NEW frontpage.html - request comments

Moderator: leecollings

User avatar
mvveelen
Posts: 678
Joined: Friday 31 October 2014 10:22
Target OS: NAS (Synology & others)
Domoticz version: Beta
Location: Hoorn, The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by mvveelen »

SwordFish wrote:
Its ok, do it when you have time for it.
Maby someone who has it will share it.
I just discovered that I had the piece of code in the frontpage.js all the time, but commented it out for later use :lol:

When you change the dimmer part into this:

Code: Select all

	if (vplusmin > 0) {	// dimmer layout cell
	if (vstatus == 'Off') {
	alarmcss=';color:#c0c0c0;font-size:80%;vertical-align:top;';	// text color dimmer percentage when OFF
	vdata = txt_off;

	}   else {
	alarmcss=';background-image:url(\'../icons/' + vdata + 'dimmer.png\');background-repeat:no-repeat;background-position:50%25%;color:#08c5e3;font-size:0%;vertical-align:top;';
	// text color dimmer percentage when ON
	}}
You will see the circles instead of the percentage. Nice when you want to 'up' or 'down' the dim level, but you won't be able to switch it off anymore. Maybe you can try to find a fix for that ;) ?
RPi3b+/RFXCOM rfxtrx433E/Shelly/Xiaomi Gateway/Philips HUE Lights/Atag Zone One/2 SunnyBoy inverters/AirconWithMe/P1 smartmeter/Domoticz latest Beta
SwordFish
Posts: 278
Joined: Sunday 14 December 2014 12:28
Target OS: Raspberry Pi / ODroid
Domoticz version: V4.11375
Contact:

Re: NEW frontpage.html - request comments

Post by SwordFish »

mvveelen wrote:
SwordFish wrote:
Its ok, do it when you have time for it.
Maby someone who has it will share it.
I just discovered that I had the piece of code in the frontpage.js all the time, but commented it out for later use :lol:

When you change the dimmer part into this:

Code: Select all

	if (vplusmin > 0) {	// dimmer layout cell
	if (vstatus == 'Off') {
	alarmcss=';color:#c0c0c0;font-size:80%;vertical-align:top;';	// text color dimmer percentage when OFF
	vdata = txt_off;

	}   else {
	alarmcss=';background-image:url(\'../icons/' + vdata + 'dimmer.png\');background-repeat:no-repeat;background-position:50%25%;color:#08c5e3;font-size:0%;vertical-align:top;';
	// text color dimmer percentage when ON
	}}
You will see the circles instead of the percentage. Nice when you want to 'up' or 'down' the dim level, but you won't be able to switch it off anymore. Maybe you can try to find a fix for that ;) ?
Thanks.
Did you name the circles like 33.png and 66.png?
Here is wher i pit the code for the sunrise and sunset,
frontpage js.PNG
frontpage js.PNG (63.4 KiB) Viewed 4984 times
frontpage html.PNG
frontpage html.PNG (52.35 KiB) Viewed 4984 times
User avatar
mvveelen
Posts: 678
Joined: Friday 31 October 2014 10:22
Target OS: NAS (Synology & others)
Domoticz version: Beta
Location: Hoorn, The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by mvveelen »

I named them:

6dimmer.png
13dimmer.png
20dimmer.png
26dimmer.png
33dimmer.png
40dimmer.png
46dimmer.png
53dimmer.png
60dimmer.png
66dimmer.png
73dimmer.png
80dimmer.png
86dimmer.png
93dimmer.png
100dimmer.png

Don't you have the images in your icons directory from one of my last downloads?
RPi3b+/RFXCOM rfxtrx433E/Shelly/Xiaomi Gateway/Philips HUE Lights/Atag Zone One/2 SunnyBoy inverters/AirconWithMe/P1 smartmeter/Domoticz latest Beta
zicht
Posts: 251
Joined: Sunday 11 May 2014 11:09
Target OS: Windows
Domoticz version: 2023.1+
Location: NL
Contact:

Re: NEW frontpage.html - request comments

Post by zicht »

The code for the dimmer icons I used :

Code: Select all

