NEW frontpage.html - request comments

[madrian]

Anybody can help me with a code for LightWaveRF dimmer? It's a 32step dimmer.

Code: Select all

{}
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "Set Level: 28 %",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 3,
         "HardwareName" : "LED",
         "HardwareType" : "Dummy (Does nothing, use for virtual switches only)",
         "HardwareTypeVal" : 15,
         "HaveDimmer" : true,
         "HaveGroupCmd" : true,
         "HaveTimeout" : false,
         "ID" : "0C0708",
         "Image" : "Light",
         "IsSubDevice" : false,
         "LastUpdate" : "2017-01-09 21:50:25",
         "Level" : 28,
         "LevelInt" : 9,
         "MaxDimLevel" : 32,
         "Name" : "BEDLED",
         "Notifications" : "false",
         "PlanID" : "4",
         "PlanIDs" : [ 4 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "Status" : "Set Level: 28 %",
         "StrParam1" : "",
         "StrParam2" : "",
         "SubType" : "LightwaveRF",
         "SwitchType" : "Dimmer",
         "SwitchTypeVal" : 7,
         "Timers" : "false",
         "Type" : "Lighting 5",
         "TypeImg" : "dimmer",
         "Unit" : 15,
         "Used" : 1,
         "UsedByCamera" : false,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "31"
      },

This formula works for minus button: var d = Math.round((level / 100.0) * 32);, but what about plus button?

[jannl]

Hi:)
How are you guys installing any frontpage to your Raspi Domoticz interface?

I have tried to Download this (among other frontpages) packages.
Unzip on computer
Edit config and or other file to correct IP adress, Port, User&Password etc.
Load all the files into www folder with a subfolder with filezilla
enter: http://ip:port/folder (with no success)
also tried "..folder/" and "..folder/index.htm" and "..index.htm/". Also with no success.

Do i need to do this differently?

Sincerely
John

My frontpage is called with: http://ip;port/frontpage.html

[Trigun]

Hi,

first of all, its great to see how the frontpage evolves. I've been following this topic for a while and you guys are doing an amazing job!
I am working with a frontpage as well but I am wondering if there is a chance anyone has figured out how to put a multi selector switch in frontpage?

I hope anyone can help.

thanks in advance!

[lvsigo]

Hi, try this

https://github.com/vil1driver/monitor

selector is full working, and most over things

[Trigun]

Hi, try this

https://github.com/vil1driver/monitor

selector is full working, and most over things

Hi,

thank you for the reply allthough my french it not as good I am not sure where to find the multi selector info.
can you please tell me where to find this?

thnx!

[G3rard]

@Trigun
I have implemented the selector switch in the frontpage.
https://github.com/gerard33/frontpage/c ... d6ce9c4cd6

It's using the code which racquemis provided.
http://www.domoticz.com/forum/viewtopic ... 017#p89405

[Trigun]

@Trigun
I have implemented the selector switch in the frontpage.
https://github.com/gerard33/frontpage/c ... d6ce9c4cd6

It's using the code which racquemis provided.
http://www.domoticz.com/forum/viewtopic ... 017#p89405

Hi G3rard,

Thank you your effort to reply.
I am going to implement it right away!
am I correct to assume that switching between options is via "+" and "-" ?

Thanks again G3rard, much appreciated!

Cheers.

[ropske]

I've edited the post with the instructions to make it more foolproof, also i forget to add one line of code.
See if you can get it working now, if not use my frontpage.js i have attached to that post.

Thank you so much for this racquemis
I've done all what you have explained and this is working on my brower (Edge and Firefox) on my laptop.

If i open my browser (Safari) (i also installed Firefox and chroome to test) on my iPad, i can see the sliders, and they look beautifull.
But when i want to move the slider, it's impossible, the slider stays fixed at it's position.
Also when pressing the slider to a position (instead of moving the slider) it's not working.
You have any idea why this could come?

Thank you again!

[cyberclwn]

Hi Guys,

I'm trying to make my own "frontpage" too.
Well actually to have a mini-version with mostly only temperatures on my PhotoFrame (pi with touch-screen) when i just woke up.
But i want 2 switches on it also.

