diff --git a/.vuepress/docs-sidebar.js b/.vuepress/docs-sidebar.js
index cc39a170c4..caa42ff063 100644
--- a/.vuepress/docs-sidebar.js
+++ b/.vuepress/docs-sidebar.js
@@ -119,19 +119,25 @@ module.exports = [
title: 'Main UI',
collapsable: false,
children: [
- ['ui/mainui', 'Main UI'],
+ ['mainui/', 'Overview'],
{ title: 'Settings',
- path: '/docs/settings/',
+ path: '/docs/mainui/settings/',
children: [
- 'settings/configuration',
- ['settings/automations', 'Automation'],
- ['settings/system_settings', 'System'],
- ['settings/addons', 'Add-ons'],
+ ['mainui/settings/things', 'Things'],
+ ['mainui/settings/model', 'Model'],
+ ['mainui/settings/items', 'Items'],
+ ['mainui/settings/pages', 'Pages'],
+ ['mainui/settings/transformations', 'Transformations'],
+ ['mainui/settings/persistence', 'Persistence'],
+ ['mainui/settings/rules', 'Rules'],
+ ['mainui/settings/scenes', 'Scenes'],
+ ['mainui/settings/scripts', 'Scripts'],
+ ['mainui/settings/schedule', 'Schedule']
]
},
- ['ui/addons-store', 'Add-on Store'],
- ['ui/developer-tools', 'Developer Tools'],
- ['ui/aboutpage', 'Help & About'],
+ ['mainui/addons', 'Add-on Store'],
+ ['mainui/developer/', 'Developer Tools'],
+ ['mainui/about', 'Help & About'],
]
},
{
diff --git a/.vuepress/process_main_docs.rb b/.vuepress/process_main_docs.rb
index 4f7205b0eb..cde2202e58 100644
--- a/.vuepress/process_main_docs.rb
+++ b/.vuepress/process_main_docs.rb
@@ -17,10 +17,7 @@ def process_main_docs(docs_source_dir)
FileUtils.cp_r("#{docs_source_dir}/images/addons", ".vuepress/public/logos")
-
puts ">>> Migrating the Concepts section"
-
-
if Dir.exists?("#{docs_source_dir}/concepts") then
Dir.glob("#{docs_source_dir}/concepts/*.md").each { |path|
file = File.basename(path)
@@ -35,10 +32,7 @@ def process_main_docs(docs_source_dir)
end
-
puts ">>> Migrating the Installation section"
-
-
Dir.glob("#{docs_source_dir}/installation/*.md") { |path|
file = File.basename(path)
next if file == "designer.md"
@@ -49,10 +43,7 @@ def process_main_docs(docs_source_dir)
FileUtils.cp_r("#{docs_source_dir}/installation/images", "docs/installation/images")
-
puts ">>> Migrating the Tutorial section"
-
-
Dir.glob("#{docs_source_dir}/tutorials/getting_started/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -65,8 +56,6 @@ def process_main_docs(docs_source_dir)
puts ">>> Migrating the Configuration section"
-
-
Dir.glob("#{docs_source_dir}/configuration/*.md") { |path|
file = File.basename(path)
next if file == "transform.md" # Useless, copy the one from addons
@@ -81,20 +70,28 @@ def process_main_docs(docs_source_dir)
#FileUtils.mv("docs/configuration/migration/migration.md", "docs/configuration/migration/index.md")
#FileUtils.cp_r("#{docs_source_dir}/tutorials/images", "docs/configuration/migration")
- puts ">>> Migrating the Settings section"
-
- Dir.glob("#{docs_source_dir}/settings/*.md") { |path|
+ puts ">>> Migrating the Main UI section"
+ Dir.glob("#{docs_source_dir}/mainui/*.md") { |path|
+ file = File.basename(path)
+ puts " -> #{file}"
+ process_file("#{docs_source_dir}/mainui", file, "docs/mainui", "#{$docs_repo_root}/mainui/#{file}")
+ }
+ Dir.glob("#{docs_source_dir}/mainui/developer/*.md") { |path|
+ file = File.basename(path)
+ puts " -> #{file}"
+ process_file("#{docs_source_dir}/mainui/developer", file, "docs/mainui/developer", "#{$docs_repo_root}/mainui/developer/#{file}")
+ }
+ Dir.glob("#{docs_source_dir}/mainui/settings/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
- process_file("#{docs_source_dir}/settings", file, "docs/settings", "#{$docs_repo_root}/settings/#{file}")
+ process_file("#{docs_source_dir}/mainui/settings", file, "docs/mainui/settings", "#{$docs_repo_root}/mainui/settings/#{file}")
}
puts " -> images"
- FileUtils.cp_r("#{docs_source_dir}/settings/images", "docs/settings/images")
-
- puts ">>> Migrating the Migration Tutorial section"
+ FileUtils.cp_r("#{docs_source_dir}/mainui/images", "docs/mainui/images")
+ puts ">>> Migrating the Migration Tutorial section"
Dir.glob("#{docs_source_dir}/configuration/migration/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -103,8 +100,8 @@ def process_main_docs(docs_source_dir)
puts " -> images"
#FileUtils.cp_r("#{docs_source_dir}/configuration/images", "docs/configuration") // no images placed yet
- puts ">>> Migrating the Blockly Tutorial section"
+ puts ">>> Migrating the Blockly Tutorial section"
Dir.glob("#{docs_source_dir}/configuration/blockly/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -113,9 +110,8 @@ def process_main_docs(docs_source_dir)
puts " -> images"
#FileUtils.cp_r("#{docs_source_dir}/configuration/images", "docs/configuration") // no images placed yet
- puts ">>> Migrating the UI section"
-
+ puts ">>> Migrating the UI section"
Dir.glob("#{docs_source_dir}/ui/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -125,10 +121,7 @@ def process_main_docs(docs_source_dir)
FileUtils.cp_r("#{docs_source_dir}/ui/images", "docs/ui/images")
-
puts ">>> Migrating the Apps section"
-
-
Dir.glob("#{docs_source_dir}/addons/uis/apps/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -138,10 +131,7 @@ def process_main_docs(docs_source_dir)
FileUtils.cp_r("#{docs_source_dir}/addons/uis/apps/images", "docs/apps")
-
puts ">>> Migrating the Administration section"
-
-
Dir.glob("#{docs_source_dir}/administration/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
@@ -151,10 +141,7 @@ def process_main_docs(docs_source_dir)
FileUtils.cp_r("#{docs_source_dir}/administration/images", "docs/administration/images")
-
puts ">>> Migrating the Developer section"
-
-
Dir.glob("#{docs_source_dir}/developers/*.md") { |path|
file = File.basename(path)
puts " -> #{file}"
diff --git a/configuration/multimedia.md b/configuration/multimedia.md
index 8d80f83696..12e284c461 100644
--- a/configuration/multimedia.md
+++ b/configuration/multimedia.md
@@ -59,7 +59,7 @@ The distribution comes with these options built-in:
| `enhancedjavasound` | System Speaker (with mp3 support) | This uses the JRE sound drivers plus an additional 3rd party library, which adds support for mp3 files. |
| `webaudio` | Web Audio | Convenient, if sounds should not be played on the server, but on the client: This sink sends the audio stream through HTTP to web clients, which then cause it to be played back by the browser. Obviously, the browser needs to be opened and have a compatible openHAB UI running. Currently, this feature is supported by Main UI, Basic UI and HABPanel. |
-Please refer to the [Main UI docs]({{base}}/ui/mainui.html#web-audio-sink) for setting up web audio in Main UI.
+Please refer to the [Main UI docs]({{base}}/mainui/about.html#web-audio-sink) for setting up web audio in Main UI.
Additionally, certain bindings register their supported devices as audio sinks, e.g. Sonos speakers.
diff --git a/developers/buildsystem.md b/developers/buildsystem.md
index f01e64ce24..aa9148d1cc 100644
--- a/developers/buildsystem.md
+++ b/developers/buildsystem.md
@@ -48,7 +48,7 @@ If the embedded bundle's manifest is not properly exporting all needed packages,
In two cases using an "external" (i.e. not embedded) dependency is required:
1. Dependencies to other openHAB bundles (e.g. `org.openhab.addons.bundles/org.openhab.binding.bluetooth/3.1.0-SNAPSHOT` or `org.openhab.addons.bundles/org.openhab.transform.map/3.1.0-SNAPSHOT`).
-2. Bundles that are used by more than one binding (e.g. Netty-bundles like `io.netty/netty-common/4.1.34.Final`).
+1. Bundles that are used by more than one binding (e.g. Netty-bundles like `io.netty/netty-common/4.1.34.Final`).
Dependencies on other openHAB bundles should always have the scope `provided`.
To ensure that external dependencies are available at runtime they also need to be added to the `feature.xml`:
diff --git a/mainui/CONTRIBUTING.md b/mainui/CONTRIBUTING.md
new file mode 100644
index 0000000000..500cd7c7f7
--- /dev/null
+++ b/mainui/CONTRIBUTING.md
@@ -0,0 +1,50 @@
+# openHAB Main UI Documentation
+
+The documentation located in this directory (`mainui`) is picked up by Main UI's sidebar help (ShiftAltD).
+
+The file structure in this directory MUST NOT be changed, otherwise Main UI won't be able to pick up the docs!
+To allow the embedding into the UI, some conventions have to be made:
+
+## Conventions
+
+In general, each `.md` file in this directory should provide a header section which is ready to be used in the UI.
+
+The content to be shown in the UI has to be enclosed into these special comments:
+
+```markdown
+
+Lorem ipsum dolor sit amet, consectetur adipisici elit, ...
+
+```
+
+## Features && Behaviour
+
+Inside these comments, the UI allows the following features:
+
+- Embed [Framework7 icons](https://framework7.io/icons/) into the UI-rendered docs using these comments:
+ - ``, where `$iconname` is a Framework7 icon's name
+ - `` to set the icon's color to blue
+ - `` to set the icon's color to green
+
+ Please note that the docs website does NOT render these icons, so you should always describe the icon, e.g.:
+
+ ```markdown
+ Add ... using the plus button ...
+ ```
+
+- Link to UI pages by linking to a file relative to the current file without adding a file extension, e.g.
+ `[Rules](rules)` in [settings/index.md](settings/index.md) links to `/settings/rules/` or
+ `[Settings](settings)` in [index.md](index.md) links to `/settings/`.
+
+ **Please consider that when adding or changing links inside the UI-shown content section!**
+ If you want to make sure you don't break anything, never change links without actually testing the consequences in Main UI.
+
+- Link to other documentation pages by using links starting with ``{{base}}`` (recommended) or `/docs`, e.g.
+ `[Inbox]({{base}}/tutorial/things_simple.html#accept-the-light-bulb-things)`
+
+The following is not supported:
+
+- Images are not loaded and not rendered, which means you can use images inside the comments, but they will only be shown on the website.
+- `[Section A](#section-a)` links are currently not supported in the UI.
+
+For advanced information on how the UI manipulates the documentation before rendering it, please have a look at the [source code](https://github.com/openhab/openhab-webui/blob/main/bundles/org.openhab.ui/web/src/components/developer/help/context.vue).
diff --git a/mainui/about.md b/mainui/about.md
new file mode 100644
index 0000000000..3f4fe4c6ac
--- /dev/null
+++ b/mainui/about.md
@@ -0,0 +1,181 @@
+---
+layout: documentation
+title: Help & About Page
+---
+
+# Help & About Page
+
+
+This page shows general information of your openHAB configuration and allows to configure some client related configuration, including:
+
+- UI appearance (theming, color scheme etc.)
+- **Web Audio Sink** support
+- Setting up the **UI Command Item**
+
+
+
+[[toc]]
+
+## Top Section
+
+
+
+- Version: shows the currently installed version of openHAB
+- Links to the official openHAB Website, the openHAB Documentation and the Community Forum
+
+## Technical Information
+
+This section is collapsed by default and can be opened by clicking on it which then reveals the
+
+- Configuration folder on the server
+- User data folder on the server
+- Logs folder on the server
+- Operating System openHAB is running on
+- Java Runtime openHAB is running on
+- Number of processors and memory
+
+Clicking on View Details opens up a popup window that contains very detailed information like
+
+- Runtime information
+- Locale (language)
+- System information including memory information
+- A list of all installed bindings
+- Client information including device information, client settings (see also the below section), screen information, theme, user agent information.
+
+The content can be easily copied with the copy button on the top to provide it as additional information when asking questions in the community.
+
+## Appearance (for this device only)
+
+This section allows to have different appearance settings _per_ device.
+
+- **Theme**: Selects the theme for that device
+ - Auto: tries to detect the client type
+ - Android
+ - iOS
+ - Desktop
+
+
+
+- **Dark mode** setting
+ - Auto: uses the default mode
+ - Light-Mode
+ - Dark-Mode
+
+
+
+- **Navigation bars style**: inverts the colors in the navigation bar
+
+
+
+## Miscellaneous settings
+
+- **Simple navigation bar on home page**: When switching it on, it means the navigation bar will look the same even whether you're at the top of the page or not - you won't have the alternate look with the date.
+The first image depicts the normal setting (off), the second image shows it switched off
+
+ 
+
+- **Standard home page background color**: This only relates to the light color scheme.
+The background color will be the same as the regular pages you can show from e.g. the sidebar, which is a kind of gray instead of white.
+The first image depicts the normal white setting (off), the second image shows it switched off with the gray setting.
+
+ 
+
+- **Disable card expansion animations**: Disables the animations when expanding a widget card.
+- **Disable page transition animations**: Disables the transitions when switching from one page to the other.
+
+## Web Audio Sink
+
+Main UI implements a web audio sink which allows the openHAB server to play audio through the web browser.
+
+To enable web audio sink support for a client, turn on the **Enable Web Audio sink support** option on the **Help & About** page.
+As it is a setting specific to your browser environment, web audio support has to be enabled for every client where it should be used.
+
+Please note that due to limitations in Safari (and possibly Chrome as well), a user interaction is required after the first audio stream has been sent to actually play it.
+This means, that after opening Main UI, the first audio that should be played on the web audio sink is only played after the user interacts with Main UI in any way (i.e. touching the screen is enough).
+For subsequent audio playback the above is not required anymore and the audio is played immediately.
+
+Please also note that you cannot address a particular web audio-enabled device.
+When you play a sound on web audio, it will be played on all devices where web audio is enabled.
+
+Web audio sinks can be used for example on wall-mounted tablets to make announcements using a [text-to-speech (TTS) engine]({{base}}/configuration/multimedia.html#text-to-speech) and play notification or alarm sounds.
+
+For more information about audio sinks as well as audio and voice actions, please refer to the [multimedia configuration docs]({{base}}/configuration/multimedia.html), where you will also find examples including UI-based rules and Blockly.
+
+### Testing Web Audio
+
+To test if it works play some static content that comes with openHAB in the /sounds dir using an openHAB console command.
+Use [openHABs console]({{base}}/administration/console.html#using-the-console) or just run the following from the Linux shell:
+
+> openhab-cli console
+
+and then enter the following command:
+
+```text
+openhab> audio play webaudio barking.mp3
+```
+
+If you have a dog that gets triggered by barking you may opt for playing `doorbell.mp3` instead.
+If you play `doorbell.mp3` your dog will then probably play its own barking audio sound. 😉
+
+Here are some useful actions available to rules in which you can specify webaudio as sink, see:
+
+- [playSound]({{base}}/configuration/multimedia.html#actions-2)
+
+```text
+playSound("webaudio", "barking.mp3")
+```
+
+- [say]({{base}}/configuration/multimedia.html#actions-3)
+
+```text
+say("Hello world!", "voicerss:enUS", "webaudio")
+```
+
+You can also configure webaudio as sink when creating rules in the UI:
+
+
+
+or using it in a blockly rule:
+
+
+
+## UI Command Item
+
+Main UI can be controlled from the openHAB server by setting up a so-called UI command Item.
+
+Similarly to web audio support, this is a setting specific to your local browser environment, so you have to define the UI command Item for each client, which also allows you to have different UI command Items for different clients.
+To set up an Item as the UI command Item on your device, first create a particular Item of type `String`, then open the **Help & About** page from the menu and select an Item for the **Listen for UI command to** option.
+
+The command Item has to be a `String` Item.
+The UI is listening for commands to that Item, and if an Item command is a valid command string, the UI executes the given command.
+
+Currently, the supported commands are:
+
+- `navigate:$path`:
+ Navigate to a given `$path`, e.g. `navigate:/locations` to navigate to the **Locations** tab of the home page or `navigate:/page/my_custom_page` to navigate to a page with the ID `my_custom_page`.
+ For example, you can use this to open a video camera page of the door automatically when the doorbell is rung.
+- `popup:$target`, `popover:$target` and `sheet:$target`:
+ Open a `$target`, which can be a page (`$target` is `page:` + a page ID), a custom widget (`$target` is `widget:` + widget ID) or any [`oh-` component]({{base}}/ui/components/) (`$target` is the component name), in a popup, popover or sheet.
+
+ For example, to open `oh-clock-card` inside a popup, send `popup:oh-clock-card` to the UI command Item.
+- `notification:$text:$title:$subtitle:$titleRight:$closeTimeout`:
+ Display a notification inside the UI:
+ The `$text` parameter is mandatory, all other parameters are optional.
+ `$closeTimeout` is in milliseconds and defaults to 5000, which means by default a notification will be closed after 5 seconds.
+ To leave out a parameter, leave a colon space empty, e.g. `notification:$text:$title:::$closeTimeout`.
+
+ For example, send `notification:This is the text.:This is the title.:This is the subtitle.:This is the right title.` to the UI command Item to display the following notification:
+ 
+- `close`:
+ Close all popups, popovers and sheets.
+- `back`:
+ Navigate back.
+- `reload`:
+ Reload the current page.
+
+## Reload
+
+Main UI is using caching and service workers to locally store ressources to reduce loading times.
+A consequence of this is, that updates might not always be properly recognized.
+
+The reload buttons make Main UI to properly reload.
diff --git a/ui/addons-store.md b/mainui/addons.md
similarity index 63%
rename from ui/addons-store.md
rename to mainui/addons.md
index 7589439bb1..9f30597dd4 100644
--- a/ui/addons-store.md
+++ b/mainui/addons.md
@@ -1,35 +1,39 @@
---
layout: documentation
-title: Add-ons Store
+title: Add-on Store
---
-# Add-ons Store
+# Add-on Store
-This is the section that allows openHAB to be extended via add-ons.
-There is a huge variety of extension possibilities that openHAB provides:
+
+**Add-ons** extend openHAB's functionality.
-- **Bindings** are used to connect and control hardware and online services. This section provides
- - **openHAB Distribution**: Official bindings maintained by the openHAB project and
- - **Community Marketplace**: Bindings independently released by the community.
-- **Automation** contains scripting languages, templates and module types
- - **languages** like Groovy, JRuby, Jython, JavaScript or
- - **technologies** like PID Controller, PWM (pulse width modulation)
- - **Rule Templates** shared by the community to bootstrap your automation
- - **[Blockly](/docs/configuration/blockly/)** libraries that contain custom blocks written by the community.
-- **UI / User Interface**: Widgets for the Main UI
-- **Other...**: System Integrations, Persistence Services, Transformation Services and Voice & Speech
+The Add-on Store allows you to install and remove many different types of add-ons:
-Clicking on the individual tile reveals more information about the add-on:
+- **Bindings**
+ Connect and control hardware and online services.
+- **Automation**
+ - **Scripting Languages** like JavaScript and JRuby.
+ - **Technologies** like PID Controller, PWM (pulse width modulation).
+ - **Rule Templates** shared by the community to bootstrap your automation.
+ - [**Blockly**]({{base}}/configuration/blockly/) libraries that contain custom blocks written by the community.
+- **UI**
+ Pre-made UI widgets and other available UIs that work with openHAB.
+- **Other**
+ Full IoT ecosystem integration, data persistence services, transformations services, and voice and speech.
+
-- A general overview what it is about
-- By clicking "more" the whole documentation is provided for the add-on
-- An information section that provides
- - Source (openHAB or Community Marketplace)
+Clicking on the individual add-on title reveals more information about the add-on:
+
+- A general overview what it is about.
+- By clicking "more" the whole documentation is provided for the add-on.
+- An information section that provides:
+ - Source (openHAB Distribution or Community Marketplace)
- Provided by (the author of the add-on)
- Type of add-on (binding, automation...)
- Content type (Karaf, Template, UI Widget...)
- Created and Update date
- - A link to the related community forum entry
+ - A link to the related community forum entry or GitHub issues
Note that there is a tab bar at the bottom that allows you to switch between the different pages:
@@ -39,24 +43,25 @@ Note that there is a tab bar at the bottom that allows you to switch between the
## Bindings
-Bindings are used to connect and control hardware and online services. This section provides bindings from openHAB Distribution, which have been thoroughly reviewed by the maintainers of openHAB, as well as bindings from the Community Marketplace.
+Bindings are used to connect and control hardware and online services.
+This section provides both official bindings from the **openHAB Distribution**, which have been thoroughly reviewed by the maintainers of openHAB, as well as bindings independently released by the community on the **Community Marketplace**.
If you want to know more about the marketplace, please read the following [Marketplace announcement](https://community.openhab.org/t/announcing-the-community-marketplace/127188).
-To learn more how to install tutorial see the [Installation of Add-ons tutorial](/docs/configuration/addons.html).
+To learn more how to install add-ons read the [Add-ons tutorial]({{base}}/configuration/addons).
## Automation
Automation provides technologies that allow you to write rules and scripts.
-- **Languages & Technologies**
+- **Languages & Technologies**
openHAB comes with two languages by default: Rules DSL and Blockly (which requires a JavaScript Scripting automation add-on to be installed) while this section allows to install more languages and technologies.
To know more about them click on the respective tile.
-- **Rule templates** provide you with solutions already written for certain usecases.
+- **Rule templates** provide you with solutions already written for certain usecases.
Rule templates can be used when you have a common use case for a rule and for instance need to bootstrap several of them, or share with others how to solve that use case in a configurable manner.
These will appear in Main UI when you create a new rule, and will present you with the configuration parameters - after the rule is created, the pre-configured rule modules (triggers, conditions, actions) will appear based on your choices.
-- Block Libraries, community extensions to the [Blockly](/docs/configuration/blockly/) toolbox
+- **Block Libraries**: Community extensions to the [Blockly]({{base}}/configuration/blockly/) toolbox.
These libraries extend the core blockly library with many useful blocks that might else be a bit too specific for the core block library or just fills the gap where a core block is still missing.
When installed they appear in a separate section beneath the core blocks of the blockly editor.
@@ -64,27 +69,21 @@ Automation provides technologies that allow you to write rules and scripts.
Community widgets & alternative frontends
-- **Widgets for Main UI**: Extend your pages with these community-designed widgets
+- **Widgets for Main UI**: Extend your pages with these community-designed widgets.
After adding a widget it can be used when creating UI page.
You can the press the "+" on a cell and a popup appears with two section: _Standard Library_, which contains the standard openHAB widgets and Personal Widgets, which contain UI widgets installed from the marketplace.
They can also be found for further adapting (or analyzing) the widget under "Developer Tools -> Widgets".
-- **Other UI Add-ons**: Alternative user interfaces and icon sets
- openHAB by default support the Basic UI as well as the HABPanel (which used to be the standard before openHAB 3).
- However, openHAB supports some more User Interfaces like
- - the [CometVisu-Backend](https://www.cometvisu.org/)
- - PHP support for CometVisu
- - and [HABot](/docs/ui/habot/),
+- **Other UI Add-ons**: Alternative user interfaces and icon sets.
## Other Add-ons
-- **System integrations**: Integrate openHAB with external systems
- Here you can find the
+- **System integrations**: Integrate openHAB with external systems:
- openHAB Cloud Connector
- Homekit Integration
- - openHAB Metric Service, an additional REST endpoint to retrieve openHAB core metrics from.
+ - openHAB Metric Service, an additional REST endpoint to retrieve openHAB core metrics from,
- and others...
-- **Persistence**: Backend connectors to store historical data like
+- **Persistence**: Backend connectors to store historical data like:
- RRD
- InfluxDB
- MongoDB
@@ -92,7 +91,7 @@ Community widgets & alternative frontends
- Several JDBC Connectors and
- JPA Persistence
-- **Transformation Add-ons**: Extensions for a particular transformation like
+- **Transformation Add-ons**: Extensions for a particular transformation like:
- JSONPath
- RegEx
- Map
@@ -104,7 +103,7 @@ Community widgets & alternative frontends
- XSLT
- Multi / long press transformation profile for rocker switch
-- **Voice & Speech**: Convert between text and speech, interpret human language queries
+- **Voice & Speech**: Convert between text and speech, interpret human language queries:
- Google Cloud Text-to-Speech
- Amazon Polly
- VoiceRSS Text-to-Speech
diff --git a/mainui/developer/index.md b/mainui/developer/index.md
new file mode 100644
index 0000000000..4d6dff13e8
--- /dev/null
+++ b/mainui/developer/index.md
@@ -0,0 +1,33 @@
+---
+layout: documentation
+title: Developer Tools - Overview
+---
+
+# Developer Tools - Overview
+
+
+The developer tools page is split into two tabs:
+
+- Expert Features
+- Debugging Features: Test the SSE connection and test different implementations of an icon for different states.
+
+## Expert Features
+
+### Advanced Object Managment
+
+- [**Widgets**](widgets)
+ Develop custom widgets, that can be then used on your pages. Community made widgets can be installed from the **UI** tab of the add-on store.
+- **Block Libraries**
+ Even though Blockly comes with a large [library of blocks]({{base}}/configuration/blockly/) out of the box, you can still extend it by developing your own Block libraries.
+- **Add Items from textual definition**
+ Create or update Items and links in bulk by using the [`.items`-file syntax]({{base}}/configuration/items).
+
+### Maintenance Tools
+
+- **Developer Sidebar**
+ The [developer sidebar]({{base}}/mainui/developer/sidebar) is accessible from anywhere in the UI and provides both an integrated help and developer tools, like the universal search or the widget expression tester.
+ The integrated help even actually renders selected parts of the [Main UI documentation]({{base}}/mainui).
+ So if you read this from the website, you can also read this from inside the UI.
+- **API Explorer**
+ Interactively discover and access the [REST API]({{base}}/configuration/restdocs), which is also used by Main UI to interact with the openHAB server.
+
diff --git a/mainui/developer/sidebar.md b/mainui/developer/sidebar.md
new file mode 100644
index 0000000000..533cac45bc
--- /dev/null
+++ b/mainui/developer/sidebar.md
@@ -0,0 +1,54 @@
+---
+layout: documentation
+title: Developer Tools - Developer Sidebar
+---
+
+# Developer Tools - Developer Sidebar
+
+
+Main UI provides a developer sidebar for administrator user(s), that is accessible from anywhere in the UI.
+The developer sidebar is split into a "tools" section with several useful tools including a [universal search]({{base}}/mainui/developer/sidebar.html#developer-sidebar-search) across nearly all UI-configurable entities and a widget expression tester,
+and a "help" section aiming at providing help and useful information regarding configuration and setup.
+
+
+If your device's screen is wide enough (it has to be at least 1280 pixels wide), you can open the developer side-panel by:
+
+- Opening the **Developer Tools** page from the menu and enabling the developer sidebar.
+- Clicking on the help icon displayed in the upper right corner of most pages.
+- Pressing the key combination AltShiftD on your keyboard.
+
+## Developer Sidebar Search
+
+As already mentioned, the developer sidebar provides a universal search across nearly all UI-configurable entities.
+This means, you can search through most configuration available in Main UI, including Things, Items, pages.
+
+Imagine you need to find all usages of an Item.
+You could start to open all rules, scenes and scripts, check persistence configuration and have a look at pages and sitemaps to find usages of that Item or you use the developer sidebar search.
+
+The developer sidebar search ignores case (so it doesn't matter whether you search `LivingRoom_Light` or `livingroom_light`) and searches inside the following entities:
+
+- Things
+ - UID
+ - label
+- Items
+ - name
+ - label
+ - tags (requires exact match, i.e. if the Item has a tag `Lightbulb`, only the search query `Lightbulb` (case doesn't matter) will match)
+ - metadata
+- Pages (including Sitemaps)
+ - uid
+ - label
+ - content (widgets, tabs, charts, etc. with their configuration) / slots
+- Transformations
+ - uid
+ - label
+ - type
+- Rules, Scenes & Scripts
+ - Item name & Thing UID of triggers, actions & conditions
+ - script code (e.g. Rules DSL, JavaScript, and even Blockly)
+ - script MIME types (requires exact match)
+ - Blockly scripts (using `block`, `blockly` or `blocksource` as search string, where case is ignored)
+ - tags (requires exact match)
+- Persistence Configurations:
+ - label & service id of persistence service
+ - Items persisted by persistence service
diff --git a/mainui/developer/widgets.md b/mainui/developer/widgets.md
new file mode 100644
index 0000000000..c1b2b0e258
--- /dev/null
+++ b/mainui/developer/widgets.md
@@ -0,0 +1,21 @@
+---
+layout: documentation
+title: Developer Tools - Widgets
+---
+
+# Developer Tools - Widgets
+
+
+**Widgets** are interactive elements that can be placed on pages.
+
+Community made Widgets can also be added to your system from the **UI** tab of the add-on store.
+
+On this page you can manage all the custom widgets you have added to your system:
+
+- **Add new Widgets**
+ Add Widgets using the plus button.
+- **Edit Widgets**
+ Click on any widget in the list to open a code editor and graphical test space for the widget.
+- **Delete Widgets**
+ Select multiple widgets using the top **Select** button and use the **Remove** button at the bottom
+
diff --git a/ui/images/about-top-section.png b/mainui/images/about-top-section.png
similarity index 100%
rename from ui/images/about-top-section.png
rename to mainui/images/about-top-section.png
diff --git a/ui/images/addons-toolbar.png b/mainui/images/addons-toolbar.png
similarity index 100%
rename from ui/images/addons-toolbar.png
rename to mainui/images/addons-toolbar.png
diff --git a/ui/images/bg-gray-setting.png b/mainui/images/bg-gray-setting.png
similarity index 100%
rename from ui/images/bg-gray-setting.png
rename to mainui/images/bg-gray-setting.png
diff --git a/ui/images/bg-white-setting.png b/mainui/images/bg-white-setting.png
similarity index 100%
rename from ui/images/bg-white-setting.png
rename to mainui/images/bg-white-setting.png
diff --git a/settings/images/config-overview.png b/mainui/images/config-overview.png
similarity index 100%
rename from settings/images/config-overview.png
rename to mainui/images/config-overview.png
diff --git a/settings/images/cron-saturday.png b/mainui/images/cron-saturday.png
similarity index 100%
rename from settings/images/cron-saturday.png
rename to mainui/images/cron-saturday.png
diff --git a/settings/images/cron-seven.png b/mainui/images/cron-seven.png
similarity index 100%
rename from settings/images/cron-seven.png
rename to mainui/images/cron-seven.png
diff --git a/ui/images/dark-mode.png b/mainui/images/dark-mode.png
similarity index 100%
rename from ui/images/dark-mode.png
rename to mainui/images/dark-mode.png
diff --git a/settings/images/log-level.png b/mainui/images/log-level.png
similarity index 100%
rename from settings/images/log-level.png
rename to mainui/images/log-level.png
diff --git a/ui/images/navbar-style.png b/mainui/images/navbar-style.png
similarity index 100%
rename from ui/images/navbar-style.png
rename to mainui/images/navbar-style.png
diff --git a/ui/images/notification.png b/mainui/images/notification.png
similarity index 100%
rename from ui/images/notification.png
rename to mainui/images/notification.png
diff --git a/ui/images/play-rule.png b/mainui/images/play-rule.png
similarity index 100%
rename from ui/images/play-rule.png
rename to mainui/images/play-rule.png
diff --git a/settings/images/plus.png b/mainui/images/plus.png
similarity index 100%
rename from settings/images/plus.png
rename to mainui/images/plus.png
diff --git a/settings/images/rules-overview.png b/mainui/images/rules-overview.png
similarity index 100%
rename from settings/images/rules-overview.png
rename to mainui/images/rules-overview.png
diff --git a/settings/images/rules-selection.png b/mainui/images/rules-selection.png
similarity index 100%
rename from settings/images/rules-selection.png
rename to mainui/images/rules-selection.png
diff --git a/settings/images/saturday-rule-schedule.png b/mainui/images/saturday-rule-schedule.png
similarity index 100%
rename from settings/images/saturday-rule-schedule.png
rename to mainui/images/saturday-rule-schedule.png
diff --git a/settings/images/scratchpad.png b/mainui/images/scratchpad.png
similarity index 100%
rename from settings/images/scratchpad.png
rename to mainui/images/scratchpad.png
diff --git a/settings/images/settings-menu.png b/mainui/images/settings-menu.png
similarity index 100%
rename from settings/images/settings-menu.png
rename to mainui/images/settings-menu.png
diff --git a/settings/images/settings-page.png b/mainui/images/settings-page.png
similarity index 100%
rename from settings/images/settings-page.png
rename to mainui/images/settings-page.png
diff --git a/ui/images/simple-nav-off.png b/mainui/images/simple-nav-off.png
similarity index 100%
rename from ui/images/simple-nav-off.png
rename to mainui/images/simple-nav-off.png
diff --git a/ui/images/simple-nav-on.png b/mainui/images/simple-nav-on.png
similarity index 100%
rename from ui/images/simple-nav-on.png
rename to mainui/images/simple-nav-on.png
diff --git a/ui/images/theme-selection.png b/mainui/images/theme-selection.png
similarity index 100%
rename from ui/images/theme-selection.png
rename to mainui/images/theme-selection.png
diff --git a/settings/images/timer-trigger.png b/mainui/images/timer-trigger.png
similarity index 100%
rename from settings/images/timer-trigger.png
rename to mainui/images/timer-trigger.png
diff --git a/ui/images/webaudio-blockly.png b/mainui/images/webaudio-blockly.png
similarity index 100%
rename from ui/images/webaudio-blockly.png
rename to mainui/images/webaudio-blockly.png
diff --git a/mainui/index.md b/mainui/index.md
new file mode 100644
index 0000000000..b078f49efa
--- /dev/null
+++ b/mainui/index.md
@@ -0,0 +1,32 @@
+---
+layout: documentation
+title: Main UI
+---
+
+# Main UI - Overview
+
+
+Since openHAB 3.0, the so-called "Main UI" is the primary web user interface of openHAB.
+It allows you to configure openHAB system, and provides a user interface for monitoring and control of your smart home.
+
+If you are new to openHAB, please refer to the [Getting Started guide]({{base}}/tutorial/), which is introducing you to Main UI by using it to set up openHAB.
+
+Users with the administrator role can use the left panel menu to access:
+
+- [**Settings**](settings)
+ The settings menu provides access to all settings that are configurable from the UI.
+- [**Add-on Store**](addons)
+ openHAB can and has to be extended via add-ons. Add-ons include bindings, automation, persistence and much more. Visit the store to discover all available add-ons.
+- [**Developer Tools**](developer)
+ Special functions including creation of custom widgets and block libraries as well as the developer sidebar.
+- [**Help & About**](about)
+ The about page shows general information of your openHAB configuration and allows to configure some client related configuration.
+
+
+## Special Features
+
+This section attempts to highlight some of Main UI's "special" features by linking to their respective documentation:
+
+- [Developer Sidebar Search]({{base}}/mainui/developer/sidebar.html#developer-sidebar-search): Provides a universal search across nearly all UI-configurable entities (i.e. Items, rules etc.).
+- [Web Audio Sink]({{base}}/mainui/about.html#web-audio-sink) support: Allows the openHAB server to play audio trough the browser on Main UI clients.
+- [UI Command Item]({{base}}/mainui/about.html#ui-command-item): Allows the openHAB server to control Main UI, e.g. navigate to UI pages or display a notification.
diff --git a/mainui/settings/index.md b/mainui/settings/index.md
new file mode 100644
index 0000000000..e9ee68f926
--- /dev/null
+++ b/mainui/settings/index.md
@@ -0,0 +1,67 @@
+---
+layout: documentation
+title: Settings
+---
+
+# Settings - Overview
+
+
+
+
+The settings page provides access to all openHAB setup and server-related settings that are configurable from the UI.
+Please note that this page is only accessible for users with the administrator role.
+
+Some often used subpages can also be accessed directly via the menu sidebar.
+
+
+
+
+### Configuration
+
+
+
+- [**Things**](things)
+ Configure and add your IoT devices and services.
+- [**Model**](model)
+ Configure the semantic, tree-like hierarchical model that structures Items and allows openHAB to automatically provide a UI.
+- [**Items**](items)
+ Items manage the functional layer of openHAB fully hardware-independent.
+- [**Pages**](pages)
+ Manage custom user interfaces including Main UI pages and sitemaps.
+- [**Transformations**](transformations)
+ Transformations convert a value or Item state into different value or state.
+- [**Persistence**](persistence)
+ openHAB can store data over time; this is known as persistence.
+ The data may be retrieved at a later time, for example to restore your system after startup, or to prepare graphs for display on a UI.
+
+Next to the entity, the count of that entity is shown.
+The Things count is not the number of configured Things, but the number of Things waiting in the [Inbox]({{base}}/tutorial/things_simple.html#accept-the-light-bulb-things).
+
+### Automation
+
+openHAB provides rules, scenes and scripts as well as a schedule overview to automate your home.
+See [What's the Difference Between a Rule, Script, and Schedule?]({{base}}/tutorial/rules_introduction.html#what-s-the-difference-between-a-rule-script-and-schedule) to learn more about the different options.
+
+- [**Rules**](rules)
+ Rules are essential for home automation:
+ Each rule can be triggered, which invokes a script that performs any kinds of tasks, e.g. turn on lights by modifying your items, do mathematical calculations, start timers etc.
+- [**Scenes**](scenes)
+ Special rules determined to command some Items to a pre-defined state.
+- [**Scripts**](scripts)
+ Special rules without triggers and with just one action determined to run code.
+- [**Schedule**](schedule)
+ Provides an overview of rules with time-based triggers and the `Schedule` tag.
+
+
+### System Settings
+
+This section lists openHAB's system settings, which e.g. includes regional, language, unit system and network settings.
+
+### Add-on Settings
+
+This section lists the installed add-ons and provides direct access to the add-on settings as well as the add-on log level:
+
+
+
+The standard log level is `INFO` but to track down an issue it might be necessary to increase the log-level upon request.
+For more information see [Logging in openHAB]({{base}}/administration/logging.html).
diff --git a/mainui/settings/items.md b/mainui/settings/items.md
new file mode 100644
index 0000000000..4321a1ca16
--- /dev/null
+++ b/mainui/settings/items.md
@@ -0,0 +1,24 @@
+---
+layout: documentation
+title: Settings - Items
+---
+
+# Settings - Items
+
+
+**Items** manage the functional layer of openHAB.
+Items can be linked to the channels of a Thing to control and read data from a device or service.
+Items have a state are used through events.
+Items can also be used to store information that is just used by your openHAB system itself.
+
+There is an [Items concepts page]({{base}}/concepts/items.html) that explains the idea of Items in detail.
+
+On these pages you can manage all the Items you have added to your system:
+
+- **Add new Items**
+ Add individual Items using the plus button and, if needed, manually link them to a channel.
+- **Configure Items**
+ Click on any Item in the list to see its configuration page.
+- **Delete Items**
+ Select multiple Items using the top **Select** button and use the **Remove** button at the bottom or use the Remove Item button on the individual Item pages.
+
diff --git a/mainui/settings/model.md b/mainui/settings/model.md
new file mode 100644
index 0000000000..9b1c76736d
--- /dev/null
+++ b/mainui/settings/model.md
@@ -0,0 +1,28 @@
+---
+layout: documentation
+title: Settings - Model
+---
+
+# Settings - Model
+
+
+The **Semantic Model** is a way for you to group and categorize your openHAB Items to provide additional real-world relationships and information about them.
+openHAB can use this information to automatically generate the location, equipment, and properties tabs of the home page.
+
+Learn more about the semantic model in [the tutorial]({{base}}/tutorial/model.html).
+
+Every semantic model object (location, equipment, or point) is just a regular openHAB Item with semantic tags and arranged in semantic groups.
+It is important to note that not all of your Items need to be included in the semantic model.
+For most systems it only makes sense to include these Items that users will interact with.
+
+On this page you can manage your system's semantic model:
+
+- **Add new Locations**
+ Add group Items with semantic group tags to represent physical locations in and around your home.
+- **Add new Equipment**
+ Add group Items with semantic equipment tags to represent devices of interest to users in specific locations.
+- **Add new Points**
+ Add Items with semantic class and property tags to represent the actual information and interactions that users will need.
+- **Bulk creation of Points**
+ Create equipment directly from your Things with the desired Items for rapid building of a semantic model.
+
diff --git a/mainui/settings/pages.md b/mainui/settings/pages.md
new file mode 100644
index 0000000000..7ec6f418f5
--- /dev/null
+++ b/mainui/settings/pages.md
@@ -0,0 +1,26 @@
+---
+layout: documentation
+title: Settings - Pages
+---
+
+# Settings - Pages
+
+
+**Pages** allow to design custom displays for user control & monitoring.
+Though openHAB automatically creates an [overview page]({{base}}/tutorial/auto_overview.html#overview-page) of your locations, equipment (e.g. light-bulbs), and available properties (e.g. temperature measurements) based on the semantic model,
+it also allows to design and create custom pages with sophisticated [standard widgets]({{base}}/tutorial/item_widgets.html) and [custom widgets]({{base}}/tutorial/custom_widgets.html).
+
+Before manually creating pages, it is highly recommended to read the [User Interface Design Overview]({{base}}/ui/) first.
+The [pages tutorial section]({{base}}/tutorial/pages_intro.html) explains how to create and design user interface pages within openHAB.
+
+On these pages you can manage all the Pages you have added to your system:
+
+- **Add new Pages**
+ Add individual Pages of all the different types using the plus button.
+- **Configure Pages**
+ Click on any Page in the main list to see a graphical editor and a yaml code editor for that page.
+- **Delete Pages**
+ Select multiple Pages using the top **Select** button and use the **Remove** buttons at the bottom.
+- **Test Pages**
+ See your changes and test the page functions using the **Run** option in the editor.
+
diff --git a/mainui/settings/persistence.md b/mainui/settings/persistence.md
new file mode 100644
index 0000000000..3c812d2647
--- /dev/null
+++ b/mainui/settings/persistence.md
@@ -0,0 +1,25 @@
+---
+layout: documentation
+title: Settings - Persistence
+---
+
+# Settings - Persistence
+
+
+**Persistence** stores data over time.
+The data may be retrieved at a later time, for example to restore your system after startup, or to prepare graphs for display on the UI.
+
+openHAB ships with the [RRD4J persistence service](/addons/persistence/rrd4j/) installed by default, which persists every Item on every state change and at least once a minute.
+Additionally, it restores the last stored value at system startup.
+
+To change this behaviour, this is the page you are looking for!
+
+Here you can:
+
+- Set the **default persistence service**.
+- **Configure Persistence Policies**
+ For each installed persistence service, a list entry is added.
+ Clicking on a persistence service from that list opens a page to create a new one or edit the existing persistence configuration of that persistence service.
+- **Install more persistence add-ons**
+ Click on the plus button to switch to the add-ons store and install more persistence services.
+
diff --git a/mainui/settings/rules.md b/mainui/settings/rules.md
new file mode 100644
index 0000000000..87403262ef
--- /dev/null
+++ b/mainui/settings/rules.md
@@ -0,0 +1,53 @@
+---
+layout: documentation
+title: Settings - Rules
+---
+
+# Settings - Rules
+
+
+**Rules** are the heart of home automation - automate with triggers, actions and conditions.
+Rules can be as simple as a directive to turn on a single light at a given time but the use of scripting languages and Blockly also allows much more complex automations.
+
+Community made Rule Templates can also be added to your system from the **Automation** tab of the add-on store.
+
+On this page you can manage all the basic rules you have added to your system:
+
+
+
+- **Add new Rules**
+ Add rules using the plus button.
+- **Configure Rules**
+ Click on any rule in the list to configure the rule or write a script action for the rule.
+- **Delete Rules**
+ Select multiple rules using the top **Select** button and use the **Remove** button at the bottom or use the Remove Rule button on the individual rule pages.
+- **Enable/Disable Rules**
+ Select multiple rules using the top **Select** button and use the **Enable** or **Disable** buttons at the bottom or use pause button on the individual rule pages.
+- **Manually run Rules**
+ Use the play button on the individual rule pages to have the rule run all actions immediately.
+
+
+The page has a searchable list of rules with the following attributes:
+
+- name
+- unique id
+- description
+- enabled state (disabled, enabled, idle, running)
+- tags
+
+The searchbar allows to filter by the name, the description and the tags of that rule.
+
+When clicking "select" in the top right corner, the list allows to select multiple entries at the same time:
+
+
+
+After selecting one or multiple rules three options appear in the footer to allow
+
+- removing
+- disabling or
+- enabling
+
+these rules.
+Press "Done" to return back to the normal list view.
+
+To add a rule press the plus icon  in the lower right corner and follow the [rules tutorial]({{base}}/tutorial/rules_basic.html#create-the-rule).
diff --git a/mainui/settings/scenes.md b/mainui/settings/scenes.md
new file mode 100644
index 0000000000..de2e34248b
--- /dev/null
+++ b/mainui/settings/scenes.md
@@ -0,0 +1,28 @@
+---
+layout: documentation
+title: Settings - Scenes
+---
+
+# Settings - Scenes
+
+
+**Rules** are the heart of home automation.
+**Scenes** are special types of rules, which require no coding.
+Scenes allow you to define an Item and its respective state very easily and combine multiple of them as a collection of item actions to be run.
+Note that the Scenes do not support triggers or conditions and need to be explicitly triggered via a page or a rule.
+
+A comprehensive introduction to scenes can be found at the [scenes tutorial]({{base}}/tutorial/rules_scenes.html).
+
+On this page you can manage all the scenes you have added to your system:
+
+- **Add new Scenes**
+ Add Scenes using the plus button.
+- **Edit Scenes**
+ Click on any scene in the list to edit the scene's Item commands.
+- **Delete Scenes**
+ Select multiple scenes using the top **Select** button and use the **Remove** button at the bottom or use the Remove Scene button on the individual scene pages.
+- **Enable/Disable Scenes**
+ Use the pause buttons on the individual scene pages.
+- **Manually run Scenes**
+ Use the play button on the individual scene pages to have the scene run immediately.
+
diff --git a/mainui/settings/schedule.md b/mainui/settings/schedule.md
new file mode 100644
index 0000000000..142ea28230
--- /dev/null
+++ b/mainui/settings/schedule.md
@@ -0,0 +1,39 @@
+---
+layout: documentation
+title: Settings - Schedule
+---
+
+# Settings - Schedule
+
+
+View upcoming time-based rules.
+
+When you create a rule, add the `Schedule` tag and define a time trigger,
+
+
+
+then this rule will be shown in the calendar view on this page.
+
+
+As an example create a rule that triggers
+
+every Saturday
+
+
+
+at 7:00 in the morning
+
+
+
+and it will appear in the schedule view:
+
+
+
+A rule that is scheduled repeatedly like every day at 8:00 in the morning will therefore be shown on every day of the calendar view.
+The way openHAB handles this, is that a rule will get a tag "schedule", so if you create a rule with the help of the  at the bottom right corner, openHAB automatically adds that tag (that is also true if you create a rule with a time trigger via the normal rule page).
+In case you have timed that trigger that repeats very often and which would "pollute" the schedule view with far too many entries, you can just delete the tag "schedule" in the edit mode of that rule (it can always be added later again).
+
+The page has a searchable list which allows to filter by the name of the rule.
+
+To see more entries scroll to the left or the right.
+Note that the selection functionality is currently not supported.
diff --git a/mainui/settings/scripts.md b/mainui/settings/scripts.md
new file mode 100644
index 0000000000..007b8c87e3
--- /dev/null
+++ b/mainui/settings/scripts.md
@@ -0,0 +1,25 @@
+---
+layout: documentation
+title: Settings - Scripts
+---
+
+# Settings - Scripts
+
+
+**Rules** are the heart of home automation.
+**Scripts** are special types of rules with only one action and no triggers, so they have to be called from "real" rules or run manually.
+They can be used to reuse code and logic across multiple other rules, for experimentation to figure something out, create a catalog of examples, or to drive tests for other rules and behaviors.
+
+On this page you can manage all the scripts you have added to your system:
+
+- **Add new Scripts**
+ Add scripts using the plus button.
+- **Edit Scripts**
+ Click on any script in the list to edit the action of the script.
+- **Delete Scripts**
+ Select multiple scripts using the top **Select** button and use the **Remove** button at the bottom or use the Remove Script button on the individual scripts' pages.
+- **Enable/Disable Scripts**
+ Select multiple scripts using the top **Select** button and use the **Enable** or **Disable** buttons at the bottom or use pause button on the individual scripts' pages.
+- **Manually run Scripts**
+ Use the play button on the individual script pages to have the rule run all actions immediately.
+
diff --git a/mainui/settings/things.md b/mainui/settings/things.md
new file mode 100644
index 0000000000..c989a6ff5b
--- /dev/null
+++ b/mainui/settings/things.md
@@ -0,0 +1,40 @@
+---
+layout: documentation
+title: Settings - Things
+---
+
+# Settings - Things
+
+
+**Things** manage the physical layer of the openHAB system and represent individual devices or services.
+The Things that you can add to your system are determined by the bindings that you have installed.
+
+There is a [Things concepts page]({{base}}/concepts/things.html) that explains the idea of Things in detail.
+
+On this page, you can manage all the Things you have added to your system:
+
+- **Add new Things**
+ Use the [Thing Inbox](#inbox) to scan for available things or manually add ones that cannot be found automatically using the plus button.
+- **Configure Things**
+ Click on any Thing in the list to see its configuration page and its channels.
+- **Delete Things**
+ Select multiple Things using the top **Select** button and use the **Remove** buttons at the bottom or use the Delete Thing button on the individual Thing pages.
+- **Enable/Disable Things**
+ Select multiple Things using the top **Select** button and use the **Enable** or **Disable** buttons at the bottom or use the pause button on the individual Thing pages.
+
+
+Adding Things via the user interface is described comprehensively in the tutorial section:
+
+- [Adding Things - Simple]({{base}}/tutorial/things_simple.html)
+- [Adding Things - Intermediate]({{base}}/tutorial/things_intermediate.html): Things that are dealing with a binding where the bridge-Thing cannot be automatically discovered.
+- [Adding Things - Advanced]({{base}}/things_advanced.html): Things that do not support automatic discovery.
+
+## Inbox
+
+Many devices, technologies and systems can be automatically discovered on the network or browsed through some API.
+It therefore makes a lot of sense to use these features for a smart home solution.
+
+openHAB bindings can therefore implement discovery services for Things, which provide discovery results.
+All discovery results are put into the Thing inbox from where they can be easily added to openHAB with just a few clicks.
+
+Please read [the tutorial]({{base}}/tutorial/things_simple.html#accept-the-light-bulb-things) to learn how to use the inbox.
diff --git a/mainui/settings/transformations.md b/mainui/settings/transformations.md
new file mode 100644
index 0000000000..1e791ba22d
--- /dev/null
+++ b/mainui/settings/transformations.md
@@ -0,0 +1,22 @@
+---
+layout: documentation
+title: Settings - Transformations
+---
+
+# Settings - Transformations
+
+
+**Transformations** convert a value or Item state into a different value or state.
+Transformations can be used in many different instances including links between channels and Items, rules and scripts, and some Thing configurations.
+
+The different available transformation methods must be individually installed via the **Other** tab of the add-on store.
+
+On this page you can manage all the transformations you have added to your system:
+
+- **Add new Transformations**
+ Add individual transformations using the plus button.
+- **Configure Transformations**
+ Click on any transformation in the list to see its configuration page.
+- **Delete Transformations**
+ Select multiple transformations using the top **Select** button and use the **Remove** button at the bottom or use the Remove Transformation button on the individual transformation pages.
+
diff --git a/settings/addons.md b/settings/addons.md
deleted file mode 100644
index 245aee5895..0000000000
--- a/settings/addons.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-layout: documentation
-title: Add-ons
----
-
-# Add-ons
-
-This section lists the installed add-ons and provides direct access to the settings that are directly related to that add-on.
-
-This section is particular important as it allows the setting of the log-level of a particular addon:
-
-
-
-The standard log level is "Info" but to track down an issue it might be necessary to increase the log-level upon request.
-For more information see [Logging in openHAB]({{base}}/administration/logging.html)
diff --git a/settings/automations.md b/settings/automations.md
deleted file mode 100644
index c41253826a..0000000000
--- a/settings/automations.md
+++ /dev/null
@@ -1,87 +0,0 @@
----
-layout: documentation
-title: Automation
----
-
-# Automation
-
-This is the section to automate openHAB which provides rules, script and a scheduling section.
-See [What's the Difference Between a Rule, Script, and Schedule?](/docs/tutorial/rules_introduction.html#what-s-the-difference-between-a-rule-script-and-schedule)
-
- [[toc]]
-
-## Rules
-
-Automate with triggers and actions: this links you to the page that allows you to manage your rules.
-
-
-The page has a searchable list of rules where the following attributes
-
-- name
-- unique id
-- description
-- enabled state (disabled, enabled, idle, running)
-- tags
-
-The searchbar allows to filter by the name, the description and the tags of that rule.
-
-When clicking "select" on the top right corner, the list allows to select multiple entries at the same time.
-
-
-
-After selecting one or multiple rules three options appear in the footer to allow
-
-- removing
-- disabling or
-- enabling
-
-these rules.
-Press "Done" to return back to the normal list view.
-
-To add a rule press the plus icon on the lower right corner:  and follow the [rules tutorial](/docs/tutorial/rules_basic.html#create-the-rule).
-
-## Scripts
-
-Rules consisting of a single Script Action and has the tag "Script", there are no triggers so they must be run manually or called from another rule.
-
-The list behaves exactly like the rule overview described above.
-
-Note: there is a special in the "Developer Sidebar"->"Code Tools" section that allows to play around with script expressions.
-Below that section is a link that allows to "Open a Scratchpad".
-This in fact creates a script in the scripts section that is automatically named "-Scratchpad" and is tagged with the tag "Scratchpad".
-It will appear in the list as follows.
-
-
-
-## Schedule
-
-View upcoming time-based rules
-
-When you create a rule and define a time trigger
-
-
-
-this rule will be shown in the Schedule Calendar view here.
-
-As an example create a rule that triggers
-
-every Saturday
-
-
-
-at 7:00 in the morning
-
-
-
-and it will appear in the schedule view:
-
-
-
-A rule that is schedule repeatedly like everyday at 8:00 in the morning will therefore be shown on every day of the calendar view.
-The way openHAB handles this, is that a rule will get a tag "schedule", so if you create a rule with the help of the  at the bottom right corner, openHAB automatically adds that tag (that is also true if you create a rule with a time trigger via the normal rule page).
-In case you have timed that trigger that repeats very often and which would "pollute" the schedule view with far too many entries, you can just delete the tag "schedule" in the edit mode of that rule (it can always be added later again).
-
-The page has a searchable list which allows to filter by the name of the rule.
-
-To see more entries scroll to the left or the right.
-Note that the selection functionality is currently not supported.
diff --git a/settings/configuration.md b/settings/configuration.md
deleted file mode 100644
index ff874faf08..0000000000
--- a/settings/configuration.md
+++ /dev/null
@@ -1,59 +0,0 @@
----
-layout: documentation
-title: Configuration
----
-
-# Configuration
-
-This section allows the configuration of things, items and user interface pages
-
- [[toc]]
-
-Next to the entity the count of that entity is shown, though the Things count is not the number of all configured Things but the count of the Things waiting in the [Inbox](/docs/tutorial/things_simple.html#accept-the-light-bulb-things).
-
-
-
-## Things
-
-_Things_ manage the physical layer of the openHAB System.
-There is a [Things concepts page](/docs/concepts/things.html) that explains the idea of Things in detail.
-
-The general explanation on how to **configure things** via things-files is described in the [Things configuration page](/docs/configuration/things.html)
-
-Adding Things via the user interface as part of the _settings section_ is described comprehensively in the tutorial section
-
-- [Adding Things - Simple](/docs/tutorial/things_simple.html)
-- [Adding Things - Intermediate](/docs/tutorial/things_intermediate.html): Things that are dealing with a binding where the bridge-Thing cannot be automatically discovered.
-- [Adding Things - Advanced](/docs/things_advanced.html): Things that do not support automatic discovery
-
-## Semantic Model and Items
-
-_Items_ manage the functional layer of openHAB.
-Items, which are linked to a Thing, represent functionality that is used by the application (mainly user interfaces or automation logic).
-Items have a state and are used through events.
-
-There is an [Items concepts page](/docs/concepts/items.html) that explains the idea of Items in detail.
-
-The general explanation on how to **configure items** via things-files is described in the [Items configuration page](/docs/configuration/items.html)
-
-An integral part on how to model items is the [Semantic Model](/docs/tutorial/model.html) of your home which structures Items in a hierarchical, tree-like model.
-That documentation also explains [how to build the Model](/docs/tutorial/model.html#building-the-locations-model) via the openHAB user interface.
-
-## User Interface Pages
-
-This configuration section allows to design displays for user control & monitoring.
-openHAB 3 has introduced a new unified user interface called MainUI. Almost everything that can be configured in openHAB can be configured through MainUI.
-
-Though openHAB automatically creates an [overview page](/docs/tutorial/auto_overview.html#overview-page) based on the semantic model, it also allows to design and create custom user interface pages with sophisticated [standard widgets](/docs/tutorial/item_widgets.html) and [custom widgets](/docs/tutorial/custom_widgets.html).
-Therefore, it is highly recommended reading the [User Interface Design Overview](/docs/ui/) first.
-
-The [pages tutorial section](/docs/tutorial/pages_intro.html) explains how to create and design user interface pages within openHAB.
-
-Within this section the following page types can be created:
-
-- [Layout](/docs/ui/layout-pages.html): Layout Pages are used in the main web user interface to display widgets in an organized manner.
-- [Tabbed Pages](/docs/ui/tabbed-pages.html): Tabbed Pages are composite Pages which are able to display other Pages in tabs.
-- [Charts](/docs/ui/chart-pages.html): Chart Pages can display historical values in a full-screenchart component.
-- [Floor Plans](/docs/ui/floorplan-pages.html): Floorplan Pages can display markers or other elements over a custom image.
-- [Map Views](/docs/ui/map-pages.html): Map Pages can display either fixed markers or markers representing items of type Location, on a map.
-- [Sitemap](/docs/ui/sitemaps.html): Sitemaps have existed since the first versions of openHAB and were used as an easy way display items. Keep in mind that the main UI is not currently able to display them, though the mobile apps still are.
diff --git a/settings/index.md b/settings/index.md
deleted file mode 100644
index e2e4101a48..0000000000
--- a/settings/index.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-layout: documentation
-title: Settings
----
-
-# Settings
-
-The settings page can be reached via the menu and is main area where openHAB can be configured:
-
-
-
-The _Settings_ entry links to an overview page that itself has several subsections that lead you to the respective configuration pages..
-
-
-
-Some of these subpages, which are most often used, can also be accessed directly via the menu, e.g. either click on _Settings->Items_ in the overview page or on directly _Items_ in the menu.
-
-## Sections
-
-- [Configuration](/docs/settings/configuration.html)
-- [Automation](/docs/settings/automations.html)
-- [System Settings](/docs/settings/system_settings.html)
-- [Add-ons](/docs/settings/addons.html)
diff --git a/settings/system_settings.md b/settings/system_settings.md
deleted file mode 100644
index 173b9ec129..0000000000
--- a/settings/system_settings.md
+++ /dev/null
@@ -1,47 +0,0 @@
----
-layout: documentation
-title: System Settings
----
-
-# System Settings
-
-This is the section that of the system settings
-
- [[toc]]
-
-## Regional Settings
-
-## Unit Settings
-
-## Network Settings
-
-## Audio
-
-## JSON Storage
-
-## Persistence
-
-## API Security
-
-## Rule Voice Interpreter
-
-## Add-on Management
-
-## Community Marketplace
-
-## Json 3rd Party Add-on Service
-
-## Voice
-
-## Charts
-
-## Sitemap
-
-## Inbox
-
-## Ephemeris
-
-## Language Server (LSP)
-
-**Note:** Originally it included settings for openHAB cloud, Basic UI etc.
-These can now be found in the _Add-on Settings_.
diff --git a/tutorials/getting_started/tips-and-tricks.md b/tutorials/getting_started/tips-and-tricks.md
index 853dc8dda8..9ddae2d8b9 100644
--- a/tutorials/getting_started/tips-and-tricks.md
+++ b/tutorials/getting_started/tips-and-tricks.md
@@ -44,7 +44,7 @@ Imagine you need to find all usages of an Item in rules or pages.
You could open all your rules and pages to check them, or just use the developer sidebar search.
Enter your Item name, and you will see in which rules, scenes, scripts and pages that Item is used.
-For more information about the search and which entities are searchable, please refer to the [Developer Sidebar docs]({{base}}/ui/mainui.html#developer-sidebar-search).
+For more information about the search and which entities are searchable, please refer to the [Developer Sidebar docs]({{base}}/mainui/developer/sidebar.html#developer-sidebar-search).
### Pinned Objects
diff --git a/ui/aboutpage.md b/ui/aboutpage.md
deleted file mode 100644
index b804bad117..0000000000
--- a/ui/aboutpage.md
+++ /dev/null
@@ -1,135 +0,0 @@
----
-layout: documentation
-title: Help & About Page
----
-
-# Help & About Page
-
-The about page shows general information of your openHAB configuration and allows to configure some client related configuration.
-
- [[toc]]
-
-## Top Section
-
-
-
-- Version: shows the currently installed version of openHAB
-- Links to the official openHAB Website, the openHAB Documentation and the Community Forum
-
-## Technical Information
-
-This section is collapsed by default and can be opened by clicking on it which then reveals the
-
-- Configuration folder on the server
-- User data folder on the server
-- Logs folder on the server
-- Operating System openHAB is running on
-- Java Runtime openHAB is running on
-- number of processors and memory
-
-Clicking on View Details opens up a popup window that contains very detailed information like
-
-- Runtime information
-- Locale (language)
-- System information including memory information
-- A list of all installed bindings
-- Client information including device information, client settings (see also the below section), screen information, theme, user agent information.
-
-The content can be easily copied with the copy button on the top to provide it as additional information when asking questions in the community.
-
-## Appearance (for this device only)
-
-This section allows to have different appearance settings _per_ device.
-
-- **Theme**: Selects the theme for that device
- - Auto: tries to detect the client type
- - Android
- - iOS
- - Desktop
-
-
-
-- **Dark mode** setting
- - Auto: uses the default mode
- - Light-Mode
- - Dark-Mode
-
-
-
-- **Navigation bars style**: inverts the colors in the navigation bar
-
-
-
-## Miscellaneous settings
-
-- **Simple navigation bar on home page**: When switching it on, it means the navigation bar will look the same even whether you're at the top of the page or not - you won't have the alternate look with the date.
-The first image depicts the normal setting (off), the second image shows it switched off
-
- 
-
-- **Standard home page background color**: This only relates to the light color scheme.
-The background color will be the same as the regular pages you can show from e.g. the sidebar, which is a kind of gray instead of white.
-The first image depicts the normal white setting (off), the second image shows it switched off with the gray setting.
-
- 
-
-- **Disable card expansion animations**: Disables the animations when expanding a widget card.
-- **Disable page transition animations**: Disables the transitions when switching from one page to the other.
-
-### Enable Web Audio sink support
-
-- This setting is also part of the miscellaneous settings.
-- The intent of that option is to allow sending audio to that device, e.g. if that device is a tablet that is hanging on the wall in a room and a specific audio should be sent to that device for notification purposes.
-- To activate audio output of that particular device, switch on this option.
-In case you want to activate audio on multiple devices, each device needs to be activated by opening the about page on the device.
-Technically, this information (and all the other miscellaneous settings) are stored in the local storage of the browser.
-- For me information [see here](https://github.com/openhab/openhab-webui/pull/1422)
-
-To test if it works play some static content that comes with openHAB in the /sounds dir using an openHAB console command.
-Use [openHABs console](docs/administration/console.html#using-the-console) or just run the following from the linux shell:
-
-> openhab-cli console
-
-and then enter the following command:
-
-```text
-openhab> audio play webaudio barking.mp3
-```
-
-If you have a dog that gets triggered by barking you may opt for playing doorbell.mp3 instead.
-If you play doorbell.mp3 your dog will then probably play its own barking audio sound. 😉
-Note that most browsers block web pages from playing audio/video automatically nowadays (though some browsers have a setting to activate automatic play)
-
-Here are some useful actions available to rules in which you can specify webaudio as sink, see:
-
-- [playSound](/docs/configuration/multimedia.html#actions-2)
-
-```text
-playSound("webaudio", "barking.mp3")
-```
-
-- [say](/docs/configuration/multimedia.html#actions-3)
-
-```text
-say("Hello world!", "voicerss:enUS", "webaudio")
-```
-
-You can also configure webaudio as sink when creating rules in the UI:
-
-
-
-or using it in a blockly rule:
-
-
-
-It is important to understand that you cannot address one particular device.
-When you play a sound on webaudio, it will be played on each device where webaudio is activated.
-
-If you really like webaudio, you can also make it the default sink in the "Audio" settings - see [Settings->Audio](/docs/settings/services_system.html#Audio).
-Then you can omit the webaudio sink ID from commands/actions.
-
-
-
-## Reload
-
-Reload the web page to reflect the selected changes.
diff --git a/ui/images/settings-audio.png b/ui/images/settings-audio.png
deleted file mode 100644
index b075003c5d..0000000000
Binary files a/ui/images/settings-audio.png and /dev/null differ
diff --git a/ui/mainui.md b/ui/mainui.md
deleted file mode 100644
index ebc7c591ed..0000000000
--- a/ui/mainui.md
+++ /dev/null
@@ -1,113 +0,0 @@
----
-layout: documentation
-title: Main UI
----
-
-# Main UI
-
-Since openHAB 3.0, the so-called "Main UI" is the main web user interface of openHAB.
-Main UI allows the administrator (you) to set up and configure openHAB, and provides many types of pages to visualize data and control Items.
-
-This page aims at providing an overview over Main UI's "special" features, which means it does not try to document Main UI in general or provide a comprehensive overview over all its many capabilities and configuration pages.
-If you are new to openHAB, please refer to the [Getting Started guide]({{base}}/tutorial/), which is introducing you to Main UI by using it to set up openHAB.
-
-[[toc]]
-
-## Developer Sidebar
-
-Main UI provides a developer sidebar for administrator user(s), that is accessible from anywhere in the UI.
-The developer sidebar is split into a "tools" section with several useful tools including a universal search across nearly all UI-configurable entities and a widget expression tester, and a "help" section aiming at providing help and useful information regarding configuration and setup.
-
-If your device's screen is wide enough (it has to be at least 1280 pixels wide), you can open the developer side-panel by:
-
-- Opening the **Developer Tools** page from the menu and enabling the developer sidebar.
-- Clicking on the help icon displayed in the upper right corner of most pages.
-- Pressing the key combination AltShiftD on your keyboard.
-
-### Developer Sidebar Search
-
-As already mentioned, the developer sidebar provides a universal search across nearly all UI-configurable entities.
-This means, you can search through most configuration available in Main UI, including Things, Items, pages.
-
-Imagine you need to find all usages of an Item.
-You could start to open all rules, scenes and scripts, check persistence configuration and have a look at pages and sitemaps to find usages of that Item - Or you use the developer sidebar search.
-
-The developer sidebar search ignores case (so it doesn't matter whether you search `LivingRoom_Light` or `livingroom_light`) and searches inside the following entities:
-
-- Things
- - UID
- - label
-- Items
- - name
- - label
- - tags (requires exact match, i.e. if the Item has a tag `Lightbulb`, only the search query `Lightbulb` (case doesn't matter) will match)
- - metadata
-- Pages (including Sitemaps)
- - uid
- - label
- - content (widgets, tabs, charts, etc. with their configuration)/slots
-- Transformations
- - uid
- - label
- - type
-- Rules, Scenes & Scripts
- - Item name & Thing UID of triggers, actions & conditions
- - script code (e.g. Rules DSL, JavaScript, and even Blockly)
- - script MIME types (requires exact match)
- - Blockly scripts (using `block`, `blockly` or `blocksource` as search string, where case is ignored)
- - tags (requires exact match)
-- Persistence Configurations:
- - label & service id of persistence service
- - Items persisted by persistence service
-
-## Web Audio Sink
-
-Main UI implements a web audio sink which allows the openHAB server to play audio through the web browser.
-
-To enable web audio sink support for a client, open the **Help & About** page from the menu and turn on the **Enable Web Audio sink support** option.
-As it is setting specific to your browser environment, web audio support has to be enabled for every client where it should be used.
-
-Please note that due to limitations in Safari (and possibly Chrome as well), a user interaction is required after the first audio stream has been sent to actually play it.
-This means, that after opening Main UI, the first audio that should be played on the web audio sink is only player after the user interacts with Main UI in any way (i.e. touching the screen is enough).
-For subsequent audio playback, that is not required anymore and the audio is played immediately.
-
-Please also note that you cannot address a particular web audio-enabled device.
-When you play a sound on web audio, it will be played on all devices where web audio is enabled.
-
-Web audio sinks can be used for example on wall-mounted tablets to make announcements using a [text-to-speech (TTS) engine]({{base}}/configuration/multimedia.html#text-to-speech) and play notification or alarm sounds.
-
-For more information about audio sinks as well as audio and voice actions, please refer to the [multimedia configuration docs]({{base}}/configuration/multimedia.html), where you will also find examples including UI-based rules and Blockly.
-
-## UI Command Item
-
-Main UI can be controlled from the openHAB server by setting up a so-called UI command Item.
-
-Similarly to web audio support, this is a setting specific to your local browser environment, so you have to define the UI command Item for each client, which also allows you to different UI command Items for different clients.
-To set up an Item as the UI command Item on your device, first create a particular Item of type `String`, then open the **Help & About** page from the menu and select an Item for the **Listen for UI command to** option.
-
-The command Item has to be a `String` Item.
-The UI is listening for commands to that Item, and if an Item command is a valid command string, the UI executes the given command.
-
-Currently, the supported commands are:
-
-- `navigate:$path`:
- Navigate to a given `$path`, e.g. `navigate:/locations` to navigate to the **Locations** tab of the home page or `navigate:/page/my_custom_page` to navigate to a page with the ID `my_custom_page`.
- For example, you can use this to open a video camera page of the door automatically when the doorbell is rung.
-- `popup:$target`, `popover:$target` and `sheet:$target`:
- Open a `$target`, which can be a page (`$target` is `page:` + a page ID), a custom widget (`$target` is `widget:` + widget ID) or any [`oh-` component]({{base}}/ui/components/) (`$target` is the component name), in a popup, popover or sheet.
-
- For example, to open `oh-clock-card` inside a popup, send `popup:oh-clock-card` to the UI command Item.
-- `notification:$text:$title:$subtitle:$titleRight:$closeTimeout`:
- Display a notification inside the UI:
- The `$text` parameter is mandatory, all other parameters are optional.
- `$closeTimeout` is in milliseconds and defaults 5000, which means by default a notification will be closed after 5 seconds.
- To leave out a parameter, leave a colon space empty, e.g. `notification:$text:$title:::$closeTimeout`.
-
- For example, send `notification:This is the text.:This is the title.:This is the subtitle.:This is the right title.` to the UI command Item to display the following notification:
-
-- `close`:
- Close all popups, popovers and sheets.
-- `back`:
- Navigate back.
-- `reload`:
- Reload the current page.
diff --git a/ui/widget-expressions-variables.md b/ui/widget-expressions-variables.md
index d7197f3e3a..3dec85c400 100644
--- a/ui/widget-expressions-variables.md
+++ b/ui/widget-expressions-variables.md
@@ -214,5 +214,5 @@ Substract one week from the state of `DateTime` and return a relative time repre
## Debugging Expressions
-Expressions can be tested in the Widgets Expression Tester found in the [Developer Sidebar](mainui.html#developer-sidebar)
+Expressions can be tested in the Widgets Expression Tester found in the [Developer Sidebar]({{base}}/mainui/developer/sidebar.html#developer-sidebar)
(ShiftAltD).