FlatZ Frontpage

[leecollings]

I don't know if I'm doing something wrong, but I can't see how I can add the donut displays? I can show the data from an outside temperature.. but it doesn't show any donut chart, just the readout.

Code: Select all

['15', 'Temp', 'cell7', 'Outside Temp', 'outTemp'],

That's what's set in settings.js, but it just shows the data readout in the lower half of the long box.

[leecollings]

Don't worry, I figured it out.

I have another question now though. Is it possible to integrate the notifications with this display?

Maybe some kind of dialog box to popup in the centre of the screen with a customised view, maybe a text, along with a camera feed for a doorbell scenario?

[mvveelen]

I don't know if I'm doing something wrong, but I can't see how I can add the donut displays? I can show the data from an outside temperature.. but it doesn't show any donut chart, just the readout.

Code: Select all

['15', 'Temp', 'cell7', 'Outside Temp', 'outTemp'],

That's what's set in settings.js, but it just shows the data readout in the lower half of the long box.

Same here.

After a long period of not having the time to play with this, I finally downloaded the latest version and I'm having the same issue.

Also: the on/off for regular switches displays a slider. Is it possible to remove this?

Edit:

The image for the ventilation didn't show. I had to make a folder in the 'settings' folder like this: /settings/images/flatz/ and upload the images into it to be able to see the image. So this might be a little flaw I guess.

Edit 2:

In frontpage.html you can find the DONUT CHART parts. In it, there is something hard-coded like: "badkamer", "woonkamer" and "buiten". The thing is: I use "badkamer" and "woonkamer" so they worked. But for "buiten" I use another name. So when I renamed it in settings.js like this:

Code: Select all

    ['785', 'Temp', 'cell10', 'Temperatuur Garage', 'buiten', '#C0382B'],
    ['785', 'LastUpdate', 'cell100', 'Temperatuur Garage'],
    

it showed me the donut chart for the Garage. So maybe it's better to get the hard-coded pieces out?

[mvveelen]

Another thing:

I want to show the camera feed of my Foscam, but I don't know what to change.

The code for the feed (image) is:

http://192.168.0.18:88/CGIProxy.fcgi?cm ... assword&t=

But where, what....etc....?

[rgvandenbosch]

you have to change the settings.js to this for foscam:

['CELL', 'http://IPADDRESS:PORT/cgi-bin/CGIProxy.fcgi?cmd=snapPicture2&usr=USERNAME&pwd=PASSWORD!&', 'Description']

it would be something like

['cell8', 'http://192.168.0.33:88/cgi-bin/CGIProxy ... mypassword!&', 'Front door']

or in your case

['cell8', 'http://192.168.0.18:88/cgi-bin/CGIProxy ... Cameraname']

------

to the author: nice job!

[mvveelen]

That works, thanks!

[vodor]

This looks really slick I like it. Well done and thanks for sharing.

I am looking for an alternative dashboard I can run on a wall mounted tablet. I will try it out tonight and see what it looks like on the tablet.

One feature request that would be great is the domoticz alarm panel in one of the tabs. Then it would be really awesome.

[Sjaakios]

I really love this skin! Downloaded it yesterday, tweeked it left and right and its running beautifull! Thanks a lot for sharing. Keep up the good work!


Verzonden vanaf mijn iPad met Tapatalk

[mvd87]

Hi there! This dashboard is looking great on my pc, but unfortunately it doesnt show anything on Safari on my iPad. Anyone got a solution for that?

Also saw there is a commit ready to be merged by one contributer, would be good to have that.

[mvd87]

Never mind, I fixed that.

For anyone having the same: make sure your domiticz authentication is set to Basic-Auth and not Login page

[jap2slow]

I added code for data from Netatmo and other devices that give multiple results in one string - eg. "20 C, 45 %, 1234 hPA". Code strips this data, and data's labels ( "Temp + Humidity + Barometer") from json and give each one in this form:

