Dashticz - General Discussions

[Lokonli]

o you appreciate my work and want to buy me a beer?
Send:
- XVG to D8fwNbyV6YxJk1aSiXftWTtdaPipsKn2Fa
- ANY ERC20-TOKEN to 0x9b8ee84329d77765a28bca188218c6c793875a8a

@tileiran: Did you post this? Why?

[Wolfgang]

just starting with dashticz and getting no infos from domoticz , the clock and the openweather on screen 1 is working fine , but the other infos from domoticz ( 623 is a temp sensor ) is not seen on the dashboard , any suggestions ?

CONFIG:js

Spoiler: show

var config = {}
config['domoticz_ip'] = 'http://X.X.X.X:8080';
config['user_name'] = 'user';
config['pass_word'] = 'password';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '60';
config['owm_api'] = 'XYZ';
config['owm_city'] = 'Somewhere';
config['owm_name'] = '';
config['owm_country'] = 'at';
config['owm_cnt'] = '8';
config['app_title'] = '';
config['timeformat'] = 'DD-MM-YY HH:mm';
config['calendarformat'] = 'dd DD.MM HH:mm';
config['calendarlanguage'] = 'de_DE';
config['calendarurl'] = '0';
config['language'] = 'de_DE';
config['hide_seconds_stationclock'] = 0;
config['use_fahrenheit'] = 0;
config['use_beaufort'] = 0;
config['translate_windspeed'] = 1;
config['slide_effect'] = 'slide';
config['use_favorites'] = 1;
config['auto_positioning'] = 1;

var _LANGUAGE = 'de_DE'; //or: en_US, fr_FR, hu_HU, sw_SW
var _HOST_DOMOTICZ = 'http://X.X.X.X:8080';
var _USER_NAME = 'user';
var _PASS_WORD = 'password';
var _DOMOTICZ_REFRESH = 5; //in seconds
var _DASHTICZ_REFRESH = 30; //in minutes
var _USE_AUTO_POSITIONING = true;
var _USE_FAVORITES = true;
var _HIDE_SECONDS_IN_CLOCK = false;
var _HIDE_MEDIAPLAYER_WHEN_OFF = false;
var _TRANSLATE_SPEED = false;
var _SHOW_LASTUPDATE = false;
var _LASTUPDATE_FORMAT = 'DD-MM-YY HH:mm';
var _IDXmoonpicture = 1; //index of the uservariabele MoonPicture


var buttons = {}

buttons.buienradar = {width:12, isimage:true, image: 'http://api.buienradar.nl/image/1.0/Rada ... =285&h=256', url: 'http://www.weeronline.nl/Europa/Nederland/Son/4058667'}
buttons.calendar = {width:4, icon: 'fa-calendar', title: 'Kalender', url: 'https://calendar.google.com/calendar'}
buttons.radio = {width:12, 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: 'http://192.168.1.5'}
buttons.moon= {width:12, isimage:true, refreshimage:60000, image: 'moon'};


var blocks = {}
blocks['blocktitle_1'] = {}
blocks['blocktitle_1']['type'] = 'blocktitle'
blocks['blocktitle_1']['title'] = 'Zeit ';
blocks['blocktitle_2'] = {}
blocks['blocktitle_2']['type'] = 'blocktitle'
blocks['blocktitle_2']['title'] = 'Wetter ';

/*

blocks[623] = {} // Aussen Süd Temp
blocks[623]['width'] = 6;
blocks[623]['icon'] = 'fa-line-chart'
blocks[623]['hide_lastupdate'] = true
blocks[623]['switch'] = true;

*/

blocks[623] = {}
blocks[623]['width'] = 6
blocks[623]['title'] = 'Temp'
blocks[623]['hide_data'] = false
blocks[623]['hide_lastupdate'] = true
blocks[623]['icon'] = 'fa-circle'
blocks[623]['protected'] = false;


var columns = {}
columns[1] = {}
columns[1]['blocks'] = ['blocktitle_1','stationclock']
columns[1]['width'] = 5;

columns[2] = {}
columns[2]['blocks'] = ['weather_owm']
columns[2]['width'] = 7;

columns[3] = {}
columns[3]['blocks'] = [841,buttons.radio,'graph_623',buttons.moon]
columns[3]['width'] = 6;

columns[4] = {}
columns[4]['blocks'] = ['graph_623']
columns[4]['width'] = 8;

columns[5] = {}
columns[5]['blocks'] = ['623_2','623_3']
columns[5]['width'] = 4;

columns[6] = {}
columns[6]['blocks'] = ['stationclock']
columns[6]['width'] = 5;

var columns_standby = {}
columns_standby[1] = {}
columns_standby[1]['blocks'] = ['stationclock','weather']
columns_standby[1]['width'] = 12;

var screens = {}
screens[1] = {}
screens[1]['background'] = 'bg4.jpg'
screens[1]['columns'] = [1,2];
screens[2] = {}
screens[2]['background'] = 'bg4.jpg'
screens[2]['columns'] = [4,6];
screens[3] = {}
screens[3]['background'] = 'bg4.jpg'
screens[3]['columns'] = [3,5];

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

