Page 8 of 184

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 15:39
by Dynamic
I'm getting pretty far with my own dashboard. An old iPad will be mounted to the wall next week to facilitate this awesome dashboard.

I've got a couple of devices that I would like to activate from the dashboard (switch command should be on/off or push). I will need this to controll my Sonos speakers. What is the easiest way to create a manual button and assign it to an on/off or push-switch?

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 18:57
by koowee
Hi,

This dashboard is great!

I have some problems when I try to add Netatmo CO2 sensor, I get result "undefind". Is there something wrong on my code or do you need to add support to this kind of device?

Code: Select all

if(data.result[r]['idx']==199){
$('.insideco').html(data.result[r]['Air Quality']+' ppm');
$('.insideco').parents('.hideinit').show();

Code: Select all

{
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "1060 ppm",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 13,
         "HardwareName" : "Netatmo",
         "HardwareType" : "Netatmo",
         "HardwareTypeVal" : 54,
         "HaveTimeout" : false,
         "ID" : "0079",
         "LastUpdate" : "2017-03-28 19:42:01",
         "Name" : "Living room CO2",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "Quality" : "Fair",
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "SubType" : "Voltcraft CO-20",
         "Timers" : "false",
         "Type" : "Air Quality",
         "TypeImg" : "air",
         "Unit" : 165,
         "Used" : 1,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "199"
      },

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 19:40
by EdwinK
Not sure if it's possible, but ..

I would like to control my Logitech Media Server (on Synology). Play/stop volume up/down, and on/off. Maybe even a playlist. It doesn't need to play on the site, iv'e got a Raspberry for that.

Just in case:

Code: Select all

    {
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "The Beatles - Sgt. Pepper's Lonely Hearts Club Band (1967)",
         "Description" : "",
         "Favorite" : 0,
         "HardwareID" : 22,
         "HardwareName" : "LMS",
         "HardwareType" : "Logitech Media Server",
         "HardwareTypeVal" : 60,
         "HaveDimmer" : true,
         "HaveGroupCmd" : true,
         "HaveTimeout" : false,
         "ID" : "000002E",
         "Image" : "Light",
         "IsSubDevice" : false,
         "LastUpdate" : "2017-03-28 19:34:59",
         "Level" : 0,
         "LevelInt" : 0,
         "MaxDimLevel" : 15,
         "Name" : "Huiskamer",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "Status" : "Playing",
         "StrParam1" : "",
         "StrParam2" : "",
         "SubType" : "AC",
         "SwitchType" : "Media Player",
         "SwitchTypeVal" : 17,
         "Timers" : "false",
         "Type" : "Lighting 2",
         "TypeImg" : "LogitechMediaServer",
         "Unit" : 1,
         "Used" : 1,
         "UsedByCamera" : false,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "102"
      }
   ],
   "status" : "OK",
   "title" : "Devices"
}

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 20:40
by robgeerts
koowee wrote:Hi,

This dashboard is great!

I have some problems when I try to add Netatmo CO2 sensor, I get result "undefind". Is there something wrong on my code or do you need to add support to this kind of device?

Code: Select all