<div class="Temp">20*C</div>



...

Hi
I am getting mad on how to define and pass multiple data like in the example above.

Starting from default, I have some questions...

should I change the frontpage.html to create a special cell?
How can I modify the image (like the megaphone one) to have others?
In the settings.js how should I pass the multiple value to be in the same cell?
is there a place in the code where it put hPa if type is Barometer, % if Humidity and so on?


I read the 3d but I haven't find it.

Thanks
Woody

I was wonderding the same thing, after some getto coding got it working

added this to the settings.js

Code: Select all

	['20', 'Data', 'cell91', 'Netatmo'], // Temp + Humidity + Baro
	['21', 'Data', 'cell92', 'Netatmo'], // Air Quality
	['22', 'Data', 'cell93', 'Netatmo'], // Db
	['20', 'LastUpdate', 'cell94', 'Netatmo'], // Updated

modified some lines in frontpage.html

Code: Select all

            <div class="col-sm-3 col-lg-3">
                <div class="dash-unit">
                    <dtitle id="desc_cell91"></dtitle>
                    <hr>
                    <div class="info-user">
                        <span aria-hidden="true" class="info-user"></span>
                    </div>
                    <div style="text-align:center;font-size: 20px" id="cell91"></div>
					<!--<br/>-->
					<div style="text-align:center;font-size: 20px" id="cell92"></div>
					<div style="text-align:center;font-size: 20px" id="cell93"></div>
					<br/>
                    <div class="text" id="cell94" style="float:right;padding-right:10px;font-size: 10px;color: #9E9E9E;" /></div>
                </div>

i edited out the SABNZBD to this code and commented out the PLEX space



i'm still figuring out all the styles and classes


only having a weird graph issue. it is getting values but not showing a line


just linked it to my Youless meter

Code: Select all

    ['1', 'counter&method=1', 'day', 'cell7', 'Zonnepanelen (Watt)', 'graph100', '#2980B9', 'v'],