custom.css

Spoiler: show

.transbg
{
border-width: 3px !important;
}

.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 {
background-color: rgba(63,63,63,0.8);
}

.ui-widget.ui-widget-content
{
background-color: rgb(124,124,124);
}

/* Weather */
.weatherdegrees,
.weatherloc {
display:inline-block;
margin-top:-2px;
font-size:18px;
font-weight:bold;
}

a {
-webkit-transition: all 0.35s;
-moz-transition: all 0.35s;
transition: all 0.35s;
color: white;
}

a:hover, a:focus {
color: white;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active
{
border: 1px solid #7C7C7C !important;
background: #80CBC4 !important;
}

.col-data .title
{
font-size:13px;
}

.col-data span
{
font-size:12px;
}

.swiper-pagination-bullet
{
display: none !important;
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: .2;
}

select, select option {
color: #000 !important;
width: auto;
max-width: 120% !important;
}

.input-groupBtn .btn-number {
opacity: 0.6;
color: white;
background-color: #666666;
border-radius: 0px;
padding: 6px 10px 6px 10px;
line-height: 20px;
}

#graphoutput29 { height:230px;}

.fa-bell-o.on { color: rgb(199,92,92)}

.fa-bell-o.off { color: rgb(131,78,78)}

.fa.fa-lightbulb-o.on { color: rgb(199,92,92)}

.fa.fa-lightbulb-o.off { color: rgb(131,78,78)}

div.mh.titlegroups {
height: 99px !important;
padding-top: 4px;
}

The screens 1,2,3 look like

[Minglarn]

Is it possible to flash the content in the DIV when it changes value etc?
Just like in Domoticz when value changes..

[HansieNL]

@Wolfgang What version of Dashticz are you using?
You have old and new variabeles in your config.js???

[Wolfgang]

@HansieNL
Thanks for reply , this was only a try because of no clue why there are no values from domoticz shown on the screens ...
I'm using the 2.5.1 version of dashticz on a rapi 3 and version V4.10215 of domoticz on a another raspi.

[HansieNL]

@Wolfgang My advice is to start with a default config.js and see if that works. This is the basic start to see if connection is working ok. If that works you can start customizing your Dashticz dashboard.

[Wolfgang]

@HansieNL
Thanks for reply , I've narrowed the error a little bit, its a little bit strange the device 369 is displayed, the device 382 and the following devices are not displayed . I debugged with wireshark and in the url
http://192.168.251.225:8080/json.htm?us ... order=Name
the data is displayed ... strange

Spoiler: show

{
"AddjMulti" : 1.0,
"AddjMulti2" : 1.0,
"AddjValue" : 0.0,
"AddjValue2" : 0.0,
"BatteryLevel" : 255,
"CustomImage" : 0,
"Data" : "0 Watt",
"Description" : "",
"Favorite" : 1,
"HardwareID" : 2,
"HardwareName" : "PiController",
"HardwareType" : "OpenZWave USB",
"HardwareTypeVal" : 21,
"HaveTimeout" : true,
"ID" : "0000029",
"LastUpdate" : "2017-08-17 18:00:37",
"Name" : "Steckdose Wohnzimmer Leistung",
"Notifications" : "false",
"PlanID" : "0",
"PlanIDs" : [ 0 ],
"Protected" : false,
"ShowNotifications" : true,
"SignalLevel" : "-",
"SubType" : "Electric",
"Timers" : "false",
"Type" : "Usage",
"TypeImg" : "current",
"Unit" : 4,
"Used" : 1,
"XOffset" : "0",
"YOffset" : "0",
"idx" : "369"
},
{
"AddjMulti" : 1.0,
"AddjMulti2" : 1.0,
"AddjValue" : 0.0,
"AddjValue2" : 0.0,
"BatteryLevel" : 255,
"CounterToday" : "0.100 kWh",
"CustomImage" : 0,
"Data" : "304.740 kWh",
"Description" : "",
"EnergyMeterMode" : "",
"Favorite" : 0,
"HardwareID" : 2,
"HardwareName" : "PiController",
"HardwareType" : "OpenZWave USB",
"HardwareTypeVal" : 21,
"HaveTimeout" : false,
"ID" : "00002901",
"LastUpdate" : "2018-12-25 21:55:24",
"Name" : "Energieverbrauch Steckdose Leistung Steckdose Wohnzimmer",
"Notifications" : "false",
"PlanID" : "13",
"PlanIDs" : [ 13 ],
"Protected" : false,
"ShowNotifications" : true,
"SignalLevel" : "-",
"SubType" : "kWh",
"SwitchTypeVal" : 0,
"Timers" : "false",
"Type" : "General",
"TypeImg" : "current",
"Unit" : 1,
"Usage" : "11.9 Watt",
"Used" : 1,
"XOffset" : "0",
"YOffset" : "0",
"idx" : "382"
},

[Wolfgang]

@HansieNL
I'm steps further now , thanks for the support and i think it was a typo ...

[sgsdebruijn]

Does someone know why i cann't edit Dasticz in the browser? The save button is not working?!

[HansieNL]

You can only save if you got PHP running and the config.js is writable.

[sgsdebruijn]

You can only save if you got PHP running and the config.js is writable.

Any tipc&tricks?

[sgsdebruijn]

You can only save if you got PHP running and the config.js is writable.

Any tipc&tricks?

Working, editted the properties of the config.js file

[Derik]

Dear All..
Try to rebuid my "old" dash to new settings..
Install the last beta....

Only i get some stuff not working:
First the color and the icons
I use:

Code: Select all

blocks['s11'] = {}
blocks['s11']['width'] 			= 2; 
blocks['s11']['title'] 			= 'Eet'; // schakelt groep eetkamer fel
blocks['s11']['icon'] 			= 'fas fa-toggle-on'; 
blocks['s11']['switch'] 		= true;
blocks['s11']['hide_data'] 		= true; 
blocks['s11']['show_lastupdate'] 	= false; 
blocks['s11']['protected'] 		= false; 

And in the custom css:

Code: Select all

.fas fa-toggle-on		{ color: yellow;}
.fas fa-toggle-on:before	{ font-size: 30px;}
.fas fa-toggle-on		{ margin-top: 15px ;margin-left: 1px;}

Why is the icon not response on the margin
Why is the color not changing?


edit:

Perhaps some have a solution to use in 1 dash multiple width?

I want a setup 1 dash with:
2 device from the top, the second under the first, a in column 12 width
then 3 times a columns 4 width
And perhaps when possible to set 2 columns 6 width..

Hope there is some..

[pvm]

I think you missed adding !important in the css

[alarm_guy1]

Hi guys, just getting into Dashticz, Looking to create a Single Large button to control 1 switch and Maybe a scene too.
I can seem to make my switch wider but not fatter.

I have cut the Config right down,

Code: Select all

var config = {}
config['domoticz_ip'] = 'http://xxx.xxx.xxx.xx:xxx';
config['app_title'] = 'Dashticz';
config['domoticz_refresh'] = '5';
config['dashticz_refresh'] = '1';
config['auto_positioning'] = '0';
config['user_name'] = '';
config['pass_word'] = '';


var publictransport = {}


var tvguide = {}


var _STREAMPLAYER_TRACKS  	= [
	
  ]; 


var buttons = {}


var blocks = {}





var columns = {}

columns[1] = {}
columns[1]['blocks'] = ['blocktitle_1',34]
columns[1]['width'] = 5; 



var columns_standby = {}
columns_standby[1] = {}
columns_standby[1]['blocks'] = []
columns_standby[1]['width'] = 12;

var screens = {}
screens[1] = {}
screens[1]['background'] = 'background_sea.jpg';
screens[1]['columns'] = [1,]

The item in Question is a Dimmer, and literally I want it as an on/off switch for this scenario, so you can just come in and touch the screen without
looking particularly and switch the light off (as we do with a switch), so my problem is 2 fold how do I make Dashticz see it as a switch and how do I make it Fill the screen.
Screen Shot attached of how it is presently
Cheers

[HansieNL]

@alarm_guy1 :
What if you create a dummy on/off switch in Domoticz and use that one in Dashticz.

[alarm_guy1]

Could do, never thought of that, just need to know how to make it taller now

cheers

[alarm_guy1]

dummy switch sorted and working cheers...

[HenriM]

A couple of questions to the experts. I tried to search and try out myself but did not find all answers.

1. Change colors of block graphs.
I found that I can configure the graph output of graph block with (hidden) configuration setting (e.g. config['lineColors'] = ['#e00', 'rgba(0,15,0, 0.4)']; ). Can other properties be done via CSS as well?

I already found out that next CSS code has effect:

Code: Select all

/* Change colors of pop-up graph */
#graphoutput { 
  background: black; 
  color:white;
}

/* Change colors of pop-up graph */
.graphpopup {
  background: black;
  color:white;
}

How can I change the other colors in the graph?

To be honest I prefer the graph output of Domoticz much better.

2. Is it possible to have lines without the measure-points itself (e.g. make them invisible with alpha-channel value 0 in CSS)? Especially when you have many measurements in a day this makes the graph ugly.

3. I have 'gas' bock (from P1 Smartmeter) and applicable 'gas' graph block on my dashboard. I have set 'gas' block to protected, but I can still click it. When I do so the 'gas' graph disappears from the dashboard and the popped up graph does not show anything.

[rgroothuis]

I've two screens, swiping between the two screens is not going that smooth, probably because of the performance of the table.

I want to add a button to switch to the next screen. And on the second screen I want to add a button to switch back to the main screen. How can I add those buttons to jump screens? Is that possible? Somebody has an example?

And secondly, after an X amount of time, the setup is always moving back to the main screen. How can I make this longer or even completely stop this. In other words that I stay on the second screen until I move it myself back to the main screen?