Dashticz / dashticz_v2

Alternative dashboard for Domoticz
107 stars 62 forks source link

How to get it to work? #98

Closed ThirstyThursten closed 7 years ago

ThirstyThursten commented 7 years ago

Hello,

First of all, I love your creation!! =D

Second, I can't seem to get some stuff to work.. I have checked every page on the wiki thrice..

I did everything on the installation and configuration pages, but all I get to see is some sort of weather forecast..

Here is my code of the CONFIG.js

var _LANGUAGE               = 'nl_NL'; //or: en_US, fr_FR, hu_HU
var _HOST_DOMOTICZ          = 'http://192.168.3.85:8080';
var _DOMOTICZ_REFRESH       = 5; //in seconds
var _DASHTICZ_REFRESH       = 3; //in minutes
var _THEME                  = 'default'; // default = dashticz default theme
/*
IF YOU HAVE A MEDIABOX FROM ZIGGO (HORIZON), COPY SWITCH_HORIZON.PHP ON A WEBSERVER INSIDE YOUR NETWORK AND CHANGE THE IP.
ENTER THE PATH TO THIS FILE BELOW.
*/
var _HOST_ZIGGO_HORIZON     = ''; //e.g. http://192.168.1.3/domoticz/switch_horizon.php';
var _APIKEY_WUNDERGROUND    = '1f7d6c7ede149e97';
var _WEATHER_CITY           = 'Eindhoven';
var _WEATHER_CITYNAME       = ''; //show a different city name, leave empty if same as _WEATHER_CITY
var _WEATHER_COUNTRY        = 'NL';
var _USE_AUTO_POSITIONING   = true; //don't want to configure positions, use auto positioning
var _USE_FAVORITES          = true; //only used when using auto positioning
var _HIDE_SECONDS_IN_CLOCK  = false; //do not show the seconds in the clock
var _HIDE_MEDIAPLAYER_WHEN_OFF = false; //when you have a mediaplayer connected, hide it if nothing is playing
var _NEWS_RSSFEED           = 'http://www.nu.nl/rss/algemeen';
var _USE_FAHRENHEIT         = false;
var _USE_BEAUFORT           = false; //Bft instead of m/s
var _TRANSLATE_SPEED        = false; //windspeed, north northwest instead of NNW
var _STANDBY_AFTER_MINUTES  = false; //enter amount of minutes like: 5 (5 minutes)
var _SCROLL_NEWS_AFTER      = 7000; //milliseconds, so 7000 is 7 seconds
var _SHOW_LASTUPDATE        = true;
var _LASTUPDATE_FORMAT      = 'DD-MM-YY HH:mm';
var _SCREENSLIDER_EFFECT    = 'slide'; //'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'

var _APIKEY_MAPS            = 'AIzaSyDGimOWkWtIdyw3R-rbOQfuRhFhJfEkc98';
var _MAPS_LATITUDE          = '51.4477476';
var _MAPS_LONGITUDE         = '5.4506984';

var _AUTO_SWIPEBACK_TO      = 1; //when no activity, swipe back to main screen after x seconds
var _AUTO_SWIPEBACK_TIME    = 10; //seconds

var calendars = {}
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/' }

//example station id: station-eindhoven
var publictransport = {}
publictransport.ovinfo= { station: 'station-eindhoven', title:'OV Info', show_lastupdate:true, provider: '9292', icon: 'train', results: 5 };
publictransport.ovinfotrain= { station: 'station-eindhoven', title:'Bus', show_lastupdate:true, provider: '9292-bus', icon: 'bus', results: 5 };
publictransport.ovinfobus= { station: 'station-eindhoven', title:'Trein', show_lastupdate:true, provider: '9292-train', icon: 'train', results: 5 };

