Dashticz, alternative dashboard based on HTML, CSS, jQuery
Moderators: leecollings , htilburgs , robgeerts
Luppie
Posts: 16 Joined: Thursday 08 October 2015 14:23
Target OS: Raspberry Pi / ODroid
Domoticz version: LastBeta
Location: Netherlands
Contact:
Post
by Luppie » Friday 18 May 2018 14:10
I also disabled block by block starting in column 2 until I ended up in column1.
Only if both columns are disabled I have a low CPU consumption.
Raspberry Pi2B | RFLink | MySensors Gateway | 18B20 | P1 | 9x KaKu Old | 3x Kaku New | KaKu PIR | 2x Flamingo Smoke Detector | Chuango PIR | Chuango Door Contact |3x Chinese Therm. Hum. Sensor | 2x SelectPlus DoorBell |
RPi 7" Touch Control Panel
astrapowerrr
Posts: 141 Joined: Tuesday 31 January 2017 20:34
Target OS: -
Domoticz version:
Contact:
Post
by astrapowerrr » Monday 21 May 2018 8:33
Martijn85 wrote: ↑ Wednesday 26 April 2017 16:01
This is mine:
config.js
Spoiler: show var _LANGUAGE = 'nl_NL';
var _HOST_DOMOTICZ = 'http://192.168.x.x:8080 ';
var _DOMOTICZ_REFRESH = 5; //in seconds
var _HOST_ZIGGO_HORIZON = 'http://192.168.x.x/dasboard/switch_horizon.php ';
var _APIKEY_WUNDERGROUND = 'xxx';
var _WEATHER_CITY = 'Sneek';
var _WEATHER_CITYNAME = ''; //show a different city name, leave empty if same as _WEATHER_CITY
var _WEATHER_COUNTRY = 'NL';
var _USE_AUTO_POSITIONING = false; //don't want to configure positions, use auto positioning
var _USE_FAVORITES = false; //only used when using auto positioning
var _HIDE_SECONDS_IN_CLOCK = true; //do not show the seconds in the clock
var _HIDE_MEDIAPLAYER_WHEN_OFF = false; //when you have a mediaplayer connected, hide it if nothing is playing
var _NEWS_RSSFEED = 'https://crossorigin.me/http://feeds.fee ... ers/nieuws ';
var _USE_FAHRENHEIT = false;
var _USE_BEAUFORT = true; //Bft instead of m/s
var _TRANSLATE_SPEED = false; //windspeed, north northwest instead of NNW
var _STANDBY_AFTER_MINUTES = 5;
var _SCROLL_NEWS_AFTER = 7000; //milliseconds, so 7000 is 7 seconds
var _SHOW_LASTUPDATE = false;
var _LASTUPDATE_FORMAT = 'DD-MM-YY HH:mm';
var _SCREENSLIDER_EFFECT = 'slide'; //'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'
var _APIKEY_MAPS = 'xxx';
var _MAPS_LATITUDE = xxx;
var _MAPS_LONGITUDE = xxx;
var _MAPS_ZOOMLEVEL = 8;
var buttons = {}
buttons.buienradar = {width:12, isimage:true, image: 'http://api.buienradar.nl/image/1.0/Rada ... =445&h=296 ', url: 'http://www.weer.nl/verwachting/nederland/son/189656/ '}
buttons.radio = {width:12, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm '}
buttons.nunl = {width:12, icon: 'fa-newspaper-o', title: 'Nu.nl', url: 'http://www.nu.nl '}
/*
CUSTOM POSITIONING:
*/
var blocks = {}
blocks[314] = {}
blocks[314]['width'] = 3;
blocks[322] = {}
blocks[322]['width'] = 3;
blocks[348] = {}
blocks[348]['width'] = 6;
blocks[349] = {}
blocks[349]['width'] = 6;
blocks[350] = {}
blocks[350]['width'] = 6;
blocks[334] = {}
blocks[334]['width'] = 3;
blocks[335] = {}
blocks[335]['width'] = 3;
blocks[336] = {}
blocks[336]['width'] = 3;
blocks[337] = {}
blocks[337]['width'] = 3;
blocks[17] = {}
blocks[17]['width'] = 3;
blocks[23] = {}
blocks[23]['width'] = 3;
blocks[231] = {}
blocks[231]['width'] = 3;
blocks[242] = {}
blocks[242]['width'] = 3;
blocks[507] = {}
blocks[507]['icon'] = 'fa-moon-o';
blocks[26] = {}
blocks[26]['icon'] = 'fa-home';
blocks[26]['width'] = 3;
blocks[511] = {}
blocks[511]['icon'] = 'fa-apple';
blocks[511]['width'] = 3;
blocks[513] = {}
blocks[513]['icon'] = 'fa-android';
blocks[513]['width'] = 3;
blocks[472] = {}
blocks[472]['icon'] = 'fa-tv';
blocks[472]['width'] = 3;
blocks['blocktitle_1'] = {}
blocks['blocktitle_1']['type'] = 'blocktitle';
blocks['blocktitle_1']['title'] = 'Schakelaars';
blocks['blocktitle_2'] = {}
blocks['blocktitle_2']['type'] = 'blocktitle';
blocks['blocktitle_2']['title'] = 'Toon';
blocks['blocktitle_3'] = {}
blocks['blocktitle_3']['type'] = 'blocktitle';
blocks['blocktitle_3']['title'] = 'Status';
blocks['blocktitle_4'] = {}
blocks['blocktitle_4']['type'] = 'blocktitle';
blocks['blocktitle_4']['title'] = 'HDD verbruik';
blocks['blocktitle_5'] = {}
blocks['blocktitle_5']['type'] = 'blocktitle';
blocks['blocktitle_5']['title'] = 'Weer';
var columns = {}
columns[1] = {}
columns[1]['blocks'] = ['blocktitle_1',348,349,350,314,322,'blocktitle_2',336,335,334,337,340,341,'blocktitle_4',17,23,231,242]
columns[1]['width'] = 5;
columns[2] = {}
columns[2]['blocks'] = ['clock','sunrise','horizon',buttons.buienradar,'trafficmap','news']
columns[2]['width'] = 2;
columns[3] = {}
columns[3]['blocks'] = ['blocktitle_5','weather',481,482,483,11,'blocktitle_3',456,459,507,26,511,513,472]
columns[3]['width'] = 5;
//var columns_standby = {}
//columns_standby[1] = {}
//columns_standby[1]['blocks'] = ['clock','currentweather_big','weather']
//columns_standby[1]['width'] = 12;
var screens = {}
screens[1] = {}
screens[1]['background'] = 'bg6.jpg';
//screens[1]['background_morning'] = 'bg_morning.jpg';
//screens[1]['background_noon'] = 'bg_noon.jpg';
//screens[1]['background_afternoon'] = 'bg_afternoon.jpg';
//screens[1]['background_night'] = 'bg_night.jpg';
screens[1]['columns'] = [1,2,3]
dashboard.jpg
If I use the idx of my toon Electra I get 5 buttons and like you have.
How do you select what you want on your dashboard and what not.
Now I get energie verbruik ,energie verbruik vandaag, energie verbruik totaal,
P1 totaal,p2 totaal.
I only want energie vandaag. And maybe in graph to.
How did you filter? Or did you do this in domoticz?
Greets marco
EdwinK
Posts: 1820 Joined: Sunday 22 January 2017 21:46
Target OS: Raspberry Pi / ODroid
Domoticz version: BETA
Location: Rhoon
Contact:
Post
by EdwinK » Monday 21 May 2018 9:39
You can use 'idx_1' to 'idx_5' to select your buttons
Running latest BETA on a Pi-3 | Toon® Thermostat (rooted) | Hue | Tuya | IKEA tradfri | Dashticz V3 on Lenovo Huawei Tablet | Conbee
astrapowerrr
Posts: 141 Joined: Tuesday 31 January 2017 20:34
Target OS: -
Domoticz version:
Contact:
Post
by astrapowerrr » Monday 21 May 2018 22:35
EdwinK wrote: ↑ Monday 21 May 2018 9:39
You can use 'idx_1' to 'idx_5' to select your buttons
Thanks. That did the trick.
Do you also maybe know how to make a graph of verbruik vandaag?
I now use 'graph_idx' but that gives me a graph with totaal verbruik as topic and the graph gives me all the 5 idxes in one graph. I would like my p1 low and and my p1 high in one graph.
One single line that starts with the low en follows with the high...
My graph now...
Luppie
Posts: 16 Joined: Thursday 08 October 2015 14:23
Target OS: Raspberry Pi / ODroid
Domoticz version: LastBeta
Location: Netherlands
Contact:
Post
by Luppie » Tuesday 22 May 2018 20:28
Luppie wrote: ↑ Thursday 17 May 2018 20:39
Is there a way to limit the amount of API calls to Wunderground ?
Right now I have 760 API calls/day, that is an average of every 2 minutes a call, while my WU developer license only allows 500 API calls.
Any ideas on this one ?
Every day that I'm using Dashticz now, it costst me one Raindrop. Resulting that I have to stop my weather forcast within 25 days
BTW, Weather Underground only reports when I exceed the 500 API calls, not that it is exceding with +/- 750 ~ 800 API Calls a day.
Is there a way to limit the amount of API calls to Wunderground ?
Raspberry Pi2B | RFLink | MySensors Gateway | 18B20 | P1 | 9x KaKu Old | 3x Kaku New | KaKu PIR | 2x Flamingo Smoke Detector | Chuango PIR | Chuango Door Contact |3x Chinese Therm. Hum. Sensor | 2x SelectPlus DoorBell |
RPi 7" Touch Control Panel
Luppie
Posts: 16 Joined: Thursday 08 October 2015 14:23
Target OS: Raspberry Pi / ODroid
Domoticz version: LastBeta
Location: Netherlands
Contact:
Post
by Luppie » Thursday 31 May 2018 22:13
Any help on this one is appreciated, still 20 day's left for me.
As a workaround I have enabled the standby-screen where I dont use any weather underground widgets, so the API calls now are limited to 440 calls/day.
I also have a new issue with showing my calendar. The dashboard loads and shows the calendar button. When pressed an empty (white) popup shows.
In developer-mode I see the following error:
Code: Select all
(index):1 Refused to display 'https://calendar.google.com/calendar/r' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
Raspberry Pi2B | RFLink | MySensors Gateway | 18B20 | P1 | 9x KaKu Old | 3x Kaku New | KaKu PIR | 2x Flamingo Smoke Detector | Chuango PIR | Chuango Door Contact |3x Chinese Therm. Hum. Sensor | 2x SelectPlus DoorBell |
RPi 7" Touch Control Panel
yfands
Posts: 67 Joined: Monday 04 July 2016 10:16
Target OS: Raspberry Pi / ODroid
Domoticz version: latest B
Location: Netherlands
Contact:
Post
by yfands » Monday 04 June 2018 1:29
Hello,
Been a while that I updated Dashticz, I still run a version from november 2017, but it suits me and made some modifications to my liking.
But exploring the latest beta versions I see some nice additions and bugfixes. Downloaded beta version 2.3.5.
Here is my problem:
In my old version if I look at my temperature/hygro values I could see the values/last update time change every 40 seconds. (set in config.js domoticz 40 dashticz with a value of 60) even if the temp/hygro values remain the same the last update time will change..
In version 2.3.5 I dont see anything happen no change in values/ last update time, no page refresh at all!!. The settings in config.js are the same as in my old version. The only refresh of the page I get is if I 'manualy' flip a switch. The entire page will be updated and so of course also the temp/hygro value (if changed) and last update time..
What do/did I miss ?, I cant find anything relevant on the forum or the wiki,
Regards
Frank
Lokonli
Posts: 2262 Joined: Monday 29 August 2016 22:40
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:
Post
by Lokonli » Monday 04 June 2018 16:06
Hi Frank, yfands
For me it's running fine with latest beta (I've installed yesterday's version).
yfands
Posts: 67 Joined: Monday 04 July 2016 10:16
Target OS: Raspberry Pi / ODroid
Domoticz version: latest B
Location: Netherlands
Contact:
Post
by yfands » Monday 04 June 2018 20:23
Hai Lokonli,
Thanks for the reply, I figured it was not the beta version. But even not even on linux or windows platform the page would refresh.
attached is the most basic version of the config.js Get al the sensors from Domoticz and display them.
Maybe you can take a look and see something I missed.
Code: Select all
var config = {}
config['domoticz_ip'] = 'http://xxx.xxx.xxx.xxx:xxxx';
config['user_name'] = '';
config['pass_word'] = '';
config['app_title'] = 'Dashticz';
config['room_plan'] = '0';
config['domoticz_refresh'] = '45';
config['dashticz_refresh'] = '120';
config['default_news_url'] = 'http://www.nu.nl/rss/algemeen';
config['news_scroll_after'] = '7';
config['theme'] = 'default';
config['background_image'] = 'img/bg2.jpg';
config['standby_after'] = '0';
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '10';
config['auto_slide_pages'] = '';
config['slide_effect'] = 'slide';
config['standard_graph'] = 'hours';
config['language'] = 'en_US';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'en_US';
config['calendarurl'] = '';
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = '';
config['gm_zoomlevel'] = '';
config['gm_latitude'] = '';
config['gm_longitude'] = '';
config['speak_lang'] = 'en-US';
config['wu_api'] = '';
config['wu_city'] = 'Amsterdam';
config['wu_name'] = '';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = '';
config['switch_horizon'] = '';
config['host_nzbget'] = '';
config['spot_clientid'] = '';
config['sonarr_url'] = '';
config['sonarr_apikey'] = '';
config['sonarr_maxitems'] = '';
config['garbage_company'] = '';
config['garbage_icalurl'] = '';
config['google_api_key'] = '';
config['garbage_calendar_id'] = '';
config['garbage_zipcode'] = '';
config['garbage_street'] = '';
config['garbage_housenumber'] = '';
config['garbage_housenumberadd'] = '';
config['garbage_maxitems'] = '';
config['garbage_width'] = '';
config['loginEnabled'] = '0';
config['no_rgb'] = '0';
config['auto_positioning'] = 1;
config['use_favorites'] = '0';
config['disable_googleanalytics'] = 1;
config['last_update'] = 1;
config['hide_topbar'] = '0';
config['edit_mode'] = '0';
config['hide_seconds'] = '0';
config['hide_seconds_stationclock'] = '0';
config['use_fahrenheit'] = '0';
config['use_beaufort'] = '0';
config['translate_windspeed'] = 1;
config['static_weathericons'] = '0';
config['hide_mediaplayer'] = '0';
config['garbage_hideicon'] = '0';
config['garbage_icon_use_colors'] = 1;
config['garbage_use_colors'] = '0';
config['garbage_use_names'] = '0';
config['garbage_use_cors_prefix'] = 1;
Lokonli
Posts: 2262 Joined: Monday 29 August 2016 22:40
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:
Post
by Lokonli » Tuesday 05 June 2018 21:05
yfands wrote: ↑ Monday 04 June 2018 20:23
Hai Lokonli,
Thanks for the reply, I figured it was not the beta version. But even not even on linux or windows platform the page would refresh.
attached is the most basic version of the config.js Get al the sensors from Domoticz and display them.
Maybe you can take a look and see something I missed.
Code: Select all
var config = {}
config['domoticz_ip'] = 'http://xxx.xxx.xxx.xxx:xxxx';
config['user_name'] = '';
config['pass_word'] = '';
config['app_title'] = 'Dashticz';
config['room_plan'] = '0';
config['domoticz_refresh'] = '45';
config['dashticz_refresh'] = '120';
config['default_news_url'] = 'http://www.nu.nl/rss/algemeen';
config['news_scroll_after'] = '7';
config['theme'] = 'default';
config['background_image'] = 'img/bg2.jpg';
config['standby_after'] = '0';
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '10';
config['auto_slide_pages'] = '';
config['slide_effect'] = 'slide';
config['standard_graph'] = 'hours';
config['language'] = 'en_US';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'en_US';
config['calendarurl'] = '';
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = '';
config['gm_zoomlevel'] = '';
config['gm_latitude'] = '';
config['gm_longitude'] = '';
config['speak_lang'] = 'en-US';
config['wu_api'] = '';
config['wu_city'] = 'Amsterdam';
config['wu_name'] = '';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = '';
config['switch_horizon'] = '';
config['host_nzbget'] = '';
config['spot_clientid'] = '';
config['sonarr_url'] = '';
config['sonarr_apikey'] = '';
config['sonarr_maxitems'] = '';
config['garbage_company'] = '';
config['garbage_icalurl'] = '';
config['google_api_key'] = '';
config['garbage_calendar_id'] = '';
config['garbage_zipcode'] = '';
config['garbage_street'] = '';
config['garbage_housenumber'] = '';
config['garbage_housenumberadd'] = '';
config['garbage_maxitems'] = '';
config['garbage_width'] = '';
config['loginEnabled'] = '0';
config['no_rgb'] = '0';
config['auto_positioning'] = 1;
config['use_favorites'] = '0';
config['disable_googleanalytics'] = 1;
config['last_update'] = 1;
config['hide_topbar'] = '0';
config['edit_mode'] = '0';
config['hide_seconds'] = '0';
config['hide_seconds_stationclock'] = '0';
config['use_fahrenheit'] = '0';
config['use_beaufort'] = '0';
config['translate_windspeed'] = 1;
config['static_weathericons'] = '0';
config['hide_mediaplayer'] = '0';
config['garbage_hideicon'] = '0';
config['garbage_icon_use_colors'] = 1;
config['garbage_use_colors'] = '0';
config['garbage_use_names'] = '0';
config['garbage_use_cors_prefix'] = 1;
Change
config['edit_mode'] = '0';
to
config['edit_mode'] = 0;
I'm not sure this is the intended behavior. Probably the other settings have to be verified as well ...
yfands
Posts: 67 Joined: Monday 04 July 2016 10:16
Target OS: Raspberry Pi / ODroid
Domoticz version: latest B
Location: Netherlands
Contact:
Post
by yfands » Thursday 07 June 2018 11:14
Hai Lokonli,
Spot on, config['edit_mode'] = 0 is correct and the page will refresh.
There is an error in the settings mode. If you save the config file via settingsmode config['edit_mode'] will be saved as '0' wich is a fault.
Also any streetname (config['garbage_street'] = 1blablabla) starting with a 1 like mine is treated as a number and the loading of the config will fail.
Thanks..
rldn
Posts: 16 Joined: Thursday 16 November 2017 20:02
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:
Post
by rldn » Thursday 07 June 2018 18:24
Can anyone explain how to change the popup size to fit the content? For example the security panel page is too wide and the height isnt big enough. How can i make this dynamic change for the content?
Danigympie
Posts: 3 Joined: Thursday 31 May 2018 13:38
Target OS: Windows
Domoticz version: 3.8153
Location: Netherlands
Contact:
Post
by Danigympie » Friday 08 June 2018 14:00
Thsi is how i made the dash. There are multiple slide witch are connected thrue a button. So swipping is possible but you can hit the burron and go straight to it.
1) 2 buttons 1 for home back to begin slide and the other one to set the alarm
2) If the alarm is on er off
3) Who is home is with ping to the smartphone. Red not home, green home or withing range of the router.
4) the buttons witch willl direct to that slide
5) Air quality (dutch only)
6) 2 Webcam small
7) Temp in dioffrent rooms and outside. Chage color when it get's a pre defined temperatuur. Green, orange or red
Home.jpg (291.77 KiB) Viewed 3833 times
When you push the button verlichting (lightning)
Verlichting.jpg (267.11 KiB) Viewed 3833 times
Config.js
Spoiler: show var config = {}
config['theme'] = '';
config['domoticz_ip'] = '';
config['user_name'] = '';
config['pass_word'] = '';
config['loginEnabled'] = 0;
config['app_title'] = ';
config['domoticz_refresh'] = '4';
config['dashticz_refresh'] = '60';
config['default_news_url'] = 'http://www.nu.nl/rss/algemeen ';
config['news_scroll_after'] = '7';
config['standby_after'] = 0;
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '30';
config['auto_slide_pages'] = 0;
config['slide_effect'] = 'flip';
config['standard_graph'] = 'month';
config['language'] = 'nl_NL';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'nl_NL';
config['calendarurl'] = 0;
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = '';
config['gm_zoomlevel'] = 15;
config['gm_latitude'] = ;
config['gm_longitude'] = ;
config['wu_api'] = '';
config['wu_city'] = '';
config['wu_name'] = '';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = 0;
config['switch_horizon'] = 1;
config['host_nzbget'] = '';
config['sonarr_url'] = '';
config['sonarr_apikey'] = '';
config['spot_clientid'] = '';
config['selector_instead_of_buttons'] = 0;
config['auto_positioning'] = 0;
config['use_favorites'] = 1;
config['last_update'] = 0;
config['hide_topbar'] = 1;
config['hide_seconds'] = 1;
config['hide_seconds_stationclock'] = 0;
config['use_fahrenheit'] = 0;
config['use_beaufort'] = 0;
config['translate_windspeed'] = 1;
config['static_weathericons'] = 1;
config['hide_mediaplayer'] = 0;
config['settings_icons'] = ["settings", "fullscreen"];
config['shortdate'] = 'D MMM';
config['longdate'] = 'D MMMM YYYY';
config['shorttime'] = 'HH:mm';
config['longtime'] = 'HH:mm:ss';
config['weekday'] = 'dddd';
config['no_rgb'] = 1;
config['standby_call_url'] = '' ;
config['standby_call_url_on_end'] = '' ;
config['longfonds_zipcode'] = '';
config['longfonds_housenumber'] = '';
//Ziggo horizon
var _HOST_ZIGGO_HORIZON = '';
//Trash options
var trashcan = {}
trashcan.afvalwijzer = { trashapp: 'mijnafvalwijzer', maxitems: 10, width:12, zipcode:'', housenumber:'' }
trashcan.recyclemanager = { trashapp: 'recyclemanager', width:12, zipcode:'', housenumber:'' }
//info bus 9292ov
var publictransport = {}
publictransport.ovinfobus= { show_via: false, station: '', provider: '9292-bus', icon: 'bus', width:6, results: 10 }
publictransport.ovinfotrein= { show_via: false, station: '', provider: '9292-train', icon: 'train', width:6, results: 10}
//treinen vertrek informatie webcam Valtho
var frames = {}
frames.treinen = {refreshiframe:30000,height:800,frameurl:"https://www.rijdendetreinen.nl/vertrekt ... ",width:10 }
frames.valtho = {refreshiframe:30000,height:195,frameurl:"https://www.skaping.com/valthorens/lamaison",width:5 }
frames.weer = {refreshiframe:30000,height:700,frameurl:"https://weerdata.weerslag.nl/image/1.0/ ... ",width:10 }
//TV gids
var tvguide = {}
tvguide.dutch = { key:'dutch', icon: 'fa-television', width:12, channels: [1,2,3,4,31,36,460,46,37,34,92,466], maxitems: 40 }
var calendars = {}
//calendars.f1 = { maxitems: 5, icalurl: 'https://www.gpupdate.net/en/calendar/27 ... -calendar/ ' }
calendars.f1 = {maxitems: 15, icon: '' , image: 'F1.png', icalurl:'webcal://www.gpupdate.net/nl/kalender/273/formul ... lendar.ics '}
calendars.google = {maxitems: 15, icon: 'fa-mars', image:'', icalurl:''}
//Stream players voor radio stations
var _STREAMPLAYER_TRACKS = [
{"track":1,"name":"Q-music","file":"http://icecast-qmusic.cdp.triple-it.nl/ ... ive_96.mp3 "},
{"track":2,"name":"Radio 2","file":"http://icecast.omroep.nl/radio2-bb-mp3 "},
{"track":3,"name":"Radio 538","file":"http://18973.live.streamtheworld.com/RADIO538.mp3 "},
{"track":4,"name":"Slam!","file":"http://stream.radiocorp.nl/web10_mp3 "},
{"track":5,"name":"100%NL","file":"http://stream.100p.nl/100pctnl.mp3 "},
];
//Buttons hier maak je de knoppen met link aan OOK voor camera links
var buttons = {}
buttons.buienradar = {width:12, isimage:true, image: 'https://api.buienradar.nl/image/1.0/Rad ... =0&forc=48 ', url: 'https://www.weeronline.nl/Europa/Nederland/ '}
buttons.calendar = {width:4, icon: 'fa-calendar', title: 'Kalender', url: 'https://www.formula1.com/sp/static/f1/2 ... r/ical.ics '}
buttons.radio = {width:4, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm '}
buttons.nunl = {width:4, icon: 'fa-newspaper-o', title: 'Nu.nl', url: 'http://www.nu.nl '}
buttons.nzbget = {width:4, icon: 'fa-download', title: 'NZBget', url: ''}
buttons.moon= {width:12, isimage:true, refreshimage:60000, image: 'moon'}
buttons.webcam1 = {width:6, isimage:true, image: '', url: ''}
buttons.webcam2 = {width:6, isimage:true, image: '', url: ''}
buttons.alarm = {key:'alarm', width:12, image: 'img/alarm2.png', title: 'Security Panel', url: 'secpanel.html'}
buttons.sonarr = {width:4, image: 'img/sonarr.png', title: 'Sonarr' ,slide:10 }
buttons.hoofdmenu = {width:12, image: 'img/main.png', title: 'Hoofdmenu' ,slide:0 }
buttons.huismodus = {width:4, image: 'img/home-icon.png', title: 'Huismodus' ,slide:1 }
buttons.trein = {width:4, image: 'img/trein.png', title: 'Trein',slide: 2}
buttons.verkeer = {width:4, image: 'img/verkeer.png', title: 'Verkeer' ,slide:3 }
buttons.verlichting = {width:4, image: 'img/Verlichting.png', title: 'Verlichting',slide: 4}
buttons.temperatuur = {width:4, image: 'img/temperatuur.png', title: 'Temperatuur' ,slide:5 }
buttons.webcam = {width:4, image: 'img/webcam.png', title: 'Webcam',slide: 6}
buttons.kalender = {width:4, image: 'img/calendar.png', title: 'Kalender' ,slide:7 }
buttons.tvgids = {width:4, image: 'img/tvgids2.png', title: 'TV Gids',slide: 8}
buttons.weer = {width:4, image: 'img/weer.png', title: 'Weer' ,slide:9 }
var blocks = {}
//Open camera als er iemand aan de deur staat
blocks[75] = {}
blocks[75]['playsound'] = 'sounds/doorbell.mp3';
blocks[75]['openpopup'] = {}
blocks[75]['openpopup']['url'] = '';
blocks[75]['openpopup']['auto_close'] = 60; //seconds
///////////////////////// Harmony /////////////////////////////////////
blocks[1] = {} //all uit harmony
blocks[1]['width'] = 3;
blocks[1]['icon'] = 'fa-power-off';
blocks[1]['hide_data'] = true;
blocks[1]['show_lastupdate'] = false;
blocks[1]['speakOn'] = 'Device is on' //speak text when device changes to On
blocks[1]['speakOff'] = 'Device is off' //speak text when device changes to Off
blocks[2] = {} //tv aan harmony
blocks[2]['width'] = 3;
blocks[2]['icon'] = 'fa-tv';
blocks[2]['hide_data'] = true;
blocks[2]['speakOn'] = 'Device is on' //speak text when device changes to On
blocks[2]['speakOff'] = 'Device is off' //speak text when device changes to Off
blocks[3] = {} //stream radio harmony
blocks[3]['width'] = 3;
blocks[3]['icon'] = 'fa-volume-down';
blocks[3]['hide_data'] = true;
blocks[4] = {} //Smart tv kijken harmony
blocks[4]['width'] = 3;
blocks[4]['icon'] = 'fa-android';
blocks[4]['hide_data'] = true;
blocks[5] = {} //raspberry pi harmony
blocks[5]['width'] = 3;
blocks[5]['icon'] = 'fa-codiepie';
blocks[5]['hide_data'] = true;
blocks[6] = {} //Computer harmony
blocks[6]['width'] = 3;
blocks[6]['icon'] = 'fa-desktop';
blocks[6]['hide_data'] = true;
blocks[7] = {} // radio ziggo harmony
blocks[7]['width'] = 3;
blocks[7]['icon'] = 'fa-volume-down';
blocks[7]['hide_data'] = true;
blocks[8] = {} //cast no tv harmony
blocks[8]['width'] = 3;
blocks[8]['icon'] = 'fa-chrome';
blocks[8]['hide_data'] = true;
blocks[9] = {} //radio ether harmony
blocks[9]['width'] = 3;
blocks[9]['icon'] = 'fa-volume-down';
blocks[9]['hide_data'] = true;
///////////////////////// ONKYO /////////////////////////////////////
blocks[10] = {} //Onkyo Master power
blocks[10]['width'] = 6;
blocks[10]['icon'] = 'fa-tv';
blocks[11] = {} //Onkyo volume master
blocks[11]['width'] = 12;
blocks[11]['icon'] = 'fa-tv';
///////////////////////// KAKU /////////////////////////////////////
blocks[110] = {} //Kaku Lamp dressoir
blocks[110]['width'] = 12
blocks[110]['hide_data'] = true;
blocks[15] = {} //Kaku Led lamp
blocks[15]['width'] = 3;
blocks[15]['hide_data'] = true;
blocks[17] = {} //Kaku Lamp bank
blocks[17]['width'] = 3;
blocks[17]['hide_data'] = true;
blocks[18] = {} //Kaku Eettafel lamp
blocks[18]['width'] = 12;
blocks[18]['hide_data'] = true;
blocks[19] = {} //Kaku Led TV
blocks[19]['width'] = 3;
blocks[19]['hide_data'] = true;
blocks[41] = {} //Kaku Lampen aan
blocks[41]['width'] = 3;
blocks[41]['hide_data'] = true;
blocks[57] = {} //Kaku Woonkamer
blocks[57]['width'] = 12;
blocks[57]['hide_data'] = true;
///////////////////////// LED Strip /////////////////////////////////////
blocks[61] = {} //Ledstrip 1
blocks[61]['width'] = 12;
blocks[61]['title'] = 'Ledstrip 1'
blocks[61]['hide_data'] = true;
blocks[68] = {} //Ledstrip 2
blocks[68]['width'] = 12;
blocks[68]['title'] = 'Ledstrip 2'
blocks[68]['hide_data'] = true;
///////////////////////// Schakel knoppen /////////////////////////////////////
blocks[49] = {} //Avond
blocks[49]['width'] = 3;
blocks[49]['hide_data'] = true;
blocks[49]['show_lastupdate'] = false;
blocks[59] = {} //Naar bed
blocks[59]['width'] = 3;
blocks[59]['image'] = 'sleep.png';
blocks[59]['hide_data'] = true;
blocks[59]['show_lastupdate'] = false;
blocks[59]['title'] = 'Naar bed'
///////////////////////// Temperatuur /////////////////////////////////////
blocks[60] = {} //Alecto Temp
blocks[60]['width'] = 3;
blocks[60]['title'] = 'Temp Buiten'
blocks[64] = {} //Temp Baby Kamer
blocks[64]['width'] = 3;
blocks[64]['title'] = 'Baby kamer'
blocks[64]['icon'] = 'fa-thermometer-half';
blocks[64]['switch'] = true;
blocks[65] = {} //Temp Slaapkamer
blocks[65]['width'] = 3;
blocks[65]['title'] = 'Slaapkamer'
blocks[66] = {} //Temp Badkamer
blocks[66]['width'] = 3;
blocks[66]['title'] = 'Badkamer'
blocks[76] = {} //Temperatuur + Luchtvochtigheid + Barometer
blocks[76]['width'] = 3;
blocks[76]['title'] = 'THB'
blocks[77] = {} //Windsnelheid
blocks[77]['width'] = 3;
blocks[77]['title'] = 'Windsnelheid'
blocks[79] = {} //Zicht buiten
blocks[79]['width'] = 3;
blocks[79]['title'] = 'Zicht'
blocks[93] = {} //UV Zonkracht
blocks[93]['width'] = 12;
blocks[93]['title'] = 'Zonkracht'
blocks[93]['switch'] = true;
///////////////////////// Wie is er thuis /////////////////////////////////////
blocks[48] = {} // thuis ping
blocks[48]['width'] = 12;
blocks[48]['title'] = 'Male';
blocks[48]['icon'] = 'fa-mobile';
blocks[48]['hide_data'] = false;
blocks[48]['show_lastupdate'] = false;
blocks[43] = {} // thuis ping
blocks[43]['width'] = 12;
blocks[43]['title'] = 'Female';
blocks[43]['icon'] = 'fa-mobile';
blocks[43]['hide_data'] = false;
blocks[43]['show_lastupdate'] = false;
///////////////////////// Verkeer /////////////////////////////////////
blocks['trafficmap'] = {} //trafficmap
blocks['trafficmap']['width'] = 4;
///////////////////////// Nieuws /////////////////////////////////////
blocks['news_2'] = {}
blocks['news_2']['feed'] = 'https://cors-anywhere.herokuapp.com/htt ... s/algemeen ';
blocks['news_tv'] = {} // TVGIDS
blocks['news_tv']['feed'] = 'https://cors-anywhere.herokuapp.com/htt ... nieuws.rss ';
blocks[106] = {}
blocks[106]['hide_stop'] = true;
blocks[102] = {} //Alarm
blocks[102]['width'] = 12;
blocks[102]['title'] = 'Alarm status';
blocks[102]['icon'] = 'fa-bell';
blocks[102]['hide_data'] = false;
blocks[114] = {} //Kodi Touch
blocks[114]['width'] = 12;
blocks[114]['title'] = 'Alarm status';
blocks[114]['icon'] = 'fa-bell';
blocks[114]['hide_data'] = false;
///////////////////////// Columns /////////////////////////////////////
var columns = {}
//Main scherm in alle screens toegevoegd
columns[1] ={}
columns[1]['blocks']=[buttons.hoofdmenu,buttons.alarm,102,'clock','sunrise',buttons.buienradar,43,48]
columns[1]['width']=2;
//Buttons naar screens
columns[2] = {}
columns[2]['blocks'] = [buttons.sonarr, buttons.trein, buttons.verkeer, buttons.verlichting, buttons.temperatuur, buttons.webcam, buttons.kalender, buttons.tvgids, buttons.weer, 'currentweather_big', 'longfonds', buttons.webcam1, buttons.webcam2]
columns[2]['width'] = 5;
//Screen trein
columns[3] = {}
columns[3]['blocks'] = [frames.treinen]
columns[3]['width'] = 10;
//Screen verkeer
columns[4] = {}
columns[4]['blocks'] = [maps.]
columns[4]['width'] = 10;
//Screen verlichting
columns[5] = {}
columns[5]['blocks'] = [1,2,3,4,5,6,7,8,9,28,15,17,29,19,110,18,57,61,68,59,49]
columns[5]['width'] = 10;
//Screen temperatuur
columns[6] = {}
columns[6]['blocks'] = ['64_1','65_1','66_1','60_1','64_2','65_2','66_2','60_2',76,77,79]
columns[6]['width'] = 10;
//Screen webcam
columns[7] = {}
columns[7]['blocks'] = [buttons.webcam2,buttons.webcam1]
columns[7]['width'] = 10;
//Screen Calender
columns[8] = {}
columns[8]['blocks'] = [calendars.f1,calendars.google]
columns[8]['width'] = 10;
//Quick knoppen
columns[9] = {}
columns[9]['blocks'] = [1,2,7,9,49,41,59,19,15,110,57,'64_1','65_1','66_1','60_1',publictransport.ovinfobus,publictransport.ovinfotrein]
columns[9]['width'] = 5;
//TV GIDS
columns[10] = {}
columns[10]['blocks'] = [tvguide.dutch,'news_tv'];
columns[10]['width'] = 10;
//Weer
columns[11] = {}
columns[11]['blocks'] = [frames.weer];
columns[11]['width'] = 10;
//sonarr
columns[12] = {}
columns[12]['blocks'] = ['sonarr'];
columns[12]['width'] = 10;
///////////////////////////////STANDBY SCHERM////////////////////////////////
var columns_standby = {}
columns_standby[1] = {}
columns_standby[1]['blocks'] = ['clock','currentweather_big','weather',buttons.webcam2,buttons.webcam1] //specify blocks for the standby mode
columns_standby[1]['width'] = 12;
///////////////////////////////SCHERMEN//////////////////////////////
var screens = {}
screens['default'] = {}
screens['default']['maxwidth'] = 1920;
screens['default']['maxheight'] = 1080;
screens['default'][1] = {}
screens['default'][1]['background'] = 'bg1.jpg';
screens['default'][1]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][1]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][1]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][1]['background_night'] = 'bg_night_winter.jpg';
screens['default'][1]['columns'] = [1,2,9]
/*trein*/
screens['default'][2] = {}
screens['default'][2]['background'] = 'bg1.jpg';
screens['default'][2]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][2]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][2]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][2]['background_night'] = 'bg_night_winter.jpg';
screens['default'][2]['columns'] = [1,3]
/*verkeer*/
screens['default'][3] = {}
screens['default'][3]['background'] = 'bg1.jpg';
screens['default'][3]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][3]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][3]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][3]['background_night'] = 'bg_night_winter.jpg';
screens['default'][3]['columns'] = [1,4]
/*verlichting*/
screens['default'][4] = {}
screens['default'][4]['background'] = 'bg1.jpg';
screens['default'][4]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][4]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][4]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][4]['background_night'] = 'bg_night_winter.jpg';
screens['default'][4]['columns'] = [1,5]
/*temperatuur*/
screens['default'][5] = {}
screens['default'][5]['background'] = 'bg1.jpg';
screens['default'][5]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][5]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][5]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][5]['background_night'] = 'bg_night_winter.jpg';
screens['default'][5]['columns'] = [1,6]
/*webcam*/
screens['default'][6] = {}
screens['default'][6]['background'] = 'bg1.jpg';
screens['default'][6]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][6]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][6]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][6]['background_night'] = 'bg_night_winter.jpg';
screens['default'][6]['columns'] = [1,7]
/*kalender*/
screens['default'][7] = {}
screens['default'][7]['background'] = 'bg1.jpg';
screens['default'][7]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][7]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][7]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][7]['background_night'] = 'bg_night_winter.jpg';
screens['default'][7]['columns'] = [1,8]
/*tv gids */
screens['default'][8] = {}
screens['default'][8]['background'] = 'bg1.jpg';
screens['default'][8]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][8]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][8]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][8]['background_night'] = 'bg_night_winter.jpg';
screens['default'][8]['columns'] = [1,10]
/*weer*/
screens['default'][9] = {}
screens['default'][9]['background'] = 'bg1.jpg';
screens['default'][9]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][9]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][9]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][9]['background_night'] = 'bg_night_winter.jpg';
screens['default'][9]['columns'] = [1,11]
/*sonarr*/
screens['default'][10] = {}
screens['default'][10]['background'] = 'bg1.jpg';
screens['default'][10]['background_morning'] = 'bg_morning_winter.jpg';
screens['default'][10]['background_noon'] = 'bg_noon_winter.jpg';
screens['default'][10]['background_afternoon'] = 'bg_afternoon_winter.jpg';
screens['default'][10]['background_night'] = 'bg_night_winter.jpg';
screens['default'][10]['columns'] = [1,12]
Custom.css
Spoiler: show
/*////////////////////////////////////// Zon opkomst en ondergang \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.sunrise { font-size: 25px; font-size: 1vw; color: yellow;}
.wi-sunrise:before { color: yellow; font-size: 25px; font-size: 1vw;}
.sunset { font-size: 25px; font-size: 1vw; color: orange;}
.wi-sunset:before { color: orange; font-size: 25px; font-size: 1vw;}
/*Tekst_in_knoppen*/
.col-data .title
{
font-size: 15px;
font-size: 1vw;
font-weight: Bold;
color: white;
padding-top: 40px;
}
/*Tekst_in_knoppen*/
.buttonimg
{
max-width: 2vw;
}
/* Kleine tekst onderin knoppen, staat uit */
.col-data span
{
font-size:10px;
margin: 0px;
font-weight: 300;
color: white;
}
/*Smaller Title blocks (Height)[edit]*/
div.mh.titlegroups
{
height: 90px;
padding-top: 0px; /* default height=75px, */ /* center text for new height */
}
/*Change font size of 1 specific (text) device*/
.block_1100 .title { font-size:10px ;color:red !important;}
/* OV informatie */
.publictransport .title div {
font-size:10px;
font-size: 1vw;
}
.clock {
font-size: 17pt;
font-size: 1vw;
}
.clock .weekday, .date{
font-size: 12pt;
font-size: 1vw;
}
/* Space between blocks smaller en ronde hoeken */
.transbg.col-xs-1,
.transbg.col-xs-2,
.transbg.col-xs-3,
.transbg.col-xs-4,
.transbg.col-xs-5,
.transbg.col-xs-6,
.transbg.col-xs-7,
.transbg.col-xs-8,
.transbg.col-xs-9,
.transbg.col-xs-10,
.transbg.col-xs-11,
.transbg.col-xs-12
{ padding-top:10px; padding-bottom:10px; border:7px solid rgba(255,255,255,0); background:rgba(0,0,0,0.5); background-clip: padding-box; border-radius: 0px; }
/* border: 7px -> 3px - Smaller space between blocks */ /* Round corners */
.fa.fa-lightbulb-o.on:before {color: #5aff00;}
.fa.fa-lightbulb-o.off:before {color: #ffffff;}
.fa.fa-power-off.on:before {color: #5aff00;}
.fa.fa-power-off.off:before {color: #ffffff;}
.fa.fa-thermometer-half:before {color: #ffffff;}
.fa.fa-plug:before {color: #ffffff;}
.fa.fa-flash:before {color: #ffffff;}
.fa.fa-male.on:before {color: #5aff00;}
.fa.fa-female.on:before {color: #5aff00;}
.fa.fa-eye-slash.off:before {color: #ffffff;}
.fa.fa-eye.on:before {color: #5aff00;}
.fa.fa-mobile.on:before {color: #5aff00;}
.fa.fa-mobile.off:before {color: red;}
.fa.fa-tv.on:before {color: #5aff00;}
.fa.fa-tv.off:before {color: #ffffff;}
.fa.fa-android.on:before {color: #5aff00;}
.fa.fa-android.off:before {color: #ffffff;}
.fa.fa-volume-down.o:beforen {color: #5aff00;}
.fa.fa-volume-down.off:before {color: #ffffff;}
.fa.fa-codiepie.on:before {color: #5aff00;}
.fa.fa-codiepie.off:before {color: #ffffff;}
.fa.fa-desktop.on:before {color: #5aff00;}
.fa.fa-desktop.off:before {color: #ffffff;}
.fa.fa-chrome.on:before {color: #5aff00;}
.fa.fa-chrome.off:before {color: #ffffff;}
.Menu .col-xs-1,
.Menu .col-xs-2,
.Menu .col-xs-3,
.Menu .col-xs-4,
.Menu .col-xs-5,
.Menu .col-xs-6,
.Menu .col-xs-7,
.Menu .col-xs-8,
.Menu .col-xs-9,
.Menu .col-xs-10,
.Menu .col-xs-11,
.Menu .col-xs-12
{
padding-top: 2px !important;
padding-right: 2px !important;
padding-left: 2px !important;
}
/* Warning Rood */
.warningred
{
/* background-color: rgba(199,44,44,0.6) !important;*/
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
.warningred .fa.fa-thermometer-half:before {color: red;}
.warningred .fa.fa-sun-o:before {color: red;}
/* Warning Oranje */
.warningorange
{
/* background-color: rgba(255,165,0,0.6) !important;*/
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
.warningorange .fa.fa-thermometer-half:before {color: orange;}
.warningorange .fa.fa-sun-o:before {color: orange;}
/* Warning Groen */
.warninggreen
{
/* background-color: rgba(0,255,20,0.6) !important;*/
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
.warninggreen .fa.fa-thermometer-half:before {color: rgba(0,255,20);}
.warninggreen .fa.fa-sun-o:before {color: rgba(0,255,20);}
/* Warning Blauw */
.warningblue
{
/* background-color: rgba(0,0,255,0.6) !important;*/
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
.warningblue .fa.fa-thermometer-half:before {color: blue;}
.warningblue .fa.fa-sun-o:before {color: blue;}
.warning
{
background-color: rgba(0,0,0,0.6) !important;
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
.warning .fa.fa-thermometer-half:before {color: red;}
.warning .fa.fa-sun-o:before {color: red;}
/*Laat achtergrond knop knipperen*/
/*
.warning {
background: rgba(199,44,44,0.3) !important;
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0);
-webkit-animation: BLINK-ANIMATION 1s infinite;
-moz-animation: BLINK-ANIMATION 1s infinite;
-o-animation: BLINK-ANIMATION 1s infinite;
animation: BLINK-ANIMATION 1s infinite;
}
@-webkit-keyframes BLINK-ANIMATION {
0%, 49% {
background-color: rgba(0,0,0,0.4);
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
50%, 100% {
background-color: rgba(199,44,44,0.7);
background-clip: padding-box;
border: 7px solid rgba(255,255,255,0.0);
}
}
*/
/* Animation code */
/* background-siren */
@keyframes background-siren {
from {background-color: red;}
to {background-color: blue;}
}
.lightswitch {
background: rgba(143,227,136,0.3) !important;
}
.alert_motion {
background: rgba(0,0,0,0.3) !important;
animation-name: background-siren;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
@-webkit-keyframes BLINK-ANIMATION {
0%, 49% {
background-color: rgba(255,0,0,0.5);
border: 3px solid red;
}
50%, 100% {
background-color: red;
border: 3px solid rgba(255,0,0.0.5);
}
}
/* Weather */
.weatherfull > div div.temp {font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: medium;
font-weight: medium;
font-style: normal;
font-size: 17pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
margin-top:0px;
opacity:1;
}
.weatherfull > div div.temp .nightT {font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: medium;
font-style: normal;
font-size: 12pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
margin:0px auto;
opacity:0.7;
display:block;
}
.weatherfull > div div.icon {font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: medium;
font-style: normal;
font-size: 17pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
margin:0px auto;
opacity:1;
display:block;
height:60px;
}
.weatherfull > div div.day {font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: regular;
font-style: normal;
font-size: 11pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
margin-top:0px;
opacity:0.9;
}
/* Clock
.standby .clock{
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: medium;
font-style: normal;
font-size: 17pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
padding:0px 5px 0px 5px;
margin-right:5px;
}
.standby .weekday,.standby .date{
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: medium;
font-style: normal;
font-size: 17pt;
letter-spacing: 0.5pt;
text-transform: uppercase;
padding:0px 5px 0px 5px;
margin-right:5px;
}
*/
/* News ticker */
#newsTicker li {
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-weight: regular;
font-style: normal;
font-size: 12pt;
letter-spacing: 0.1pt;
min-height: 72px;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
color: white;
max-height: 250px; */ Set the maxim height of the news-ticker */
}
Custom.js
Spoiler: show //add custom javascript in here
function afterGetDevices(){
}
function getExtendedBlockTypes(blocktypes){
//blocktypes.Type['Lighting 2'] = { icon: 'fa fa-lightbulb-o', title: '<Name>', value: 'ds' }
return blocktypes;
}
//////////////////////////////// Alarm aan of uit ////////////////////////////////////////
function getBlock_102(device,idx){ //change 233 to the idx of your device!
$('.block_'+idx).attr('onclick','switchDevice(this)');
var html='';
html+='<div class="col-xs-4 col-icon">';
if(device['Status']=='Off') html+=iconORimage(idx,'fa-toggle-off','','off icon');
else html+=iconORimage(idx,'fa-toggle-on','','on icon');
html+='</div>';
html+='<div class="col-xs-8 col-data">';
html+='<strong class="title">'+device['Name']+'</strong><br />';
if(device['Status']=='Normal') html+='<span class="state">Uitgeschakeld</span>';
else html+='<span class="state">Ingeschakeld</span>';
html+='</div>';
return html;
}
////////////////////// Aanwezig / Afwezig telefoon /////////////////////////////
function getBlock_48(device,idx){ //change 233 to the idx of your device!
$('.block_'+idx).attr('onclick','switchDevice(this)');
var html='';
html+='<div class="col-xs-4 col-icon">';
if(device['Status']=='Off') html+=iconORimage(idx,'fa-toggle-off','','off icon');
else html+=iconORimage(idx,'fa-toggle-on','','on icon');
html+='</div>';
html+='<div class="col-xs-8 col-data">';
html+='<strong class="title">'+device['Name']+'</strong><br />';
if(device['Status']=='Off') html+='<span class="state">Afwezig</span>';
else html+='<span class="state">Aanwezig</span>';
html+='</div>';
return html;
}
function getBlock_43(device,idx){ //change 233 to the idx of your device!
$('.block_'+idx).attr('onclick','switchDevice(this)');
var html='';
html+='<div class="col-xs-4 col-icon">';
if(device['Status']=='Off') html+=iconORimage(idx,'fa-toggle-off','','off icon');
else html+=iconORimage(idx,'fa-toggle-on','','on icon');
html+='</div>';
html+='<div class="col-xs-8 col-data">';
html+='<strong class="title">'+device['Name']+'</strong><br />';
if(device['Status']=='Off') html+='<span class="state">Afwezig</span>';
else html+='<span class="state">Aanwezig</span>';
html+='</div>';
return html;
}
///////////////////////Warning voor temperatuur //////////////////////////////////////
function getStatus_64_1(idx,value,device){ //Verander de IDX naar die van het device
if(parseFloat(device['Data'])>26){
$('div.block_64_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').addClass('warningred');
}
else if(parseFloat(device['Data'])>23){
$('div.block_64_1').removeClass('warning').removeClass('warningred').removeClass('warninggreen').addClass('warningorange');
}
else if(parseFloat(device['Data'])>19){
$('div.block_64_1').removeClass('warningorange').removeClass('warningred').removeClass('warninggreen').addClass('warninggreen');
}
else if(parseFloat(device['Data'])>0){
$('div.block_64_1').removeClass('warningorange').removeClass('warningred').removeClass('warningblue').addClass('warningblue');
}
else {
$('div.block_64_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').removeClass('warningred').removeClass('warningblue');
}
}
function getStatus_65_1(idx,value,device){
if(parseFloat(device['Data'])>26){
$('div.block_65_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').addClass('warningred');
}
else if(parseFloat(device['Data'])>23){
$('div.block_65_1').removeClass('warning').removeClass('warningred').removeClass('warninggreen').addClass('warningorange');
}
else if(parseFloat(device['Data'])>19){
$('div.block_65_1').removeClass('warningorange').removeClass('warningred').removeClass('warninggreen').addClass('warninggreen');
}
else if(parseFloat(device['Data'])>0){
$('div.block_65_1').removeClass('warningorange').removeClass('warningred').removeClass('warningblue').addClass('warningblue');
}
else {
$('div.block_65_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').removeClass('warningred').removeClass('warningblue');
}
}
function getStatus_66_1(idx,value,device){
if(parseFloat(device['Data'])>26){
$('div.block_66_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').addClass('warningred');
}
else if(parseFloat(device['Data'])>23){
$('div.block_66_1').removeClass('warning').removeClass('warningred').removeClass('warninggreen').addClass('warningorange');
}
else if(parseFloat(device['Data'])>19){
$('div.block_66_1').removeClass('warningorange').removeClass('warningred').removeClass('warninggreen').addClass('warninggreen');
}
else if(parseFloat(device['Data'])>0){
$('div.block_66_1').removeClass('warningorange').removeClass('warningred').removeClass('warningblue').addClass('warningblue');
}
else {
$('div.block_66_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').removeClass('warningred').removeClass('warningblue');
}
}
function getStatus_60_1(idx,value,device){
if(parseFloat(device['Data'])>26){
$('div.block_60_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').addClass('warningred');
}
else if(parseFloat(device['Data'])>23){
$('div.block_60_1').removeClass('warning').removeClass('warningred').removeClass('warninggreen').addClass('warningorange');
}
else if(parseFloat(device['Data'])>19){
$('div.block_60_1').removeClass('warningorange').removeClass('warningred').removeClass('warninggreen').addClass('warninggreen');
}
else if(parseFloat(device['Data'])>0){
$('div.block_60_1').removeClass('warningorange').removeClass('warningred').removeClass('warningblue').addClass('warningblue');
}
else {
$('div.block_60_1').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').removeClass('warningred').removeClass('warningblue');
}
}
///////////////////////Warning voor UV Zonkracht //////////////////////////////////////
function getStatus_93(idx,value,device){ //Verander de IDX naar die van het device
if(parseFloat(device['Data'])>7){
$('div.block_93').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').addClass('warningred');
}
else if(parseFloat(device['Data'])>4){
$('div.block_93').removeClass('warning').removeClass('warningred').removeClass('warninggreen').addClass('warningorange');
}
else if(parseFloat(device['Data'])>0){
$('div.block_93').removeClass('warningorange').removeClass('warningred').removeClass('warningblue').addClass('warninggreen');
}
else {
$('div.block_93').removeClass('warning').removeClass('warningorange').removeClass('warninggreen').removeClass('warningred').removeClass('warningblue');
}
}
Attachments
Verlichting.jpg (267.11 KiB) Viewed 3834 times
EdwinK
Posts: 1820 Joined: Sunday 22 January 2017 21:46
Target OS: Raspberry Pi / ODroid
Domoticz version: BETA
Location: Rhoon
Contact:
Post
by EdwinK » Friday 08 June 2018 18:41
That looks great.
Trying to copy it, but isn't something that is done easy.
Running latest BETA on a Pi-3 | Toon® Thermostat (rooted) | Hue | Tuya | IKEA tradfri | Dashticz V3 on Lenovo Huawei Tablet | Conbee
Danigympie
Posts: 3 Joined: Thursday 31 May 2018 13:38
Target OS: Windows
Domoticz version: 3.8153
Location: Netherlands
Contact:
Post
by Danigympie » Saturday 09 June 2018 9:08
EdwinK wrote: ↑ Friday 08 June 2018 18:41
That looks great.
Trying to copy it, but isn't something that is done easy.
You can PM me in dutch so I can help you with some settings, or give you some hints
yfands
Posts: 67 Joined: Monday 04 July 2016 10:16
Target OS: Raspberry Pi / ODroid
Domoticz version: latest B
Location: Netherlands
Contact:
Post
by yfands » Saturday 09 June 2018 22:18
Hai
Dashticz version Beta 2.3.5
raspberry pi 3
Playing with the speak option
In the config.js
config['speak_lang'] = 'nl-NL';
and in a block definition the following dutch sentence (translated: The temperature has changed)
blocks['636_1']['speak'] = 'Temperatuur is gewijzigd';
The lady tries her best but can't pronounce the dutch sentence it is still english based.
So, what must I do for her to understand the sentence is dutch?
Isn't config['speak_lang'] = 'nl-NL'; in the config file enough ?
regards
Frank
EdwinK
Posts: 1820 Joined: Sunday 22 January 2017 21:46
Target OS: Raspberry Pi / ODroid
Domoticz version: BETA
Location: Rhoon
Contact:
Post
by EdwinK » Saturday 09 June 2018 22:40
Danigympie wrote: ↑ Saturday 09 June 2018 9:08
EdwinK wrote: ↑ Friday 08 June 2018 18:41
That looks great.
Trying to copy it, but isn't something that is done easy.
You can PM me in dutch so I can help you with some settings, or give you some hints
Later, I think. Now other things to work on.
Running latest BETA on a Pi-3 | Toon® Thermostat (rooted) | Hue | Tuya | IKEA tradfri | Dashticz V3 on Lenovo Huawei Tablet | Conbee
rldn
Posts: 16 Joined: Thursday 16 November 2017 20:02
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:
Post
by rldn » Thursday 05 July 2018 13:19
Can someone tell me how to change the icon image whenever a status change? For the font awesome i can get it done, but for an image instead of icon its not working. I only see the static white image deur_open.png. Not even a transparancy when the door is closed.
And of course, its not changing to deur_closed.png when the status is 'Dicht'.
I have made a block in config.js with:
blocks[21] = {} // DEURCONTACT VOORDEUR
blocks[21]['title'] = 'Voordeur';
blocks[21]['width'] = 12;
blocks[21]['image'] = 'deur_open.png';
And in custom.js i made this:
// CHANGE STATUS VOOR DEURCONTACT VOOR
function getBlock_21(device,idx){
$('.block_'+idx).attr('onclick','switchDevice(this)');
var html='';
html+='<div class="col-xs-4 col-icon">';
if(device['Status']=='Closed') html+=iconORimage(idx,'deur_dicht.off','','off icon');
else html+=iconORimage(idx,'deur_open.on','','on icon');
html+='</div>';
html+='<div class="col-xs-8 col-data">';
html+='<strong class="title">'+device['Name']+'</strong><br />';
if(device['Status']=='Open') html+='<span class="state">Deur is open</span>';
else html+='<span class="state">Deur is dicht</span>';
html+='</div>';
return html;
}
HansieNL
Posts: 957 Joined: Monday 28 September 2015 15:13
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:
Post
by HansieNL » Saturday 07 July 2018 15:10
can you change:
if(device['Status']=='Closed') html+=iconORimage(idx,'deur_dicht.off','','off icon');
else html+=iconORimage(idx,'deur_open.on','','on icon');
to:
if(device['Status']=='Closed') html+='<img src="img/deur_dicht.off" class="off icon" />';
else html+='<img src="img/deur_open.on" class="on icon" />';
I suppose you have the two images in the img map of Dashticz.
Blah blah blah
hoeby
Posts: 528 Joined: Saturday 02 June 2018 11:05
Target OS: Raspberry Pi / ODroid
Domoticz version: V2022.1
Location: Echt, Netherlands
Contact:
Post
by hoeby » Saturday 07 July 2018 18:03
Maybe someone can help me.
I would like to make Multi screens.
But having the buttons for going to the Multi screens in the bottom of Dashticz, not a column function, but more a row function.
Does somebody has an idea, how to make that?
I can make the buttons on the bottom of a column, but prefer to get it separate to the other buttons
Looking for this idea (the home, lighting, devices, activities, environment row)
Thin-client --> Docker Domoticz main environment
Pi3A+ --> Google home (GAssistPi)
Pi3B+ --> Docker (P1monitor, Domoticz test environment, Ubiquity controller)
Users browsing this forum: floris74 and 1 guest