Dashticz - Show your dashboard and how-to's!

[dutchdevil83]

I have made a spinning font awesome icon when my solar panels are generating power. Ofcourse you can also use this for spinning other icons.

Add this to CUSTOM.JS for defining the action:

Code: Select all

function getStatus_29(idx,value,device){ 
   if(parseFloat(device['Usage'])>0){
      blocks['29_1']['icon'] = 'fa fa-sun-o slow-spin'; //if you use "fa-spin" instead of "slow-spin" then it is not necessary to add code to custom.css
   }
   else {
      blocks['29_1']['icon'] = 'fa fa-sun-o'; 
   }
}

Add this to CUSTOM.CSS to define a slower spinning speed for the font awesome spinning function (i liked this better):

Code: Select all

.slow-spin {
  -webkit-animation: fa-spin 4s infinite linear;
  animation: fa-spin 4s infinite linear;
}

Have fun with spinning your icons !

Doesn't work over here. I tried to apply it to my P1 meter (idx=1 and actual usage is 1_1) with following code in CUSTOM.JS:

Code: Select all

function getStatus_1(idx,value,device){ 
   if(parseFloat(device['Usage'])>0){
      blocks['1_1']['icon'] = 'fa fa-sun-o slow-spin'; //if you use "fa-spin" instead of "slow-spin" then it is not necessary to add code to custom.css
   }
   else {
      blocks['1_1']['icon'] = 'fa fa-sun-o'; 
   }
}

And of course also added the slow spinning code to custom.css.