if(data.result[r]['idx']==199){
$('.insideco').html(data.result[r]['Air Quality']+' ppm');
$('.insideco').parents('.hideinit').show();

Code: Select all

$('.insideco').html(data.result[r]['Air Quality']+' ppm');
NEEDS TO BE:

Code: Select all

$('.insideco').html(data.result[r]['Data']);

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 20:42
by robgeerts
EdKo66 wrote: "Data" : "The Beatles - Sgt. Pepper's Lonely Hearts Club Band (1967)",
Nice choice!
EdKo66 wrote: I would like to control my Logitech Media Server (on Synology). Play/stop volume up/down, and on/off. Maybe even a playlist. It doesn't need to play on the site, iv'e got a Raspberry for that.
In this case, you need to know wich commands it uses.
When you open your existing webpage of the Media Server (assuming there's one), you can check (f12, network tab) wich urls it calls when you click on a button.

Could you retrieve these?

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 20:46
by koowee
robgeerts wrote:
koowee wrote:
...

Code: Select all

$('.insideco').html(data.result[r]['Air Quality']+' ppm');
NEEDS TO BE:

Code: Select all

$('.insideco').html(data.result[r]['Data']);
Thanks!

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 20:46
by robgeerts
Dynamic wrote:I'm getting pretty far with my own dashboard. An old iPad will be mounted to the wall next week to facilitate this awesome dashboard.

I've got a couple of devices that I would like to activate from the dashboard (switch command should be on/off or push). I will need this to controll my Sonos speakers. What is the easiest way to create a manual button and assign it to an on/off or push-switch?
Well, you could copy the next code from main.js and change this to fit your needs.

Code: Select all

else if(data.result[r]['Type']=='Group'){
	var switchHTML = '<div class="col-md-4 mb no-pr" data-light="'+data.result[r]['idx']+'" onclick="switchGroup(this);">';
			switchHTML+='<div class="transbg"> ';
				switchHTML+='<div class="col-md-4 no-padding">';
					if(data.result[r]['Status']=='Off') switchHTML+='<img src="img/'+buttonimg+'_off.png" class="off icon" />';
					else switchHTML+='<img src="img/'+buttonimg+'_on.png" class="on icon" />';
				switchHTML+='</div>';
				switchHTML+='<div class="col-md-8 no-padding">';
					switchHTML+='<strong class="title">'+data.result[r]['Name']+'</strong><br />';
					if(data.result[r]['Status']=='Off') switchHTML+='<span class="state">UIT</span>';
					else switchHTML+='<span class="state">AAN</span>';
				switchHTML+='</div>';
			switchHTML+='</div>';
		switchHTML+='</div>';
	$('#groups').append(switchHTML);
}
You can also post your json-output if you want us to help you, take a look at this post:
http://domoticz.com/forum/viewtopic.php ... 60#p124168

Re: New Dashboard Design

Posted: Tuesday 28 March 2017 20:56
by EdwinK
robgeerts wrote:
Could you retrieve these?

I've got this in jsonrpc.js

Code: Select all

{"result":{"lastscan":"1489419015","version":"7.9.0","uuid":"66e16fd3-bf2f-4e86-9793-efec66a38a6d","info total albums":199,"info total artists":580,"info total genres":33,"info total songs":2510,"info total duration":523574.062000001,"player count":1,"players_loop":[{"playerid":"00:1d:43:10:15:92","uuid":null,"ip":"192.168.0.103:49961","name":"Huiskamer","seq_no":0,"model":"squeezelite","power":"1","isplaying":1,"displaytype":"none","canpoweroff":1,"connected":1,"isplayer":1}],"sn player count":0,"other player count":0},"params":["",["serverstatus","0","999"]],"id":1,"method":"slim.request"}
This created for every song, so I hope this might be it.

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 1:05
by Maartenkr
Hello I have a question.

Is it possible to control my Nest termostaat?

And how do I get the barometer and wind on the right see picture.


Image

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 9:25
by robgeerts
Maartenkr wrote:Hello I have a question.

Is it possible to control my Nest termostaat?

And how do I get the barometer and wind on the right see picture.


Image
could you send me the complete output, as described here:
http://domoticz.com/forum/viewtopic.php ... 60#p124168

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 11:06
by Maartenkr

Code: Select all

"AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "18.4",
         "Description" : "",
         "Favorite" : 0,
         "HardwareID" : 3,
         "HardwareName" : "Nest",
         "HardwareType" : "Nest Thermostat/Protect",
         "HardwareTypeVal" : 52,
         "HaveTimeout" : false,
         "ID" : "0000001",
         "LastUpdate" : "2017-03-29 11:03:38",
         "Name" : "Setpoint Verwarming",
         "Notifications" : "false",
         "PlanID" : "2",
         "PlanIDs" : [ 2 ],
         "Protected" : false,
         "SetPoint" : "18.4",
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "SubType" : "SetPoint",
         "Timers" : "false",
         "Type" : "Thermostat",
         "TypeImg" : "override_mini",
         "Unit" : 0,
         "Used" : 1,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "7"

This is the output of the nest thermostat

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 12:47
by EdwinK
EdKo66 wrote:
robgeerts wrote:
Could you retrieve these?

I've got this in jsonrpc.js

Code: Select all

{"result":{"lastscan":"1489419015","version":"7.9.0","uuid":"66e16fd3-bf2f-4e86-9793-efec66a38a6d","info total albums":199,"info total artists":580,"info total genres":33,"info total songs":2510,"info total duration":523574.062000001,"player count":1,"players_loop":[{"playerid":"00:1d:43:10:15:92","uuid":null,"ip":"192.168.0.103:49961","name":"Huiskamer","seq_no":0,"model":"squeezelite","power":"1","isplaying":1,"displaytype":"none","canpoweroff":1,"connected":1,"isplayer":1}],"sn player count":0,"other player count":0},"params":["",["serverstatus","0","999"]],"id":1,"method":"slim.request"}
This created for every song, so I hope this might be it.
Accidently posted this in my previous post.

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 19:55
by Dynamic
robgeerts wrote:
You can also post your json-output if you want us to help you, take a look at this post:
http://domoticz.com/forum/viewtopic.php ... 60#p124168
Hmm, i'm not having success myself...

What I want: in the middle column I want to have 4 buttons next to each other to control my sonos speakers (stop, play, volume up, volume down).

This is the JSON-output:

Code: Select all

 {
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "Off",
         "Description" : "",
         "Favorite" : 0,
         "HardwareID" : 2,
         "HardwareName" : "Dummy",
         "HardwareType" : "Dummy (Does nothing, use for virtual switches only)",
         "HardwareTypeVal" : 15,
         "HaveDimmer" : true,
         "HaveGroupCmd" : true,
         "HaveTimeout" : false,
         "ID" : "0005000A",
         "Image" : "Light",
         "IsSubDevice" : false,
         "LastUpdate" : "2017-03-29 19:51:03",
         "Level" : 0,
         "LevelActions" : "||||",
         "LevelInt" : 0,
         "LevelNames" : "Off|Play|Pause|Volume up|Volume down",
         "LevelOffHidden" : true,
         "MaxDimLevel" : 100,
         "Name" : "Sonos",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "SelectorStyle" : 0,
         "ShowNotifications" : true,
         "SignalLevel" : 0,
         "Status" : "Off",
         "StrParam1" : "",
         "StrParam2" : "",
         "SubType" : "Selector Switch",
         "SwitchType" : "Selector",
         "SwitchTypeVal" : 18,
         "Timers" : "false",
         "Type" : "Light/Switch",
         "TypeImg" : "Light",
         "Unit" : 9,
         "Used" : 1,
         "UsedByCamera" : false,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "771"
      }

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 20:37
by robgeerts
Maartenkr wrote:Hello I have a question.

Is it possible to control my Nest termostaat?

And how do I get the barometer and wind on the right see picture.
The output of your nest thermostat is only for displaying the temperature and for controlling it?
If you want the barometer and wind on the right, try this:

Find:

Code: Select all

else if(data.result[r]['Type']=='General' && data.result[r]['SubType']=='Barometer'){
Change the complete elseif-statement to:

Code: Select all

else if(data.result[r]['Type']=='General' && data.result[r]['SubType']=='Barometer'){
	$('.block'+data.result[r]['idx']).remove();

	var switchHTML = '<div class="col-md-12 mb block'+data.result[r]['idx']+'" data-light="'+data.result[r]['idx']+'">';
			switchHTML+='<div class="transbg">';
				switchHTML+='<div class="col-md-4 no-padding">';
					switchHTML+='<em class="wi wi-barometer"></em>';
				switchHTML+='</div>';
				switchHTML+='<div class="col-md-8 no-padding">';
					switchHTML+='<strong class="title">'+data.result[r]['Data']+'</strong><br />';
					switchHTML+='<span>'+data.result[r]['Name']+'</span>';
				switchHTML+='</div>';
			switchHTML+='</div>';
		switchHTML+='</div>';

	$('.blocks').append(switchHTML);

}
AND FOR WIND:
Find:

Code: Select all

else if(data.result[r]['Type']=='Wind'){
And change it to:

Code: Select all

else if(data.result[r]['Type']=='Wind'){
	$('.block'+data.result[r]['idx']).remove();

	var switchHTML = '<div class="col-md-12 mb block'+data.result[r]['idx']+'" data-light="'+data.result[r]['idx']+'">';
			switchHTML+='<div class="transbg">';
				switchHTML+='<div class="col-md-4 no-padding">';
					switchHTML+='<em class="wi wi-wind-direction"></em>';
				switchHTML+='</div>';
				switchHTML+='<div class="col-md-8 no-padding">';
					switchHTML+='<strong class="title">'+data.result[r]['Gust']+'km/u, '+data.result[r]['DirectionStr']+'</strong><br />';
					switchHTML+='<span>'+data.result[r]['Name']+'</span>';
				switchHTML+='</div>';
			switchHTML+='</div>';
		switchHTML+='</div>';

	$('.blocks').append(switchHTML);
}

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 20:39
by robgeerts
Dynamic wrote: This is the JSON-output:

Code: Select all

 {
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
        ......
         "Description" : "",
         "Favorite" : 0,
         "HardwareID" : 2,
         .....
         "LevelActions" : "||||",
         "LevelInt" : 0,
         "LevelNames" : "Off|Play|Pause|Volume up|Volume down",
         "LevelOffHidden" : true,
        ......
         "idx" : "771"
      }
First, you have to enable the switch as a favorite in Domoticz.
Second, the LevelActions for each buttons are empty?

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 20:41
by Dynamic
robgeerts wrote: First, you have to enable the switch as a favorite in Domoticz.
Second, the LevelActions for each buttons are empty?
Done!
The LevelActions are empty for the moment, because I created this device for the new dashboard. I'm going to assign actions to those buttons (it will run a Python-script).

Re: New Dashboard Design

Posted: Wednesday 29 March 2017 22:49
by robgeerts
In the meantime, I'm changing some things, take a look at this screenshot:

Image


It seems that more people have blocks like you can see in the middle (status of devices etc.). By moving them here (they were on the right before) you can have more blocks of this type before falling of the screen ;)
I also changed a lot in the CSS-files regarding the spaces between blocks.

I updated gitlab, If you wanna keep the old version, backup or rename your current folder and clone the latest version.
If you experience css problems, make sure you've cleared your cache.

Re: New Dashboard Design

Posted: Thursday 30 March 2017 0:02
by pvm
EdKo66 wrote:Not sure if it's possible, but ..
I would like to control my Logitech Media Server (on Synology). Play/stop volume up/down, and on/off. Maybe even a playlist. It doesn't need to play on the site, iv'e got a Raspberry for that.
This triggered me to display whats currently playing (not controlling something yet) based on Domoticz data, screenshot of the new part of the dashboard:
MuziekSpelers.JPG
MuziekSpelers.JPG (25.1 KiB) Viewed 2244 times

Updates to main.js :

Code: Select all

			if(!sliding){
					-------keep default code here ------
					$('#LMSPlayers').html('');
					for(r in data.result){

						if(data.result[r]['HardwareType']=='Logitech Media Server'){
							if(data.result[r]['Status']=='Playing'){
								var html='<div class="transbg">';
								html +='<div class="col-md-1 no-padding">';
								html +='<em class="fa fa-music"></em>';
								html +='</div>';
								html +='<div class="col-md-11 no-padding">';
								html +='<strong class="title">'+data.result[r]['Name']+'</strong><br />';
								html +='<span class="h2">'+data.result[r]['Data']+'</span>';
								html +='</div>';
								$('#LMSPlayers').append(html);
							}

						}
						
						------ keep default code here ------
update to config.js, addition to titles part:

Code: Select all

titles.LMSPlayers = 'Muziekspelers';
and the index.html addition (I've kept the part on traffic and buttons as default and added LMSPlayers in between)

Code: Select all

						<div class="row containstraffic mb">
							<div class="titletraffic"><h3 class="transbg"></h3></div>
							<div id="traffic"></div>
						</div>						
								
						<div class="row mb">
							<div class="titleLMSPlayers"><h3 class="transbg"></h3></div>
							<div id="LMSPlayers"></div>
						</div>						
								
						<div class="row mb" id="buttons">

Somethings wrong when using this on a small screen, the data is not displayed... I'm not an html expert, guess I've made a mistake somehere
Is it possible to add this to the repository?
edit: (improvement could be to show the playing status based on the Status field by coloring the icon green? and not hiding the titles?)

Re: New Dashboard Design

Posted: Thursday 30 March 2017 0:20
by pvm
EdKo66 / robgeerts
To control the player you need the following urls

Previous song

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Rewind
Next song

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Forward
Pause

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Pause
Play

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Play
Stop

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Stop
Volume up

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=VolumeUp
Mute

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=Mute
Volume down

Code: Select all

/json.htm?type=command&param=lmsmediacommand&idx=XXYYZZ&action=VolumeDown

Shuffle and repeat buttons have 'strange' behaviour it switches between non shuffling, shuffle by album and shuffle, for repeat: no repeat, repeat number, repeatplaylist, that's why I did not add those urls


Sorry, do not have time today to integrate this in the dashboard... I would also have to look into adding buttons and behaviour... EdKo66, can you help?

Re: New Dashboard Design

Posted: Thursday 30 March 2017 0:36
by pvm
The slider does not work for my fibaro dimmer as its expecting a 0-100% value

Like 71%:

Code: Select all

/json.htm?type=command&param=switchlight&idx=26&switchcmd=Set%20Level&level=71
information on this dimmer

Code: Select all

{
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "Set Level: 70 %",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 6,
         "HardwareName" : "Aeonlabs Z-wave stick",
         "HardwareType" : "OpenZWave USB",
         "HardwareTypeVal" : 21,
         "HaveDimmer" : true,
         "HaveGroupCmd" : true,
         "HaveTimeout" : false,
         "ID" : "00001301",
         "Image" : "Light",
         "IsSubDevice" : false,
         "LastUpdate" : "2017-03-30 00:34:26",
         "Level" : 70,
         "LevelInt" : 70,
         "MaxDimLevel" : 100,
         "Name" : "Dimmer2tst",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "Status" : "Set Level: 70 %",
         "StrParam1" : "",
         "StrParam2" : "",
         "SubType" : "Switch",
         "SwitchType" : "Dimmer",
         "SwitchTypeVal" : 7,
         "Timers" : "false",
         "Type" : "Light/Switch",
         "TypeImg" : "dimmer",
         "Unit" : 1,
         "Used" : 1,
         "UsedByCamera" : false,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "26"
      },
Do you see an option to give dim levels between 0 and 100% for this device (and 0-16 for the device for which it has been developed by you)
Based on maxdimlevel?


ah... and compliments!! Nice dashboard!