Page 1 of 10

Dashticz Dial - Features, Fixes & Updates

Posted: Monday 18 May 2020 20:11
by clinkadink
Dashticz beta has been updated today to include a new 'dial' component.

It was primarily designed for my EvoHome devices; the controller, the hot water and each of the zones. But it should also work fine for thermostats and dimmers. It currently supports devices for SwitchType = "Dimmer", Type = "Heating" or "Thermostat" and SubType= "SetPoint" or 'Evohome'.

This is with my EvoHome devices ...
Image

This is with my LightwaveRF dimmer lights ....
Image

Note: if you have lights that support dimming, make sure you have set their "Switch Type" to "Dimmer" in Domoticz first.

A demonstration of the UI interaction ...
Image

The block config can be as follows, with the "type" param set to "dial":

Code: Select all

blocks[401] = {
  title: 'Kitchen',	
  type: 'dial',
  width: 3
}
Alternatively, the block can be named, and the "idx" added as a param.

Code: Select all

blocks['kitchen_lights'] = {
  idx: 401,
  title: 'Kitchen',	
  type: 'dial',
  width: 3
} 
For any supported devices (mentioned above), adding type: 'dial', to the existing block config is all that is required to change to the "dial" component.

All of the currently supported block params are as follows:

Code: Select all

blocks['kitchen_lights'] = {
	idx: 401,                // idx of the device (mandatory if named block)
	title: 'Kitchen',	 // title that will appear on the dial (mandatory)
	type: 'dial',            // indentifies this block as a dial (mandatory)
	width: 3,                // dial width (optional, default 3)
        height: 250,             // dial height (optional, default based on width)
        color: '#57c4d6'         // color theme for the dial (default orange)
} 
The dials will glow when on/active as shown below:
Image

For EvoHome devices, their outer ring color changes, depending on the temperature and setpoint.
Image

In the above image:
1. The device temperature is 22 degrees, the setpoint is 26 degrees, the device is heating, the dial glows
2. When hovering above the dial in this state, the outer ring will be blue, as it is colder than the target setpoint
3. The device is at or above it's setpoint, therefore it is not on or glowing, when hovering above the dial, it shows orange

The dials are interactive. Rotating the dial needle will change and set the new value. Single tapping the dial will also provide different commands.
  • Setpoint devices (Evohome and Thermostat) - a single tap will cancel any temporary override, and the device will return to its schedule.
  • Hot water device (Evohome) - this will toggle the hotwater on (temporary override using CONFIG.js setting) and off.
  • Lights (Dimmer) - this will toggle the light on (100) and off (0).
Note: any dial for device types of Thermostat will display the setpoint data, but it will not be able to show the 'Controller' and 'Hot Water' dials, as these are specifically for EvoHome devices.

Hope you like it. Any issues (its a beta!) or feedback, I am sure you'll let me know ;)

Re: Dashticz Dial

Posted: Wednesday 27 May 2020 17:44
by Ierlandfan
I like the dials! I was thinking of using a dial for selector switches.
Dials would show LevelNames (Highlighting the current LevelName as in your picture e.g. "Auto")
Rotating the dial would change the level(Names)
Would it be hard to insert that into the current code?

Re: Dashticz Dial

Posted: Tuesday 02 June 2020 23:01
by clinkadink
The beta branch has now been updated, including new dial features.

Dials now support Toon thermostat and controller. The thermostat block config can now accept a "temp" idx. This will then show both the Toon temperature device and the Toon Setpoint on the same dial (exactly how it works with EvoHome devices). The Toon devices will need to be configured in Domoticz as dummy devices. The controller needs to a switch with "SwitchType" : "Selector". The temperature device needs to be "Type" : "Temp", and the thermostat "Type" : "Thermostat".

Toon controller and thermostat, with their block config below:
Image

