Domoticz

Maybe I did not understand you, but in dashtics there is a thermostat.js in the js folder. I use the beta version.
Then with the config.js i think it kust uses the thermostat.jsto fill in and control tje setpoint and temperature.

Obviously send from my Aphone

I want a radio icon in front of the radio station text. Can someone tell me how to do that?
Thanks in advance.

So, I've bought a tablet for Dashticz. 10" Lenovo. Next work to make everything look a bit bigger on screen.



(and i need the graphs working again, but that is something for another day and time)

EdwinK wrote: ↑Wednesday 24 October 2018 21:57 So, I've bought a tablet for Dashticz. 10" Lenovo. Next work to make everything look a bit bigger on screen.



(and i need the graphs working again, but that is something for another day and time)

looks very nice, mind to share some of the settings?

Of course (btw. this is based on what 'thuis' made a few page before). It's still a work in progress
CONFIG.js

Spoiler: show

Code: Select all

//	Configuratie
var config = {}
	config['language'] = 'nl_NL';
	config['domoticz_ip'] = 'http://192.168.0.11:8080';
	config['app_title'] = 'HOME Control';
	config['domoticz_refresh'] = '5';
	config['dashticz_refresh'] = '60';
	config['default_news_url'] = 'http://www.nu.nl/';
	config['news_scroll_after'] = '15';
	config['standby_after'] = 1;
	config['auto_swipe_back_to'] = 1;
	config['auto_swipe_back_after'] = '600';
	config['auto_slide_pages'] = 0;
	config['slide_effect'] = 'slide'; 
	config['standard_graph'] = 'hour';
	config['timeformat'] = 'DD-MM-YY HH:mm';
	config['calendarformat'] = 'dd DD.MM HH:mm';
	config['calendarlanguage'] = 'nl_NL';
	config['calendarurl'] = 'calendar.google.com/public/basic.ics'; // still don't know what to put in here
	config['idx_moonpicture'] = 0;
	config['switch_horizon'] = 0;
	config['selector_instead_of_buttons'] = 0;
	config['auto_positioning'] = 0;
	config['use_favorites'] = 0;
	config['last_update'] = 0;
	config['hide_topbar'] = 1;
	config['hide_seconds'] = 0;
	config['hide_seconds_stationclock'] = 0;
	config['use_fahrenheit'] = 0;
	config['use_beaufort'] = 1;
	config['translate_windspeed'] = 0;
	config['static_weathericons'] = 0;
	config['calendar_parse_localy']=true;
	config['hide_mediaplayer'] = 0;
	config['logo'] = '';
	config['last_update'] = 0;
	config['gm_api'] = '';
	config['boss_stationclock'] = 'RedBoss';
	config['hide_seconds_stationclock'] = 0;
//OpenWeather
	config['owm_api'] = ';
	config['owm_city'] = 'Rhoon';
	config['owm_name'] = '';
	config['owm_country'] = 'nl';
	config['static_weathericons'] = 0;
//Vuilnis Module
	config['garbage_company'] = '';
	config['garbage_icalurl'] = 0;
	config['garbage_zipcode'] = '3161LH';
	config['garbage_street'] = 'Jonkerhof';
	config['garbage_housenumber'] = '27';
	config['garbage_maxitems'] = '3';
	config['garbage_width'] = '12';
	config['garbage_hideicon'] = 0;
	config['garbage_use_names'] = true;
	config['garbage_use_colors'] = true;
	config['garbage_icon_use_colors'] = true;
	config['garbage_use_cors_prefix'] = false;
	config['garbage'] = {
		gft: {kliko: 'green', 		code: '#FF8C00', name: 'GFT', icon: 'img/garbage/kliko_brown.png'},
		pmd: {kliko: 'orange', 	code: '#db5518', name: 'PMD', icon: 'img/garbage/kliko_orange.png'},
		rest: {kliko: 'grey', 		code: '#7CFC00', name: 'Restafval', icon: 'img/garbage/kliko_green.png'},
		papier: {kliko: 'blue', 	code: '#00BFFF', name: 'Papier', icon: 'img/garbage/kliko_blue.png'},
		kca: {kliko: 'red', 		code: '#b21807', name: 'Chemisch afval', icon: 'img/garbage/kliko_red.png'},
		brown: {kliko: 'brown', 	code: '#7c3607', name: 'Bruin', icon: 'img/garbage/kliko_brown.png'},
		black: {kliko: 'black', 	code: '#000000', name: 'Zwart', icon: 'img/garbage/kliko_black.png'},
		milieu: {kliko: 'yellow', 	code: '#f9e231', name: 'Geel', icon: 'img/garbage/kliko_yellow.png'},
		kerstboom: {kliko: 'green', code: '#375b23', name: 'Kerstboom', icon: 'img/garbage/tree.png'},}

