docs: more

Writerside/redirection-rules.xml

@@ -54,4 +54,26 @@
         <description>Created after removal of "Stale Data Painter" from Serpenta Developer Handbook</description>
         <accepts>Stale-Data-Painter.html</accepts>
     </rule>
+    <rule id="79fb3235">
+        <description>Created after removal of "Front-end State Persistence" from Serpenta Developer Handbook
+        </description>
+        <accepts>Front-end-State-Persistence.html</accepts>
+    </rule>
+    <rule id="12569081">
+        <description>
+            <![CDATA[Created after removal of "Separation of View & Control" from Serpenta Developer Handbook]]></description>
+        <accepts>Separation-of-View-Control.html</accepts>
+    </rule>
+    <rule id="282797c5">
+        <description>Created after removal of "Grand Data Distributor" from Serpenta Developer Handbook</description>
+        <accepts>Grand-Data-Distributor.html</accepts>
+    </rule>
+    <rule id="7c19a755">
+        <description>Created after removal of "Grand Charter" from Serpenta Developer Handbook</description>
+        <accepts>Grand-Charter.html</accepts>
+    </rule>
+    <rule id="3e5b622">
+        <description>Created after removal of "Keybind Handler" from Serpenta Developer Handbook</description>
+        <accepts>Keybind-Handler.html</accepts>
+    </rule>
 </rules>

Writerside/sdh.tree

@@ -12,6 +12,19 @@
         <toc-element topic="DH08-GUI-Setup.md"/>
         <toc-element topic="Contributing-Maintenance.md"/>
     </toc-element>
+    <toc-element topic="Architecture.md">
+        <toc-element topic="Stores.md"/>
+        <toc-element topic="Configuration-Interface.md"/>
+        <toc-element topic="UI-Required-Interfaces.md">
+            <toc-element topic="Data-Distributor.md"/>
+            <toc-element topic="Command-Invoker.md">
+            </toc-element>
+            <toc-element topic="Windowing-Engine.md"/>
+        </toc-element>
+        <toc-element topic="Tauri-Starter-Kit-Provided.md">
+            <toc-element topic="Keybind-Engine.md"/>
+        </toc-element>
+    </toc-element>
     <toc-element topic="Safety-Features.md">
         <toc-element topic="Alerts.md"/>
         <toc-element topic="Safe-Data-Display.md"/>
@@ -20,14 +33,6 @@
         <toc-element topic="Keybinds.md"/>
         <toc-element topic="Multi-window-Engine.md"/>
     </toc-element>
-    <toc-element topic="Architecture.md">
-        <toc-element topic="Stores.md"/>
-        <toc-element topic="Configuration-Interface.md"/>
-        <toc-element topic="Front-end-State-Persistence.md"/>
-        <toc-element topic="Separation-of-View-Control.md"/>
-        <toc-element topic="Grand-Data-Distributor.md"/>
-        <toc-element topic="Grand-Charter.md"/>
-    </toc-element>
     <toc-element topic="UI-Toolkit.md">
         <toc-element topic="Base.md"/>
         <toc-element topic="Control.md"/>
@@ -44,13 +49,14 @@
         <toc-element topic="Logger-flusher.md"/>
         <toc-element topic="Datapoint-script.md"/>
         <toc-element topic="Commands-script.md"/>
-        <toc-element topic="Keybind-Handler.md"/>
     </toc-element>
     <toc-element topic="Reference.md">
         <toc-element topic="Conventions.md"/>
         <toc-element topic="Envrionment-Variables.md"/>
         <toc-element topic="Tauri-Event-Channels.md"/>
     </toc-element>
-    <toc-element topic="Guides.md"/>
+    <toc-element topic="Guides.md">
+        <toc-element topic="Achieving-safety-with-the-provided-code.md"/>
+    </toc-element>
     <toc-element topic="epilogue.md"/>
 </instance-profile>

