semanticHomeMenu
Vision / About
The idea is to have a UI for openHAB4 that dynamically configures itself automatically using the data of the openHAB semantic model.
It is also possible to use the specialized widgets standalone or to extend the project with further widgets your own, some inspiration will be given later.
History
An openHAB 4 specific version became necessary because we identified some strong performance issues in “main_widget” due to the heavy usage of the oh-repeater component, which is used to gather all semantic information needed to reduce configuration commplexity.
Concept idea
This MainUI widget is based on a proper configuration of the openHAB semantic model and a strict naming scheme for Items.
The project aims to show all information automatically - if found in the model - mostly without additional configuration by the user.
To help getting more information about an item we make use of an extention of the semantic model via the uiSemantics.
The Menu is split into a Top Navigation Bar,
the Body showing multiple specialized widgets (which are shown if the model contains the needed data)
and the the Bottom Navigation Bar.
Bottom Navigation Bar with Scenes selected
The red indicator badges are shown if there is any alarm, whether security or low battery. Usage and setup will be explained in the security and energy widget documentation.
- [Weather widget]
- [Security widget]
- including the [Keypad widget]
- [Scenes widget]
- [Lights widget]
- [Rollershutter widget]
- [RadiatorControl widget]
- [HVAC widget]
Installation and Usage
Prerequisite for using this project is a well maintained semantic model and a strict naming scheme for the used Items.
We recommend to use the “create equipment from Thing” option in MainUI or the provided examples for textual import (change to your individual needs).
Group gHome "Home" ["Building"]
Group gIndoor "Building" <house> (gHome) ["Indoor"]
Group gOutdoor "Outdoor" <garden> (gHome) ["Outdoor"]
Group gAttic "Attic" <attic> (gIndoor) ["Attic"] {widgetOrder="11"}
Group gCorridorAttic "Corridor Attic" <corridor> (gAttic) ["Corridor"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Corridor", location="Attic"],widgetOrder="12"}
Group gOffice "Office" <office> (gAttic) ["Room"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Office", location="Attic"],widgetOrder="13"}
Group gGuestroom "Guestroom" <bedroom> (gAttic) ["Bedroom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Guestroom", location="Attic"],widgetOrder="14"}
Group gFirstFloor "First Floor" <firstfloor> (gIndoor) ["FirstFloor"] {widgetOrder="21"}
Group gCorridorFirstfloor "Corridor FF" <corridor> (gFirstFloor) ["Corridor"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Corridor", location="First Floor"],widgetOrder="22"}
Group gChildroom "Childroom" <boy_1> (gFirstFloor) ["Bedroom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Childroom", location="First Floor"],widgetOrder="23"}
Group gBathroom "Bathroom" <bath> (gFirstFloor) ["Bathroom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Bathroom", location="First Floor"],widgetOrder="24"}
Group gBedroom "Bedroom" <bedroom> (gFirstFloor) ["Bedroom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Bedroom", location="First Floor"],widgetOrder="25"}
Group gGroundFloor "Ground Floor" <groundfloor> (gIndoor) ["GroundFloor"] {widgetOrder="31"}
Group gEntrance "Corridor GF" <corridor> (gGroundFloor) ["Corridor"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Corridor", location="Ground Floor"],widgetOrder="32"}
Group gToilet "Toilet" <toilet> (gGroundFloor) ["Bathroom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Toilet", location="Ground Floor"],widgetOrder="33"}
Group gKitchen "Kitchen" <kitchen> (gGroundFloor) ["Kitchen"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Kitchen", location="Ground Floor"],widgetOrder="34"}
Group gDiningroom "Diningroom" (gGroundFloor) ["DiningRoom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Dininroom", location="Ground Floor"],widgetOrder="35"}
Group gLivingroom "Livingroom" <sofa> (gGroundFloor) ["LivingRoom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Livingroom", location="Ground Floor"],widgetOrder="36"}
Group gBasement "Basement" <cellar> (gIndoor) ["Basement"] {widgetOrder="41"}
Group gCorridorCellar "Corridor Basement" <corridor> (gBasement) ["Corridor"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Corridor", location="Basement"],widgetOrder="42"}
Group gLaundry "Laundryroom" <washingmachine> (gBasement) ["LaundryRoom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Laundryroom", location="Basement"],widgetOrder="43"}
Group gBoilerRoom "Boilerroom" <heating> (gBasement) ["BoilerRoom"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Boilerroom", location="Basement"],widgetOrder="44"}
Group gHobbyroom "Hobbyroom" (gBasement) ["Room"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Hobbyroom", location="Basement"],widgetOrder="45"}
Group gGarden "Garden" <garden> (gOutdoor) ["Garden"] {widgetOrder="51"}
Group gShed "Shed" <garden> (gOutdoor) ["Location"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Shed", location="Garden"],widgetOrder="52"}
Group gTerrace "Terrace" <terrace> (gOutdoor) ["Room"] {uiSemantics="uiSemantics"[preposition=" in the ", equipment="Terrace", location="Garden"],widgetOrder="53"}
Group:Number:COUNT(ON) gSmokeAlarm "Smokealarm" <smoke>
Group:Number:COUNT(ON) gBatteryLowTotal "Empty Batteries" <lowbattery>
Group:Number:COUNT(OPEN) gWindowsOpen "Windows Open"
Group:Number:COUNT(OPEN) gDoorsOpen "Doors Open"
Group:Number:COUNT(ON) gMotionDetected "Motion Detected"
These items will create the general structure shown in the top navigation menu and will also create the red notification badges in the bottom navigation bar. If you don’t want your locations/equipment to be ordered, just remove the widgetOrder from the examples.
- Install the widgets you want to use for this project from the marketplace.
- Create a new layout page in openHAB MainUI
- Enter the
Codetab for the new page and paste the following code
config:
label: HomeMenu
sidebar: true
hideNavbar: true
showFullscreenIcon: false
hideSidebarIcon: true
style:
--f7-block-padding-horizontal: 0px
--f7-block-padding-vertical: 0px
--f7-navbar-height: 0
blocks:
- component: oh-block
config:
stylesheet: >
.block:first-child{
margin: 0px;
}
slots:
default:
- component: oh-grid-row
config: {}
slots:
default:
- component: oh-grid-col
config: {}
slots:
default:
- component: widget:semanticHomeMenu
config: {}
masonry: null
grid: []
canvas: null
Community
Please check openHAB community for discussions and proposals. Do not post on the marketplace topics.
Credits
Thanks to
- @Dimitris for creating the design specs
- @Nic0205 for creating the first widgets
- @JustinG for his excellent support when we struggled with design and functionality
- @Nico_R for rewriting many parts of the code and redesigning the equipment widgets. His tremendous work truely brought the project to the next level.
and anyone else I have forgotten 
Changelog
Version 1.1.2
- corrected wrong example for group battery low.
Version 1.1.1
- corrected wrong room names shown if uiSemantics have not been added.
Version 1.1
- added Lightstripe support
Version 1.0.1
- ressource link corrected
Version 1.0
- initial release for openHAB 4
Resources
https://github.com/hmerk/semanticHomeMenu/raw/main/main/semanticHomeMenu.yaml