config['lineColors'] = ['#f1c40f', '#40e0d0', '#eee'];	

var frames = {}

frames.artwork = {width:12, isimage:true, refresh:2000, image: 'http://192.168.0.10:9002/music/current/cover.jpg?player=b8:27:eb:00:62:03'}
frames.weather = {refreshiframe:1800000,height:230,frameurl:"http://forecast.io/embed/#lat=51.860062&lon=4.412646&name=Rhoon&lang=nl&color=#00aaff&font=Helvetica&fontcolor=#ffffff&units=si",width:12}

//Knoppen var aanmaken
var buttons = {}

buttons.ipcam1 		= {key: 'cam1'	, width:12, isimage:true, image: ' https://spacetrack.eu/iss/globe.php?114126457&'}

//buttons.ipcam2 		= {key: 'cam2'	, width:12, isimage:true, image: ' https://spacetrack.eu/iss/globe.php?114126457&'}
	
buttons.energie		= {key: 'EnergiePag', width:12, icon: 'fas fa-plug', title: 'Ga naar Energie' ,slide:2 }

buttons.home		= {key: 'Homepage'	, width:12,	icon: 'fas fa-home', title: 'Ga naar Thuis Scherm' ,slide:1 }

buttons.bedien		= {key: 'Bedienpage'	, width:12,	icon: 'fas fa-user-alt', title: 'TOON®/Schakelaars' ,slide:3 }

//OV 
var publictransport = {}
publictransport.trein1= { show_via: true, station: 'station-kampen', title:'NS Kampen Centraal', show_lastupdate:true, provider: '9292-train', icon: 'train', results: 5 };

publictransport.trein2= { show_via: true, station: 'station-kampen-zuid', title:'NS Kampen Zuid', show_lastupdate:true, provider: '9292-train', icon: 'train', results: 5 };

publictransport.bus= { show_via: true, station: 'station-kampen', title:'Bus', show_lastupdate:true, provider: '9292-bus', icon: 'bus', results: 5 };

//Calendar 
var calendars = {}
calendars.business = { url: 'https://calendar.google.com/calendar/r', icon:'fa-calendar', maxitems: 5, color:'red',icalurl: 'https://calendar.google.com/calendar/ical/' }

calendars.private = { icon: 'fa-calendar', maxitems: 5, color:'green',icon:'fa-calendar', color:'green', icalurl: 'https://calendar.google.com/calendar/ical/' }

calendars.combined = {}
calendars.combined.maxitems = 5 ;
calendars.combined.calendars = [
   { color:'green',	calendar:calendars.business }, 
   { color:'red',	calendar:calendars.private }
]
calendars.combined.url = 'https://calendar.google.com/calendar';

//buttons.moon	= {key: 'moon'width:12, isimage:true, refreshimage:60000, image: 'moon'}

var blocks = {}

// Bloknamen
	blocks['blocktitle_1'] = {}
	blocks['blocktitle_1']['type'] = 'blocktitle';
	blocks['blocktitle_1']['title'] = 'TOON®'
	blocks['blocktitle_1']['width'] = 12 ;
	
	blocks['blocktitle_2'] = {}
	blocks['blocktitle_2']['type'] = 'blocktitle';
	blocks['blocktitle_2']['title'] = 'WEER'
	blocks['blocktitle_2']['width'] = 12 ;

	blocks['blocktitle_3'] = {}
	blocks['blocktitle_3']['type'] = 'blocktitle';
	blocks['blocktitle_3']['title'] = 'Energie/GAS'
	blocks['blocktitle_3']['width'] = 12 ;

	blocks['blocktitle_4'] = {}
	blocks['blocktitle_4']['type'] = 'blocktitle';
	blocks['blocktitle_4']['title'] = 'Lampen/Schakelaars'
	blocks['blocktitle_4']['width'] = 12 ;

	blocks['blocktitle_5'] = {}
	blocks['blocktitle_5']['type'] = 'blocktitle';
	blocks['blocktitle_5']['title'] = 'Agenda / Nieuws'
	blocks['blocktitle_5']['width'] = 12 ;

	blocks['blocktitle_6'] = {}
	blocks['blocktitle_6']['type'] = 'blocktitle';
	blocks['blocktitle_6']['title'] = 'Nieuws / Files / Weer'
	blocks['blocktitle_6']['width'] = 12 ;

	blocks['blocktitle_7'] = {}
	blocks['blocktitle_7']['type'] = 'blocktitle';
	blocks['blocktitle_7']['title'] = 'Oranje = Hoog tarief / Blauw = Laag tarief'
	blocks['blocktitle_7']['width'] = 12 ;

	blocks['blocktitle_8'] = {}
	blocks['blocktitle_8']['type'] = 'blocktitle';
	blocks['blocktitle_8']['title'] = 'Oranje = Hoog tarief / Blauw = Laag tarief'
	blocks['blocktitle_8']['width'] = 12 ;

	blocks['blocktitle_9'] = {}
	blocks['blocktitle_9']['type'] = 'blocktitle';
	blocks['blocktitle_9']['title'] = 'Diverse blocks'
	blocks['blocktitle_9']['width'] = 12 ;