//Dimmer
if(vplusmin > 0 && vtype == 'Dimmer' && vplusmin != 4) {
if (vdata == txt_off) {
if (show) { vdata=new String(vdata).replace( txt_off,"<img src=icons/off.png width=65 height=60 style='margin-top: 30px;'>"); }
else { alarmcss=';color:#E24E2A;'; }
												
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'On\');lightbox_open(\'switch\', '+switch_on_timeout+', '+txt_switch_on+')"; style='+alarmcss+'> '+ vdata+' </span>';
var plus = ""; // no updown when dimmer is off
var min = "";
}
else if(vtype == 'Dimmer' && vplusmin != 4)
{
var vdimmericon=new String(Vdimmerc).replace( Vdimmerc,"<img src=icons/dimmer"+Vdimmerc+".png width=65 height=60 style='margin-top: 30px;'>");
console.log(vdimmericon);  // debugging
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'Off\');lightbox_open(\'switch\', '+switch_off_timeout+', '+txt_switch_off+')"; style='+alarmcss+'> '+ vdimmericon +' </span>';
var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png  onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>"
}
vdata = min.concat(hlp,plus);
}
Where Vdimmerc is Vdimmercurrent in some earlier examples.
If you in chrome richtclick and choose inspect element you will see how the renaming is done. = command consle.log();
For this to work i obviously renamed the "66dimmer.png" icons to dimmer+value.png to get a match.
It works like expected, increasing the ring on each + and decreasing the ring radius on each -
By clicking on the icon with the ring you can directly put the dimmer of and on.
(Vplusmin !=4 is a special condition i build in to be able in FrontPage settings.js to disable icons )
Rpi & Win x64. Using : cam's,RFXCom, LaCrosse, RFY, HuE, google, standard Lua, Tasker, Waze traveltime, NLAlert&grip2+,curtains, vacuum, audioreceiver, smart-heating&cooling + many more (= automate all repetitive simple tasks)
SwordFish
Posts: 278
Joined: Sunday 14 December 2014 12:28
Target OS: Raspberry Pi / ODroid
Domoticz version: V4.11375
Contact:

Re: NEW frontpage.html - request comments

Post by SwordFish »

zicht wrote:The code for the dimmer icons I used :

Code: Select all

//Dimmer
if(vplusmin > 0 && vtype == 'Dimmer' && vplusmin != 4) {
if (vdata == txt_off) {
if (show) { vdata=new String(vdata).replace( txt_off,"<img src=icons/off.png width=65 height=60 style='margin-top: 30px;'>"); }
else { alarmcss=';color:#E24E2A;'; }
												
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'On\');lightbox_open(\'switch\', '+switch_on_timeout+', '+txt_switch_on+')"; style='+alarmcss+'> '+ vdata+' </span>';
var plus = ""; // no updown when dimmer is off
var min = "";
}
else if(vtype == 'Dimmer' && vplusmin != 4)
{
var vdimmericon=new String(Vdimmerc).replace( Vdimmerc,"<img src=icons/dimmer"+Vdimmerc+".png width=65 height=60 style='margin-top: 30px;'>");
console.log(vdimmericon);  // debugging
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'Off\');lightbox_open(\'switch\', '+switch_off_timeout+', '+txt_switch_off+')"; style='+alarmcss+'> '+ vdimmericon +' </span>';
var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png  onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>"
}
vdata = min.concat(hlp,plus);
}
Where Vdimmerc is Vdimmercurrent in some earlier examples.
If you in chrome richtclick and choose inspect element you will see how the renaming is done. = command consle.log();
For this to work i obviously renamed the "66dimmer.png" icons to dimmer+value.png to get a match.
It works like expected, increasing the ring on each + and decreasing the ring radius on each -
By clicking on the icon with the ring you can directly put the dimmer of and on.
(Vplusmin !=4 is a special condition i build in to be able in FrontPage settings.js to disable icons )
So you named like dimmer66.png?
Is it also possible to have the dimmer circels and the on/off icons visible?
zicht
Posts: 251
Joined: Sunday 11 May 2014 11:09
Target OS: Windows
Domoticz version: 2023.1+
Location: NL
Contact:

Re: NEW frontpage.html - request comments

Post by zicht »

So you named like dimmer66.png?
Is it also possible to have the dimmer circels and the on/off icons visible ?
Yes indeed, but by changing the sequence in my code you maybe can keep your names... it is a matter of preference.
The nice thing is you do it with almost one line code :)

