Module uvls::webview

This web interface allows simple configuration of uvl models within the sever.

The GUI is written as a html-over-wire liveview, via dioxus. The liveview can then be accessed directly in vs-code or the native browser. Each server instance has its own localhost TCP port {p}, configuration is possible over two different entries: localhost:{p}/create/{uvl_base_file} - Create an empty config from a uvl base file localhost:{p}/load/{uvl_config_file} - Load a configuration from a json file

The actual GUI is implemented as redux style asynchronous event loop. This is mainly due to the fact that its simple and requires minimal state management. Currently the whole tree is redrawn when a value changes since there is only one global configuration and tree state. This should be separated. To synchronize the webview with the rest of the server two handlers are used: ui_sync and smt::web_view_handler. The first detects file changes and rebuilds the target module, the second handler calculates new smt values when things change.

Modules

• frontend 🔒
  This Module is used for frontend rendering

Structs

• AppProps
• ConfigSource
  The UVL file source for the configuration
• UIConfigState
  The UIConfigState stores the frontend entries inside the entries variable and thus can be used to render the frontend
• UIEntry
  This struct represents a entry in the UVL configuration.
• UIState
  This stores the state of the configurator of a UVL file.

Enums

• AppInitialParams
• Icon
  This Enum stores the different Item types for the configuration View
• SatState
  Different State for the UVL File displayed in the configuration
• UIAction
  The different UI Actions executable by the user from the frontend and by some backend tasks
• UIEntryValue
  Data structure to store and display the different elements of UVL in the configuration
• UISyncState

Functions

• create_file_tree 🔒
  goes through the UVL file and stores each entry accordingly in the provided entries variable
• rebuild_config 🔒
• rebuild_tree 🔒
• transfer_config 🔒
  Transfer state from with a new module
• ui_event_loop 🔒
  redux style state management
• ui_main
  UI coroutine handles all state managment and creation
• ui_sync 🔒
  Keeps the UI in sync with its context
• web_handler
  HTTP server for the configuration interface