//	Standaard blokken met config benaming
	blocks['news_1'] = {}
	blocks['news_1']['feed'] = 'https://cors-anywhere.herokuapp.com/http://www.nu.nl/rss/Algemeen';
	blocks['news_1']['maxheight'] = 300;

// scenes
blocks['s1'] = {}
blocks['s1']['title'] = 'Lampen';
blocks['s1']['width'] = 6;

//Regenkans
		blocks[9] = {}
		blocks[9]['title'] = 'Regenkans';
		blocks[9]['width'] = 4;
		blocks[9]['switch'] = true;
		blocks[9]['icon'] = 'fas fa-tint';

// Iemand thuis
		blocks[12] = {}
		blocks[12]['title'] = 'Edwin';
		blocks[12]['icon'] = 'fas fa-male';
		blocks[12]['width'] = 6;

// Onweer
blocks['51_1'] = {}
		blocks['51_1']['title'] = 'Onweer';
		blocks['51_1']['icon'] = 'fas fa-bolt';
		blocks['51_1']['width'] = 6;
		blocks['51_1']['switch'] = true;
// Zonwering
blocks[20] = {}
blocks[20]['width'] = 12;
blocks[20]['hide_stop'] = true;
	 
//Zonwering manual
blocks[30] = {}
blocks[30]['title'] = 'manual'
blocks[30]['width'] = 6;
blocks[30]['hide_stop'] = true;

blocks[31] = {}
blocks[31]['title'] = 'HUE';
blocks[31]['width'] = 12;
blocks[31]['icon'] = 'fa-lightbulb-o';

// TEMP SLK
blocks['21_1'] = {}
blocks['21_1']['title'] = 'SLK';
blocks['21_1']['width'] = 6;
blocks['21_1']['switch'] = true;
// Temp HSK
blocks['16_1'] = {}
blocks['16_1']['title'] = 'HSK';
blocks['16_1']['width'] = 6
blocks['16_1']['switch'] = true;
// buiten temp
blocks['33_1'] = {}
blocks['33_1']['title'] = 'Buiten';
blocks['33_1']['switch'] = true;
blocks['33_1']['width'] = 6;

// Weer en metingen van buiten OWM
//	Buiten temperatuur
		blocks['47_1'] = {}
		blocks['47_1']['title'] = 'Temperatuur';
		blocks['47_1']['width'] = 4;
		blocks['47_1']['switch'] = true;
//	Luchtvochtigheid
		blocks['47_2'] = {}
		blocks['47_2']['title'] = 'Vochtigheid';
		blocks['47_2']['width'] = 4;
		blocks['47_2']['switch'] = true;
//	Lucht druk
		blocks['47_3'] = {}
		blocks['47_3']['title'] = 'Baro';
		blocks['47_3']['width'] = 4;
		blocks['47_3']['switch'] = true;
//	Windkracht
		blocks[48] = {}
		blocks[48]['title'] = 'Windkracht';
		blocks[48]['width'] = 4;
		blocks[48]['switch'] = true;
//	Zicht
		blocks[49] = {}
		blocks[49]['title'] = 'Zicht';
		blocks[49]['width'] = 4;
		blocks[49]['switch'] = true;
//	Clouds-index
		blocks[50] = {}
		blocks[50]['title'] = 'Clouds';
		blocks[50]['width'] = 4;
		blocks[50]['switch'] = true;
		blocks[50]['icon'] = 'fas fa-cloud';