In addition to supporting Toon, there have been some addition parameters added to the dial block.
  • last_update - same as standard block (default: true)
  • flash - same as standard block but around the outer dial with user or default color (default: 0)
  • dialimage - an image instead of the calendar icon (default: false)
  • dialicon - a different font awesome icon instead of the default calendar icon (default: 'fas fa-calendar-alt')
  • showring - always show the outer color ring (default: false)
Screenshots of the above parameters enabled are here: https://github.com/Dashticz/dashticz/pull/501

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Wednesday 03 June 2020 9:14
by EdwinK
I like how this is now for the Toon. :) I've got Toon setup with dummy-devices already, so it should work (I hope)
Screen Shot 2020-06-03 at 09.55.49.png
Screen Shot 2020-06-03 at 09.55.49.png (190.13 KiB) Viewed 6140 times

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Wednesday 03 June 2020 9:17
by clinkadink
EdwinK wrote: Wednesday 03 June 2020 9:14 I like how this is now for the Toon. :)
Great, glad you like it :D

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Thursday 04 June 2020 11:28
by jjnh
Having nice dials is for me one of the things missing in Dashticz right now. So I am very happy seeing this development.

Nice work especially the selector swith which is also usable if you don't have your thermostate connected yet.

Could you make the pluigin more universal, like also als indicator for temperatures or other levels?
Or maybe even color the dial so if a temperature is higher you can make a green, yellow, red background?
Or use it to set Domoticz levels for values (i.e. for light value when a light should switch on, a switch temperature on when a fan should turn on).

Just some thoughts :D

I detected one issue btw. if you put the dial in a column, other items in that same column will not be shown anymore. Other columns on the same page will keep working.

But again great, work to bring Dashticz to the next level!!

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Thursday 04 June 2020 21:58
by felix63
HI, I really like the dials!

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 0:15
by clinkadink
jjnh wrote: Thursday 04 June 2020 11:28 Having nice dials is for me one of the things missing in Dashticz right now. So I am very happy seeing this development. Nice work especially the selector swith which is also usable if you don't have your thermostate connected yet.
Thanks for the feedback, and glad you like them. Its early days being a beta and all that.
jjnh wrote: Thursday 04 June 2020 11:28 Could you make the pluigin more universal, like also als indicator for temperatures or other levels?
Or maybe even color the dial so if a temperature is higher you can make a green, yellow, red background?
Or use it to set Domoticz levels for values (i.e. for light value when a light should switch on, a switch temperature on when a fan should turn on).
The dials already show a color indicator for temperature, this is the outer ring. By default, it only shows when you hover over it. But if you add "showring: true" to your block, it will constantly show the indicator. If its at or above the setpoint, it will show an orange ring. If below, then a blue ring. You can also change the colors.
Spoiler: show
Image
jjnh wrote: Thursday 04 June 2020 11:28 I detected one issue btw. if you put the dial in a column, other items in that same column will not be shown anymore. Other columns on the same page will keep working.
I cannot replicate this. I have a news block, my energy sensors and my dials ... all in the same column. Maybe if you post you config, it may help.

Cheers ;)

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 0:16
by clinkadink
felix63 wrote: Thursday 04 June 2020 21:58 HI, I really like the dials!
Great! They are still work in progress, but coming along. Thanks for the feedback ;)

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 11:03
by HansieNL
How can I change the color of the outer ring? Is it a parameter or have I to do that by css?

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 11:21
by clinkadink
HansieNL wrote: Friday 05 June 2020 11:03 How can I change the color of the outer ring? Is it a parameter or have I to do that by css?
You set the color parameter. I have included all supported parameters below for completeness ;)

Code: Select all