Writerside/topics/Achieving-safety-with-the-provided-code.md

@@ -0,0 +1,3 @@
+# Achieving safety with the provided code
+
+Start typing here...

Writerside/topics/Architecture.md

@@ -1,5 +1,42 @@
 # Architecture
 
 One of the main goals of Serpenta is to decouple the View as much as possible from the Control; i.e., provide a safe, 
-clean and efficient UI library with defined exposing interfaces and allow for the developer to create their own 
-communication with their pod (given that they chose not to use the default `GrandDataDistributor`). 
+clean and efficient UI library with defined exposed ports and allow for the developer to create their own communication 
+with their pod.
+
+However, this would strip away a lot of Serpenta's functionality and purpose. 
+To deal with this, an implementation with Tauri was provided additionally in a Tauri Starter Kit.
+
+> Serpenta consists of a UI package, a middleware defined using interfaces and a Tauri realization of said middleware.
+> 
+> You can override any realization with your own implementation using the [config object](Configuration-Interface.md)
+> or entirely swap out the backend for something else other than Tauri.
+
+## Components of a Serpenta System
+
+A Serpenta system includes a frontend built on a Svelte-compatible framework and a backend that powers the app, 
+providing necessary functionality for the UI-required interfaces and additional auxiliary features.
+
+> A UI-required interface is one of several interfaces upon which the UI kit works. 
+> These include a Data Distributor, Command Invoker and a Windowing Engine.
+> 
+> Check out more information at the [UI-required interfaces topic](UI-Required-Interfaces.md).
+{style="note"}
+
+### Modularity
+
+The entire Running Engine subsystem is replaceable by default, and you may opt to use another engine instead.
+
+> For this you will have to write an entire middleware that implements all required interfaces.
+> You can, of course, also choose to implement only specific parts of the configuration. 
+> 
+> Check out the [Configuration Interface page](Configuration-Interface.md) for more information.
+
+![](serenta-components.png)
+
+## Classes and required interfaces
+
+The entire Tauri Starter subsystem component (or only parts of it) may be swapped for another as mentioned before
+in this section.
+
+![](serpenta-detailed.png)

Writerside/topics/Command-Invoker.md

@@ -0,0 +1,3 @@
+# Command Invoker
+
+Start typing here...

Writerside/topics/Configuration-Interface.md

@@ -2,6 +2,34 @@
 
 Built to allow for dependency injection, the `<SerpentaShell />` component takes a configuration prop which is set as
 context for all its children (recursively). 
+
+## Interface
+
+The config itself has a describing interface:
+
+### Properties {collapsible="true"}
+
+Each of these properties can be accessed by calling the `getSerpentaContext()` command within a component nested
+inside the `<SerpentaShell>` one.
+
+> If the component is not living inside the shell, get context will return an empty object. 
+> What's more, the context is set with the key "serpenta-context" which shall not appear for any other context within 
+> the shell or its children.
+
+| name                     | type                                | comments                                                                            |
+|--------------------------|-------------------------------------|-------------------------------------------------------------------------------------|
+| `appWindow`              | `any`                               | Interface for controlling the native app window. Used to make the custom title bar. |
+| `pod_name`               | `string`                            | The name of the hyperloop pod. Used in the bottom bar.                              |
+| `grand_data_distributor` | `WindowEngine<any>`                 |                                                                                     |
+| `window_engine`          | `CommandInvocation`                 |                                                                                     |
+| `grand_charter`          | `Writable<Map<string, PlotBuffer>>` |                                                                                     |
+| `big_error`              | `Writable<ErrorStatus>`             |                                                                                     |
+| `latest_timestamp`       | `Writable<number>`                  |                                                                                     |
+| `generic_command_name`   | `string`                            |                                                                                     |
+| `stores.fsm_name`        | `string`                            |                                                                                     |
+
+## Usage within the UI kit
+
 All Serpenta components shall get data that shall be configurable from this context by using the following:
 
 ```html
@@ -12,5 +40,3 @@ All Serpenta components shall get data that shall be configurable from this cont
     const context = getSerpentaContext();
 </script>
 ```