// P1 GAS
	//	Gas meter verbruik vandaag
		blocks['37_1'] = {}
		blocks['37_1']['width'] = 4;
		blocks['37_1']['title'] = 'Gas Vandaag';
		blocks['37_1']['switch'] = true;
	//	blocks['37_1']['image'] = 'gas48.png'; 
	// 	Gasmeter verbruik totaal
		blocks['37_2'] = {}
		blocks['37_2']['width'] =  4;
		blocks['37_2']['title'] = 'Gas Totaal';
		blocks['37_2']['switch'] = true; 
		
// P1 Elektra
	// 	KWh verbruik actueel
		blocks['39_1'] = {}
		blocks['39_1']['title'] = 'Energie Actueel';
		blocks['39_1']['width'] = 12;
		blocks['39_1']['switch'] = true; 
	//	Verbruik KWh Vandaag
		blocks['39_2'] = {}
		blocks['39_2']['title'] = 'Energie vandaag';
		blocks['39_2']['width'] = 4;
		blocks['39_2']['switch'] = true; 
	//	Totale KWh verbruik	
		blocks['39_3'] = {}
		blocks['39_3']['title'] = 'Energie Totaal';
		blocks['39_3']['width'] = 4;
		blocks['39_3']['switch'] = true;
		blocks['39_3']['image'] = 'current48.png'; 

// Blokken die nog geplaatst moeten worden
// 	mm Regen
/*		blocks[59] = {}
		blocks[59]['title'] = 'Regen'
		blocks[59]['width'] = 4;
		blocks[59]['switch'] = true;*/

//	Gevoelstemperatuur, Windchill
/*		blocks[75] = {}
		blocks[75]['title'] = 'windchill';
		blocks[75]['width'] = 4;
		blocks[75]['switch'] = true;	*/	

//Schakelaars
/*		blocks[39] = {}
		blocks[39]['title'] = 'HSK-1';
		blocks[39]['width'] = 6;
		blocks[44] = {}
		blocks[44]['title'] = 'HSK-2';
		blocks[44]['width'] = 6;
		
		blocks[37] = {}
		blocks[37]['title'] = 'FAN_hsk';
		blocks[37]['width'] = 6;
		blocks[45] = {}
		blocks[45]['title'] = 'FAN-slk';
		blocks[45]['width'] = 6;
		blocks[18] = {}
		blocks[18]['title'] = 'HUE';
		blocks[18]['width'] = 8;
		
		blocks[24] = {}
		blocks[24]['title'] = 'KetelInfo';
		blocks[24]['width'] = 6;
		
		blocks[48] = {}
		blocks[48]['width'] = 6;
		blocks[49] = {}
		blocks[49]['width'] = 6;
		blocks[50] = {}
		blocks[50]['width'] = 6;
		blocks[51] = {}
		blocks[51]['width'] = 6;
		blocks[52] = {}
		blocks[52]['width'] = 6; */

blocks[15] = {}
blocks[15]['title'] = 'Berging';
blocks[15]['width'] = 6;
	

//TOON - Rooted
blocks[38] = {}
blocks[38]['title'] = 'KamerTmp';
blocks[38]['switch'] = true;
blocks[38]['width'] = 4;

// werkt niet!
//blocks[36] = {}
//blocks[36]['title'] = '';
//blocks[36]['switch'] = true;
//blocks[36]['width'] = 6;

blocks[42] = {}
blocks[42]['title'] = 'Toon Prog';
//blocks[42]['switch'] = true;
blocks[42]['width'] = 6;

blocks[45] = {}
blocks[45]['title'] = 'Toon Autoprog';
blocks[45]['switch'] = true;
blocks[45]['width'] = 6;

blocks[43] = {}
blocks[43]['title'] = 'Ketelstand';
blocks[43]['switch'] = true;
blocks[43]['width'] = 6;

blocks[44] = {}
blocks[44]['title'] = 'Toon Scenes';
blocks[44]['switch'] = true;
blocks[44]['width'] = 12;

blocks[34] = {}
blocks[34]['switch'] = true;
blocks[34]['title'] = 'Mod. Lvl';
blocks[34]['width'] = 6;
blocks[35] = {}
blocks[35]['switch'] = true;
blocks[35]['title'] = 'Keteldruk';
blocks[35]['width'] = 6;
blocks[40] = {}
blocks[40]['switch'] = true;
blocks[40]['title'] = 'Boiler IN';
blocks[40]['width'] = 6;
blocks[41] = {}
blocks[41]['title'] = 'Boiler UIT';
blocks[41]['switch'] = true;
blocks[41]['width'] = 6;	
	
	