look for the underlined part :
vdimmericon = Vdimmerc;
var vdimmericon=new String(Vdimmerc).replace( Vdimmerc,"<img src=icons/dimmer"+Vdimmerc+".png width=65 height=60 style='margin-top: 30px;'>");
console.log(vdimmericon);
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'Off\');lightbox_open(\'switch\', '+switch_off_timeout+', '+txt_switch_off+')"; style='+alarmcss+'> '+ vdimmericon +' </span>';
It should be possible to have both, like temp and humidity by using <div> inside the cells.
Edit : Would not be needed to used the div :) If you conditinal add the icon to vdimmericon it should work straight away. Of course you have to look at the var hlp also to define where you will be able to click for issueing on and off commands...

I am still working on this as i did not think about this till somebody showed here :oops:
Rpi & Win x64. Using : cam's,RFXCom, LaCrosse, RFY, HuE, google, standard Lua, Tasker, Waze traveltime, NLAlert&grip2+,curtains, vacuum, audioreceiver, smart-heating&cooling + many more (= automate all repetitive simple tasks)
User avatar
mvveelen
Posts: 678
Joined: Friday 31 October 2014 10:22
Target OS: NAS (Synology & others)
Domoticz version: Beta
Location: Hoorn, The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by mvveelen »

With this code, the UP and DOWN disappear in my frontpage, and I can't switch the lights on....?
RPi3b+/RFXCOM rfxtrx433E/Shelly/Xiaomi Gateway/Philips HUE Lights/Atag Zone One/2 SunnyBoy inverters/AirconWithMe/P1 smartmeter/Domoticz latest Beta
SwordFish
Posts: 278
Joined: Sunday 14 December 2014 12:28
Target OS: Raspberry Pi / ODroid
Domoticz version: V4.11375
Contact:

Re: NEW frontpage.html - request comments

Post by SwordFish »

mvveelen wrote:With this code, the UP and DOWN disappear in my frontpage, and I can't switch the lights on....?
On my page also and I still get 33, 66 enz?
Is there something I forget to do?
zicht
Posts: 251
Joined: Sunday 11 May 2014 11:09
Target OS: Windows
Domoticz version: 2023.1+
Location: NL
Contact:

Re: NEW frontpage.html - request comments

Post by zicht »

SwordFish wrote:
mvveelen wrote:With this code, the UP and DOWN disappear in my frontpage, and I can't switch the lights on....?
On my page also and I still get 33, 66 enz?
Is there something I forget to do?
Dear ,
When switched off, the + and - are not there as mention in the comments in the code . This is my personal preference/
this is due to :
var plus = "";
var min = "";
Make sure you have the below mentioned icons or adjust the name to show the + - icons when switched on.