-
-The config itself has a describing interface:

Writerside/topics/Contributing-Maintenance.md

@@ -22,7 +22,8 @@ guidelines of Delft Hyperloop.
 ### Suggesting new features
 
 One can suggest any feature for Serpenta by opening issues in the [Serpenta repository](https://github.com/delft-hyperloop/serpenta).
-The people who have a final say in whether your suggestion should become part of Serpenta,
+
+> The people who have a final say in whether your suggestion should become part of Serpenta,
 however, are the active Sense & control software engineers at the time of submission.
 
 <seealso>

Writerside/topics/Data-Distributor.md

@@ -0,0 +1,4 @@
+# Data Distributor
+
+The data distributor interface of the middleware configuration is responsible for distributing the stores where needed,
+updating them as necessary.

Writerside/topics/Home.md

@@ -19,12 +19,14 @@ Serpenta is a <tooltip term="GUI standard">GUI standard</tooltip> created and im
 ground station controlling Helios III. It provides:
 
 - a common UI toolkit for displaying data points received from an arbitrary Hyperloop pod
-- a configurable middleware for managing data distribution and command issuing to the pod 
+- a configurable middleware for managing data distribution and command issuing to the pod
 - utilities for refreshing and supporting charts
+- middleware example built for Tauri
 
 Serpenta is split between a UI kit that is completely decoupled from middleware and a Tauri adaptation of such 
 middleware.
-Originally, Serpenta ran on Tauri, but its front-end was entirely decoupled from it to allow for more flexibility in 
+
+> Originally, Serpenta ran on Tauri, but its front-end was entirely decoupled from it to allow for more flexibility in 
 choosing a compatible tech stack. 
 
 ![dh08serpenta.png](dh08serpenta.png){style="block"} _DH08 Serpenta GUI on its Home tab_
@@ -39,8 +41,7 @@ Built with 💚 by Kiril Panayotov, Andreas Tsatsanis & Fransisco Amaro - DH08.
 <seealso>
     <category ref="related">
         <a href="UI-Toolkit.md">Svelte UI Toolkit</a>
-        <a href="Grand-Data-Distributor.md">GDD Interface</a>
-        <a href="Grand-Charter.md">Chart manager interface</a>
+        <a href="Data-Distributor.md">Data Distributor Interface</a>
         <a href="Guides.md">Guides and recipes</a>
     </category>
     <category ref="external">

Writerside/topics/Keybind-Handler.md → Writerside/topics/Keybind-Engine.md

@@ -1,5 +1,5 @@
-# Keybind Handler
+# Keybinding Engine
 
 <primary-label ref="tauri-starter-kit"/>
 
-Start typing here...
+Start typing here...

Writerside/topics/Keybinds.md

@@ -1,3 +1,5 @@
-# Keybinds
+# Keybindings
+
+<primary-label ref="tauri-starter-kit"/>
 
 Start typing here...

Writerside/topics/Stores.md

@@ -1,10 +1,11 @@
 # Stores
 
-Before we begin with anything specific about the Architecture, we will start with fundamental part that makes the GUI:
+Before we begin with anything specific about the Architecture, 
+we will start with the fundamental part that makes the GUI:
 [Svelte Stores](https://svelte.dev/docs/svelte-store).
 
 > "A store is simply an object with a subscribe method that allows interested parties to be notified whenever the store
-> value changes." - Official Svelte Tutorial - August 24th 2024.
+> value changes."—Official Svelte Tutorial—August 24th 2024.
 
 Stores will automatically update the front-end that subscribes to them. You can even use their syntactic sugar to save
 you the code bloat and the danger of a memory leak (if you forget to unsubscribe): `$store`. They can be accessed
@@ -24,8 +25,9 @@ globally and have multiple appearances across the front-end of the GUI, as well
 
 ## Usage within the Serpenta GUI
 
-All data that is received, parsed and distributed by the [Grand Data Distributor](Grand-Data-Distributor.md) is
-maintained withing stores. However, Serpenta uses its own interface that extends the svelte stores with additional
+All data that is received,
+parsed and distributed by an implementation of a [Grand Data Distributor](Data-Distributor.md) is maintained within stores.
+However, Serpenta uses its own interface that extends the svelte stores with additional
 information that is closely tied to the received values.
 
 ```Typescript

Writerside/topics/Tauri-Starter-Kit-Provided.md

@@ -0,0 +1,5 @@
+# Tauri Starter Kit Provided
+
+<primary-label ref="tauri-starter-kit"/>
+
+Start typing here...

Writerside/topics/Tauri-Starter-Kit.md

@@ -2,9 +2,11 @@
 
 <primary-label ref="tauri-starter-kit"/>
 
-The Serpenta Started kit provides a project with SvelteKit, Tauri and several other dependencies defined in its
-`project.json` and `Cargo.toml` files. This is the preferable way to start a new project that will use the Serpenta
-Standard. Additionally, it sets up the routes for its [Multi-Window Engine](Multi-window-Engine.md).
+Serpenta was decoupled from its original Tauri middleware to support different implementations and tech stacks. 
+If you choose to use Tauri, we provide a Tauri starter kit in the form of an `npm` binary that creates a project
+with the required packages, Tauri and all middleware implemented.
+
+> Despite its preconfiguration, editing and changing this middleware can still be easily achieved.
 
 The project is situated under the [packages folder of the Serpenta monorepo](https://github.com/delft-hyperloop/serpenta/tree/main/packages/serpenta-app). It has the entire folder structure in
 its child `template` folder. Upon execution of the script, these will be synced to a child folder of the one where this
@@ -17,12 +19,36 @@ binary is run.
 While the setup provides some examples of how one can render data and fetch it from the Tauri backend, the implementation
 of the communication middleware is left for the developer. For ideas, you can look at the [DH08's Serpenta GUI](https://github.com/delft-hyperloop/Helios_III/tree/main/gs).
 
-## Usage
+## Installing & setup
 
 You can create a new Serpenta project using its npm binary like so:
 
 ```Shell
 npx @delft-hyperloop/create-serpenta-app [name]
-cd [name]
-npm i
+cd [name]                                 
+direnv allow                          # optional if you use nix flakes
+npm i                                 # install dependencies
+npm run tauri dev                     # run the tauri app
 ```
+
+> If you happen to see a blank page with an error saying "Failed to create GBM buffer," this may very well be caused by
+> GNOME.
+> 
+> Please try running the start command with the environment variable `WEBKIT_DISABLE_COMPOSITING_MODE` set to `1`:
+> ```Shell
+> WEBKIT_DISABLE_COMPOSITING_MODE=1 npm run tauri dev
+> ```
+{style="note"}
+
+This will create a template directory with SvelteKit,
+Tauri setup together with a predefined configuration for Serpenta.
+
+## Features
+
+Upon installation, the Tauri starter kit will provide you with all of these features (which normally are left for 
+own custom configuration) implemented:
+- A Data Distributor. 
+- Windowing Engine
+- Command Invoker
+
+

Writerside/topics/UI-Required-Interfaces.md

@@ -0,0 +1,7 @@
+# UI Required Interfaces
+
+The children topics of this section describe all the required interfaces that must be implemented to use Serpenta.
+
+> Each of these interfaces has a Tauri adaptation in the `@delft-hyperloop/create-serpenta-app` package. More 
+> information can be found on the [Tauri Starter Kit documentation page](Tauri-Starter-Kit.md).
+{style="note"}

Writerside/topics/Windowing-Engine.md

@@ -0,0 +1,3 @@
+# Windowing Engine
+
+Start typing here...