buttons schema and implementation

Author: vkottler

.pylintrc

@@ -1,7 +1,7 @@
 [DESIGN]
 max-args=10
 max-positional-arguments=10
-max-attributes=16
+max-attributes=17
 max-parents=14
 max-public-methods=22
 max-branches=13

local/configs/package.yaml

@@ -8,7 +8,7 @@ time_command: true
 
 requirements:
   - aiofiles
-  - vcorelib>=3.6.3
+  - vcorelib>=3.6.4
   - svgen>=0.8.0
   - websockets
   - psutil

runtimepy/channel/environment/command/processor.py

@@ -20,6 +20,7 @@
 from runtimepy.mixins.environment import ChannelEnvironmentMixin
 from runtimepy.primitives.bool import Bool
 from runtimepy.primitives.field import BitField
+from runtimepy.ui.button import ActionButton
 
 CommandHook = Callable[[Namespace, Optional[FieldOrChannel]], None]
 
@@ -33,7 +34,11 @@ class ChannelCommandProcessor(ChannelEnvironmentMixin):
     """A command processing interface for channel environments."""
 
     def __init__(
-        self, env: ChannelEnvironment, logger: LoggerType, **kwargs
+        self,
+        env: ChannelEnvironment,
+        logger: LoggerType,
+        buttons: list[ActionButton] = None,
+        **kwargs,
     ) -> None:
         """Initialize this instance."""
 
@@ -49,6 +54,11 @@ def __init__(
 
         self.parser.initialize()
 
+        # Action buttons.
+        if buttons is None:
+            buttons = []
+        self.buttons: list[ActionButton] = buttons
+
     def register_custom_commands(
         self, *custom_commands: CustomCommand
     ) -> None:

runtimepy/data/css/bootstrap_extra.css

@@ -110,6 +110,10 @@ select:hover {
   background-image: linear-gradient(to bottom, var(--bs-tertiary-bg), rgba(var(--bs-tertiary-bg-rgb), 0), var(--bs-tertiary-bg));
 }
 
+.bg-gradient-tertiary-left-right {
+  background-image: linear-gradient(to right, var(--bs-tertiary-bg), rgba(var(--bs-tertiary-bg-rgb), 0), var(--bs-tertiary-bg));
+}
+
 .border-start-info-subtle {
   border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-info-border-subtle);
 }

runtimepy/data/dummy_load.yaml

@@ -1,4 +1,42 @@
 ---
+# UDP JSON clients.
+clients:
+  - factory: udp_json
+    name: udp_json_client
+    defer: true
+    kwargs:
+      remote_addr: [localhost, "$udp_json"]
+    views:
+      - [metrics, metrics]
+      - [transmit, tx]
+      - [receive, rx]
+    buttons: &buttons
+      - icon: tux
+        key: test
+        payload: {}
+      - icon: tux
+        key: test
+        text: asdf
+        payload: {}
+      - icon: tux
+        key: test
+        payload: {}
+        outline: false
+      - icon: tux
+        key: test
+        text: asdf
+        payload: {}
+        outline: false
+    markdown: |
+      # `udp_json_client`
+
+      Connects to `udp_json_server`.
+
+  - factory: udp_json
+    name: udp_json_server
+    kwargs:
+      local_addr: [localhost, "$udp_json"]
+
 # Add some sample tasks.
 tasks:
   # Chaos.
@@ -9,6 +47,7 @@ tasks:
       a: 1
       b: 2
       c: 3
+      buttons: *buttons
       views:
         - [zero, "\\.0\\."]
         - [one, "\\.1\\."]
@@ -49,27 +88,6 @@ tasks:
   # Drive interactions with runtime entities that won't otherwise be polled.
   - {name: app, factory: SampleApp, period_s: 0.25}
 
-# UDP JSON clients.
-clients:
-  - factory: udp_json
-    name: udp_json_client
-    defer: true
-    kwargs:
-      remote_addr: [localhost, "$udp_json"]
-    views:
-      - [metrics, metrics]
-      - [transmit, tx]
-      - [receive, rx]
-    markdown: |
-      # `udp_json_client`
-
-      Connects to `udp_json_server`.
-
-  - factory: udp_json
-    name: udp_json_server
-    kwargs:
-      local_addr: [localhost, "$udp_json"]
-
 # Add some sample structs.
 structs:
   - name: example.struct1
@@ -80,6 +98,8 @@ structs:
       b: 2
       c: 3
 
+      buttons: *buttons
+
       markdown: |
         # Docs for `example.struct1`
 

runtimepy/data/js/classes/WorkerInterface.js

@@ -10,7 +10,7 @@ class WorkerInterface {
 
   command(data) { this.send({kind : "command", value : data}); }
 
-  bus(data) { this.worker.postMessage({bus : data}); }
+  bus(key, data) { this.worker.postMessage({key : key, bus : data}); }
 
   toWorker(data, param) { return this.send({"worker" : data}, param); }
 }

runtimepy/data/js/sample.js

@@ -1,2 +1,2 @@
 console.log(`sample.js included (${tab.name})`);
-// tab.worker.bus({a: 1, b: 2, c: 3});
+// tab.worker.bus("test", {a: 1, b: 2, c: 3});

runtimepy/data/schemas/Button.yaml

@@ -0,0 +1,17 @@
+---
+type: object
+additionalProperties: false
+required: [key, payload]
+properties:
+  key:
+    type: string
+  payload:
+    type: object
+  text:
+    type: string
+  icon:
+    type: string
+  variant:
+    type: string
+  outline:
+    type: boolean

runtimepy/data/schemas/ClientConnectionConfig.yaml

@@ -4,6 +4,7 @@ includes:
   - has_name.yaml
   - has_markdown.yaml
   - has_views.yaml
+  - has_buttons.yaml
 
 properties:
   defer:

runtimepy/data/schemas/has_buttons.yaml

@@ -0,0 +1,6 @@
+---
+properties:
+  buttons:
+    type: array
+    items:
+      $ref: package://runtimepy/schemas/Button.yaml