Code: Select all

      {
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "Counter" : "80108.641",
         "CounterToday" : "9.587 kWh",
         "CustomImage" : 0,
         "Data" : "80108.641 kWh 767 Watt",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 2,
         "HardwareName" : "kw/h uless",
         "HardwareType" : "YouLess Meter with LAN interface",
         "HardwareTypeVal" : 6,
         "HaveTimeout" : false,
         "ID" : "80",
         "LastUpdate" : "2016-06-27 21:56:11",
         "Name" : "Youless kw/h",
         "Notifications" : "false",
         "PlanID" : "9",
         "PlanIDs" : [ 9 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "SubType" : "YouLess counter",
         "SwitchTypeVal" : 0,
         "Timers" : "false",
         "Type" : "YouLess Meter",
         "TypeImg" : "counter",
         "Unit" : 1,
         "Usage" : "767 Watt",
         "Used" : 1,
         "ValueQuantity" : "",
         "ValueUnits" : "",
         "XOffset" : "301",
         "YOffset" : "89",
         "idx" : "1"
      },

[Chrisiesmit93]

I am trying to connect the FlatZ site to Domoticz, but it seems it's not working.

In settings.js I have entered the IP of Domoticz and setup 1 of my Hue lights but the hue lights and the Logs page are not working...
Domoticz and FlatZ are on the same server (Domoticz on port 80, no security and FlatZ on port 8080, also no security).

Do I have to edit some more options to let it work?
I also followed the example as described in post #1, but nothing is working

[wm62]

Anyone figured out how to change the icons ?
I like this very much , but would like to user my own icons for lights and blinds....

[sorampage]

Hello all,

I use your frontpage (Very great design !), but i have a problem for user "News" ...
I can't display any informations ....

Someone can help me ?

[Fainted]

@sorampage

You have do change under menu settings, news should be true

//Menu settings
$.Graph = true; //false or true
$.News = false; //false or true
$.Log = true; //false or true
$.Lights = true; //false or true
$.Weather = true; //false or true
$.Camera = false; //false or true
$.Traffic = true; //false or true

[Fainted]

Great work galadril!

Is there any chance that the security panel could be implemented in a nice way in your frontpage? I unfortunatly don't have the skills.

And if I may have one more suggestion I would love to see my google calender in the home page, what do you think, good idea? hard to implement?

[sorampage]

@Fainted
Thx ..! It's work .. It was AdBlock ...

[g0dz0r]

I really like this frontpage but after searching for more then half a day I can't seem to find a solution to an annoying problem. If I load the frontpage from outside my own lan it doesn't show switches or anything. Just displays the page and that's it.

What do I have to change to get switches visible outside of my own lan?

[johansson]

Great approach, looks great! I've been looking for a solution to gather the all main data into one dashboard, including e.g. switches, temperatures, traffic and train details etc; so far the best alternative I've found.

After several hours of fiddling with the dashboard, most of the external stuff (traffic, cameras and so on) are in place, but no Domoticz switches or temperatures. Cannot figure out what's wrong, maybe you guys could help out. For example, a switch from json:

Code: Select all

"AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "Off",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 2,
         "HardwareName" : "RFXCom",
         "HardwareType" : "RFXCOM - RFXtrx433 USB 433.92MHz Transceiver",
         "HardwareTypeVal" : 1,
         "HaveDimmer" : true,
         "HaveGroupCmd" : true,
         "HaveTimeout" : false,
         "ID" : "0F7E8A2",
         "Image" : "Light",
         "IsSubDevice" : true,
         "LastUpdate" : "2016-10-04 13:08:46",
         "Level" : 0,
         "LevelInt" : 0,
         "MaxDimLevel" : 15,
         "Name" : "Block",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : "-",
         "Status" : "Off",
         "StrParam1" : "",
         "StrParam2" : "",
         "SubType" : "AC",
         "SwitchType" : "On/Off",
         "SwitchTypeVal" : 0,
         "Timers" : "false",
         "Type" : "Lighting 2",
         "TypeImg" : "lightbulb",
         "Unit" : 1,
         "Used" : 1,
         "UsedByCamera" : false,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "13"

That inserted into the switches section in settings.js should be:

Code: Select all

    ['13', 'Data', 'cell1', 'Block', 'onbutton'],//onbutton = only push on

But nothing, I've tried all the options I could figure out with no luck.

Same goes with my thermometers:

Code: Select all

"AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 100,
         "CustomImage" : 0,
         "Data" : "8.3 C",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 2,
         "HardwareName" : "RFXCom",
         "HardwareType" : "RFXCOM - RFXtrx433 USB 433.92MHz Transceiver",
         "HardwareTypeVal" : 1,
         "HaveTimeout" : false,
         "ID" : "8800",
         "LastUpdate" : "2016-10-04 15:42:02",
         "Name" : "Outer_temp",
         "Notifications" : "false",
         "PlanID" : "0",
         "PlanIDs" : [ 0 ],
         "Protected" : false,
         "ShowNotifications" : true,
         "SignalLevel" : 7,
         "SubType" : "Viking 02811/02813, Proove TSS330",
         "Temp" : 8.300000000000001,
         "Timers" : "false",
         "Type" : "Temp",
         "TypeImg" : "temperature",
         "Unit" : 0,
         "Used" : 1,
         "XOffset" : "0",
         "YOffset" : "0",
         "idx" : "12"

That in other devices should look something like:

Code: Select all

      ['12', 'Temp', 'cell10', 'Ulkolampo', 'Ulko', '#C0382B'],

Again, nothing anywhere but don't know where's the problem.

Even the log page is empty, maybe there's an issue the Domoticz connection. Or something. Any advice would be highly appreciated.

[Btje]

First of al great theme.

When i load the frontpage I see the light toggles I added but when swithcing to an other tab they dissapear?

Trafic shows "oops something went wrong"