Page 8 of 66

Re: NEW frontpage.html - request comments

Posted: Thursday 22 January 2015 22:19
by ThinkPad
Maybe you 2 can work together at the code, at a service like http://www.codeshare.io .... And then post only when it is working correctly :P Or design something so the settings stay in an external file?

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 0:30
by floris74
Hi,
It's an awesome frontpage! i'm getting closer to the wife friendly frontend... :)
Thanks all you guys!!!

still got my problems with the thermostat.
It includes dimmer buttons (also for thermostats) and the optional indication of the 'last seen'.
See the read me file in the attachment.
['96','Status', 'cell8', 'Thermostaat','0','0.5'],
only result is the idx numer in green, with + and - buttons.

['96','SetPoint', 'cell2', 'Thermostaat','0','0.5'],
correct number of the temerature of the thermostat, in green :) But the + and - buttons doesnt change the setpoint... :cry:

I have a virtual thermostat. but that shouldn't be the problem i guess. any one can help?

Floris

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 7:28
by jannl
By placing console.log messages on some places, it is possible to check the value of variables. Please check frontpage.html for the correct syntax.

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 9:39
by bbqkees
floris74 wrote:Hi,

still got my problems with the thermostat.

['96','Status', 'cell8', 'Thermostaat','0','0.5'],
only result is the idx numer in green, with + and - buttons.

['96','SetPoint', 'cell2', 'Thermostaat','0','0.5'],
correct number of the temerature of the thermostat, in green :) But the + and - buttons doesnt change the setpoint... :cry:

I have a virtual thermostat. but that shouldn't be the problem i guess. any one can help?

Floris
You need to keep into acount that basically you can show the buttons next to any ID, even if it does not support dimming (or level change, as this is what the function does).

What happens when you press on the button, it sends the following command:
/json.htm?type=command&param=switchlight&idx=" + idx + "&switchcmd=Set%20Level&level=" + newvalue.

Edit:
I created a virtual setpoint device, I now see I need to send another command for those devices.
/json.htm?type=command&param=udevice&idx=93&nvalue=0&svalue=21.5
But I can fix that this weekend.


I think with a few more code iterations we will have a nice and complete general setup.

This weekend I will try to find time to also at least separate code/html from settings, in that way you only have to change 1 file to get the updates.

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 12:41
by mvveelen
I'm (again) trying to get those nice weather icons (called Skycons) into one of the div's. Source: https://github.com/darkskyapp/skycons

It uses an external .js file (Skycons.js) and in the html you can embed the image by using:

Code: Select all

<script src="skycons.js">

Code: Select all

 <script>
      var icons = new Skycons(),
          list  = [
            "clear-day", "clear-night", "partly-cloudy-day",
            "partly-cloudy-night", "cloudy", "rain", "sleet", "snow", "wind",
            "fog"
          ],
          i;

      for(i = list.length; i--; )
        icons.set(list[i], list[i]);

      icons.play();
    </script>
and finally (for example):

Code: Select all

<canvas id=cloudy width=64 height=64></canvas>
When I use this outside the div's, I can see the (animated) image, but when I use this in the piece of code like:

Code: Select all

if(vdata == 'Cloudy'){
vdata=new String(vdata).replace("Cloudy","<canvas id=cloudy width=64 height=64></canvas>");
}
It won't show me anything. Mind you, I already changed the colors to be sure I can see the image on the background.

jan_nl or bbqkees, can you guys help me out here?

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 13:18
by Skorpion
@mvveelen,

I see a typo in your code. "Mew" string must be new string. ;)

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 13:35
by bbqkees
Not sure if your idea with the fancy HTML5 stuff will work with the existing code anyway, but at least you need to close the canvas tag.

<canvas id=cloudy width=64 height=64></canvas>

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 13:40
by mvveelen
True, true....I made a typo :D and I already closed the canvas (will edit the post again). I'm typing this on my work-pc at the moment. With closing the canvas it doesn't show me anything. Do you think it can be implemented?

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 14:57
by bbqkees
You need to make sure that <canvas id="fog" width="64" height="64"></canvas>

comes BEFORE

<script src="skycons.js"></script>

<script>
var icons = new Skycons({"color": "pink"}),
list = [
"clear-day", "clear-night", "partly-cloudy-day",
"partly-cloudy-night", "cloudy", "rain", "sleet", "snow", "wind",
"fog"
],
i;
for(i = list.length; i--; )
icons.set(list, list);
icons.play();
</script>