What exactly doesn`t work? If you don`t see the sun icon at all you`re probably not on latest beta

[Onrust]

I'm not seeing spinning icons. But in all honesty I'm not sure which icons should be spinning. Not in the latest beta.

[Mace]

Probably a very stupid question, but I'm somewhat confused with the use of CONFIG.js. I've copied the code from one of the examples in this thread in CONFIG.js and into custom.css (both in /home/mace/domoticz/www/dashticz_v2/custom) when I reload the page (10.0.0.121:8080/dashticz_v2/) I get a black screen.
When I start with the empty CONFIG.js, I DO have a occupied dashboard....Think I'm missing something here....

[Ingmar]

Then you probably have a small mistake in the code you added, probably a ' or ] missing or too many. I've had this a couple of times as well. Can you post the bit of your config.js that you added from the example?

[Ingmar]

Been busy with my dashboard over the last week. There are still some things that aren't working, like the news block and trafficmap. I have no clue why it doesn't work... so if anyone has a suggestion, please let me know

dash.jpg (324.67 KiB) Viewed 8510 times

I've added my doorbell device but made it hidden so that you can hear a doorbell sound on the tablet but you can't see anything on the dashboard.

Config

Code: Select all

////////////////////// GENERAL CONFIG /////////////////////////
var config = {}
config['domoticz_ip'] = 'XXX';
config['app_title'] = 'Dashboard';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '60';
config['default_news_url'] = 'https://crossorigin.me/http://feeds.bbci.co.uk/news/world/europe/rss.xml';
config['news_scroll_after'] = '7';
config['standby_after'] = 0;
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '10';
config['auto_slide_pages'] = 0;
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'] = 0;
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = 'XXX';
config['gm_zoomlevel'] = '8';
config['gm_latitude'] = 'XXX';
config['gm_longitude'] = 'XXX';
config['wu_api'] = 'XXX';
config['wu_city'] = 'The Hague';
config['wu_name'] = 'in The Hague';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = 0;
config['switch_horizon'] = 0;
config['host_nzbget'] = 0;
config['spot_clientid'] = 'XXX';
config['garbage_company'] = 0;
config['garbage_icalurl'] = 0;
config['garbage_zipcode'] = 0;
config['garbage_street'] = 0;
config['garbage_housenumber'] = 0;
config['garbage_maxitems'] = 0;
config['garbage_width'] = 0;
config['selector_instead_of_buttons'] = 0;
config['auto_positioning'] = 0;
config['use_favorites'] = 0;
config['last_update'] = 1;
config['hide_topbar'] = 0;
config['hide_seconds'] = 1;
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;


//var trashnames = {}
//trashnames['Gft'] = 'GFT';
//trashnames['Pmd'] = 'Plastic';
//trashnames['Rest'] = 'Rest'; //LEAVE EMPTY IF YOU WANT TO HIDE IT


var tvguide = {}
tvguide.dutch = { key:'dutch', icon: 'fa-television', width:12, channels: [7,8,464,25,438], maxitems: 8 }

var _STREAMPLAYER_TRACKS  	= [
	{"track":1,"name":"Q-music","file":"http://icecast-qmusic.cdp.triple-it.nl/Qmusic_nl_live_96.mp3"},
	{"track":2,"name":"538 Hitzone","file":"http://vip-icecast.538.lw.triple-it.nl/WEB11_MP3"},
	{"track":3,"name":"Slam! NonStop","file":"http://stream.radiocorp.nl/web10_mp3"},
	{"track":4,"name":"BBC Radio 1","file":"http://radiofeeds.co.uk/bbcradio1.pls"},  ]; 



////////////////////// FRAMES ///////////////////////////
var frames = {}
frames.weather = {refreshiframe:10000,height:230,frameurl:"//forecast.io/embed/#lat=52.081316&lon=4.383277&name=The Hague&color=#00aaff&font=Helvetica&fontcolor=#ffffff&units=si&text-color=#fff",width:12}



////////////////////// BUTTONS /////////////////////////
var buttons = {}
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image:'http://api.buienradar.nl/image/1.0/RadarMapNL?w=285&h=256', url:'https://gadgets.buienradar.nl/gadget/zoommap/?lat=52.06022&lng=4.39288&overname=2&zoom=13&naam=2493bj&size=3&voor=1'}



////////////////////// BLOCK TITLES /////////////////////////
var blocks = {}
blocks['blocktitle_tv'] = {}
blocks['blocktitle_tv']['key'] = 'blocktitle_tv';
blocks['blocktitle_tv']['type'] = 'blocktitle';
blocks['blocktitle_tv']['title'] = 'TV and news';

blocks['blocktitle_switches'] = {}
blocks['blocktitle_switches']['key'] = 'blocktitle_switches';
blocks['blocktitle_switches']['type'] = 'blocktitle';
blocks['blocktitle_switches']['title'] = 'Controlling the lights';

blocks['blocktitle_temp'] = {}
blocks['blocktitle_temp']['key'] = 'blocktitle_temp';
blocks['blocktitle_temp']['type'] = 'blocktitle';
blocks['blocktitle_temp']['title'] = 'Temperatures inside';

blocks['blocktitle_doors'] = {}
blocks['blocktitle_doors']['key'] = 'blocktitle_doors';
blocks['blocktitle_doors']['type'] = 'blocktitle';
blocks['blocktitle_doors']['title'] = 'Doors and windows';

blocks['blocktitle_spotify'] = {}
blocks['blocktitle_spotify']['key'] = 'blocktitle_spotify';
blocks['blocktitle_spotify']['type'] = 'blocktitle';
blocks['blocktitle_spotify']['title'] = 'Spotify';



// custom block width for switches

blocks['news_2'] = {}
blocks['news_2']['feed'] = 'http://feeds.bbci.co.uk/news/world/europe/rss.xml';

blocks[104] = {} //
blocks[104]['width'] = 4;
blocks[104]['title'] = 'The front door is now:'

blocks['s1'] = {} //Scene Front room all off
blocks['s1']['hide_data'] = true;
blocks['s1']['hide_lastupdate'] = true;
blocks['s1']['icon'] = 'fa-times-circle';

blocks['s2'] = {} //Movie scene
blocks['s2']['hide_data'] = true;
blocks['s2']['hide_lastupdate'] = true;
blocks['s2']['icon'] = 'fa-video-camera';

blocks['s3'] = {} //Evening scene
blocks['s3']['hide_data'] = true;
blocks['s3']['hide_lastupdate'] = true;
blocks['s3']['icon'] = 'fa-image';





blocks[73] = {} //kitchen light string
blocks[73]['width'] = 6;
blocks[73]['title'] = 'Kitchen light string'
blocks[73]['hide_data'] = true;
blocks[73]['hide_lastupdate'] = true;

blocks[93] = {} //kitchen spots dimmer
blocks[93]['width'] = 6;
blocks[93]['title'] = 'Kitchen spots'
blocks[93]['hide_data'] = true;
blocks[93]['hide_lastupdate'] = true;

blocks[74] = {}
blocks[74]['width'] = 6;
blocks[74]['title'] = 'Cupboard spots'
blocks[74]['hide_data'] = true;
blocks[74]['hide_lastupdate'] = true;

blocks[72] = {}
blocks[72]['width'] = 6;
blocks[72]['title'] = 'Ceiling light'
blocks[72]['hide_data'] = true;
blocks[72]['hide_lastupdate'] = true;

blocks[44] = {}
blocks[44]['width'] = 6;
blocks[44]['title'] = 'Floor lamp'
blocks[44]['hide_data'] = true;
blocks[44]['hide_lastupdate'] = true;

blocks[18] = {}
blocks[18]['width'] = 6;
blocks[18]['title'] = 'TV light'
blocks[18]['hide_data'] = true;
blocks[18]['hide_lastupdate'] = true;

blocks[70] = {}
blocks[70]['width'] = 6;
blocks[70]['title'] = 'Couch light'
blocks[70]['hide_data'] = true;
blocks[70]['hide_lastupdate'] = true;

blocks[17] = {}
blocks[17]['width'] = 6;
blocks[17]['title'] = 'Subwoofer'
blocks[17]['hide_data'] = true;
blocks[17]['hide_lastupdate'] = true;
blocks[17]['icon'] = 'fa-volume-up';

blocks[92] = {}
blocks[92]['width'] = 6;
blocks[92]['title'] = 'Bedroom fairy lights'
blocks[92]['hide_data'] = true;
blocks[92]['hide_lastupdate'] = true;

// DOORBELL
blocks[89] = {}
blocks[89]['width'] = 1;
blocks[89]['title'] = ''
blocks[89]['hide_data'] = true;
blocks[89]['hide_lastupdate'] = true;
blocks[89]['playsound'] = 'sounds/doorbell.mp3';
blocks[89]['protected'] = true;
blocks[89]['icon'] = 'fa-bell-o';

//change temp blocks size
blocks[82] = {}
blocks[82]['width'] = 3;

blocks[52] = {}
blocks[52]['width'] = 3;

blocks[54] = {}
blocks[54]['width'] = 3;

blocks[81] = {}
blocks[81]['width'] = 3;
blocks[81]['title'] = 'Change temp.'

//Device status - ping results
blocks[122] = {}
blocks[122]['width'] = 12;
blocks[122]['title'] = 'Internet'
blocks[122]['hide_data'] = true;
blocks[122]['hide_lastupdate'] = true;
blocks[122]['icon'] = 'fa-circle';
blocks[122]['protected'] = true;

blocks[118] = {}
blocks[118]['width'] = 12;
blocks[118]['title'] = 'Our network'
blocks[118]['hide_data'] = true;
blocks[118]['hide_lastupdate'] = true;
blocks[118]['icon'] = 'fa-circle';
blocks[118]['protected'] = true;

blocks[121] = {}
blocks[121]['width'] = 12;
blocks[121]['title'] = 'Printer'
blocks[121]['hide_data'] = true;
blocks[121]['hide_lastupdate'] = true;
blocks[121]['icon'] = 'fa-circle';
blocks[121]['protected'] = true;


//blocks['sunrise'] = {}
//blocks['sunrise']['width'] = 1;

//blocks['miniclock'] = {}
//blocks['miniclock']['width'] = 7;


// My IDX list
// 73 = kitchen light string
// 93 = Kitchen spots
// 74 = Cupboard spots
// 72 = Ceiling light
// 44 = Floor lamp
// 18 = TV light
// 70 = Couch light
// 17 = Subwoofer
// 92 = Bedroom fairy lights


////////////////////// COLUMNS /////////////////////////
var columns = {}
columns['bar'] = {}
columns['bar']['blocks'] = ['sunrise','miniclock',89]
					
columns[1] = {}
columns[1]['blocks'] = ['blocktitle_switches','s1','s3','s2',73,93,74,72,44,18,70,17,92]
columns[1]['width'] = 5;

columns[2] = {}
columns[2]['blocks'] = [frames.weather,'blocktitle_temp',81,82,'54_1','52_1','blocktitle_doors',104,'news','trafficmap']
columns[2]['width'] = 5; 

columns[3] = {}
columns[3]['blocks'] = [122,118,121,buttons.buienradar,'news_2',tvguide.dutch,'traffic','blocktitle_spotify','spotify']
columns[3]['width'] = 2; 

////////////////////// STANDBY /////////////////////////
var columns_standby = {}
columns_standby[1] = {}
columns_standby[1]['blocks'] = ['clock','weather']
columns_standby[1]['width'] = 12;


////////////////////// SCREEENS /////////////////////////
var screens = {}
screens[1] = {}
// Background  image files must be in the "img" folder
screens[1]['background'] = 'bg4.jpg';
screens[1]['background_morning'] = 'day.jpg'; //morning = 06:00-10:59
screens[1]['background_noon'] = 'day.jpg'; //noon = 11:00-15:59 
screens[1]['background_afternoon'] = 'day.jpg'; //afternoon 16:00-19:59 
screens[1]['background_night'] = 'night.jpg'; //night = 20:00:05:59 
screens[1]['columns'] = [1,2,3]

CSS

Code: Select all

/*
CUSTOM CSS FILE
*/

/* ////////////////  Icon colors ////////////////////////*/
.fa.fa-lightbulb-o.on,
.fa.fa-volume-up.on, /*used for subwoofer*/ 
.fa.fa-circle.on {  /*used for device status*/
    color: #3EFF00;
}

.fa.fa-circle.off {   /*used for device status*/
    color: #ff0000;
}

/* Standard the opacity of the buttons is less (0.4) to make them grey*/
.off.icon {
	opacity:1 !important;
}



/*CHANGE ICON SIZES */
    /* Make all icons bigger */
    .fa,.wi {
       font-size:30px !important;
    }
    /* Make device status dots smaller */
    .fa.fa-circle {
        font-size: 15px !important;
        }

    


/* //////////// Background of blocks /////////////// */
.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:15px;
	padding-bottom:15px;
	border: 5px solid rgba(255,255,255,0);		/* border: 7px -> 3px - Smaller space between blocks */
	background: rgba(0,0,0,0.2);				
	background-clip: padding-box;
	border-radius: 20px;						/* Round corners */ 
    
}

/* Make doorbell block invisible */
.transbg.block_89 {
    opacity: 0;
    height: 1px;
    padding-top:1px;
	padding-bottom:1px;
}


/* Change background height of device status blocks */
.transbg.block_118,
.transbg.block_121,
.transbg.block_122{
	height: 10px;
    padding: 10px;
    line-height: 1px; /* makes the device text move up to the center of the block.*/
}
.fa.fa-circle.on,     
.fa.fa-circle.off {  
    margin-top: -8px; /* makes the device icon to move up to the center of the block */
    padding-right: 1px;
}


/* Change background height of blocks with width 4, i.e. scene and door sensor blocks */
.transbg.col-xs-4{
	height: 70px;
    padding: 12px;
    line-height: 15px;
    font-size: 10pt;
}


/* Make the background of the titleblocks less high */
.transbg.titlegroups {
	height: 50px;
    padding: 0px;
}
/* Same for titleblock of current weather - NOT USED AT THE MOMENT
.transbg.big.block_currentweather_big {
    height: 50px;
    padding: 0px;
    line-height: 1px;
}*/

    

/* //////////// TOP BAR MODS ////////// */
/* Change size of sunrise and sunset plus icons in top bar*/
.wi.wi-sunrise, /* icons */
.wi.wi-sunset {
    font-size: 18pt !important;
}
.sunrise, /* timestamp */
.sunset {
    font-size: 13pt !important;
}





/* //////////// DIMMER SLIDER MODS ////////// */
.block_70 .ui-slider-handle, 
.block_72 .ui-slider-handle,
.block_93 .ui-slider-handle,
.block_74 .ui-slider-handle {
    background-color: #00aaff;
    border-radius: 25px;
    border-color:  #00aaff;
    height: 20px;
    width: 20px;
    margin-top: -6px; /* Slider handle and horizontal bar are related, to center the handle, play with margin*/
}
.block_70 .ui-slider-horizontal, 
.block_72 .ui-slider-horizontal,
.block_93 .ui-slider-horizontal,
.block_74 .ui-slider-horizontal {
    background-color: #fff;
    border-color: transparent;
    height: 3px;
}

Once I can select a device to play my Spotify playlist on, I will definitely buy rob a couple of beers! He's done a great job

[remb0]

I have a few (i hope small) questions:

1: google maps is not showing a map anymore.


2: Color bulbs on my hue not showing on screen. (known issue with rgbw?)


3: news is not showing (I use nu.nl as default and tweakers as second)
used with crossorigin and without.
with F12 i see:
XMLHttpRequest cannot load https://crossorigin.me/http://www.nu.nl/rss/Algemeen. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://192.168.0.8:8080' is therefore not allowed access. The response had HTTP status code 503.


4:
a iframe is not nice looking.
when using this code it's nice but My popup of cammeras are ugly. who has the right code to let the popups intact and the iframe nicer?

Spoiler: show

Code: Select all

/*
Verkleinen iframes
iframe {
-moz-transform: scale(0.80, 0.80);
-webkit-transform: scale(0.65, 0.65);
-o-transform: scale(0.65, 0.65);
-ms-transform: scale(0.65, 0.65);
-transform: scale(0.65, 0.65);
-moz-transform-origin: top left;
-webkit-transform-origin: top left;
-o-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
height:700px !important;
width:50vw !important;
overflow:hidden !important;
}
*/

5: got lots of calls like:

Spoiler: show

Code: Select all

VM445 pubads_impl_150.js:1 GET https://securepubads.g.doubleclick.net/gampad/ads?gdfp_req=1&correlator=2782147972516595&output=json_html&callback=googletag.impl.pubads.callbackProxy6&impl=fifs&json_a=1&eid=108809103&sc=0&sfv=1-0-10&iu_parts=7571%2CTEST-Weeronline_NL%2Cdesktop-web%2CTest-0001_lazyloading%2CGroup_A&enc_prev_ius=%2F0%2F1%2F2%2F3%2F4&prev_iu_szs=728x90%7C970x90&prev_scp=event%3DadSettings%26p%3Dlocale%26lang%3Dnl%26dext%3D.nl%26d%3D4057857-Dordrecht%26c%3D135-Nederland%26wcd%3Dbw____-wait-for-description-from-node-service%26wtd%3D18%26wctd%3Dwb____-wait-for-description-from-node-service%26wttd%3D20%26wcm%3Dbw____-wait-for-description-from-node-service%26wtm%3D17%26wctm%3Dbw____-wait-for-description-from-node-service%26wttm%3D19%26gtm.uniqueEventId%3D7&cookie_enabled=1&cdm=www.weeronline.nl&lmt=1505926277&dt=1505926277350&frm=24&biw=-12245933&bih=-12245933&isw=0&ish=0&oid=3&adxs=0&adys=0&adks=3544500888&gut=v2&ifi=11&ifk=2517980815&u_tz=120&u_his=50&u_h=864&u_w=1536&u_ah=824&u_aw=1536&u_cd=24&u_nplug=4&u_nmime=5&u_sd=1.25&flash=0&nhd=1&iag=3&url=http%3A%2F%2Fwww.weeronline.nl%2FEuropa%2FNederland%2FDordrecht%2F4057857%3Ft%3D1505926272817&ref=http%3A%2F%2F192.168.0.8%3A8080%2Fdashboard%2Findex.html&top=http%3A%2F%2F192.168.0.8%3A8080%2Fdashboard%2Findex.html&dssz=31&icsg=183075080320&std=0&vrg=150&vis=1&ga_vid=1585532819.1505837635&ga_sid=1505926277&ga_hid=52886125 net::ERR_BLOCKED_BY_CLIENT
hc @ VM445 pubads_impl_150.js:1
Ko @ VM445 pubads_impl_150.js:1
gm @ VM445 pubads_impl_150.js:1
$u @ VM445 pubads_impl_150.js:1
Zu @ VM445 pubads_impl_150.js:1
Zr @ VM445 pubads_impl_150.js:1
rm @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
H @ VM445 pubads_impl_150.js:1
Xr.Jd @ VM445 pubads_impl_150.js:1
h.fillSlot @ VM445 pubads_impl_150.js:1
h.ta @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
value @ VM516 bundle.js:45
(anonymous) @ VM516 bundle.js:45
kq.push @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
wr @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
fv @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
(anonymous) @ VM445 pubads_impl_150.js:1
VM445 pubads_impl_150.js:1 GET https://securepubads.g.doubleclick.net/static/3p_cookie.html net::ERR_BLOCKED_BY_CLIENT

6: my link to nas is not showing.?

MY screens:

Dashticz1.jpg (220.82 KiB) Viewed 8090 times

dashticz.png (388.46 KiB) Viewed 8090 times

my config:

Spoiler: show

Code: Select all

var config = {}
config['edit_mode'] = 0;
config['domoticz_ip'] = 'sensored';
config['app_title'] = 'Dashticz';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '60';
config['default_news_url'] = 'https://crossorigin.me/http://www.nu.nl/rss/Algemeen';
config['news_scroll_after'] = '4';
config['standby_after'] = 0;
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '10';
config['auto_slide_pages'] = 0;
config['slide_effect'] = 'slide';
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'] = 'sensored';
config['gm_zoomlevel'] = '10';
config['gm_latitude'] = '51.860067';
config['gm_longitude'] = '4.412692';
config['wu_api'] = 'sensored';
config['wu_city'] = 'Dordrecht';
config['wu_name'] = 'Weer';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = 0;
config['switch_horizon'] = 0;
config['host_nzbget'] = 'http://sensored';
config['spot_clientid'] = 'sensored';
config['sonarr_url'] = 'http://192.168.0.10:8989';
config['sonarr_apikey'] = 'sensored';
config['sonarr_maxitems'] = '7';
config['garbage_company'] = 'hvc';
config['garbage_icalurl'] = 0;
config['garbage_zipcode'] = 'sensored LN';
config['garbage_street'] = 'sensored 39';
config['garbage_housenumber'] = '39';
config['garbage_maxitems'] = 0;
config['garbage_width'] = 0;
config['selector_instead_of_buttons'] = 1;
config['auto_positioning'] = 1;
config['use_favorites'] = 1;
config['last_update'] = 1;
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['garbage_hideicon'] = 0;

// Afvalwijzer
var trashnames = {}
trashnames['Gft']			= 			'GFT';
trashnames['Pmd']			= 			'Plastic';
var trashcolors 			= {}
trashcolors['Gft'] 			= 			'Green';
trashcolors['Pmd'] 			= 			'Orange';
trashcolors['Papier'] 		= 			'Blue';
trashcolors['Restafval'] 	=			'Red';
var _DO_NOT_USE_COLORED_TRASHCAN = false

var tvguide = {}
tvguide.dutch = { key:'dutch', icon: 'fa-television', width:12, channels: [1,2,3,4,31,46,92], maxitems: 10 }

//Buttons or images to open webpages in an iframe, like a news website or weather forecast
var buttons = {}
buttons.webcam1 = { width:6, isimage:true, refresh:5000, image: 'http://sensored/image.jpg', url: 'http://sensored/image.jpg' }
buttons.webcam2 = { width:6, isimage:true, refresh:5000, image: 'sensored' }
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image: 'http://api.buienradar.nl/image/1.0/RadarMapNL?w=sensored', url: 'http://www.weeronline.nl/Europa/Nederland/Dordrecht/sensored'}
buttons.radio = {width:12, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm'}
buttons.nzbget = {width:12, icon: 'fa-download', title: 'NZBget', url: 'http://sensored:6789'}
buttons.log = {key:'log', width:12, icon:'fa-microchip', title: 'Domoticz Log', log:true, level: 2}

var _STREAMPLAYER_TRACKS = [
   {"track":1,"name":"Q-music","file":"http://icecast-qmusic.cdp.triple-it.nl/Qmusic_nl_live_96.mp3"},
   {"track":2,"name":"538 Hitzone","file":"http://vip-icecast.538.lw.triple-it.nl/WEB11_MP3"},
   {"track":3,"name":"Slam! NonStop","file":"http://stream.radiocorp.nl/web10_mp3"},
   {"track":4,"name":"100%NL","file":"http://stream.100p.nl/100pctnl.mp3"},
   {"track":5,"name":"StuBru","file":"http://mp3.streampower.be/stubru-high.mp3"},
   {"track":6,"name":"NPO Radio 1","file":"http://icecast.omroep.nl/radio1-bb-mp3"},
   {"track":7,"name":"Omroep Brabant","file":"http://streaming.omroepbrabant.nl/mp3"},
];

var calendars = {}
calendars.private = { maxitems: 5, icalurl: 'sensored' }

var frames = {}
frames.secpanel = {height:390,frameurl:"http://sensored:8080/secpanel/index.html",width:12}

var screens = {}
screens[1] = {}
screens[1]['background'] = 'bg7.jpg';
screens[1]['columns'] = [1,2,3]

screens[2] = {}
screens[2]['background'] = 'bg2.jpg';
screens[2]['columns'] = [4,5,6]

screens[3] = {}
screens[3]['background'] = 'bg8.jpg';
screens[3]['columns'] = [7,8,9] //blocks can be size 6

screens[4] = {}
screens[4]['background'] = 'bg9.jpg';
//screens[4]['background_morning'] = 'bg_morning.jpg';
//screens[4]['background_noon'] = 'bg_noon.jpg';
//screens[4]['background_afternoon'] = 'bg_afternoon.jpg';
//screens[4]['background_night'] = 'bg_night.jpg';
screens[4]['columns'] = [10,11,12] //blocks can be size 6

var blocks = {}

blocks['clock'] = {}
blocks['clock']['width'] = 12;

blocks['news_2'] = {} 
blocks['news_2']['feed'] = 'http://feeds.feedburner.com/tweakers/nieuws';

blocks['sonarr'] = {}
blocks['sonarr']['title'] = 'Sonarr';
blocks['sonarr']['title_position'] = 'left';
blocks['sonarr']['view'] = 'Banner';
blocks['sonarr']['width'] = 5;

blocks['nas'] = {} // Ping Esx
blocks['nas']['width'] = 3;
blocks['nas']['icon'] = 'fa-server';
blocks['nas']['title'] = 'NAS';
blocks['nas']['link'] = 'http://192.168.0.99';
blocks['nas']['target'] = 'iframe'; // iframe, tab, window

//Scene blocks
blocks['s7'] = {} // tuin
blocks['s7']['width'] = 3;
blocks['s7']['icon'] = 'fa-bed';

blocks['s3'] = {} // Alles uit
blocks['s3']['width'] = 4;
blocks['s3']['protected'] = true;
blocks['s3']['hide_data'] = true;
blocks['s3']['icon'] = 'fa-bed';

blocks['blocktitle_2'] = {}
blocks['blocktitle_2']['type'] = 'blocktitle';
blocks['blocktitle_2']['title'] = 'Switches';

blocks[30] = {} 
blocks[30]['width'] = 6;
blocks[30]['title'] = 'keuken';

blocks[829] = {} 
blocks[829]['width'] = 6;
blocks[829]['title'] = 'eettafel';

blocks[136] = {}
blocks[136]['width'] = 6;
blocks[136]['title'] = 'salon';

blocks['blocktitle_3'] = {}
blocks['blocktitle_3']['type'] = 'blocktitle';
blocks['blocktitle_3']['title'] = 'Temperature';

blocks['blocktitle_4'] = {}
blocks['blocktitle_4']['type'] = 'blocktitle';
blocks['blocktitle_4']['title'] = 'Beneden';

blocks['blocktitle_5'] = {}
blocks['blocktitle_5']['type'] = 'blocktitle';
blocks['blocktitle_5']['title'] = 'Tuin';

blocks['blocktitle_6'] = {}
blocks['blocktitle_6']['type'] = 'blocktitle';
blocks['blocktitle_6']['title'] = 'Boven';

blocks['blocktitle_7'] = {}
blocks['blocktitle_7']['type'] = 'blocktitle';
blocks['blocktitle_7']['title'] = 'Overig';

blocks['blocktitle_30'] = {}
blocks['blocktitle_30']['type'] = 'blocktitle';
blocks['blocktitle_30']['title'] = 'Gas';

blocks['blocktitle_31'] = {}
blocks['blocktitle_31']['type'] = 'blocktitle';
blocks['blocktitle_31']['title'] = 'Elektra';

blocks['blocktitle_32'] = {}
blocks['blocktitle_32']['type'] = 'blocktitle';
blocks['blocktitle_32']['title'] = 'Water';

//screen1
var columns = {}
columns[1] = {}
columns[1]['blocks'] = ['clock','garbage',calendars.private ,buttons.radio,'streamplayer'];
columns[1]['width'] = 3;


columns[2] = {}
columns[2]['blocks'] = ['weather','trafficmap','traffic','news','news_2'];
columns[2]['width'] = 4;

//woonkamer & tuin
columns[3] = {}
columns[3]['blocks'] = ['blocktitle_4',829,136,1023,88,'s3',951,14,994,1023,1877,1878,1903,30];
columns[3]['width'] = 5;


//screen2
columns[4] = {}
columns[4]['blocks'] = ['blocktitle_5', 1047,14, 'blocktitle_6', 560, 1170, 11, 1016, 1170, 1143, 1111, 1022];
columns[4]['width'] = 4;

columns[5] = {}
columns[5]['blocks'] = ['blocktitle_7',3,2,606,1459,1458,951];
columns[5]['width'] = 4;

columns[6] = {}
columns[6]['blocks'] = [buttons.webcam1,buttons.webcam2,frames.secpanel];
columns[6]['width'] = 4;

//screen3
columns[7] = {} //gas
columns[7]['blocks'] = ['blocktitle_30','graph_3'];
columns[7]['width'] = 4;

columns[8] = {} //energie
columns[8]['blocks'] = ['blocktitle_31','graph_2'];
columns[8]['width'] = 4;

columns[9] = {} //water
columns[9]['blocks'] = ['blocktitle_32','graph_606'];
columns[9]['width'] = 4;


//screen4
columns[10] = {} 
columns[10]['blocks'] = [buttons.buienradar,buttons.nzbget,buttons.log,'nas'];
columns[10]['width'] = 3;

//tvguide.dutch
columns[11] = {} 
columns[11]['blocks'] = [tvguide.dutch,'news','news_2'];
columns[11]['width'] = 4;

columns[12] = {} //4
columns[12]['blocks'] = ['sonarr'];
columns[12]['width'] = 5;

who can help me to make my dashboard awesome?

[robgeerts]

The doubleclick.net calls are probable from another site...for example an iframe you use or something like that.. currently on vacation so not able to take a closer look untill next week.

[Ingmar]

I have the same issue with news and traffic map, so I'm curious what the solution will be

[remb0]

You are right they coming from the weatherplugin.

but the rest of my questions still remains I hope you enjoyed your holidays!!

The doubleclick.net calls are probable from another site...for example an iframe you use or something like that.. currently on vacation so not able to take a closer look untill next week.

[stuffer]

For the news I use:

Code: Select all

'https://cors-anywhere.herokuapp.com/http://www.nu.nl/rss';

and not the:

Code: Select all

'https://crossorigin.me/http://www.nu.nl/rss/Algemeen'

[remb0]

Thanks! the news is fixed!! thank you very much it help to use your url prefix.

[h143]

Been busy with my dashboard over the last week. There are still some things that aren't working, like the news block and trafficmap. I have no clue why it doesn't work... so if anyone has a suggestion, please let me know


dash.jpg



I've added my doorbell device but made it hidden so that you can hear a doorbell sound on the tablet but you can't see anything on the dashboard.

Config

Code: Select all

////////////////////// GENERAL CONFIG /////////////////////////
var config = {}
config['domoticz_ip'] = 'XXX';
config['app_title'] = 'Dashboard';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '60';
config['default_news_url'] = 'https://crossorigin.me/http://feeds.bbci.co.uk/news/world/europe/rss.xml';
config['news_scroll_after'] = '7';
config['standby_after'] = 0;
config['auto_swipe_back_to'] = 1;
config['auto_swipe_back_after'] = '10';
config['auto_slide_pages'] = 0;
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'] = 0;
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = 'XXX';
config['gm_zoomlevel'] = '8';
config['gm_latitude'] = 'XXX';
config['gm_longitude'] = 'XXX';
config['wu_api'] = 'XXX';
config['wu_city'] = 'The Hague';
config['wu_name'] = 'in The Hague';
config['wu_country'] = 'NL';
config['idx_moonpicture'] = 0;
config['switch_horizon'] = 0;
config['host_nzbget'] = 0;
config['spot_clientid'] = 'XXX';
config['garbage_company'] = 0;
config['garbage_icalurl'] = 0;
config['garbage_zipcode'] = 0;
config['garbage_street'] = 0;
config['garbage_housenumber'] = 0;
config['garbage_maxitems'] = 0;
config['garbage_width'] = 0;
config['selector_instead_of_buttons'] = 0;
config['auto_positioning'] = 0;
config['use_favorites'] = 0;
config['last_update'] = 1;
config['hide_topbar'] = 0;
config['hide_seconds'] = 1;
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;


//var trashnames = {}
//trashnames['Gft'] = 'GFT';
//trashnames['Pmd'] = 'Plastic';
//trashnames['Rest'] = 'Rest'; //LEAVE EMPTY IF YOU WANT TO HIDE IT


var tvguide = {}
tvguide.dutch = { key:'dutch', icon: 'fa-television', width:12, channels: [7,8,464,25,438], maxitems: 8 }

var _STREAMPLAYER_TRACKS  	= [
	{"track":1,"name":"Q-music","file":"http://icecast-qmusic.cdp.triple-it.nl/Qmusic_nl_live_96.mp3"},
	{"track":2,"name":"538 Hitzone","file":"http://vip-icecast.538.lw.triple-it.nl/WEB11_MP3"},
	{"track":3,"name":"Slam! NonStop","file":"http://stream.radiocorp.nl/web10_mp3"},
	{"track":4,"name":"BBC Radio 1","file":"http://radiofeeds.co.uk/bbcradio1.pls"},  ]; 



////////////////////// FRAMES ///////////////////////////
var frames = {}
frames.weather = {refreshiframe:10000,height:230,frameurl:"//forecast.io/embed/#lat=52.081316&lon=4.383277&name=The Hague&color=#00aaff&font=Helvetica&fontcolor=#ffffff&units=si&text-color=#fff",width:12}



////////////////////// BUTTONS /////////////////////////
var buttons = {}
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image:'http://api.buienradar.nl/image/1.0/RadarMapNL?w=285&h=256', url:'https://gadgets.buienradar.nl/gadget/zoommap/?lat=52.06022&lng=4.39288&overname=2&zoom=13&naam=2493bj&size=3&voor=1'}



////////////////////// BLOCK TITLES /////////////////////////
var blocks = {}
blocks['blocktitle_tv'] = {}
blocks['blocktitle_tv']['key'] = 'blocktitle_tv';
blocks['blocktitle_tv']['type'] = 'blocktitle';
blocks['blocktitle_tv']['title'] = 'TV and news';

blocks['blocktitle_switches'] = {}
blocks['blocktitle_switches']['key'] = 'blocktitle_switches';
blocks['blocktitle_switches']['type'] = 'blocktitle';
blocks['blocktitle_switches']['title'] = 'Controlling the lights';

blocks['blocktitle_temp'] = {}
blocks['blocktitle_temp']['key'] = 'blocktitle_temp';
blocks['blocktitle_temp']['type'] = 'blocktitle';
blocks['blocktitle_temp']['title'] = 'Temperatures inside';

blocks['blocktitle_doors'] = {}
blocks['blocktitle_doors']['key'] = 'blocktitle_doors';
blocks['blocktitle_doors']['type'] = 'blocktitle';
blocks['blocktitle_doors']['title'] = 'Doors and windows';

blocks['blocktitle_spotify'] = {}
blocks['blocktitle_spotify']['key'] = 'blocktitle_spotify';
blocks['blocktitle_spotify']['type'] = 'blocktitle';
blocks['blocktitle_spotify']['title'] = 'Spotify';



// custom block width for switches

blocks['news_2'] = {}
blocks['news_2']['feed'] = 'http://feeds.bbci.co.uk/news/world/europe/rss.xml';

blocks[104] = {} //
blocks[104]['width'] = 4;
blocks[104]['title'] = 'The front door is now:'

blocks['s1'] = {} //Scene Front room all off
blocks['s1']['hide_data'] = true;
blocks['s1']['hide_lastupdate'] = true;
blocks['s1']['icon'] = 'fa-times-circle';

blocks['s2'] = {} //Movie scene
blocks['s2']['hide_data'] = true;
blocks['s2']['hide_lastupdate'] = true;
blocks['s2']['icon'] = 'fa-video-camera';

blocks['s3'] = {} //Evening scene
blocks['s3']['hide_data'] = true;
blocks['s3']['hide_lastupdate'] = true;
blocks['s3']['icon'] = 'fa-image';





blocks[73] = {} //kitchen light string
blocks[73]['width'] = 6;
blocks[73]['title'] = 'Kitchen light string'
blocks[73]['hide_data'] = true;
blocks[73]['hide_lastupdate'] = true;

blocks[93] = {} //kitchen spots dimmer
blocks[93]['width'] = 6;
blocks[93]['title'] = 'Kitchen spots'
blocks[93]['hide_data'] = true;
blocks[93]['hide_lastupdate'] = true;

blocks[74] = {}
blocks[74]['width'] = 6;
blocks[74]['title'] = 'Cupboard spots'
blocks[74]['hide_data'] = true;
blocks[74]['hide_lastupdate'] = true;

blocks[72] = {}
blocks[72]['width'] = 6;
blocks[72]['title'] = 'Ceiling light'
blocks[72]['hide_data'] = true;
blocks[72]['hide_lastupdate'] = true;

blocks[44] = {}
blocks[44]['width'] = 6;
blocks[44]['title'] = 'Floor lamp'
blocks[44]['hide_data'] = true;
blocks[44]['hide_lastupdate'] = true;

blocks[18] = {}
blocks[18]['width'] = 6;
blocks[18]['title'] = 'TV light'
blocks[18]['hide_data'] = true;
blocks[18]['hide_lastupdate'] = true;

blocks[70] = {}
blocks[70]['width'] = 6;
blocks[70]['title'] = 'Couch light'
blocks[70]['hide_data'] = true;
blocks[70]['hide_lastupdate'] = true;

blocks[17] = {}
blocks[17]['width'] = 6;
blocks[17]['title'] = 'Subwoofer'
blocks[17]['hide_data'] = true;
blocks[17]['hide_lastupdate'] = true;
blocks[17]['icon'] = 'fa-volume-up';

blocks[92] = {}
blocks[92]['width'] = 6;
blocks[92]['title'] = 'Bedroom fairy lights'
blocks[92]['hide_data'] = true;
blocks[92]['hide_lastupdate'] = true;

// DOORBELL
blocks[89] = {}
blocks[89]['width'] = 1;
blocks[89]['title'] = ''
blocks[89]['hide_data'] = true;
blocks[89]['hide_lastupdate'] = true;
blocks[89]['playsound'] = 'sounds/doorbell.mp3';
blocks[89]['protected'] = true;
blocks[89]['icon'] = 'fa-bell-o';

//change temp blocks size
blocks[82] = {}
blocks[82]['width'] = 3;

blocks[52] = {}
blocks[52]['width'] = 3;

blocks[54] = {}
blocks[54]['width'] = 3;

blocks[81] = {}
blocks[81]['width'] = 3;
blocks[81]['title'] = 'Change temp.'

//Device status - ping results
blocks[122] = {}
blocks[122]['width'] = 12;
blocks[122]['title'] = 'Internet'
blocks[122]['hide_data'] = true;
blocks[122]['hide_lastupdate'] = true;
blocks[122]['icon'] = 'fa-circle';
blocks[122]['protected'] = true;

blocks[118] = {}
blocks[118]['width'] = 12;
blocks[118]['title'] = 'Our network'
blocks[118]['hide_data'] = true;
blocks[118]['hide_lastupdate'] = true;
blocks[118]['icon'] = 'fa-circle';
blocks[118]['protected'] = true;

blocks[121] = {}
blocks[121]['width'] = 12;
blocks[121]['title'] = 'Printer'
blocks[121]['hide_data'] = true;
blocks[121]['hide_lastupdate'] = true;
blocks[121]['icon'] = 'fa-circle';
blocks[121]['protected'] = true;


//blocks['sunrise'] = {}
//blocks['sunrise']['width'] = 1;

//blocks['miniclock'] = {}
//blocks['miniclock']['width'] = 7;


// My IDX list
// 73 = kitchen light string
// 93 = Kitchen spots
// 74 = Cupboard spots
// 72 = Ceiling light
// 44 = Floor lamp
// 18 = TV light
// 70 = Couch light
// 17 = Subwoofer
// 92 = Bedroom fairy lights


////////////////////// COLUMNS /////////////////////////
var columns = {}
columns['bar'] = {}
columns['bar']['blocks'] = ['sunrise','miniclock',89]
					
columns[1] = {}
columns[1]['blocks'] = ['blocktitle_switches','s1','s3','s2',73,93,74,72,44,18,70,17,92]
columns[1]['width'] = 5;

columns[2] = {}
columns[2]['blocks'] = [frames.weather,'blocktitle_temp',81,82,'54_1','52_1','blocktitle_doors',104,'news','trafficmap']
columns[2]['width'] = 5; 

columns[3] = {}
columns[3]['blocks'] = [122,118,121,buttons.buienradar,'news_2',tvguide.dutch,'traffic','blocktitle_spotify','spotify']
columns[3]['width'] = 2; 

////////////////////// STANDBY /////////////////////////
var columns_standby = {}
columns_standby[1] = {}
columns_standby[1]['blocks'] = ['clock','weather']
columns_standby[1]['width'] = 12;


////////////////////// SCREEENS /////////////////////////
var screens = {}
screens[1] = {}
// Background  image files must be in the "img" folder
screens[1]['background'] = 'bg4.jpg';
screens[1]['background_morning'] = 'day.jpg'; //morning = 06:00-10:59
screens[1]['background_noon'] = 'day.jpg'; //noon = 11:00-15:59 
screens[1]['background_afternoon'] = 'day.jpg'; //afternoon 16:00-19:59 
screens[1]['background_night'] = 'night.jpg'; //night = 20:00:05:59 
screens[1]['columns'] = [1,2,3]

CSS

Code: Select all

/*
CUSTOM CSS FILE
*/

/* ////////////////  Icon colors ////////////////////////*/
.fa.fa-lightbulb-o.on,
.fa.fa-volume-up.on, /*used for subwoofer*/ 
.fa.fa-circle.on {  /*used for device status*/
    color: #3EFF00;
}

.fa.fa-circle.off {   /*used for device status*/
    color: #ff0000;
}

/* Standard the opacity of the buttons is less (0.4) to make them grey*/
.off.icon {
	opacity:1 !important;
}



/*CHANGE ICON SIZES */
    /* Make all icons bigger */
    .fa,.wi {
       font-size:30px !important;
    }
    /* Make device status dots smaller */
    .fa.fa-circle {
        font-size: 15px !important;
        }

    


/* //////////// Background of blocks /////////////// */
.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:15px;
	padding-bottom:15px;
	border: 5px solid rgba(255,255,255,0);		/* border: 7px -> 3px - Smaller space between blocks */
	background: rgba(0,0,0,0.2);				
	background-clip: padding-box;
	border-radius: 20px;						/* Round corners */ 
    
}

/* Make doorbell block invisible */
.transbg.block_89 {
    opacity: 0;
    height: 1px;
    padding-top:1px;
	padding-bottom:1px;
}


/* Change background height of device status blocks */
.transbg.block_118,
.transbg.block_121,
.transbg.block_122{
	height: 10px;
    padding: 10px;
    line-height: 1px; /* makes the device text move up to the center of the block.*/
}
.fa.fa-circle.on,     
.fa.fa-circle.off {  
    margin-top: -8px; /* makes the device icon to move up to the center of the block */
    padding-right: 1px;
}


/* Change background height of blocks with width 4, i.e. scene and door sensor blocks */
.transbg.col-xs-4{
	height: 70px;
    padding: 12px;
    line-height: 15px;
    font-size: 10pt;
}


/* Make the background of the titleblocks less high */
.transbg.titlegroups {
	height: 50px;
    padding: 0px;
}
/* Same for titleblock of current weather - NOT USED AT THE MOMENT
.transbg.big.block_currentweather_big {
    height: 50px;
    padding: 0px;
    line-height: 1px;
}*/

    

/* //////////// TOP BAR MODS ////////// */
/* Change size of sunrise and sunset plus icons in top bar*/
.wi.wi-sunrise, /* icons */
.wi.wi-sunset {
    font-size: 18pt !important;
}
.sunrise, /* timestamp */
.sunset {
    font-size: 13pt !important;
}





/* //////////// DIMMER SLIDER MODS ////////// */
.block_70 .ui-slider-handle, 
.block_72 .ui-slider-handle,
.block_93 .ui-slider-handle,
.block_74 .ui-slider-handle {
    background-color: #00aaff;
    border-radius: 25px;
    border-color:  #00aaff;
    height: 20px;
    width: 20px;
    margin-top: -6px; /* Slider handle and horizontal bar are related, to center the handle, play with margin*/
}
.block_70 .ui-slider-horizontal, 
.block_72 .ui-slider-horizontal,
.block_93 .ui-slider-horizontal,
.block_74 .ui-slider-horizontal {
    background-color: #fff;
    border-color: transparent;
    height: 3px;
}

Once I can select a device to play my Spotify playlist on, I will definitely buy rob a couple of beers! He's done a great job

wow great dashboard, do you have the imagefiles?

[Ingmar]

Been busy with my dashboard over the last week. There are still some things that aren't working, like the news block and trafficmap. I have no clue why it doesn't work... so if anyone has a suggestion, please let me know

wow great dashboard, do you have the imagefiles?

Of which images? The background?

[Ingmar]

For the news I use:

Code: Select all

'https://cors-anywhere.herokuapp.com/http://www.nu.nl/rss';

That totally fixed it for me too, thanks a lot!


Now all that's left is the traffic map...

[Ingmar]

6: my link to nas is not showing.?

my config:

Code: Select all

var config = {}
blocks['nas'] = {} // Ping Esx
blocks['nas']['width'] = 3;
blocks['nas']['icon'] = 'fa-server';
blocks['nas']['title'] = 'NAS';
blocks['nas']['link'] = 'http://192.168.0.99';
blocks['nas']['target'] = 'iframe'; // iframe, tab, window

I don't have a solution, but an alternative way. This is how I'm using it for pinging my printer:
I've made a virtual switch in domoticz called Printer_status. Then in domoticz Setup > Events, I created a new Lua/Time event with the following code:

Code: Select all

commandArray = {}
 
--Ping printer 
 ping_success=os.execute('ping -c1 192.168.1.1')
 if ping_success then
   print("ping success")
   commandArray['Printer_status']='On'
 else
   print("ping fail")
   commandArray['Printer_status']='Off'	
end

return commandArray

Then in the dashboard it's a block like any other light switch. Then pick an icon from Font Awesome and you can do anything you like with it. I made this of it:

status.JPG (96.21 KiB) Viewed 7766 times

[Toinevanlieshout]

Yes, I did the frame myself.. I took a few hours to get there

1 measure the aluminum U frame 10 times.
2 saw the frames in a 45 degree angle.
3 on the backside I used a very firm cardboard where I glued the frames on.
4 drill a hole in the wall (my wife was not around at than moment ) to get the wire trough.

5 done !

Very nice frame! Can you please explain how you made the cuts for the home button and camera?

Thanks!

[SuperMouse]

Hi Toine.

I just used a round file and a lot of sandpaper to make the cuts.

Hope this helps.

[garethhowell]

Has anybody got to the bottom of why Google Maps is not displaying with the V2 Dashboard?

[ArjanPeeters]

I'll show mine here for inspiration to all.

First of all i've used a nexus 7 from 2013 because it's still a good tablet and it has Qi charging. And i could get my hands on a second hand for only 70,-

What have i done:
I've bolted six magnets to my wall. And glued six counter parts to the nexus. Then i've drilled a hole thru the wall in to the closet on the other side.
Opened a cheap five euro wireless charger pad and glued the coil to the wall in the middel of the magnets. Connected it to the electronics of the charger on the other side in my closed. And now i don't see any charger cables!







And of course the code. It's not ready jet. Because i need my brother-in-law to do the css stuff. But so far it looks clean!

Config.JS

Spoiler: show

var config = {};
config['domoticz_ip'] = 'http://192.168.2.3:8080';
config['app_title'] = 'PeeterSmit';
config['domoticz_refresh'] = '5';
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'] = '10';
config['auto_slide_pages'] = 0;
config['slide_effect'] = 'slide';
config['language'] = 'nl_NL';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'en_US';
config['calendarurl'] = 0;
config['boss_stationclock'] = 'RedBoss';
config['gm_api'] = 0;
config['gm_zoomlevel'] = 0;
config['gm_latitude'] = 0;
config['gm_longitude'] = 0;
config['wu_api'] = 'xx';
config['wu_city'] = 'Haarlem';
config['wu_name'] = 0;
config['wu_country'] = 'NL';
config['idx_moonpicture'] = 0;
config['switch_horizon'] = 0;
config['host_nzbget'] = 0;
config['spot_clientid'] = 'xx';
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['slider_timeout'] = 1000; // 1 sec.

var buttons = {};
buttons.buienradar = { key: 'buienradar', width:12, isimage:true, refreshimage:30000, image: 'http://api.buienradar.nl/image/1.0/Rada ... =300&h=300', url: 'http://www.buienalarm.nl/widget/graphic ... lor=4395c7'};
buttons.webcam = {width:8, isimage:false, refresh:2000, url: 'http://xx'}

// Scenes
var blocks = {};

blocks['s2'] = {
width: 12,
hide_data: true,
icon: 'fa-home'
}; // Alles uit

blocks['s3'] = {
width: 12,
hide_data: true,
icon: 'fa-home'
}; // TV kijken

blocks['s4'] = {
width: 12,
hide_data: true,
icon: 'fa-home'
}; // Aan tafel

blocks['s5'] = {
width: 12,
hide_data: true,
icon: 'fa-home'
}; // Alles Aan

blocks['s6'] = {
width: 12,
hide_data: true,
icon: 'fa-home'
}; // Koken

// Schakelaars

blocks[17] = {
width: 12,
hide_data: true
}; // Lichtkoof RGBW

blocks[51] = {
width: 12,
hide_data: true
}; // tafel

blocks[65] = {
width: 12,
hide_data: true
}; // Wand lampen

blocks[81] = {
width: 12,
hide_data: true
}; // schemer lampen

blocks[102] = {
width: 12,
hide_data: true
}; // Eiland

// sensoren
blocks[125] = {
width: 12,
hide_data: true
};

blocks[130] = {
width: 12,
hide_data: true
};

blocks[135] = {
width: 12,
hide_data: true
};

blocks[140] = {
width: 12,
hide_data: true
};

blocks[145] = {
width: 12,
hide_data: true
};

blocks[150] = {
width: 12,
icon: 'fa-music fa-x2'
}; //radio

blocks[154] = {
width: 12,
title: " "
} //aanwezig



// titels
blocks['blocktitle_1'] = {
type: 'blocktitle',
title: 'Scenes'
};

blocks['blocktitle_2'] = {
type: 'blocktitle',
title: 'Schakelaars',
width: 6
};

blocks['blocktitle_3'] = {
type: 'blocktitle',
title: 'Sensors'
};

// kalenders
var calendars = {};
calendars.business = { maxitems: 5, url: 'https://calendar.google.com/calendar/', icalurl: 'https://calendar.google.com/calendar/' };
calendars.private = { maxitems: 5, icalurl: 'https://cors-anywhere.herokuapp.com/htt ... /calendar/' };

// Camera



//kolommen
var columns = {};
columns[1] = {
width: 2,
blocks: [
'blocktitle_1',
's5',
's3',
's4',
's6',
's2'
]
};

columns[2] = {
width: 6,
blocks: [
150,
'blocktitle_2',
81,
51,
65,
102,
17
]
};

columns[3] = {
width: 4,
blocks: [
154,
'blocktitle_3',
125,
130,
135,
140,
145
]
};

columns[4] = {
width: 4,
blocks: [
'currentweather_big',
'clock',
'sunrise',
buttons.buienradar
]
};

columns[5] = {
width: 8,
blocks: [
'weather'
buttons.webcam
]
};

var screens = {};
screens[1] = {};
// screens[1]['background'] = 'bg12.jpg';
screens[1]['columns'] = [1,2,3];

screens[2] = {};
// screens[2]['background'] = 'bg12.jpg';
screens[2]['columns'] = [4,5];

And Custom.LESS (translates to a custom.css)

Spoiler: show

// out: ../custom/custom.css, sourcemap: true, compress: true

/* Reset styles */
a, button, .btn, label, .ui-slider-handle {
outline: none !important;
-webkit-tap-highlight-color: rgba(0,0,0,0) !important;
-webkit-touch-callout: none !important;
}

/* kollomen */
[data-id="UNKNOWN"] {
border-bottom: 1px solid #FFF !important;
}

/* Rows / cols */
.col-data {
padding-top: 5px;

> .ui-slider-horizontal {
margin-left: 50% !important;
margin-top: -12px;
}
}

div.mh {
height: 70px !important;
/* border-bottom: 1px solid #222 !important; */
}

.transbg {
background-color: transparent !important;
}

/* Buttons */
.btn.btn-default {
background-color: #222 !important;
border: none !important;
color: #FFF !important;

&:active {
background-color: #444 !important;
border: none !important;
color: #FFF !important;
}
}

/* Aanwezig */
[data-id="154"] {

.btn-group {
position: absolute !important;
right: -66px;
top: 0;

> .btn {
padding: 6px 10px !important;
}
}


.btn-group>.btn:first-child {
display: none;
}

.btn-group>.btn:nth-child(2) {
border-radius: 6px 0 0 6px !important;
}

.btn-group>.btn:last-child {
border-radius: 0 6px 6px 0 !important;
}
}


/* Radio play/pause buttons */
[data-id="150"] {

.fa-music {
font-size: 24px !important;
}

.btn-group {
position: absolute !important;
right: -66px;
top: 0;

> .btn {
padding: 6px 10px !important;
}
}

.btn-group>.btn:first-child {
display: none;
}

.btn-group>.btn:nth-child(2) {
border-radius: 6px 0 0 6px !important;
}

.btn-group>.btn:last-child {
border-radius: 0 6px 6px 0 !important;
}
}

/* Window sensor icon */
img.icon {
max-width: 28px !important
}

/* Color picker */
.sp-replacer {
position: absolute;
left: 102px;
top: 4px;
border: none !important;
background: none !important;

.sp-preview {
width: 28px;
height: 28px;
border-radius: 6px;
border: 1px solid #444;
overflow: hidden;
}

.sp-dd {
display: none;
}
}

.sp-picker-container {
width: 320px !important;

.sp-button-container {
display: none;
}
}

/* Sliders */
.ui-slider {

&-handle {
background-color: #ffffff;
border-radius: 10px;
border-color: #ffffff;
height: 25px;
width: 25px;
margin: -7px !important;

&:after {
content: '';
display: block;
width: 60px;
height: 60px;
background: transparent;
margin: -20px;
border-radius: 50%;
}
}

&-horizontal {
background-color: #6a6a6a;
border-color: transparent;
margin-left: 50%;
height: 1px;
}

}

/* Misc */
.fa.fa-lightbulb-o.on {color: yellow;}
.fa-lightbulb-o:before {font-size: 36px;}
.col-data .title {font-size: 18px; font-weight: normal;}
.col-data {margin-left: 15px;}
.fa-home:before {font-size: 32px;}
.fa-home.off {color: white;}

[EdwinK]

Is that the old or the new model of the Nexus7?
I've got the old one, and never heard of the Qi charging thingy.

Be advised to remove your API-codes (Spottify and such) from posts. People can use them now.