var buttons = {}
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image: 'http://api.buienradar.nl/image/1.0/RadarMapNL?w=285&h=256', url: 'http://www.weer.nl/verwachting/nederland/son/189656/'}
buttons.radio = {width:12, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm'}
buttons.nunl = {width:12, icon: 'fa-newspaper-o', title: 'Nu.nl', url: 'http://www.nu.nl'}

But how do I get the buienradar, public transport and the nu.nl news feed to show up? Below is a screenshot of the current Dashticz Dashboard.

Thanks in advance!

Greetings, Thursten

PS. Funny to see this is created by practically my neighbour! ;P

image

robgeerts commented 7 years ago

With your config it works with me, except for the news. If you want the news to work you have to define blocks and screens... Take a look at: http://www.domoticz.com/wiki/Dashticz_V2_-_Positioning

Try that first please. Living in Son too? (Sonniuspark?)

ThirstyThursten commented 7 years ago

Hello, It's me again!

Okay so as you can see from the picture it's working better now.. I just did a new git clone and replaced the config and that worked! ..So far..

I'm now struggling with the positioning.. I think I have it right but the layout isn't changing.. Could you look over it and help again?

This is the config:

var _LANGUAGE               = 'nl_NL'; //or: en_US, fr_FR, hu_HU
var _HOST_DOMOTICZ          = 'http://192.168.3.85:8080';
var _DOMOTICZ_REFRESH       = 5; //in seconds
var _DASHTICZ_REFRESH       = 3; //in minutes
var _THEME                  = 'default'; // default = dashticz default theme
/*
IF YOU HAVE A MEDIABOX FROM ZIGGO (HORIZON), COPY SWITCH_HORIZON.PHP ON A WEBSERVER INSIDE YOUR NETWORK AND CHANGE THE IP.
ENTER THE PATH TO THIS FILE BELOW.
*/
var _HOST_ZIGGO_HORIZON     = ''; //e.g. http://192.168.1.3/domoticz/switch_horizon.php';
var _APIKEY_WUNDERGROUND    = '1f7d6c7ede149e97';
var _WEATHER_CITY           = 'Eindhoven';
var _WEATHER_CITYNAME       = ''; //show a different city name, leave empty if same as _WEATHER_CITY
var _WEATHER_COUNTRY        = 'NL';
var _USE_AUTO_POSITIONING   = false; //don't want to configure positions, use auto positioning
var _USE_FAVORITES          = false; //only used when using auto positioning
var _HIDE_SECONDS_IN_CLOCK  = false; //do not show the seconds in the clock
var _HIDE_MEDIAPLAYER_WHEN_OFF = false; //when you have a mediaplayer connected, hide it if nothing is playing
var _NEWS_RSSFEED           = 'http://www.nu.nl/rss/algemeen';
var _USE_FAHRENHEIT         = false;
var _USE_BEAUFORT           = false; //Bft instead of m/s
var _TRANSLATE_SPEED        = false; //windspeed, north northwest instead of NNW
var _STANDBY_AFTER_MINUTES  = false; //enter amount of minutes like: 5 (5 minutes)
var _SCROLL_NEWS_AFTER      = 7000; //milliseconds, so 7000 is 7 seconds
var _SHOW_LASTUPDATE        = true;
var _LASTUPDATE_FORMAT      = 'DD-MM-YY HH:mm';
var _SCREENSLIDER_EFFECT    = 'slide'; //'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'

var _APIKEY_MAPS            = 'AIzaSyDGimOWkWtIdyw3R-rbOQfuRhFhJfEkc98';
var _MAPS_LATITUDE          = '51.4477476';
var _MAPS_LONGITUDE         = '5.4506984';

var _AUTO_SWIPEBACK_TO      = 1; //when no activity, swipe back to main screen after x seconds
var _AUTO_SWIPEBACK_TIME    = 10; //seconds

var _ICALENDAR_DATEFORMAT   = 'DD.MM.YYYY HH:mm'; //'friendly', 'MM.DD.YYYY HH:mm', 'DD.MM.YYYY HH:mm', 'YYYY.MM.DD HH:mm'
var _ICALENDAR_LOCALE       = 'nl'; //en,hu, etc.

//PublicTransport defenition
//example station id: station-eindhoven
var publictransport = {}
publictransport.ovinfo= { station: 'station-eindhoven', title:'OV Info', show_lastupdate:true, provider: '9292', icon: 'train', results: 5 };
publictransport.ovinfotrain= { station: 'station-eindhoven', title:'Bus', show_lastupdate:true, provider: '9292-bus', icon: 'bus', results: 5 };
publictransport.ovinfobus= { station: 'station-eindhoven', title:'Trein', show_lastupdate:true, provider: '9292-train', icon: 'train', results: 5 };

//Buttons defenition
var buttons = {}
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image: 'http://api.buienradar.nl/image/1.0/RadarMapNL?w=285&h=256', url: 'http://www.weer.nl/verwachting/nederland/son/189656/'}
buttons.radio = {width:12, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm'}
buttons.nunl = {width:12, icon: 'fa-newspaper-o', title: 'Nu.nl', url: 'http://www.nu.nl'}
buttons.moon = {width:12, isimage:true, refreshimage:60000, image: 'moon'}

//Block defenition
var blocks = {}
blocks['news_games'] = {}
blocks['news_games']['feed'] = 'http://www.nu.nl/rss/Games';
blocks['news_thn'] = {}
blocks['news_thn']['feed'] = 'http://thehackernews.com/feeds/posts/default?alt=rss';

//Calender defenition
var calendars = {}
//calendars.business = { maxitems: 5, url: 'https://calendar.google.com/calendar/', icalurl: 'https://calendar.google.com/calendar/' }
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/' }

//Columns defenition
var columns = {}
columns[1] = {}
columns[1]['blocks'] = ['clock','sunrise',buttons.buinradar,buttons.moon] 
columns[1]['width'] = 2;

columns[2] = {}
columns[2]['blocks'] = ['currentweather_big','weather','news']
columns[2]['width'] = 5; 

columns[3] = {}
columns[3]['blocks'] = ['news_games','news_thn',buttons.radio,calendars.private]
columns[3]['width'] = 5;

Thanks again!

And I'm from Eindhoven! So that's pretty close! ;)