AND you need to change the color because default is black, and then it works!

I will include it in the next version.

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 15:03
by mvveelen
bbqkees wrote:You need to make sure that <canvas id="fog" width="64" height="64"></canvas>

comes BEFORE

<script src="skycons.js"></script>

<script>
var icons = new Skycons({"color": "pink"}),
list = [
"clear-day", "clear-night", "partly-cloudy-day",
"partly-cloudy-night", "cloudy", "rain", "sleet", "snow", "wind",
"fog"
],
i;
for(i = list.length; i--; )
icons.set(list, list);
icons.play();
</script>

AND you need to change the color because default is black, and then it works!


I moved:

Code: Select all

<script src="skycons.js"></script>

    <script>
      var icons = new Skycons({"color": "pink"}),
          list  = [
            "clear-day", "clear-night", "partly-cloudy-day",
            "partly-cloudy-night", "cloudy", "rain", "sleet", "snow", "wind",
            "fog"
          ],
          i;
      for(i = list.length; i--; )
        icons.set(list[i], list[i]);
      icons.play();
    </script>
to the bottom, just before </body> and I already changed the color in the .js file to white. I still can only see the rain (in my example) outside the div's and not in the code (in the div's).
Did you test it in your code?

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 15:05
by mvveelen
bbqkees wrote:You need to make sure that <canvas id="fog" width="64" height="64"></canvas>

I will include it in the next version.
That would be great! Thanks!! You can even use the colored version and/or set the canvas-size. It look very nice......

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 16:43
by bbqkees
mvveelen wrote:
bbqkees wrote: Did you test it in your code?
Yes,
During lunchbreak, but only in an offline version. I have to check it this weekend in my own live setup.

Image

Re: NEW frontpage.html - request comments

Posted: Friday 23 January 2015 22:41
by floris74
Edit:
I created a virtual setpoint device, I now see I need to send another command for those devices.
/json.htm?type=command&param=udevice&idx=93&nvalue=0&svalue=21.5
But I can fix that this weekend.
i experimented with that, but after pressing the button it sets the setpoint to 0.0. i deleted the line, so i cant show the line.

It's so great that you, and others, are working on all of this so enthousiastic. Wish that i could help, but i cant program...

p.s. is your new format t big for 7" tablet? and the 2th page looks weird?
Before i had to scroll a little bit, so i looked up for a nice app, wich hide your navigation bar (and status bar) easily. i think it's a real must have for the 7" Nexus i have bought for 55 euro last week!

Floris

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 11:16
by jannl
You can save the page to your homescreen and use it more or less as an app, the bars are gone in that way.
There is code in frontpage to accomplish this.

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 13:02
by floris74
Jan_nl, Thanks. I already did that, but the little bar on top and bottom were stille there, so I had to scroll anyway vertical.

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 13:57
by jannl
Hm. Strange. The code for this is at least in my last upload..

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 14:12
by remb0
damn I downloaded al the files in this thread but still get 1 cloumn with al my devices :P

Is it an option to split userfiles and html ?
And the usersettings like Ip / webcam etc all centralised?
So we can replace one block of setting into the html of usersettings?

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 16:53
by mvveelen
Well, I think that is what jan_nl / bbqkees are already planning to do. I hope they will find the time today / early tomorrow, so we can modify the basic code a bit to fit our 'needs'. I'm very interested, and depending on how this all will turn out, I might buy myself a cheap tablet :D

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 17:39
by bbqkees
I have now split the entire thing in several files:

-frontpage.html (Contains all the html layout)
-frontpage2.css (Contains all styling)
-scripts.js (Contains all necessary scripts and functions)
And most important:
-settings.js (Contains all the settings you can change yourself)


I am having some difficulty with the swipe layout, for some reason I get 4 panels instead of 2.
So I am working on that now.

Also the skycons are not working correctly yet, but I am getting close.

I will make the skycons an option, because I don't like the moving icons in the otherwise 'plain' layout myself. :-)
Also I am going to make these skycons scale automatically depending if you put them in a large or a small cell.

I hope I can finish it al tomorrow.

Re: NEW frontpage.html - request comments

Posted: Saturday 24 January 2015 18:18
by remb0
Nice! I will try it when you are done. And also thinking of a cheap tablet.
I will place it in the hall. :)