docs: add ToC to ui/web/README.md

[e-mobility-charging-stations-simulator.git] / ui / web / README.md

diff --git a/ui/web/README.md b/ui/web/README.md
index 1541dd2b276922697b64088af6dc477a9d64bde8..250d0bd02008cca24121bc9c69d888ef8935e7ec 100644 (file)
--- a/ui/web/README.md
+++ b/ui/web/README.md
@@ -2,15 +2,23 @@
 
 The Web UI code and configuration is in the repository directory [ui/web](./../../ui/web/). Commands execution is relative to that directory.
 
-## Project setup
-
-### Dependencies
+## Table of contents
+
+- [Project setup](#project-setup)
+  - [Configuration](#configuration)
+    - [Simulator UI Server Configuration](#simulator-ui-server-configuration)
+    - [Web UI configuration](#web-ui-configuration)
+      - [Unique UI server](#unique-ui-server)
+      - [Multiple UI servers](#multiple-ui-servers)
+  - [Run](#run)
+    - [Compiles and run for production](#compiles-and-run-for-production)
+    - [Preview locally](#preview-locally)
+  - [Development](#development)
+    - [Compiles and run for development](#compiles-and-run-for-development)
+    - [Formats files](#formats-files)
+    - [Lints and fixes files](#lints-and-fixes-files)
 
-```shell
-corepack enable
-corepack prepare pnpm@latest --activate
-pnpm install
-```
+## Project setup
 
 ### Configuration
 
@@ -37,22 +45,75 @@ See [here](./../../README.md#charging-stations-simulator-configuration) for more
 
 Copy the configuration template [src/assets/config-template.json](./src/assets/config-template.json) to `public/config.json`.
 
+##### Unique UI server
+
+```json
+{
+  "uiServer": {
+    "host": "localhost",
+    "port": 8080,
+    "protocol": "ui",
+    "version": "0.0.1",
+    "authentication": {
+      "enabled": true,
+      "type": "protocol-basic-auth",
+      "username": "admin",
+      "password": "admin"
+    }
+  }
+}
+```
+
+##### Multiple UI servers
+
+```json
+{
+  "uiServer": [
+    {
+      "host": "server1.domain.tld",
+      "port": 8080,
+      "protocol": "ui",
+      "version": "0.0.1",
+      "authentication": {
+        "enabled": true,
+        "type": "protocol-basic-auth",
+        "username": "admin",
+        "password": "admin"
+      }
+    },
+    ...
+    {
+      "host": "serverN.domain.tld",
+      "port": 8080,
+      "protocol": "ui",
+      "version": "0.0.1",
+      "authentication": {
+        "enabled": true,
+        "type": "protocol-basic-auth",
+        "username": "admin",
+        "password": "admin"
+      }
+    }
+  ]
+}
+```
+
 ### Run
 
-#### Compiles for production and preview locally
+#### Compiles and run for production
 
 ```shell
 pnpm preview
 ```
 
-#### Try it out
+#### Preview locally
 
 You can now follow the link displayed in the terminal. The Web UI looks like the following:
 
 ![webui](./src/assets/webui.png)
 
-1. With the buttons on the top you can start/stop the simulator, add new charging stations and refresh the content.
-2. Each charging station is a row in the table with specific 'Actions' to execute. Try 'Stop Charging Station' and refresh with the large blue button and see the status 'Started' turns from 'Yes' into 'No'.
+1. With the buttons on the top you can change UI server, start/stop the simulator, add new charging stations and refresh the content.
+2. Each charging station is a row in the table with specific 'Actions' to execute on. Try 'Stop Charging Station' and refresh with the large blue button and see the status 'Started' turns from 'Yes' into 'No'.
 
 ### Development