var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>"
What do you find in the console.log (in chrome rightclick the page and select inspect element.
In the log shown on the right site of the screen you should see passing the code with the iconname for the %

vdimmericon = Vdimmerc;
var vdimmericon=new String(Vdimmerc).replace( Vdimmerc,"<img src=icons/dimmer"+Vdimmerc+".png width=65 height=60 style='margin-top: 30px;'>");
console.log(vdimmericon);
Switch off and + - action is in the code below done by switchtoggle function and changestatus function :
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'Off\');lightbox_open(\'switch\', '+switch_off_timeout+', '+txt_switch_off+')"; style='+alarmcss+'> '+ vdimmericon +' </span>';
var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
Switch On is in the code below done by switchtoggle function :
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'On\');lightbox_open(\'switch\', '+switch_on_timeout+', '+txt_switch_on+')"; style='+alarmcss+'> '+ vdata+' </span>';
var plus = "";
var min = "";
Edit : I just remembered something ...
I had some problems in the beginning with vdimmercurrent, so i loaded the vdimmercurrent into vdimmerc.
Maybe you have not filled vdimmerc causing the code to stop and break the function by this. Remember by the swipe module the "Strict mode" is set, so all variable should be declared and filled somehow before using them ....
I did it by this earlier in the code :
for( var ii = 0, len = $.PageArray.length; ii < len; ii++ ) {
if( $.PageArray[ii][0] === item.idx ) { // Domoticz idx number
var vtype= $.PageArray[ii][1]; // Domotitcz type (like Temp, Humidity)
var vlabel= $.PageArray[ii][2]; // cell number from HTML layout
var vdesc= $.PageArray[ii][3]; // description
var lastseen= $.PageArray[ii][4]; // Display lastseen or noT
var vplusmin= $.PageArray[ii][5]; // minplus buttons, or icon on
var vattr= $.PageArray[ii][6]; // extra css attributes
var valarm= $.PageArray[ii][7]; // alarm value to turn text to red
var vdata= item[vtype]; // current value
var vstatus= item["Status"];
var vls= item["LastUpdate"]; // ´Last Seen´
var vdimmercurrent= item["LevelInt"]; // What is the dim level
var Vdimmerc = vdimmercurrent; // something strangs happens along, so recreate new var
For me with KAKU it works like a charm :)

Complete FrontPage code : http://www.filedropper.com/frontpagesm = only temp download for 30days
Many personal tweaks done, mainly intiated in FrontPage settings file.
Please consider it as a fork, many things are changed by me for my personal use and code may not be 100% usefull or functional depending on your situation.
Most of it is commented in the code.
For example :
- i have created an option to make a cell protected via the settings file for cells that are not protected in domoticz itself.
- i have changed the dimmer function not to use 33 66 etc but back to 1-16 as this works more reliable on my kaku dimmers. I have currently only kaku installed in my
home.
- When the alarmtimer is triggere background changes to orange. (timer is started for 20 secs after a door is openend to be able to disarm,
With lua the disarm is done by ping my Phone to discover i am home :) and alarm is set armed away as soon as my Phone is not at home anymore)
- When alarm is triggered then background changes to red. (= alarm timer is finished and alarm is not disarmed) My smoke detectors will make sound on this.
- When the alarm is triggered a beep wil be played to get notified.
- When abroad ip is detected (VPN) then the FrontPage.html is switched to FrontPage_sm.html with less cameras and lower refresh to reduce bandwith
and many more...

For me all is 100% functional and no bugs so far , my only improvement next will be humidity and temp in shared cell to free up some space for future use.
Rpi & Win x64. Using : cam's,RFXCom, LaCrosse, RFY, HuE, google, standard Lua, Tasker, Waze traveltime, NLAlert&grip2+,curtains, vacuum, audioreceiver, smart-heating&cooling + many more (= automate all repetitive simple tasks)
SwordFish
Posts: 278
Joined: Sunday 14 December 2014 12:28
Target OS: Raspberry Pi / ODroid
Domoticz version: V4.11375
Contact:

Re: NEW frontpage.html - request comments

Post by SwordFish »

zicht wrote:
SwordFish wrote:
mvveelen wrote:With this code, the UP and DOWN disappear in my frontpage, and I can't switch the lights on....?
On my page also and I still get 33, 66 enz?
Is there something I forget to do?
Dear ,
When switched off, the + and - are not there as mention in the comments in the code . This is my personal preference/
this is due to :
var plus = "";
var min = "";
Make sure you have the below mentioned icons or adjust the name to show the + - icons when switched on.

var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>"
What do you find in the console.log (in chrome rightclick the page and select inspect element.
In the log shown on the right site of the screen you should see passing the code with the iconname for the %

vdimmericon = Vdimmerc;
var vdimmericon=new String(Vdimmerc).replace( Vdimmerc,"<img src=icons/dimmer"+Vdimmerc+".png width=65 height=60 style='margin-top: 30px;'>");
console.log(vdimmericon);
Switch off and + - action is in the code below done by switchtoggle function and changestatus function :
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'Off\');lightbox_open(\'switch\', '+switch_off_timeout+', '+txt_switch_off+')"; style='+alarmcss+'> '+ vdimmericon +' </span>';
var plus = "<img src=icons/plus.png onclick=ChangeStatus('plus'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
var min = "<img src=icons/min.png onclick=ChangeStatus('min'," + Vdimmerc + "," + item.idx + ","+ Vdimmerc+")>";
Switch On is in the code below done by switchtoggle function :
var hlp = '<span onclick="SwitchToggle('+item.idx+',\'On\');lightbox_open(\'switch\', '+switch_on_timeout+', '+txt_switch_on+')"; style='+alarmcss+'> '+ vdata+' </span>';
var plus = "";
var min = "";
Edit : I just remembered something ...
I had some problems in the beginning with vdimmercurrent, so i loaded the vdimmercurrent into vdimmerc.
Maybe you have not filled vdimmerc causing the code to stop and break the function by this. Remember by the swipe module the "Strict mode" is set, so all variable should be declared and filled somehow before using them ....
I did it by this earlier in the code :
for( var ii = 0, len = $.PageArray.length; ii < len; ii++ ) {
if( $.PageArray[ii][0] === item.idx ) { // Domoticz idx number
var vtype= $.PageArray[ii][1]; // Domotitcz type (like Temp, Humidity)
var vlabel= $.PageArray[ii][2]; // cell number from HTML layout
var vdesc= $.PageArray[ii][3]; // description
var lastseen= $.PageArray[ii][4]; // Display lastseen or noT
var vplusmin= $.PageArray[ii][5]; // minplus buttons, or icon on
var vattr= $.PageArray[ii][6]; // extra css attributes
var valarm= $.PageArray[ii][7]; // alarm value to turn text to red
var vdata= item[vtype]; // current value
var vstatus= item["Status"];
var vls= item["LastUpdate"]; // ´Last Seen´
var vdimmercurrent= item["LevelInt"]; // What is the dim level
var Vdimmerc = vdimmercurrent; // something strangs happens along, so recreate new var
For me with KAKU it works like a charm :)

Complete FrontPage code : http://www.filedropper.com/frontpagesm = only temp download for 30days
Many personal tweaks done, mainly intiated in FrontPage settings file.
Please consider it as a fork, many things are changed by me for my personal use and code may not be 100% usefull or functional depending on your situation.
Most of it is commented in the code.
For example :
- i have created an option to make a cell protected via the settings file for cells that are not protected in domoticz itself.
- i have changed the dimmer function not to use 33 66 etc but back to 1-16 as this works more reliable on my kaku dimmers. I have currently only kaku installed in my
home.
- When the alarmtimer is triggere background changes to orange. (timer is started for 20 secs after a door is openend to be able to disarm,
With lua the disarm is done by ping my Phone to discover i am home :) and alarm is set armed away as soon as my Phone is not at home anymore)
- When alarm is triggered then background changes to red. (= alarm timer is finished and alarm is not disarmed) My smoke detectors will make sound on this.
- When the alarm is triggered a beep wil be played to get notified.
- When abroad ip is detected (VPN) then the FrontPage.html is switched to FrontPage_sm.html with less cameras and lower refresh to reduce bandwith
and many more...

For me all is 100% functional and no bugs so far , my only improvement next will be humidity and temp in shared cell to free up some space for future use.
Thanks for the reply.
I think i'm gonne use your dimmer function 1-16 because i have also only kaku dimmers.
User avatar
mvveelen
Posts: 678
Joined: Friday 31 October 2014 10:22
Target OS: NAS (Synology & others)
Domoticz version: Beta
Location: Hoorn, The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by mvveelen »

I have KAKU dimmers too, but no problems with the way it is now.... :o

OK, I replaced the 'dimmer' code and made sure I have all the right icons in the icons folder. Also I added the piece of code where you set the variables. When I want to turn the lights on nothing happens. When I turn the lights on, using another button, it only shows me the level on the button and no UP or DOWN buttons.In other words: it doesn't work like this. Maybe there is something we forget?
RPi3b+/RFXCOM rfxtrx433E/Shelly/Xiaomi Gateway/Philips HUE Lights/Atag Zone One/2 SunnyBoy inverters/AirconWithMe/P1 smartmeter/Domoticz latest Beta
zicht
Posts: 251
Joined: Sunday 11 May 2014 11:09
Target OS: Windows
Domoticz version: 2023.1+
Location: NL
Contact:

Re: NEW frontpage.html - request comments

Post by zicht »

mvveelen wrote:I have KAKU dimmers too, but no problems with the way it is now.... :o

OK, I replaced the 'dimmer' code and made sure I have all the right icons in the icons folder. Also I added the piece of code where you set the variables. When I want to turn the lights on nothing happens. When I turn the lights on, using another button, it only shows me the level on the button and no UP or DOWN buttons.In other words: it doesn't work like this. Maybe there is something we forget?
I have looked into my code and cannot understand why it is not working for you. Did you take a look at the complete FrontPage zipfile ?
I am not a coder at all, just develop things by trial and error and for me it is working :cry:
I went to the 1-16 because the dimmer code as it was did not function for me at all. I had the same issues as you are describing right now, maybe there is a clue inside that i have broken something during the process ? Exact as you write : not switching on, no reaction on + and - icon ... strange. Because now its is working fine.

btw : i went for the <div> solution and made temp on top and humidity below, but in a way you still can choose to work as initial designed by using the settings file.
when finished i will post the code :
FrontPage.html one cell example

Code: Select all

<div id="cell1">
<div id="cell1A" style="height: 30%; float:top">--</div>
<div id="cell1B" style="height: 10%; float:bottem">--</div>
</div>
<div id="desc_cell1">cell1</div>
I did the above change for all cells exept camera cells

FrontPage_settings.js example, as you can see both divided cells and normal cells work together :)

Code: Select all

['0','Desc',    	    'cell2',                        'Buiten (&deg;C/%)','0','0'],    // description when the split cell is used.
['68','Temp',           'cell2A',                       'BuitenTemp (&deg;C)','0','0','color:#FFCC66;font-size:90%'],
['68','Humidity',       'cell2B',                       'Vocht (%)','0','0','color:#66cccc;font-size:50%'],
['150','CounterToday',  'cell4',                      	'Electra vandaag (kWH)<br />','2','0','color:#99ff33;font-size:100%'],
FrontPage.js adjustment just to get a description when the cell is split.

Code: Select all

else if ( $.PageArray[ii][1] === 'Desc' ) { //Special nummer, IP in cell (test)
             var vlabel=     $.PageArray[ii][2];             // cell number from HTML layout
             var vdesc=        $.PageArray[ii][3];
  	     //$('#'+vlabel).html( '<div style='+vattr+'>'+vdata+'</div>');
             $('#desc_'+vlabel).html(vdesc);
	
Image
Image
Rpi & Win x64. Using : cam's,RFXCom, LaCrosse, RFY, HuE, google, standard Lua, Tasker, Waze traveltime, NLAlert&grip2+,curtains, vacuum, audioreceiver, smart-heating&cooling + many more (= automate all repetitive simple tasks)
User avatar
G3rard
Posts: 669
Joined: Wednesday 04 March 2015 22:15
Target OS: -
Domoticz version: No
Location: The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by G3rard »

That's a nice solution for the div's.
I was using an other approach, but yours is better so I have used that one.

I have only moved the styling of the div (style="height: 30%; float:top") in the html to the css files.
Not using Domoticz anymore
User avatar
G3rard
Posts: 669
Joined: Wednesday 04 March 2015 22:15
Target OS: -
Domoticz version: No
Location: The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by G3rard »

I have updated my frontpage.

I made among others the following changes:
- text with cell description changes according to the state (eg alarm on/off, sunrise/set)
- removed bounce effect (no vertical scrolling) on iPad
- use extra div's in the cells above (see also the post from zicht)
- various layout changes

I still want to add the possibility to operate the blinds (any suggestions are welcome).

I will share the files after I have done some checks and cleanup of the code.
frontpage-day.jpg
frontpage-day.jpg (231.63 KiB) Viewed 4808 times
frontpage-night.jpg
frontpage-night.jpg (152.55 KiB) Viewed 4808 times
Last edited by G3rard on Saturday 21 March 2015 23:56, edited 1 time in total.
Not using Domoticz anymore
Luuc_a
Posts: 24
Joined: Tuesday 16 July 2013 10:12
Target OS: Raspberry Pi / ODroid
Domoticz version: Beta
Contact:

Re: NEW frontpage.html - request comments

Post by Luuc_a »

zicht wrote: ...
That looks very nice. I'm looking forward to your code.

How does the frontpage work with z-wave dimmers? For now I use the latest version of JKimmel. And for my the dimmer function is not working.
When I increase or decrease the dimmer the value will become 15 or 1.
ThinkPad
Posts: 890
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by ThinkPad »

G3rard wrote:I have updated my frontpage.

I made among others the following changes:
- text with cell description changes according to the state (eg alarm on/off, sun up/down)
- removed bounce effect (no vertical scrolling) on iPad
- use extra div's in the cells above (see also the post from zicht)
- various layout changes

I still want to add the possibility to operate the blinds (any suggestions are welcome).

I will share the files after I have done some checks and cleanup of the code.
frontpage-day.jpg
frontpage-night.jpg
Really nice, please share your code, i can't wait to put it onto my tablet 8-)
I am not active on this forum anymore.
zicht
Posts: 251
Joined: Sunday 11 May 2014 11:09
Target OS: Windows
Domoticz version: 2023.1+
Location: NL
Contact:

Re: NEW frontpage.html - request comments

Post by zicht »

Just to share : i tried to make some code for Wind measurement for the FrontPage. It is just a draft so feel free to copy and/or optimize :)
I reads the description of the vdesc of the cell , if "Wind" is found it tries to convert the values to wind values that fit in a cell ( direction, speed + gust, like "NNW 17 + 0"

The description in the FrontPage_settings should be like : '22','Data', 'cell3_15', 'Woensdrecht Wind (m/s)','0','0','color:#666666;font-size:60%'],

Code: Select all

// get wind value if Wind is in vdesc
	var index = -1;
	var index = vdesc.indexOf("Wind");
	if (index >0 ) {
				var degrees = new String(vdata).split(";",6)[0];
				var degrees = new String(degrees).split(".",1)[0];
				var direction = new String(vdata).split(";",6)[1];
				var speed = new String(vdata).split(";",6)[2];
				var speed = speed/10;
				var gust = new String(vdata).split(";",6)[3];
				var temp1 = new String(vdata).split(";",6)[4];
				var temp2 = new String(vdata).split(";",6)[5];
				var vdata = direction+" "+speed+" + "+gust;
   			   }
Rpi & Win x64. Using : cam's,RFXCom, LaCrosse, RFY, HuE, google, standard Lua, Tasker, Waze traveltime, NLAlert&grip2+,curtains, vacuum, audioreceiver, smart-heating&cooling + many more (= automate all repetitive simple tasks)
User avatar
Iron Man
Posts: 17
Joined: Wednesday 05 March 2014 21:37
Target OS: Raspberry Pi / ODroid
Domoticz version:
Location: Netherland
Contact:

Re: NEW frontpage.html - request comments

Post by Iron Man »

Hallo,

I’m also working on my Domoticz frontpage and I wanted to make a function to control my amplifier. I already have made many functions to control in written in Python code.
So my question is does anybody know how I can launch the python codes (located on my Raspberry Pi) from the frontpage.html webpage?

This is how the python code looks like:

Code: Select all

#!/usr/bin/python

import socket

# set host and port
HOST = 'IP amplifier'
PORT = 23

# connect to Denon
s = socket.socket( socket.AF_INET, socket.SOCK_STREAM)
s.connect((HOST, PORT))

# Send Command - Denon - Power On
s.sendall("PWON\r")

# disconnect from Denon
s.close()

# Delay Timer 10 Sec
time.sleep(10)
return
Kind regards,
Iron Man
ThinkPad
Posts: 890
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: NEW frontpage.html - request comments

Post by ThinkPad »

You can call the script from the on/off actions of a virtual switch. That virtual switch can be placed on the frontpage.html
But this only works for turning the amplifier on/off. For other functions like volume you will need a Lua script or something.

But lucky you, someone with a Denon already has made a script for that: http://gathering.tweakers.net/forum/lis ... 8#43697408 ;)

P.S. Further questions about creating scripts to control your amplifier fit better in a own topic, in the 'Scripts' subforum.
I am not active on this forum anymore.
User avatar
Iron Man
Posts: 17
Joined: Wednesday 05 March 2014 21:37
Target OS: Raspberry Pi / ODroid
Domoticz version:
Location: Netherland
Contact:

Re: NEW frontpage.html - request comments

Post by Iron Man »

@ThinkPad

Thanks for the fast replay. But the scripts are not the problem I already wrote them also for the volume channelling between input channels. And before I also used Domoticz virtual switches to trigger these python codes, but my domoticz got slower and slower after adding to much commands.

Lately I’m rewritten my frontpage.html and I was thinking to add the possibilities to control my Denon amplifier. But to do that I need to connect a button on my frontpage to the python code or at least launch the python code by pressing the button.
This way it is going besides my domoticz and won’t slow it down.

So do you think there is a way to accomplish this?
I also have been thinking to call for a shellscript that can launch the python code or a (external) php code that will launch the python code.

I hope you can help me with this.

Kind regards,
Iron Man
Post Reply

Who is online

Users browsing this forum: No registered users and 0 guests