// Hier worden de kolommen voor op het scherm gemaakt
var columns = {}
	columns['bar'] = {}
	columns['bar']['blocks'] = ['logo','miniclock','settings']

//screen 1
	columns[1] = {}
	columns[1]['blocks'] = [buttons.ipcam1,frames.artwork] 
	columns[1]['width'] = 3;

	columns[2] = {}
	columns[2]['blocks'] = ['blocktitle_5',calendars.combined,'garbage','news_1']
	columns[2]['width'] = 3; 

	columns[3] = {}
	columns[3]['blocks'] = ['blocktitle_2',frames.weather,38,'21_1','16_1','33_1','47_1','47_2','47_3',48,49,50,9,'51_1']
	columns[3]['width'] = 4; 

	columns[4] = {}
	columns[4]['blocks'] = ['sunrise',31,44,12,30,20,26,24,buttons.home,buttons.energie,buttons.bedien]
	columns[4]['width'] = 2; 

//screen 2
	columns[5] = {}
	columns[5]['width'] = 3;
	columns[5]['blocks'] = ['blocktitle_3','39_1','39_2','39_3','37_1','37_2']

	columns[6] = {}
	columns[6]['blocks']=[]
	columns[6]['width'] = 3;
	
	columns[7] = {}
	columns[7]['blocks'] = []
	columns[7]['width'] = 4;

//screen 3
	columns[8] = {}
	columns[8]['blocks'] = ['blocktitle_4',15] 
	columns[8]['width'] = 3;

	columns[9] = {}
	columns[9]['blocks'] = ['blocktitle_1',34,35,40,41,42,43,45]
	columns[9]['width'] = 3;

	columns[10] = {}
	columns[10]['blocks'] = []
	columns[10]['width'] = 4;

//Standby modus configuratie
var columns_standby = {}
	columns_standby[1] = {}
	columns_standby[1]['blocks'] = ['clock']  //specify blocks for the standby mode
	columns_standby[1]['width'] = 12;

//Hier worden de verschillende schermen gemaakt welke je kunt swipen
var screens = {}
	screens['default'] = {}
	screens['default']['maxwidth'] = 1920;
	screens['default']['maxheight'] = 1080;

	screens['default'][1] = {}
	screens['default'][1]['background'] = 'bg10.jpg';
	screens['default'][1]['columns'] = [1,2,3,4]

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

	screens['default'][3] = {}
	screens['default'][3]['background'] = 'bg10.jpg';
	screens['default'][3]['columns'] = [8,9,10,4]

custom css

Spoiler: show

Code: Select all

.col-xs-12.items {
   font-size: 15px;
}

.trash .state div.trashtoday      { font-size: 30px; font-weight: 3; margin-left: 29px; font-weight: bold; font-variant: small-caps;}
.trash .state div.trashtomorrow       { font-size: 25px; font-weight: 2; margin-left: 25px; font-variant: small-caps;}
.trash .state div.trashrow        { font-size: 22px; font-weight: 1; margin-left: 29px; font-variant: small-caps;}

.img.trashcan           { height: 65px; width: 65px; margin-left:0px; margin-top: 20px;}


.fa.fa-male.on {color: green}
.fa.fa-male.off {color: red}
.fa-male:before{font-size: 36px;}

/*
CUSTOM CSS FILE
*/

@font-face{
 font-family:'digital-clock-font';
 src: url('../img/font/digital-7.ttf');
}

/* Title of tile */
	.title {font-size:15px;}	

/* News block: Hide icon and change margins of text to fill block */
		#rss-styled_news {
			margin-right: -20px;
			margin-left: -20px;}
	.fas.fa-newspaper-o {opacity: 50;}
/* Blocktitles?*/
		div.mh.transbg.block_graph_37 {Height:150px;}
		div.mh.titlegroups {
			height: 38px !important;	/* default height=75px */
			padding-top: 0px;			/* center text for new height */
			color: white;
			background-color: rgba(0,0,0,0.02);}
