Aurora theme
Posted: Sunday 17 December 2017 19:10
Aurora is a new theme for Domoticz. It was originally intended to be the new default theme, but has now been rebuilt to work as a normal theme.
INSTALLING
DOWNLOAD
2. Place the theme folder into the domoticz/www/styles folder. So it becomes: domoticz/www/styles/aurora.
3. Enable the theme on the settings page.
4. Go into the privacy settings of your browser and really clear your (application) cache.
FEATURES
The theme offers a number of new features:
1.
Added a theme settings tab on the settings page. The features below can be turned on or off. Theme feature preferences are stored in a user variable inside Domoticz, which the theme creates automatically.
2.
Highlighted items: these have more space to do fun things, like:
3.
Datavisualisations on the dashboard. Toggle day or month view by clicking on the button in the bottom left. Not all items currently have dataviz.
4.
Show live camera feed: if you have cameras, you can now see them at a glance. Just add a switch to your camera under "Active Devices/Scenes" on the camera page.
5.
Merge items into grouped items. Simple items with the same name before a “-“ can be merged into one grouped item. So for example:
Miflora1 - temperature
Miflora1 - lux
Miflora1 - moisture
Miflora1 - fertility
..will be merged into one item. The second part of the name will be shown as the prefix before the data output:
6.
Change text colour, background color and add a background image through the interface.
7.
Animations: icons on active fan items spin slowly, barometer items now display the weather prediction as an icon.
8.
Mobile view in iPhone style. Can also be enabled as a desktop view.
9.
Privacy settings. Removes some last-update time and log details. It has two levels: 'swithes' and 'all'.
10.
Blockly Import and Export. Something I've long wanted. Click the export button to export a code which you can share on the forums and elsewhere.
11.
Inline thermostat setpoint. You no longer need to open the popup for small changes to the temperature.
12.
Battery status. This now has a nice icon as well as a percentage display.
13.
iFrames. If a text item has a URL as its value, then on the dashboard the item is turned into an iFrame which shows that site. This can be used to integrate external sites, like weather, news or stock tickers into the dashboard.
becomes:
For example: (1) add the 'dummy hardware' on the hardware page. (2) use that to create a new virtual text device. (3) go to the utilities page, and simply click on the text item's text, and then change the value into a url.
14.
The theme adds a button in the menu to enter and exit fullscreen mode.
Other options:
- Hide last update time: if you prefer a more clean look.
- Vertical columns. This allows each category to have some elements at the top of the screen. This is great if you use a tablet on your wall and want some of your items to be instantly visible.
- Merge weather and temperature into ‘environment’ category. Useful way to save space if, like me, you only have one weather sensor.
- Move the clock to the bottom of the page, or display it as an item at the top of the switches category.
IMPROVEMENTS
Some of the proposed improvements to HTML output have not been accepted into Domoticz yet. This theme works around that by standardising HTML and adding classes though javascript instead.
- Responsive design: item displays are more flexible, making optimal use of available screen space (2 columns, etc).
- A sidebar menu: saves a lot of space on horizontal screens, and offers quicker access to all settings.
- A sidebar menu on the settings page. Allows for quicker access to settings.
- Higher resolution icons made for Domoticz, based on public domain sources.
- Very limited attempt to reshuffle things on the settings page.
- Center popups on the screen. Currently some popups fall of the screen.
- Shows ID numbers on items, makes it easier to look up.
- Each item's option are now displayed as icon-buttons instead of text.
- Edit Text items' value directly from the interface. Just click on the text to edit it. Click outside it to save.
THINGS THEMERS CARE ABOUT
Feel free to use this theme as a starting point for your own themes. It has been designed with that in mind.
- inserts more descriptive CSS classes. All items now have classes that describe their contents, allowing for many of the features described above, like animation or datavisualisation.
- Domoticz currently uses ID's where classes should be used. This causes a lot of problems. The theme adds the ID's as classes.
- Span wrappers around content, allowing more flexible data output display.
- Removal of BR tags and negating of much inline CSS, in order to avoid a pixel based layout.
CONTRIBUTE
The theme is now being developed further on Github. Feel free to contribute.
https://github.com/flatsiedatsie/domoticz-aurora-theme
INSTALLING
DOWNLOAD
2. Place the theme folder into the domoticz/www/styles folder. So it becomes: domoticz/www/styles/aurora.
3. Enable the theme on the settings page.
4. Go into the privacy settings of your browser and really clear your (application) cache.
FEATURES
The theme offers a number of new features:
1.
Added a theme settings tab on the settings page. The features below can be turned on or off. Theme feature preferences are stored in a user variable inside Domoticz, which the theme creates automatically.
2.
Highlighted items: these have more space to do fun things, like:
3.
Datavisualisations on the dashboard. Toggle day or month view by clicking on the button in the bottom left. Not all items currently have dataviz.
4.
Show live camera feed: if you have cameras, you can now see them at a glance. Just add a switch to your camera under "Active Devices/Scenes" on the camera page.
5.
Merge items into grouped items. Simple items with the same name before a “-“ can be merged into one grouped item. So for example:
Miflora1 - temperature
Miflora1 - lux
Miflora1 - moisture
Miflora1 - fertility
..will be merged into one item. The second part of the name will be shown as the prefix before the data output:
6.
Change text colour, background color and add a background image through the interface.
7.
Animations: icons on active fan items spin slowly, barometer items now display the weather prediction as an icon.
8.
Mobile view in iPhone style. Can also be enabled as a desktop view.
9.
Privacy settings. Removes some last-update time and log details. It has two levels: 'swithes' and 'all'.
10.
Blockly Import and Export. Something I've long wanted. Click the export button to export a code which you can share on the forums and elsewhere.
11.
Inline thermostat setpoint. You no longer need to open the popup for small changes to the temperature.
12.
Battery status. This now has a nice icon as well as a percentage display.
13.
iFrames. If a text item has a URL as its value, then on the dashboard the item is turned into an iFrame which shows that site. This can be used to integrate external sites, like weather, news or stock tickers into the dashboard.
becomes:
For example: (1) add the 'dummy hardware' on the hardware page. (2) use that to create a new virtual text device. (3) go to the utilities page, and simply click on the text item's text, and then change the value into a url.
14.
The theme adds a button in the menu to enter and exit fullscreen mode.
Other options:
- Hide last update time: if you prefer a more clean look.
- Vertical columns. This allows each category to have some elements at the top of the screen. This is great if you use a tablet on your wall and want some of your items to be instantly visible.
- Merge weather and temperature into ‘environment’ category. Useful way to save space if, like me, you only have one weather sensor.
- Move the clock to the bottom of the page, or display it as an item at the top of the switches category.
IMPROVEMENTS
Some of the proposed improvements to HTML output have not been accepted into Domoticz yet. This theme works around that by standardising HTML and adding classes though javascript instead.
- Responsive design: item displays are more flexible, making optimal use of available screen space (2 columns, etc).
- A sidebar menu: saves a lot of space on horizontal screens, and offers quicker access to all settings.
- A sidebar menu on the settings page. Allows for quicker access to settings.
- Higher resolution icons made for Domoticz, based on public domain sources.
- Very limited attempt to reshuffle things on the settings page.
- Center popups on the screen. Currently some popups fall of the screen.
- Shows ID numbers on items, makes it easier to look up.
- Each item's option are now displayed as icon-buttons instead of text.
- Edit Text items' value directly from the interface. Just click on the text to edit it. Click outside it to save.
THINGS THEMERS CARE ABOUT
Feel free to use this theme as a starting point for your own themes. It has been designed with that in mind.
- inserts more descriptive CSS classes. All items now have classes that describe their contents, allowing for many of the features described above, like animation or datavisualisation.
- Domoticz currently uses ID's where classes should be used. This causes a lot of problems. The theme adds the ID's as classes.
- Span wrappers around content, allowing more flexible data output display.
- Removal of BR tags and negating of much inline CSS, in order to avoid a pixel based layout.
CONTRIBUTE
The theme is now being developed further on Github. Feel free to contribute.
https://github.com/flatsiedatsie/domoticz-aurora-theme
...