The displaying works really great, but i can't get the switches to work. I have searched the posts and forum but i can't find the solution to get the switches to work

I have added the switchclick bit:

Code: Select all

switchclick='';
if (vdata == 'Off' ) {
	switchclick = 'onclick="SwitchToggle('+item.idx+', \'On\');"';
}
if (vdata == 'On' ) {
	switchclick = 'onclick="SwitchToggle('+item.idx+', \'Off\');"';
}
$('#'+vlabel).html(vdata);

Also added the function at the bottom of the file:

Code: Select all

function SwitchToggle(idx, switchcmd)
{
        console.log('function called');
        $.ajax({
        url: "json.htm?type=command&param=switchlight" + "&idx=" + idx + "&switchcmd=" + switchcmd + "&level=0",
        async: false,
        dataType: 'json',
        success: function(){
                console.log('SUCCES');
        },
        error: function(){
                console.log('ERROR');
        }
        });
        RefreshData();
}

The switches show up on the page, and they are displaying "On" or "Off" but they are not doing anything.

[cyberclwn]

Ok, i partially solved it, i was missing the script at the top

Code: Select all

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

But now i get 404-erros like

Code: Select all

http://<ip>:<port>/undefined/json.htm?type=devices&plan=undefined&jsoncallback=jQuery111003160575170475055_1484260269839&format=json&_=1484260269840

Don't get where the "undefined" is coming from, the $.domoticzurl is set correctly, also is the "$.roomplan".

And when i change the url-string to just 1, without variables

Code: Select all

var jurl= "http://<ip>:<port>/json.htm?type=devices&plan=12&jsoncallback=?";

I get the error that "$.PageArray " not exists ...
Hmm, i might have some layout issues, altho i checked that many times... i'll keep on struggling .. maybe i better start over

[Trigun]

Ok, i partially solved it, i was missing the script at the top

Code: Select all

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

But now i get 404-erros like

Code: Select all

http://<ip>:<port>/undefined/json.htm?type=devices&plan=undefined&jsoncallback=jQuery111003160575170475055_1484260269839&format=json&_=1484260269840

Don't get where the "undefined" is coming from, the $.domoticzurl is set correctly, also is the "$.roomplan".

And when i change the url-string to just 1, without variables

Code: Select all

var jurl= "http://<ip>:<port>/json.htm?type=devices&plan=12&jsoncallback=?";

I get the error that "$.PageArray " not exists ...
Hmm, i might have some layout issues, altho i checked that many times... i'll keep on struggling .. maybe i better start over

Hi Cyberclwn,

Perhaps it is an idea to use G3rards frontpage and edit it to you liking.
This way you don't have to worry about scripts not or partially being present.

Maybe it helps, it did for me

Grtz.

[racquemis]

I've edited the post with the instructions to make it more foolproof, also i forget to add one line of code.
See if you can get it working now, if not use my frontpage.js i have attached to that post.

Thank you so much for this racquemis
I've done all what you have explained and this is working on my brower (Edge and Firefox) on my laptop.

If i open my browser (Safari) (i also installed Firefox and chroome to test) on my iPad, i can see the sliders, and they look beautifull.
But when i want to move the slider, it's impossible, the slider stays fixed at it's position.
Also when pressing the slider to a position (instead of moving the slider) it's not working.
You have any idea why this could come?

Thank you again!

Does the frontpage generate any errors when using the sliders on your laptops browser?
If not you could try adding a z-index to the div containing the slider to make it appear on top.
Not sure it that would work.

I did found this:
http://stackoverflow.com/questions/2684 ... ick-on-ios
Try and see if it works

[ropske]

I've edited the post with the instructions to make it more foolproof, also i forget to add one line of code.
See if you can get it working now, if not use my frontpage.js i have attached to that post.

Thank you so much for this racquemis
I've done all what you have explained and this is working on my brower (Edge and Firefox) on my laptop.

If i open my browser (Safari) (i also installed Firefox and chroome to test) on my iPad, i can see the sliders, and they look beautifull.
But when i want to move the slider, it's impossible, the slider stays fixed at it's position.
Also when pressing the slider to a position (instead of moving the slider) it's not working.
You have any idea why this could come?

