Domoticz

Open source Home Automation System
https://forum.domoticz.com/

Dashticz - Function - Trigger action on specific value

https://forum.domoticz.com/viewtopic.php?t=17657

Page 2 of 4

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Tuesday 23 May 2017 15:38
by mikeoo
robgeerts wrote:It's not the same for all devices.
You can search the output (http://DOMOTICZ_URL:8080/json.htm?type=devices&filter=all&used=true&order=Name) for attributes you could use.
For example, you could use for switch:

Code: Select all

function getStatus_145(idx,value,device){
   if(device['Data']=="On"){
      $('div.block_145').addClass('warning');
   }
   else {
      $('div.block_145').removeClass('warning');
   }
}
Thanks again for the quick response

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Tuesday 23 May 2017 19:15
by mvveelen
I'm using:

Code: Select all

.transbg.col-xs-1, .transbg.col-xs-2, .transbg.col-xs-3, .transbg.col-xs-4, .transbg.col-xs-5, .transbg.col-xs-6, .transbg.col-xs-7, .transbg.col-xs-8, .transbg.col-xs-9, .transbg.col-xs-10, .transbg.col-xs-11, .transbg.col-xs-12 {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid rgba(255,255,255,0);
  background: rgba(0,0,0,0.2);
  background-clip: padding-box;
border-radius: 9px; 
}
for the size and rounded corners of the buttons. How can I use (for instance) the orange style code to get the same sized button? Tried a few things, but it still has another size. See attachment.

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Tuesday 23 May 2017 21:30
by htilburgs
If you use this code, I think it should be the same....

Code: Select all

.warning {
   background: rgba(204,129,44,0.30) !important;
   background-clip: padding-box;
   border: 7px solid rgba(255,255,255,0);
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Tuesday 23 May 2017 22:14
by htilburgs
Is it also possible to get multiple devices / IDX in 1 function?
Now I've to add the same function 2, 3 or more times with a different IDX. Is it possible to create a kind of array?

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Tuesday 23 May 2017 22:52
by robgeerts
Not yet but you can do this to by pass this:

Code: Select all

function getStatus_145(idx,value,device){
	if(parseFloat(device['Data'])>24){
		$('div.block_145').addClass('warning');
	}
	else {
		$('div.block_145').removeClass('warning');
	}
}

function getStatus_5(idx,value,device){
         getStatus_145(idx,value,device);
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Wednesday 24 May 2017 17:42
by repoman
htilburgs wrote:If you use this code, I think it should be the same....

Code: Select all

.warning {
   background: rgba(204,129,44,0.30) !important;
   background-clip: padding-box;
   border: 7px solid rgba(255,255,255,0);
}
Hi. I've tried adding the line "border: 7px solid rgba(255,255,255,0);" but nothing seems to change.

The warning block is still bigger...

Is this by design? How can I make them the same size as the others?

Thanks,
Pascal

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 12:04
by mvveelen
htilburgs wrote:If you use this code, I think it should be the same....

Code: Select all

.warning {
   background: rgba(204,129,44,0.30) !important;
   background-clip: padding-box;
   border: 7px solid rgba(255,255,255,0);
}
Unfortunately it isn't:

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 13:28
by HansieNL
mvveelen wrote:
htilburgs wrote:If you use this code, I think it should be the same....

Code: Select all

.warning {
   background: rgba(204,129,44,0.30) !important;
   background-clip: padding-box;
   border: 7px solid rgba(255,255,255,0);
}
Unfortunately it isn't:
Don't know for sure, but what if removing the border code?

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 18:46
by mvveelen
I get the same result when I delete that line.

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 20:56
by HansieNL
mvveelen wrote:I get the same result when I delete that line.
Does this work?

Code: Select all

.warning .transbg.col-xs-1, 
.warning. transbg.col-xs-2, 
.warning .transbg.col-xs-3, 
.warning .transbg.col-xs-4, 
.warning .transbg.col-xs-5, 
.warning .transbg.col-xs-6, 
.warning .transbg.col-xs-7, 
.warning .transbg.col-xs-8, 
.warning .transbg.col-xs-9, 
.warning .transbg.col-xs-10, 
.warning .transbg.col-xs-11, 
.warning .transbg.col-xs-12 {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid rgba(255,255,255,0);
  background: rgba(204,129,44,0.30) !important;
  background-clip: padding-box;
border-radius: 9px; 
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 21:26
by htilburgs
Maybe you overrule the setting in your custom.css. Is it possible for you to post your custom.css
I've tested the css and for me it's working great.

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Thursday 25 May 2017 22:38
by mvveelen
htilburgs wrote:Maybe you overrule the setting in your custom.css. Is it possible for you to post your custom.css
I've tested the css and for me it's working great.
Spoiler: show

Code: Select all

/*
CUSTOM CSS FILE
*/
.h4.h4 {
    font-size: 14px;
}

.trashcan { 
    height 36px;
    width: 36px;
} 

.warning {
   background: rgba(204,129,44,0.30) !important;
   background-clip: padding-box;
}

/* Calendar font modifications with icon active */
/*.col-xs-10.items {
/*   font-size: 12px;
/*}

/* Calendar font modifications with NO icon active */
/*.col-xs-12.items {
/*   font-size: 12px;
/*}

.trash .state div.trashrow {
    font-size: 12px;
}
.trash .state div.trashtoday {
    font-size: 16px;
    font-weight: bold;
}
.trash .state div.trashtomorrow {
    font-size: 14px;
    font-weight: bold;
}

/* Transparent background for buttons Thermostat */
.input-groupBtn .btn-number {
    opacity: 0.5;
    color: white;
    background-color: rgb(34, 34, 34);
    border-radius: 0px;
    padding: 6px 10px 6px 10px;
    line-height: 20px;
    background-color: transparent;
}

.swiper-pagination-bullet {
    width: 30px !important;
    height: 30px !important;
}

/* Height of the blocktitles and center text in new height */
div.mh.titlegroups {
    height: 60px !important;
    padding-top: 3px !important;
}


.transbg.col-xs-1, .transbg.col-xs-2, .transbg.col-xs-3, .transbg.col-xs-4, .transbg.col-xs-5, .transbg.col-xs-6, .transbg.col-xs-7, .transbg.col-xs-8, .transbg.col-xs-9, .transbg.col-xs-10, .transbg.col-xs-11, .transbg.col-xs-12 {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid rgba(255,255,255,0);
  background: rgba(0,0,0,0.2);
  background-clip: padding-box;
border-radius: 9px; 
}

.transbg.col-xs-1.hover:hover,
.transbg.col-xs-2.hover:hover,
.transbg.col-xs-3.hover:hover,
.transbg.col-xs-4.hover:hover,
.transbg.col-xs-5.hover:hover,
.transbg.col-xs-6.hover:hover,
.transbg.col-xs-7.hover:hover,
.transbg.col-xs-8.hover:hover,
.transbg.col-xs-9.hover:hover,
.transbg.col-xs-10.hover:hover,
.transbg.col-xs-11.hover:hover,
.transbg.col-xs-12.hover:hover {padding-top:15px; padding-bottom:15px; border: 2px solid rgba(0,0,0,0); background: rgba(100,100,100,0.8); background-clip: padding-box; border-radius: 9px; }

#newsTicker li {
    min-height: 72px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 14px;
    color: #fff;
    max-height: 250px;    */ Set the maxim height of the news-ticker */
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 9:38
by htilburgs
Ok, quite a puzzle (but a nice one...;-)).

Put this in your custom.css for the .warning part and it should work:

Code: Select all

.warning {
	padding-top: 15px !important;
	padding-bottom: 15px !important;
	border-radius: 9px !important; 
	background-color: rgba(199, 44, 43, 0.3) !important;	
	border: 2px solid rgba(255,255,255,0) !important;
	background-image: initial !important;
	background-position-x: initial !important;
	background-position-y: initial !important;
	background-size: initial !important;
	background-repeat-x: initial !important;
	background-repeat-y: initial !important;
	background-attachment: initial !important;
	background-origin: initial !important;
	background-clip: padding-box !important;
}
Let me know, if its OK now.

And I see one minor error in your custom.css.
In the #newsTicker li part the */ Set the maxim height of the news-ticker */ shoud be /* Set the maxim height of the news-ticker */

For now it's not causing an issue, but you never now what it causes in the future....;-)

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 11:47
by repoman
htilburgs wrote:Ok, quite a puzzle (but a nice one...;-)).

Put this in your custom.css for the .warning part and it should work:

Code: Select all

.warning {
	padding-top: 15px !important;
	padding-bottom: 15px !important;
	border-radius: 9px !important; 
	background-color: rgba(199, 44, 43, 0.3) !important;	
	border: 2px solid rgba(255,255,255,0) !important;
	background-image: initial !important;
	background-position-x: initial !important;
	background-position-y: initial !important;
	background-size: initial !important;
	background-repeat-x: initial !important;
	background-repeat-y: initial !important;
	background-attachment: initial !important;
	background-origin: initial !important;
	background-clip: padding-box !important;
}
Let me know, if its OK now.
Tried this code and I get the rounded corners but the warning blocks are still bigger...
(it's the only code in my custom.css)

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 11:59
by htilburgs
This was specific for @mveelen, based on his css.
I'll will look into it later on, now busy with my regular job....;-)

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 12:10
by htilburgs
repoman wrote: Tried this code and I get the rounded corners but the warning blocks are still bigger...
(it's the only code in my custom.css)
Try this one:

Code: Select all

.warning {
	background: rgba(199,44,44,0.7) !important;
	background-image: initial !important;
	background-position-x: initial !important;
	background-position-y: initial !important;
	background-size: initial !important;
	background-repeat-x: initial !important;
	background-repeat-y: initial !important;
	background-attachment: initial !important;
	background-origin: initial !important;
	background-clip: padding-box !important;
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 12:16
by repoman
Yep, that did the trick!

Thanks!

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 15:26
by freakshock
robgeerts wrote:I did this to have different colors, depending on the temperature of my living room:

Code: Select all

function getStatus_145(idx,value,device){
	if(parseFloat(device['Data'])>23){
		$('div.block_145').removeClass('warning').addClass('warningorange');
	}
	else if(parseFloat(device['Data'])>25){
		$('div.block_145').removeClass('warningorange').addClass('warning');
	}
	else {
		$('div.block_145').removeClass('warning').removeClass('warningorange');
	}
}
Hi Rob,

I think you need to switch the higher value with the lower value.
Your code did not work for me, the blocks remained orange even though the value exceeded 25.

My code:

Code: Select all

//kleurtje op knop temp huiskamer wanneer het warmer is dan bepaalde temperatuur (oranje of rood)
function getStatus_90(idx,value,device){
   if(parseFloat(device['Temp'])>25){
      $('div.block_90').removeClass('warningoranje').addClass('warning');
   }
   else if(parseFloat(device['Temp'])>23){
      $('div.block_90').removeClass('warning').addClass('warningoranje');
   }
   else {
      $('div.block_90').removeClass('warning').removeClass('warningoranje');
   }
}

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 19:32
by mvveelen
htilburgs wrote:Ok, quite a puzzle (but a nice one...;-)).

Put this in your custom.css for the .warning part and it should work:
Spoiler: show

Code: Select all

.warning {
	padding-top: 15px !important;
	padding-bottom: 15px !important;
	border-radius: 9px !important; 
	background-color: rgba(199, 44, 43, 0.3) !important;	
	border: 2px solid rgba(255,255,255,0) !important;
	background-image: initial !important;
	background-position-x: initial !important;
	background-position-y: initial !important;
	background-size: initial !important;
	background-repeat-x: initial !important;
	background-repeat-y: initial !important;
	background-attachment: initial !important;
	background-origin: initial !important;
	background-clip: padding-box !important;
}
Let me know, if its OK now.

And I see one minor error in your custom.css.
In the #newsTicker li part the */ Set the maxim height of the news-ticker */ shoud be /* Set the maxim height of the news-ticker */

For now it's not causing an issue, but you never now what it causes in the future....;-)
Yesssss, that's it !! Thanks !

Also changed the newsTicker-part :)

Re: Dashticz - [BETA] - Function - Do something at a specific value

Posted: Friday 26 May 2017 19:37
by htilburgs
mvveelen wrote:
htilburgs wrote:Ok, quite a puzzle (but a nice one...;-)).

Put this in your custom.css for the .warning part and it should work:
Spoiler: show

Code: Select all

.warning {
	padding-top: 15px !important;
	padding-bottom: 15px !important;
	border-radius: 9px !important; 
	background-color: rgba(199, 44, 43, 0.3) !important;	
	border: 2px solid rgba(255,255,255,0) !important;
	background-image: initial !important;
	background-position-x: initial !important;
	background-position-y: initial !important;
	background-size: initial !important;
	background-repeat-x: initial !important;
	background-repeat-y: initial !important;
	background-attachment: initial !important;
	background-origin: initial !important;
	background-clip: padding-box !important;
}
Let me know, if its OK now.

And I see one minor error in your custom.css.
In the #newsTicker li part the */ Set the maxim height of the news-ticker */ shoud be /* Set the maxim height of the news-ticker */

For now it's not causing an issue, but you never now what it causes in the future....;-)
Yesssss, that's it !! Thanks !

Also changed the newsTicker-part :)
I also noticed a minor in .trashcan. After height the : is missing. (I know, I'm a nitpicker ;-))
All times are UTC+01:00
Page 2 of 4

Powered by phpBB® Forum Software © phpBB Limited