/* Modifications to the fa en wi font family*/
	.sunrise { font-size: auto; 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;} 
	.wi-humidity:before {color: gray;}
	.wi-barometer:before {color: aqua;}
	.wi-wind-direction:before {color: lightcyan;}
	.fas.fa-mobile.on.icon {font-size: 30px !; color: green;}
	.fas.fa-mobile.off.icon {font-size: 30px !important;}
/*Alle iconen verkleuren*/
	.fas.fa-lightbulb-o.on {color: yellow}
	.fas.fa-fire {color: orange}
	.fas.fa-bolt {color: yellow}
	.fas.fa-plug {color:yellowgreen}
	.fas.fa-thermometer-half {color:pink}
	.fas.fa-newspaper-o {color:springgreen}
	.fas.fa-calendar {color:purple}
	.fas.fa-certificate {color:orange}
	.fas.fa-sun-o {color:orange}
	.fas.fa-tint {color: MediumSlateBlue }
	.fas.fa-eye {color: LightGoldenRodYellow}
	.fas.fa-radio {color:red}
	.fas.fa-play {color:aqua; font-weight:bold;}
	.fas.staticon {color:red}
	.fas.fa-chevron-left {color:orange; font-weight:bold;}
	.fas.fa-chevron-right {color:orange; font-weight:bold;}
	
 .col-xs-6 transbg imgblock {

    margin-left: auto;
    margin-right: auto }
	
	.wi.wi-day-sunny:before { color: #FFFF00; font-size: 40px;}
	.wi.wi-night-clear:before { color: #FAFAD2; font-size: 40px; }
	.wi.wi-day-cloudy:before { color: #FFFF00; font-size: 40px;}
	.wi.wi-night-cloudy:before { color: #FAFAD2; font-size: 40px; }
	.wi.wi-cloud:before { color: #F8F8FF; font-size: 40px; }
	.wi.wi-cloudy:before { color: #DCDCDC; font-size: 40px;}
	.wi.wi-showers:before { color: #00FFFF; font-size: 40px; }
	.wi.wi-day-rain:before { color:  #AFEEEE; font-size: 40px; 	}
	.wi.wi-night-rain:before { color: #4169E1; font-size: 40px; }
	.wi.wi-day-thunderstorm:before { color: #FFD700; font-size: 40px;}
	.wi.wi-night-thunderstorm:before { color: #DAA520; font-size: 40px; }
	.wi.wi-snow:before { color: #FFFAFA; font-size: 40px;}
	.wi.wi-day-fog:before { color: #F5F5F5; font-size: 40px; }
	.wi.wi-night-fog:before { color:  	#D3D3D3; font-size: 40px; }
	
div.mh.transbg.block_131.col-xs-12 {
	/*background-image: url("../img/icons/honeywellthermostaat1.png");*/
	/*background-clip:content-box;*/
	background-repeat: no-repeat;
/*  background-attachment: fixed;*/
	height:260px;
	background-position: 110px; 
	text-align:center;
  line-height: 60px;
  text-align: center;
}
/*
.input-groupBtn .btn-number {
    opacity: 0.5;
    color: white;
    background-color: rgb(34, 34, 34);
	border-radius: 0px;
    padding: 6px 10px 6px 10px;
    line-height: 0px;
	border-radius:180px;
	
}
*/
section.wrapper {
  min-width: 400px; /* Minimum width of your wrapper element */
  overflow: hidden;
  display: inline-block;
}

.stateheating {
	color:black;
	display:inline-block;
	width:100%;
	height:100%;
	vertical-align:0px;
	position: relative;
  left: 0%;
	bottom:70px;
}
.title-input {
	font-family: 'digital-clock-font';
	font-size:28px;
	display:inline-block;
	/*width:100%;
	Height:100%;*/
	color:black;
 	position: relative;
  Top: 75px;
}

/* OWM Weather	*/	
	
.col-xs-12.big .weatherdegrees, .big .weatherloc {
	display: inline-block;
	margin-top: -2px;
	font-size: 18px;
	font-weight: bold;
	margin-right: 4px;
	float: right;
	text-align:right;
	color:orange;}
	.weatherfull > div div.temp {
    font-size: 28px;
    font-weight: 400;
    color: orange;
	margin-top: 10px;
	margin-left:100px;
	text-align: left;
	padding: 0px 4px;}
	.weatherfull > div div.day {
    margin-top: 0px;
    font-weight: 300;
    font-size: 20px;
	color:aqua;}
	.block_currentweather_owm
	{margin-left: 0px;}
	.transbg.col-xs-2.temp .av-temp {text-align:left;}
	.transbg.col-xs-2.temp .rain {text-align:right;}	
	.col-xs-4 transbg hover text-center btnPrev {color:red;}	
/* Fontsize buttons Blinds */
	.fa,.wi {font-size:auto !important;}
/* Block Title */

		h1, h2, h3, h4, h5, h6 {
		/*	font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif; */
			margin: 0px;
			margin-left: 15px;
			font-weight: 100;
			font-size: 140%;
/*			color: white;*/
			text-shadow: 2px 2px black;
			text-align: center;}
	.smalltitle h3 {font-size: 15px !important;margin-left: 6px;color: pink; font-weight:bold;}

/*// Buienradar
	.block_117 {height: 100% !important;}
	.fas.fa-umbrella {font-size: 32px !important;font-weight: bold !important;}
	.fas.fa-umbrella.on {color:#3399ff !important;} */

/*  Standby screen */
	.standby .clock {font-size:60px !important;}
	.standby .weekday,.standby .date {font-size:40px !important;}
	.standby .fas.fa-thermometer-half {color:pink}
	.standby .swiper-slide {background:rgba(0,0,0,0.0)}

/* Swiper bullet */
	.swiper-pagination-bullet {width: 30px;height: 30px;background: white;}
/* Up-Down arrow Blinds */
	.input-groupBtn li {
		position:sticky;
		z-index: 9999;
		right: 1px;
		border-radius: 0px; /* Round corners */}
/*Default buttons*/
	.btn.btn-default {
		background-color: black;
		color: white;
		-webkit-transition-duration: 0.4s; /* Safari */
		transition-duration: 0.4s;
		border: none;}
	.btn.btn-default:hover {
		background-color: black; /* Green */
		color: lime;
		box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
		border: none;}

/* 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: 3px solid rgba(0,0,0,0); background: rgba(0,0,0,0.02); background-clip: padding-box; border-radius: 0px; height:auto}

.transbg.col-xs-1.hover:hover,
.transbg.col-xs-2.hover:hover,
.transbg.col-xs-3.hover:hover,
.transbg.col-xs-4.hover:hover,
.transbg.col-xs-5.hover:hover,
.transbg.col-xs-6.hover:hover,
.transbg.col-xs-7.hover:hover,
.transbg.col-xs-8.hover:hover,
.transbg.col-xs-9.hover:hover,
.transbg.col-xs-10.hover:hover,
.transbg.col-xs-11.hover:hover,
.transbg.col-xs-12.hover:hover 	{padding-top:15px; padding-bottom:15px; border: 3px solid rgba(0,0,0,0); background: rgba(100,100,100,0.3); background-clip: padding-box; border-radius: 0px; cursor:pointer; height:auto}

/*Thermostaat Image*/
.transbg.col-xs-12.imgblock{
text-align:center;}

custom.js

Spoiler: show

Code: Select all

 //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;
} 

Thuis wrote: ↑Friday 05 October 2018 18:14 Ja natuurlijk, ik heb wel weer wat aangepast, het ziet er nu zo uit:





Hier zijn mn configs:


Ben er nog steeds niet achter hoe ik de icons van de electra en de gas kan vervangen door images, als ook het autootje, maar ik spit gestaag door !

Hi Thuis - zou je eventueel ook je background willen delen? Vind het wel een stylish one....

EdwinK wrote: ↑Wednesday 24 October 2018 21:57 So, I've bought a tablet for Dashticz. 10" Lenovo. Next work to make everything look a bit bigger on screen.



(and i need the graphs working again, but that is something for another day and time)

Hi, just quick question. Do you know how to change forecast.io text and icons color to any other than black? For some time it stays black, which used to be white.

No clue. You might have to experiment with some CSS

poweredge wrote: ↑Sunday 28 October 2018 22:21

Hi Thuis - zou je eventueel ook je background willen delen? Vind het wel een stylish one....

I just used google, found what i liked and got to this website, where you can download the wallpaper. Good luck

https://picsbroker.com/basic-wallpapers ... lpapers-1/

CaesarPL wrote: ↑Monday 29 October 2018 14:46

EdwinK wrote: ↑Wednesday 24 October 2018 21:57 So, I've bought a tablet for Dashticz. 10" Lenovo. Next work to make everything look a bit bigger on screen.



(and i need the graphs working again, but that is something for another day and time)

Hi, just quick question. Do you know how to change forecast.io text and icons color to any other than black? For some time it stays black, which used to be white.

See viewtopic.php?f=67&t=16526&hilit=foreca ... 60#p193322

Thuis wrote: ↑Monday 29 October 2018 17:55

poweredge wrote: ↑Sunday 28 October 2018 22:21

Hi Thuis - zou je eventueel ook je background willen delen? Vind het wel een stylish one....

I just used google, found what i liked and got to this website, where you can download the wallpaper. Good luck

https://picsbroker.com/basic-wallpapers ... lpapers-1/

thanks

Not 100% happy with this, wallmount feels instable, but is fixed against the wall, as far as i could get the screws in. For now, however this is my view.



O, and my wall is not that ugly color the picture makes it.

Now i need everything the tiles to be a bit bigger.

@EdwinK, Looks Good !

Thanks. It's for the most part from *your* dashboard.

Hier is mijn 55 inch "tablet", haha nee het is gewoon een TV. Kodi staat hier bijna 24/7 aan, en kan Dashticz via Kodi oproepen, geen tab nodig dus

Here is my 55 inch "tablet", haha no, it is just a TV. Kodi is almost 24/7 on over here, and I call Dashticz with Kodi, no need of a tablet thus







When will there be a product that is controlled over ethernet, can dim, and does not use internet, and works out of the box with domoticz, so i can change out my x10 dimmers and switches. Try to read about flashing and soldering, but i think i wait until a products will arrive that can do this. Would be very easy, on: 192.168.0.100/on, off: 192.168.0.100/off, dim or bright 45%: 192.168.0.100/45 etc... Why do all these companies want me to use their cloud, it is useless. Well there must be a smart company that will do this in the future, must wait for it. Until then, my X10 CM15 is just not connectable to domoticz, on windows, i use windows. I've read this rfxcom, but does it work under windows and can i dim bright my x10 in wall switches? Can i use my RF IR universal ICON10 remote controller? it is unclear in the rfxcom manual.

lol - gaaf - maar je bedient em dan met remote en dus niet met touch ?

Yes, I have a remote than can do mouse handling, or I could use the wiimote (see the little bar above the screen), or a ps3 controller, or just buttons on the remote :-p

Ah I forgot, the keyboard keys

Hey guys.
This is my first post :p Yeey! Anyway still WIP ..and it will probably change quite a bit in time , but ... here it is




CONFIG.js custom.css I have few questions about dashticz....
1. Can I have a per-graph period display setting ? (Set default to montly and have few on hourly ?)
2. Can I have different size(width) for the same block on different screens?
3. Can I change the background of the button. windows ? (In my case buttons.log)
4. Can I change the size of the pop-up window for those button. windows ? (again buttons.log my case)

Thuis wrote: ↑Wednesday 10 October 2018 15:56

rgroothuis wrote: ↑Wednesday 10 October 2018 13:05

Thuis wrote: ↑Wednesday 10 October 2018 13:02

I cannot recreate your layout, did you tried the last change, and undo the first ?
Otherwise, try and look at it yourself, i use firefox and when i press F12 i can look at all the names and then change them inside notepad++

Yes, when I tested the second option I removed the first configuration. When I've a bit more time I will analyse the css a bit more and try to understand it. I'm using Chrome, will try Firefox as well, maybe that is easier.

Great ! Yes it is very time consuming if you do not know what your doing, like me. I keep trying and trying, searching logic of things, but it has so many variables that it is frustrating. Look here, I try to get the buttons and the reading inside my thermostat, but man, it is so hard, i do not understand the relationships between all the .mh .div .col .whatever ... haha



So in eed to get the + and the - to move in the right direction, and i need to put the " ingestelde temperatuur" text in the right direction ..... It does have the led font type of the setpoint in the middle, but now the rest ....

And i am used to scada packets like WinCC, Proface or Codesys, where i can draw, click, copy and paste, haha

How did you get the costs to display? I can't seem to find the idx number of those, the costs are in Domoticz though, so that's strange..

Thuis wrote: ↑Friday 12 October 2018 12:46 Hey, look I finally have the buttons and the set-point positioned on the thermostat image. The only thing is, I am trying to figure out, how i can group all the elements together. Try searching and reading. Is there some one here that could tell me how to do that? So that the buttons and the set-point data and the background image and the block become one? Must be possible, right? This is of course, when changing the display browser it comes all messed up, because they are not grouped...

As said, I'm working to get something like this, but.. I can't get the graph's to show.