image

robgeerts commented 7 years ago

Use console (f12) to see if it shows any errors.. I tried your config, remove buttons.moon ;)

ThirstyThursten commented 7 years ago

I tried that.. Don't really know what I'm looking for.. I see a lot of CSS warnings and in network there is a 404 error on json.htm.. Further not much I can get something from..

So you tried my config and it worked? Do I need to reboot my Pi again?

Have you changed anything else in your Dashticz besides config.js that I could be missing?

EDIT: I sometimes see "Domoticz error, check your _Host_Domoticz_Variable" or something like that? Ooh and something more now: afbeelding

EDIT EDIT: I tested it out at home.. (before I was trying to do it from a remote location) From hom, inside the network it still doesn't work.. I don't get any errors when inspecting the element(F12).. Only a whole lot of CSS warnings. But it still doesn't look like it should, or how I want it to look..

Here i a revised version of Config.js:


var _LANGUAGE               = 'nl_NL'; //or: en_US, fr_FR, hu_HU
var _HOST_DOMOTICZ          = 'http://192.168.3.85:8080';
var _DOMOTICZ_REFRESH       = 5; //in seconds
var _DASHTICZ_REFRESH       = 3; //in minutes
var _THEME                  = 'default'; // default = dashticz default theme
/*
IF YOU HAVE A MEDIABOX FROM ZIGGO (HORIZON), COPY SWITCH_HORIZON.PHP ON A WEBSERVER INSIDE YOUR NETWORK AND CHANGE THE IP.
ENTER THE PATH TO THIS FILE BELOW.
*/
var _HOST_ZIGGO_HORIZON     = ''; //e.g. http://192.168.1.3/domoticz/switch_horizon.php';
var _APIKEY_WUNDERGROUND    = '1f7d6c7ede149e97';
var _WEATHER_CITY           = 'Eindhoven';
var _WEATHER_CITYNAME       = ''; //show a different city name, leave empty if same as _WEATHER_CITY
var _WEATHER_COUNTRY        = 'NL';
var _USE_AUTO_POSITIONING   = false; //don't want to configure positions, use auto positioning
var _USE_FAVORITES          = false; //only used when using auto positioning
var _HIDE_SECONDS_IN_CLOCK  = false; //do not show the seconds in the clock
var _HIDE_MEDIAPLAYER_WHEN_OFF = false; //when you have a mediaplayer connected, hide it if nothing is playing
var _NEWS_RSSFEED           = 'http://www.nu.nl/rss/algemeen';
var _USE_FAHRENHEIT         = false;
var _USE_BEAUFORT           = false; //Bft instead of m/s
var _TRANSLATE_SPEED        = false; //windspeed, north northwest instead of NNW
var _STANDBY_AFTER_MINUTES  = false; //enter amount of minutes like: 5 (5 minutes)
var _SCROLL_NEWS_AFTER      = 7000; //milliseconds, so 7000 is 7 seconds
var _SHOW_LASTUPDATE        = true;
var _LASTUPDATE_FORMAT      = 'DD-MM-YY HH:mm';
var _SCREENSLIDER_EFFECT    = 'slide'; //'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'