blocks['kitchen_lights'] = {
	idx: 401,                    // idx of the device (mandatory if named block)
	title: 'Kitchen',	     // title that will appear on the dial (mandatory)
	type: 'dial',                // indentifies this block as a dial (mandatory)
	width: 3,                    // dial width (optional, default 3)
        height: 250,                 // dial height (optional, default based on width)
        color: '#57c4d6'             // color theme for the dial (default orange)
        last_update: true,           // shows last update info (default: true)
        flash: true,                 // outer dial will flash with user or default color (default: 0)
        dialimage: 'img/toon.png',   // show an image instead of the calendar icon (default: false)
        dialicon: 'fas fa-train',    // show a different font awesome icon (default: 'fas fa-calendar-alt')
        showring: true               // always show the outer color ring (default: false)
} 

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 12:50
by HansieNL
@clinkadink Thanks. I was a littlebit confused about the color setting. I thought it would change only the outer ring color, but it also change the title and needle color.

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 18:45
by gielie
EdwinK wrote: Wednesday 03 June 2020 9:14 I like how this is now for the Toon. :) I've got Toon setup with dummy-devices already, so it should work (I hope)

Screen Shot 2020-06-03 at 09.55.49.png
Nice one, I made this one too In my system, but.

Is it possible to hide the OFF?
This is also hidden in the Domticz switch.

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 19:10
by clinkadink
gielie wrote: Friday 05 June 2020 18:45
EdwinK wrote: Wednesday 03 June 2020 9:14 I like how this is now for the Toon. :) I've got Toon setup with dummy-devices already, so it should work (I hope)

Screen Shot 2020-06-03 at 09.55.49.png
Is it possible to hide the OFF?
This is also hidden in the Domticz switch.
You can try adding this to your custom.css, replacing it with your block name.

Code: Select all

[data-id='_BLOCK_NAME_'] .dial-menu li:nth-child(1){
   display: none;
}

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 20:00
by gielie
clinkadink wrote: Friday 05 June 2020 19:10
gielie wrote: Friday 05 June 2020 18:45
EdwinK wrote: Wednesday 03 June 2020 9:14 I like how this is now for the Toon. :) I've got Toon setup with dummy-devices already, so it should work (I hope)

Screen Shot 2020-06-03 at 09.55.49.png
Is it possible to hide the OFF?
This is also hidden in the Domticz switch.
You can try adding this to your custom.css, replacing it with your block name.

Code: Select all

[data-id='_BLOCK_NAME_'] .dial-menu li:nth-child(1){
   display: none;
}
my code would be this

Code: Select all

[data-id='Toon2'] .dial-menu li:nth-child(1){
   display: none;
}
but this has no effect

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 21:01
by EdwinK
gielie wrote: Friday 05 June 2020 18:45
my code would be this

Code: Select all

[data-id='Toon2'] .dial-menu li:nth-child(1){
   display: none;
}
but this has no effect
Works for me.

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Friday 05 June 2020 22:52
by gielie
EdwinK wrote: Friday 05 June 2020 21:01
gielie wrote: Friday 05 June 2020 18:45
my code would be this

Code: Select all

[data-id='Toon2'] .dial-menu li:nth-child(1){
   display: none;
}
but this has no effect
Works for me.
Yeah for me too now, had an curly bracket too much

But now, How do I get an temp/hum sensor in the dial button and is it possible to get an degree icon and an decimal in the dial?

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Sunday 07 June 2020 11:36
by clinkadink
gielie wrote: Friday 05 June 2020 22:52 How do I get an temp/hum sensor in the dial button and is it possible to get an degree icon and an decimal in the dial?
Like this?

Image

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Sunday 07 June 2020 14:34
by JuanUil
verry nice

Re: Dashticz Dial - Features, Fixes & Updates

Posted: Sunday 07 June 2020 14:56
by clinkadink
I am currently expanding the support for the dial component. I am currently working on adding:

Code: Select all

"Type" : "Temp + Humidity"
"Type" : "Temp + Humidity + Baro"
Are there anymore that would suit the dial? I cannot promise I can accommodate, but I will try.

Obviously, if most of you ask for the same device to be added, then that gets prioritised ;)