Dashticz - v3.4.3 beta

[Lokonli]

Dashticz v3.4.3 beta is small update containing:

* The new calender module. See:
https://www.domoticz.com/forum/viewtopi ... 67&t=32132

* Bug fixes

* Improved error reporting
The main reason for adding this is that the interface to the functions in custom.js changed.

So if you see the next message:

Then please check that function in custom.js, especially line 41.

Examples for the new getStatus function can be found here:
https://dashticz.readthedocs.io/en/beta ... -idx-block

I'll add a few more examples coming days.

[EdwinK]

Guess I'm going to wait. Don't know what to do.

[Lokonli]

Guess I'm going to wait. Don't know what to do.

If you post your custom.js I'll check

[toro]

I have 2 question about the getStatus function
I'm on 3.4.2 right now and have the following fuction:

Spoiler: show

Code: Select all

function getStatus_241(block, afterupdate){
	var device = block.device;
	if(parseFloat(device['Data'])<=50){
		block.addClass='moisture_critical';
		block.removeClass='moisture_low';
		block.removeClass='moisture_normal';
		block.removeClass='moisture_high';
	}
	else if(parseFloat(device['Data'])>50 && parseFloat(device['Data'])<=60){
		block.addClass='moisture_low';
		block.removeClass='moisture_critical';
		block.removeClass='moisture_normal';
		block.removeClass='moisture_high';
	}
	else if(parseFloat(device['Data'])>90){
		block.addClass='moisture_high';
		block.removeClass='moisture_critical';
		block.removeClass='moisture_low';
		block.removeClass='moisture_normal';
	}
	else {
		block.addClass='moisture_normal';
		block.removeClass='moisture_critical';
		block.removeClass='moisture_low';
		block.removeClass='moisture_high';
	}
	setTimeout(function(){
		if(moment(device['LastUpdate']).unix()<(moment().unix()-(4200))){
			block.addClass='update_timeout';
			blocks[241]['last_update'] = true;
			console.log('Timeout Grondvochtigheidsensor:');
		}
		else {
			block.removeClass='update_timeout';
			blocks[241]['last_update'] = false;
			console.log('Grondvochtigheidsensor is actief');
		}
	},1000);
}

1. Do I have to change ‘getStatus_241(block, afterupdate)’ to ‘getStatus_241(block)’ for 3.4.3 and will it still work the same?
2. The setTimeout function doesn’t work. It is executed one time on refresh of the page but the class is not applied. How is this fixable as it checks if the device isn’t updated in time? (before it worked only after a refresh of the page, but in this case that was not a big problem)

[Lokonli]

The afterupdate parameter is not applicable anymore. You can indeed remove it.

The removeClass part also is not needed. Only addClass is used. Maybe setClass would be a better name.

You cannot use block.addClass in the setTimeout function.
(getStatus already returned. Changes in block are not seen anymore)

To be honest, I did not think of this use case, but I expect the following will work.

Code: Select all

	setTimeout(function(){
		if(moment(device['LastUpdate']).unix()<(moment().unix()-(4200))){
			Dashticz.setBlock('241', {
                           addClass:'update_timeout'
                        });
			console.log('Timeout Grondvochtigheidsensor:');
		}
		else {
			Dashticz.setBlock('241', {
                           addClass:''
                        });
			console.log('Grondvochtigheidsensor is actief');
		}
	},1000);

[EdwinK]

Hi,

This is my current custom.js file

Spoiler: show

Code: Select all

//add custom javascript in here
function afterGetDevices(){
	
	
}

function getExtendedBlockTypes(blocktypes){
	//blocktypes.Type['Lighting 2'] = { icon: 'fa fa-lightbulb-o', title: '<Name>', value: 'ds' }
	return blocktypes;
}

// Meteo Alarm today = 407, tomorrow = 408

function getStatus_407(idx,value,device) {
if(device['Level']==1) {
$('div.block_407').addClass('alertnormal');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alerthigh');
$('div.block_407').removeClass('alertlight');
}
else if (device['Level']==2) {
$('div.block_407').addClass('alertlight');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alerthigh');
}
else if (device['Level']==3) {
$('div.block_407').addClass('alertmedium');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alerthigh');
$('div.block_407').removeClass('alertlight');
}
else {
$('div.block_407').addClass('alerthigh');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alertlight');
}
}
function getStatus_408(idx,value,device) {
if(device['Level']==1) {
$('div.block_408').addClass('alertnormal');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alerthigh');
$('div.block_408').removeClass('alertlight');
}
else if (device['Level']==2) {
$('div.block_408').addClass('alertlight');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alerthigh');
}
else if (device['Level']==3) {
$('div.block_408').addClass('alertmedium');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alerthigh');
$('div.block_408').removeClass('alertlight');
}
else {
$('div.block_408').addClass('alerthigh');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alertlight');
}
}