var _APIKEY_MAPS            = 'AIzaSyDGimOWkWtIdyw3R-rbOQfuRhFhJfEkc98';
var _MAPS_LATITUDE          = '51.4477476';
var _MAPS_LONGITUDE         = '5.4506984';

var _AUTO_SWIPEBACK_TO      = 1; //when no activity, swipe back to main screen after x seconds
var _AUTO_SWIPEBACK_TIME    = 10; //seconds

var _ICALENDAR_DATEFORMAT   = 'DD.MM.YYYY HH:mm'; //'friendly', 'MM.DD.YYYY HH:mm', 'DD.MM.YYYY HH:mm', 'YYYY.MM.DD HH:mm'
var _ICALENDAR_LOCALE       = 'nl'; //en,hu, etc.

var calendars = {}
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/' }

//example station id: station-eindhoven
var publictransport = {}
publictransport.ovinfo= { station: 'station-eindhoven', title:'OV Info', show_lastupdate:true, provider: '9292', icon: 'train', results: 5 };
publictransport.ovinfotrain= { station: 'station-eindhoven', title:'Bus', show_lastupdate:true, provider: '9292-bus', icon: 'bus', results: 5 };
publictransport.ovinfobus= { station: 'station-eindhoven', title:'Trein', show_lastupdate:true, provider: '9292-train', icon: 'train', results: 5 };

var buttons = {}
buttons.buienradar = {width:12, isimage:true, refreshimage:60000, image: 'http://api.buienradar.nl/image/1.0/RadarMapNL?w=285&h=256', url: 'http://www.weer.nl/verwachting/nederland/son/189656/'}
buttons.radio = {width:12, image: 'img/radio_on.png', title: 'Radio', url: 'http://nederland.fm'}
buttons.nunl = {width:12, icon: 'fa-newspaper-o', title: 'Nu.nl', url: 'http://www.nu.nl'}
//buttons.moon = {width:12, isimage:true, refreshimage:60000, image: 'moon'}

var blocks = {}
blocks['news_games'] = {}
blocks['news_games']['feed'] = 'http://www.nu.nl/rss/Games';
blocks['news_thn'] = {}
blocks['news_thn']['feed'] = 'http://thehackernews.com/feeds/posts/default?alt=rss';

var calendars = {}
//calendars.business = { maxitems: 5, url: 'https://calendar.google.com/calendar/', icalurl: 'https://calendar.google.com/calendar/' }
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/' }

var columns = {}
columns[1] = {}
columns[1]['blocks'] = ['clock','sunrise',buttons.buinradar] 
columns[1]['width'] = 2;

columns[2] = {}
columns[2]['blocks'] = ['currentweather_big','weather','news']
columns[2]['width'] = 5; 

columns[3] = {}
columns[3]['blocks'] = ['news_games','news_thn',buttons.radio,calendars.private]
columns[3]['width'] = 5;

Is there any argument or code piece missing? Or resides the problem in another file perhaps? 'Cause again, I didn't change anything but the "config.js" file..

I hope you can help me out, because I would love for this to work!! =D

Thanks again, Greets!

ThirstyThursten commented 7 years ago

Hey Guys!

I got it to work so far!! =D Seemed it were a few typos! xD

Though I can't get the calendar to work. Shouldn't I put my login info anywhere? I want my google calendar in there. I only see "Loading..." in the part where the calendar should render. Any tips? =)

Thanks in advance!

robgeerts commented 7 years ago

You shouldn't enter your login info... Did you use the Private address (Privé-adres) under your calendar settings?

ThirstyThursten commented 7 years ago

Hey you guys!

I'm so sorry for not giving a sooner reaction! I got it to work!! I even have 2 screens as of now, it is still very basic dashboard without any Domoticz buttons or anything, since I'm still saving up for a Hue starter pack and that sort of stuff. =D

I don't have much experience with programming or anything, but I somehow found out (through the wiki and) by reading the code of the calendar parser that I needed a ICS file. I never heard of that before but I found out how it works and got it to work! It's amazing!

Once more I would like to thank and show my appreciation to Rob for making this and being so very helpful!! =D You're awesome! ;)

I just wanted to show what I made:

Screen 1:

image

Screen 2:

image

robgeerts commented 7 years ago

Great work!! Keep on going like this!