Thank you again!

Does the frontpage generate any errors when using the sliders on your laptops browser?
If not you could try adding a z-index to the div containing the slider to make it appear on top.
Not sure it that would work.

I did found this:
http://stackoverflow.com/questions/2684 ... ick-on-ios
Try and see if it works

Thanks for the update,

but where exactly do i need to put this?

Code: Select all

var hlp = '<div style="position:relative;z-index=1000;top:-4px;font-size:initial;line-height:initial"><input onmousedown="startCountToWhite(this.value,' + item.idx + ')" onmouseup="stopCountToWhite()" style="position:relative;top:4px" type="range" min="0" max="' + item.MaxDimLevel +'" value="'+ vdimmercurrent +'" step="2" onChange="ChangeStatus100(this.value,'+item.idx+')" /></div>';
                     hlp = hlp + '<div style="position:relative;z-index=1000;top:-6px;font-size:initial;line-height:initial"><input style="position:relative;top:4px;-webkit-appearance: none;background: white;background: -webkit-linear-gradient(left, hsl(0,100%,50%),hsl(60,100%, 50%), hsl(120,100%, 50%), hsl(180, 100%, 50%), hsl(240,100%,50%),hsl(300,100%,50%),hsl(360,100%,50%));height:5px" type="range" min="0" max="360" value="' + hue_array[item.idx] +'" step="1" onChange="ChangeHue(this.value,' + vdimmercurrent + ','+item.idx+',24)" /></div>';
                     

[cyberclwn]

Perhaps it is an idea to use G3rards frontpage and edit it to you liking.
This way you don't have to worry about scripts not or partially being present.

Hey,

I'm a bit of stubborn guy that wants to understand what is going on and trying to understand what i am doing.
But in this case i don't get it

So i reverted it back to without the switches. That way i know what i have, and can change it myself.

If anyone have an idea why the switchtoggle isn't working, let me know.
For now i give up and remove that bit from my page.

[ubfssF]

A question before I install this frontpage: will it be visible from the outside world?

I use Domoticz with a port forwarding in my router (with SSL) to port 443 to the Domoticz-PC and the built-in webserver is serving the Domoticz pages. I have the basic authentication "on", so that only with a password one is able to use Domoticz from outside my LAN.

I am wandering whether someone can access the frontpage by using the URL of the Domoticz-server and then the frontpage, without having to use the password. So, in my case something like:

Code: Select all

https://xxxxxx.asuscomm.com/frontpage.html

That would break the security of the basic authentication of Domoticz.....

[Trigun]

Hi all, perhaps this has been asked before.
I am using g3rards front page and everything work perfect but it is not responsive for iPhone.
Does anyone know how I can change this?

Thnx all!


Sent from my iPad using Tapatalk

[BarryT]

...
However, I would like to adjust the frontpage so it will be full screen on my tablet (1920x1200).

I also want to change the screen res. in order to run on my tablet.

+1

[G3rard]

Hi all, perhaps this has been asked before.
I am using g3rards front page and everything work perfect but it is not responsive for iPhone.
Does anyone know how I can change this?
Thnx all!

Then you have to change the HTML/CSS code, see for example https://dzone.com/articles/using-csshtm ... responsive.
But I think the frontpage is not easy to handle on a phone. You can have a look at Reacticz, that's working great on a phone.

[G3rard]

A question before I install this frontpage: will it be visible from the outside world?

I use Domoticz with a port forwarding in my router (with SSL) to port 443 to the Domoticz-PC and the built-in webserver is serving the Domoticz pages. I have the basic authentication "on", so that only with a password one is able to use Domoticz from outside my LAN.

I am wandering whether someone can access the frontpage by using the URL of the Domoticz-server and then the frontpage, without having to use the password. So, in my case something like:

Code: Select all

https://xxxxxx.asuscomm.com/frontpage.html

That would break the security of the basic authentication of Domoticz.....

If you install the frontpage in another folder then the Domoticz folder you won't have this problem.

[ubfssF]

OK, you probably mean to run apache or nginx then. I see