[toro]

The afterupdate parameter is not applicable anymore. You can indeed remove it.

The removeClass part also is not needed. Only addClass is used. Maybe setClass would be a better name.

You cannot use block.addClass in the setTimeout function.
(getStatus already returned. Changes in block are not seen anymore)

To be honest, I did not think of this use case, but I expect the following will work.

Spoiler: show

Code: Select all

	setTimeout(function(){
		if(moment(device['LastUpdate']).unix()<(moment().unix()-(4200))){
			Dashticz.setBlock('241', {
                           addClass:'update_timeout'
                        });
			console.log('Timeout Grondvochtigheidsensor:');
		}
		else {
			Dashticz.setBlock('241', {
                           addClass:''
                        });
			console.log('Grondvochtigheidsensor is actief');
		}
	},1000);

Thank you Lokonli.

I'm on 3.4.3 now, but your solution does not work.
In de console, the message 'Timeout Grondvochtigheidsensor' is displayed, but the class in not applied.
For now, I did change it to:

Spoiler: show

Code: Select all

function getStatus_241(block){
	var device = block.device;
	if(parseFloat(device['Data'])<=50){
		block.addClass='moisture_critical';
	}
	else if(parseFloat(device['Data'])>50 && parseFloat(device['Data'])<=60){
		block.addClass='moisture_low';
	}
	else if(parseFloat(device['Data'])>90){
		block.addClass='moisture_high';
	}
	else {
		block.addClass='moisture_normal';
	}
	if(moment(device['LastUpdate']).unix()<(moment().unix()-(4200))){ //(70 min)
		block.addClass='update_timeout';
	}
}

Of course, now the check for the timeout is only done on a refresh of the page.
For this purpuse not a problem, but maybe for other devices not suitable.

[Lokonli]

I think you want to apply the 'update_timeout' class after 70 minutes without device update?

getStatus_241 will only be called after an update of device 241, so that's not a good place to set the class.

You could use the afterGetDevices function in custom.js for this, because this function will be called after every update.

If you change it as follow it should work:

Code: Select all

 function afterGetDevices() {
     var device = Domoticz.getAllDevices()['241'];
     if (moment(device['LastUpdate']).unix() < (moment().unix() - (4200))) { //(70 min)
         Dashticz.setBlock('241', {
             addClass: 'update_timeout'
         });
     } else {
         Dashticz.setBlock('241', {
             addClass: ''
         });
     }
 }

Also update to latest beta ...

[toro]

I think you want to apply the 'update_timeout' class after 70 minutes without device update?

getStatus_241 will only be called after an update of device 241, so that's not a good place to set the class.

You could use the afterGetDevices function in custom.js for this, because this function will be called after every update.

If you change it as follow it should work:

Spoiler: show

Code: Select all

 function afterGetDevices() {
     var device = Domoticz.getAllDevices()['241'];
     if (moment(device['LastUpdate']).unix() < (moment().unix() - (4200))) { //(70 min)
         Dashticz.setBlock('241', {
             addClass: 'update_timeout'
         });
     } else {
         Dashticz.setBlock('241', {
             addClass: ''
         });
     }
 }

Also update to latest beta ...

I updated the file dashtics.js and tried your sugestion.
The fuction gets indeed called a lot of times now, I did a console.log in the if-part.
But still the class is not applied.
So, the function works, but the addClass does not

[Lokonli]

How did you define your block?
And your css class?

Sent from my SM-A320FL using Tapatalk

[Lokonli]

Hi,

This is my current custom.js file

Spoiler: show

Code: Select all

//add custom javascript in here
function afterGetDevices(){
	
	
}

function getExtendedBlockTypes(blocktypes){
	//blocktypes.Type['Lighting 2'] = { icon: 'fa fa-lightbulb-o', title: '<Name>', value: 'ds' }
	return blocktypes;
}

// Meteo Alarm today = 407, tomorrow = 408

function getStatus_407(idx,value,device) {
if(device['Level']==1) {
$('div.block_407').addClass('alertnormal');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alerthigh');
$('div.block_407').removeClass('alertlight');
}
else if (device['Level']==2) {
$('div.block_407').addClass('alertlight');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alerthigh');
}
else if (device['Level']==3) {
$('div.block_407').addClass('alertmedium');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alerthigh');
$('div.block_407').removeClass('alertlight');
}
else {
$('div.block_407').addClass('alerthigh');
$('div.block_407').removeClass('alertnormal');
$('div.block_407').removeClass('alertmedium');
$('div.block_407').removeClass('alertlight');
}
}
function getStatus_408(idx,value,device) {
if(device['Level']==1) {
$('div.block_408').addClass('alertnormal');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alerthigh');
$('div.block_408').removeClass('alertlight');
}
else if (device['Level']==2) {
$('div.block_408').addClass('alertlight');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alerthigh');
}
else if (device['Level']==3) {
$('div.block_408').addClass('alertmedium');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alerthigh');
$('div.block_408').removeClass('alertlight');
}
else {
$('div.block_408').addClass('alerthigh');
$('div.block_408').removeClass('alertnormal');
$('div.block_408').removeClass('alertmedium');
$('div.block_408').removeClass('alertlight');
}
}

