Page 3 of 184
Re: New Dashboard Design
Posted: Saturday 11 March 2017 19:52
by robgeerts
If you open console (F12) and reload the dashboard, you can see a call made to Domoticz (network-tab), if you click on it, it will show his response, could you send me this response in a PM?
Verstuurd vanaf mijn SM-G930F met Tapatalk
Re: New Dashboard Design
Posted: Saturday 11 March 2017 20:58
by Ierlandfan
I want to change the image of a custom selector switch based on the levels
I can see there is some code for that but it is hashed out.
Code: Select all
//if(parseFloat(data.result[r]['Level'])==0) switchHTML+='<img src="img/'+buttonimg+$
//else
switchHTML+='<img src="img/'+buttonimg+'_on.png" class="on icon" />';
It seems I only have to define the levels and the icon I want to show for that level?
like:
Code: Select all
if(parseFloat(data.result[r]['Level'])==10) switchHTML+='<img src="img/some-image"
elseif
if(parseFloat(data.result[r]['Level'])==20) switchHTML+='<img src="img/some-other-image"
else
switchHTML+='<img src="img/'+buttonimg+'_off.png" class="on icon" />';
Right?
Another question
Code: Select all
else if(typeof(data.result[r]['LevelActions'])!=='undefined' && data.result[r]['LevelActions']!=="")
{
How can I change that to my custom idx?
Re: New Dashboard Design
Posted: Saturday 11 March 2017 21:06
by robgeerts
Ierlandfan wrote:
It seems I only have to define the levels and the icon I want to show for that level?
Right?
Right!
Another question
Code: Select all
else if(typeof(data.result[r]['LevelActions'])!=='undefined' && data.result[r]['LevelActions']!=="")
How can I change that to my custom idx?[/quote]
Code: Select all
else if(data.result[r]['idx']==123)
Re: New Dashboard Design
Posted: Saturday 11 March 2017 21:42
by Ierlandfan
This test ended up in missing text and completely no block of switches
(I suck in coding html and javascript I know....I probably forgot some } somewhere?)
$('#groups').append(switchHTML);
}
else if(data.result[r]['idx']==104)
var actions = data.result[r]['LevelActions'].split('|');
var names = data.result[r]['LevelNames'].split('|');
var switchHTML = '<div class="col-md-4 mb no-pr switch" data-light="'+data.result[r]['idx']+'">';
switchHTML+='<div class="transbg"> ';
switchHTML+='<div class="col-md-4 no-padding">';
###
if(parseFloat(data.result[r]['Level'])==10) switchHTML+='<img src="img/weekend.png">;
else
if(parseFloat(data.result[r]['Level'])==20) switchHTML+='<img src="img/other-image'>;
else
if(parseFloat(data.result[r]['Level'])==30) switchHTML+='<img src="img/groen.png">;
else
if(parseFloat(data.result[r]['Level'])==40) switchHTML+='<img src="img/'+buttonimg+$
else
if(parseFloat(data.result[r]['Level'])==50) switchHTML+='<img src="img/'+buttonimg+$
else
if(parseFloat(data.result[r]['Level'])==60) switchHTML+='<img src="img/'+buttonimg+$
else
if(parseFloat(data.result[r]['Level'])==70) switchHTML+='<img src="img/'+buttonimg+$
else
if(parseFloat(data.result[r]['Level'])==90) switchHTML+='<img src="img/'+buttonimg+$
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 />';
switchHTML+='<select onchange="switchDeviceBtn(this,this.value);">';
switchHTML+='<option value="">Selecteer</option>';
for(a in actions){
switchHTML+='<option value="'+actions[a]+'">'+names[a]+'</option>';
}
switchHTML+='</select>';
switchHTML+='</div>';
switchHTML+='</div>';
switchHTML+='</div>';
$('#switches').append(switchHTML);
}
else if(typeof(data.result[r]['LevelActions'])!=='undefined' && data.result[r]['LevelActions']!==""){
var actions = data.result[r]['LevelActions'].split('|');
var names = data.result[r]['LevelNames'].split('|');
Re: New Dashboard Design
Posted: Saturday 11 March 2017 21:45
by robgeerts
Please attach your main.js to your reply..
Re: New Dashboard Design
Posted: Saturday 11 March 2017 21:56
by Ierlandfan
Here it is
Re: New Dashboard Design
Posted: Saturday 11 March 2017 22:09
by robgeerts
Well, you missed a lot of } and ' but I fixed it.
Don't know if the result is expected but at least there are no more parse errors in the script.
Re: New Dashboard Design
Posted: Saturday 11 March 2017 22:39
by Awst6000
Is there an easy/simple way to display only the groups, switches and sliders?
I tried to edit the index.html, but I end up with only the left side of the screen filled.
Re: New Dashboard Design
Posted: Saturday 11 March 2017 22:42
by robgeerts
You have to change:
Code: Select all
<div class="col-md-5" style="padding-right:30px;">
to:
Code: Select all
<div class="col-md-12" style="padding-right:30px;">
On row 34
Re: New Dashboard Design
Posted: Saturday 11 March 2017 22:45
by Awst6000
I'll grab a cool beer and try this immediately
Txs!
Re: New Dashboard Design
Posted: Saturday 11 March 2017 23:14
by Awst6000
This way I get 3 very wide switchboxes on every row.
Is there a way to get about 8 of them on each row?
I wish I didn't have to ask these simple questions, but unfortunately I'm not a coder
Re: New Dashboard Design
Posted: Saturday 11 March 2017 23:19
by robgeerts
You can found several times things like 'col-md-6' or 'col-md-4' in main.js, change the number to 1,2,3, etc, for example: col-md-1
Verstuurd vanaf mijn SM-G930F met Tapatalk
Re: New Dashboard Design
Posted: Sunday 12 March 2017 10:11
by Racierox
Very nice dashboard! I got it working by copying the contents, changing the domoticz ip, wunderground api and so on.
Only problem is it doesn't automatically load my favorite switches. It doesn't load a single switch at all. What can I do about this?
Re: New Dashboard Design
Posted: Sunday 12 March 2017 10:21
by robgeerts
I think you've set the wrong IP or PORTnumber of Domoticz.
Or do you have a username/password?
If you have username/password, enter:
http://username:pass@ip:port
e.g.:
http://admin:[email protected]:8080
or if you don't have a password:
http://ip:port
e.g.:
http://192.168.1.23:8080
If it still doesn't work, open your console (F12) en see if it shows any errors in console-tab.
Re: New Dashboard Design
Posted: Sunday 12 March 2017 11:49
by Ierlandfan
Thanx for the main.js! Perfect! Level off and no image it won't show which is exactly what I wanted!
I noticed that the page does not respond to the change of switches. I have to manually reload (F5) the page for the change to show up.
Is there any refresh timer I can adjust?
Re: New Dashboard Design
Posted: Sunday 12 March 2017 11:53
by robgeerts
My dashboard does response to the change of switches, although it could take some seconds... After a click on the switch it gets the new states of all switches from Domoticz and rebuild the blocks.
Verstuurd vanaf mijn SM-G930F met Tapatalk
Re: New Dashboard Design
Posted: Sunday 12 March 2017 12:35
by Ierlandfan
I started over..unzipped the original (with the then 2 hours old update) dashboard..only changed CONFIG.js (IP and Port) No refesh.
I started over...downloaded the original tar (a few minutes ago) dashboard..untarred the archive...only changed CONFIG.js (IP and Port) No refesh.
Tried Chrome, Microsoft Edge & IE..no refresh.
Tot test Domoticz I installed another frontpage...that responded.
Could it be that the update from yesterday broke the refresh?
Re: New Dashboard Design
Posted: Sunday 12 March 2017 12:37
by robgeerts
Well, its possible, do you get any errors in console (F12)?
Re: New Dashboard Design
Posted: Sunday 12 March 2017 12:50
by Ierlandfan
Did a git clone (just to make sure)...same result.
I checked out branch 8fb5c41f and that one worked immediately.
No errors in the console for as far as I can see. I can see that nzbget (which i don't use) is the only part that updates.
Re: New Dashboard Design
Posted: Sunday 12 March 2017 13:36
by robgeerts
I'll check tonight!