Try this:

Code: Select all

 function getStatus_407(block) {
     var value = block.device.Level;
     if (value == 1) {
         block.addClass = 'alertnormal';
     } else if (value == 2) {
         block.addClass = 'alertlight';
     } else if (value == 3) {
         block.addClass = 'alertmedium';
     } else {
         block.addClass = 'alerthigh';
     }
 }

 function getStatus_408(block) {
     var value = block.device.Level;
     if (value == 1) {
         block.addClass = 'alertnormal';
     } else if (value == 2) {
         block.addClass = 'alertlight';
     } else if (value == 3) {
         block.addClass = 'alertmedium';
     } else {
         block.addClass = 'alerthigh';
     }
 }

[EdwinK]

Thanks, This seems to work

[toro]

How did you define your block?
And your css class?

Sent from my SM-A320FL using Tapatalk

This is how I configured it:

config.js

Spoiler: show

Code: Select all

blocks[241] = { 
	title: '',
	width: 3,
	switch: true
}

custom.css

Spoiler: show

Code: Select all

.block_241 {
   font-size:10px;
}
.block_241 .title {
   font-size:25px;
   padding-left: 0px;
   margin-left: 0px;
}
.block_241 .col-xs-8 { /*data*/
   padding-left: 0px;
   margin-left: 0px;
}
.block_241 .col-xs-4 { /*icon*/
   padding-right: 0px;
   margin-right: 0px;
}
.moisture_normal {
   color: rgba(255,255,255,0.5);
}
.moisture_high {
   color: rgb(0,0,255);
}
.moisture_low {
   color: rgb(254,167,42);
}
.moisture_critical {
   color: rgb(255,0,0);
}
.update_timeout {
   color: rgb(0,0,0) !important;
}

[Lokonli]

How did you define your block?
And your css class?

Sent from my SM-A320FL using Tapatalk

This is how I configured it:

config.js

Spoiler: show

Code: Select all

blocks[241] = { 
	title: '',
	width: 3,
	switch: true
}

custom.css

Spoiler: show

Code: Select all

.block_241 {
   font-size:10px;
}
.block_241 .title {
   font-size:25px;
   padding-left: 0px;
   margin-left: 0px;
}
.block_241 .col-xs-8 { /*data*/
   padding-left: 0px;
   margin-left: 0px;
}
.block_241 .col-xs-4 { /*icon*/
   padding-right: 0px;
   margin-right: 0px;
}
.moisture_normal {
   color: rgba(255,255,255,0.5);
}
.moisture_high {
   color: rgb(0,0,255);
}
.moisture_low {
   color: rgb(254,167,42);
}
.moisture_critical {
   color: rgb(255,0,0);
}
.update_timeout {
   color: rgb(0,0,0) !important;
}

As a result of the setBlock call, the block will be refreshed. As a result of the refresh, the getStatus function will be called again. Since you set addClass in the getStatus function as well, it will overwrite the addClass value set by the setBlock function.

So probably you have to add some checks on the LastUpdate value in the getStatus function, and only modify addClass if needed.

[toro]

As a result of the setBlock call, the block will be refreshed. As a result of the refresh, the getStatus function will be called again. Since you set addClass in the getStatus function as well, it will overwrite the addClass value set by the setBlock function.

So probably you have to add some checks on the LastUpdate value in the getStatus function, and only modify addClass if needed.

Wow, of course, that makes sense!
Thank you Lokonli for your time and suggestions, really appreciate it.
I changed the code a bit and this way it works as intended.
For your information, and maybe for others with the same problem, this is how:

Spoiler: show

Code: Select all

function afterGetDevices(){
	var device = Domoticz.getAllDevices()['241'];
	if(moment(device['LastUpdate']).unix() < (moment().unix() - (4200))) { //(70 min)
		Dashticz.setBlock('241', {
			addClass: 'update_timeout'
		});
	}
}

function getStatus_241(block){
	var device = block.device;
	if(moment(device['LastUpdate']).unix() < (moment().unix() -(4200))) { //(70 min)
		block.addClass='update_timeout';
	}
	else if(parseFloat(device['Data'])<=50){
		block.addClass='moisture_critical';
	}
	else if(parseFloat(device['Data'])>50 && parseFloat(device['Data'])<=60){
		block.addClass='moisture_low';
	}
	else if(parseFloat(device['Data'])>90){
		block.addClass='moisture_high';
	}
	else {
		block.addClass='moisture_normal';
	}
}