Dashticz - Module - Calendar

[pvklink]

@lokonli: problem solved. there werer no meetings for the selected agenda! Everythings works fine...

[Lokonli]

@lokonli: problem solved. there werer no meetings for the selected agenda! Everythings works fine...

ok, thanks for the update!

[Dave47]

I have a file f1kalender.ics from my phone.
I put it in Dashticz folder.

Is it possible with module Calandar to make this vissible in Dashticz.

Which code do i need?

I have tried but it is not working

[mvdheide01]

Hi,
I am trying just to display the google calendar as it shows in the "integrate calendar". So no tricks or formatting, just as it comes because i like that. Also my garbage calendar is included, the holidays etc.
I was able to show it in Dashticz, but after 1 minute or so, it is replace by the month view of a google calendar.
I have seen some posts on it and tried to put it together, but I am stuck.
How can i do that?
I tried to add a screenshot as attachement to this post but it keeps complaining that it is too large
Marcel

How did you add your calendar to Dashticz? Via a frame, or via a calendar block?
Can you post your calendar definition from your CONFIG.js here?

Thanks for replying,
Actually at this moment i don't know what my configuration was exactly and I ca't find that post anymore.
I had found a post that put it in a frame and remove the "<iframe src=" before the link and "></iframe>" from the end of the Google calendar link.
But at this moment every try does not display the page anymore. I should be displayed like for example the train info or news from nu.nl.
It would help to have a simple example that always would work to display.

[Lokonli]

Hi,
I am trying just to display the google calendar as it shows in the "integrate calendar". So no tricks or formatting, just as it comes because i like that. Also my garbage calendar is included, the holidays etc.
I was able to show it in Dashticz, but after 1 minute or so, it is replace by the month view of a google calendar.
I have seen some posts on it and tried to put it together, but I am stuck.
How can i do that?
I tried to add a screenshot as attachement to this post but it keeps complaining that it is too large
Marcel

How did you add your calendar to Dashticz? Via a frame, or via a calendar block?
Can you post your calendar definition from your CONFIG.js here?

Thanks for replying,
Actually at this moment i don't know what my configuration was exactly and I ca't find that post anymore.
I had found a post that put it in a frame and remove the "<iframe src=" before the link and "></iframe>" from the end of the Google calendar link.
But at this moment every try does not display the page anymore. I should be displayed like for example the train info or news from nu.nl.
It would help to have a simple example that always would work to display.

First, you have to find the correct link to your calendar. You can find them as follows:
open https://calendar.google.com/calendar
Under 'My calendars' click on the three dots behind your calendar -> settings and sharing

In the page that opens look for the following links:
Public URL to this calendar. It's something like: https://calendar.google.com/calendar/em ... FAmsterdam

I call this PublicURL

Secret address in ICAL format. It's something like: https://calendar.google.com/calendar/ic ... /basic.ics

I call this SecretICAL

There are several ways to display your google calendar:

1) Use a calendar block.
See https://www.domoticz.com/wiki/Dashticz_ ... -_Calendar

Set the icalurl parameter to SecretICAL
Set the url parameter to PublicURL

Precondition: You must use a recent beta, and have PHP enabled.

2) Use a frame:
In CONFIG.js:

Code: Select all

var frames = {}
frames.calendar = { frameurl: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
frames.calendar
]

3) Via a button
In CONFIG.js:

Code: Select all

var buttons= {}
buttons.calendar = { url: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
buttons.calendar
]

If you click the button your calendar will be shown in a popup window.

You can configure the frame and button via the usual parameters (title, width, height, icon, etc)

One of the advantages for method 1 is that you don't have to login into your Google account, so I would recommend that one.

[Lokonli]

I have a file f1kalender.ics from my phone.
I put it in Dashticz folder.

Is it possible with module Calandar to make this vissible in Dashticz.

Which code do i need?

I have tried but it is not working

yes, that is possible.
Define your calendar as follows in CONFIG.js:

Code: Select all

calendars.example = {maxitems:4, icalurl:'/home/pi/dashticz_v2/f1kalender.ics'}

and then add calendars.example to a column.
You have to change the icalurl to the correct path for your ics file.
The ics file must have read permission set for the webserver-user (normally that's root)

[mvdheide01]

How did you add your calendar to Dashticz? Via a frame, or via a calendar block?
Can you post your calendar definition from your CONFIG.js here?

Thanks for replying,
Actually at this moment i don't know what my configuration was exactly and I ca't find that post anymore.
I had found a post that put it in a frame and remove the "<iframe src=" before the link and "></iframe>" from the end of the Google calendar link.
But at this moment every try does not display the page anymore. I should be displayed like for example the train info or news from nu.nl.
It would help to have a simple example that always would work to display.

First, you have to find the correct link to your calendar. You can find them as follows:
open https://calendar.google.com/calendar
Under 'My calendars' click on the three dots behind your calendar -> settings and sharing

In the page that opens look for the following links:
Public URL to this calendar. It's something like: https://calendar.google.com/calendar/em ... FAmsterdam

I call this PublicURL

Secret address in ICAL format. It's something like: https://calendar.google.com/calendar/ic ... /basic.ics

I call this SecretICAL

There are several ways to display your google calendar:

1) Use a calendar block.
See https://www.domoticz.com/wiki/Dashticz_ ... -_Calendar

Set the icalurl parameter to SecretICAL
Set the url parameter to PublicURL

Precondition: You must use a recent beta, and have PHP enabled.

2) Use a frame:
In CONFIG.js:

Code: Select all

var frames = {}
frames.calendar = { frameurl: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
frames.calendar
]

3) Via a button
In CONFIG.js:

Code: Select all

var buttons= {}
buttons.calendar = { url: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
buttons.calendar
]

If you click the button your calendar will be shown in a popup window.

You can configure the frame and button via the usual parameters (title, width, height, icon, etc)

One of the advantages for method 1 is that you don't have to login into your Google account, so I would recommend that one.

Great!
With this info, I at least have my previous results back.
I have used both options
1, with the calendar block using SecretICAL. That works ok but does not show my recurring appointments and the format is not like i want it (that i might be able to change in a css)
2, with iframe, this shows my combined calendar perfect, but only for one minute or so, then it is empty. You wrote something like I need to login to Google? Or do I need to set up an api key or something like that?
I would like option 2 to function

Let me try if i can show my code
In CONFIG.js:

Code: Select all

var calendars = {}
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/ical/.......mic.be_.........group.calendar.google.com/private-....../basic.ics' }

var frames = {}
frames.calendar = { frameurl: 'https://calendar.google.com/calendar/embed?showTitle=0&showNav=0&showDate=0&showPrint=0&showTabs=0&showCalendars=0&showTz=0&mode=AGENDA&height=400&wkst=2&bgcolor=%23FFFFFF&src=..........c.be_.........4%40group.calendar.google.com&color=%2344a703&src=en.be%23holiday%40group.v.calendar.google.com&color=%23125A12&src=.....%40import.calendar.google.com&color=%23691426&ctz=Europe%2FBrussels" style="border-width:0" width="400" height="400" frameborder="0" scrolling="no">'}

var columns = {}
columns[1]  = {}
columns[1]['blocks'] = [calendars.private]

columns[2] = {}
columns[2]['blocks'] = [frames.calendar]

[Dave47]

The ics file must have read permission set for the webserver-user (normally that's root)

How can i change that, i dont understand?
Dashticz can not read my file!


I use

Code: Select all

 var calendars = {}

calendars.example = {maxitems:4, icalurl:'/home/pi/dashticz_v2/f1kalender.ics'}  

Must i also use this or other other calendar config?

Code: Select all

  config['calendarurl']   

[mvdheide01]

Thanks for replying,
Actually at this moment i don't know what my configuration was exactly and I ca't find that post anymore.
I had found a post that put it in a frame and remove the "<iframe src=" before the link and "></iframe>" from the end of the Google calendar link.
But at this moment every try does not display the page anymore. I should be displayed like for example the train info or news from nu.nl.
It would help to have a simple example that always would work to display.

First, you have to find the correct link to your calendar. You can find them as follows:
open https://calendar.google.com/calendar
Under 'My calendars' click on the three dots behind your calendar -> settings and sharing

In the page that opens look for the following links:
Public URL to this calendar. It's something like: https://calendar.google.com/calendar/em ... FAmsterdam

I call this PublicURL

Secret address in ICAL format. It's something like: https://calendar.google.com/calendar/ic ... /basic.ics

I call this SecretICAL

There are several ways to display your google calendar:

1) Use a calendar block.
See https://www.domoticz.com/wiki/Dashticz_ ... -_Calendar

Set the icalurl parameter to SecretICAL
Set the url parameter to PublicURL

Precondition: You must use a recent beta, and have PHP enabled.

2) Use a frame:
In CONFIG.js:

Code: Select all

var frames = {}
frames.calendar = { frameurl: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
frames.calendar
]

3) Via a button
In CONFIG.js:

Code: Select all

var buttons= {}
buttons.calendar = { url: 'PublicURL'}

columns[1] = {}
columns[1]['blocks'] = [
buttons.calendar
]

If you click the button your calendar will be shown in a popup window.

You can configure the frame and button via the usual parameters (title, width, height, icon, etc)

One of the advantages for method 1 is that you don't have to login into your Google account, so I would recommend that one.

Great!
With this info, I at least have my previous results back.
I have used both options
1, with the calendar block using SecretICAL. That works ok but does not show my recurring appointments and the format is not like i want it (that i might be able to change in a css)
2, with iframe, this shows my combined calendar perfect, but only for one minute or so, then it is empty. You wrote something like I need to login to Google? Or do I need to set up an api key or something like that?
I would like option 2 to function

Let me try if i can show my code
In CONFIG.js:

Code: Select all

var calendars = {}
calendars.private = { maxitems: 5, icalurl: 'https://calendar.google.com/calendar/ical/.......mic.be_.........group.calendar.google.com/private-....../basic.ics' }

var frames = {}
frames.calendar = { frameurl: 'https://calendar.google.com/calendar/embed?showTitle=0&showNav=0&showDate=0&showPrint=0&showTabs=0&showCalendars=0&showTz=0&mode=AGENDA&height=400&wkst=2&bgcolor=%23FFFFFF&src=..........c.be_.........4%40group.calendar.google.com&color=%2344a703&src=en.be%23holiday%40group.v.calendar.google.com&color=%23125A12&src=.....%40import.calendar.google.com&color=%23691426&ctz=Europe%2FBrussels" style="border-width:0" width="400" height="400" frameborder="0" scrolling="no">'}

var columns = {}
columns[1]  = {}
columns[1]['blocks'] = [calendars.private]

columns[2] = {}
columns[2]['blocks'] = [frames.calendar]

I have switched to the calendar in block, which workes good, also the recurring events are there.
The only enhancement I would like to see is the order of the records.
Now when there there is a recurring appointment at 11:00 and a normal at 14:00, the 14:00 appointment is shown first.
Can this be included?

[naitsirhc]

Is it possible to give items which will return in the calendar some colors, For example:
Birthday wil be written in blue
Dentist in yellow
etc.

[Lokonli]

Is it possible to give items which will return in the calendar some colors, For example:
Birthday wil be written in blue
Dentist in yellow
etc.

Do you mean coloring of recurring events, or give an event a color if it contains specific text?

[naitsirhc]

Is it possible to give items which will return in the calendar some colors, For example:
Birthday wil be written in blue
Dentist in yellow
etc.

Do you mean coloring of recurring events, or give an event a color if it contains specific text?

I would like to give the event a color if it contains a specific text, or even better...showing a icon and colored text

[TankySpanky]

Im starting to getting a headache of the Calendar thing......... Grrrr
I got the garbage working but the normal one seems to get blocked ( probally my mistake ) but i cant find it.
When i press F12 i get the following error

Code: Select all

Refused to display 'https://accounts.google.com/ServiceLogin?service=cl&passive=*******&osid=1&continue=https://calendar.google.com/calendar/render&followup=https://calendar.google.com/calendar/render&scc=1' in a frame because it set 'X-Frame-Options' to 'deny'.

changed one number to ***

I placed in the .htaccess
"Header always unset X-Frame-Options"
But no fireworks with that...

"Pretty please" Help

[Lokonli]

Im starting to getting a headache of the Calendar thing......... Grrrr
I got the garbage working but the normal one seems to get blocked ( probally my mistake ) but i cant find it.
When i press F12 i get the following error

Code: Select all

Refused to display 'https://accounts.google.com/ServiceLogin?service=cl&passive=*******&osid=1&continue=https://calendar.google.com/calendar/render&followup=https://calendar.google.com/calendar/render&scc=1' in a frame because it set 'X-Frame-Options' to 'deny'.

changed one number to ***

I placed in the .htaccess
"Header always unset X-Frame-Options"
But no fireworks with that...

"Pretty please" Help

Which exact Dashticz version are you using?
(you find your Dashticz version if you click on the settings icon in the Dashticz topbar, and then on the info tab)

Do you use a server with PHP installed? Which PHP version is reported by Dashticz?
(you find your PHP version if you click on the settings icon in the Dashticz topbar, and then on the info tab)

You must have an (unmodified) recent beta version of Dashticz, with a PHP enabled webserver for the calendar to work.

How did you define your calendar in CONFIG.js?

[TankySpanky]

Hello ,
I have installed...
Dashticz Beta
Php 7.0.33-0+deb9u3
Apache2 webserver
I have copied the "private" link from google calendar in the place for the kalender URL ical

Code: Select all

https://calendar.google.com/calendar/ical/***********%40gmail.com/private-************************/basic.ics

further i have some CSS changes for nothing strange
Edited the traffic.js info to show belgium traffic info

ty in advance

[Lokonli]

Hello ,
I have installed...
Dashticz Beta
Php 7.0.33-0+deb9u3
Apache2 webserver
I have copied the "private" link from google calendar in the place for the kalender URL ical

Code: Select all

https://calendar.google.com/calendar/ical/***********%40gmail.com/private-************************/basic.ics

further i have some CSS changes for nothing strange
Edited the traffic.js info to show belgium traffic info

ty in advance

Just to be sure: Which Dashticz version are you using?

I'm not sure how you defined your calendar block in CONFIG.js, but my advice is to do it as follows:

Code: Select all

var calendars = {}
calendars.me = { maxitems: 10,
  icon:'far fa-lightbulb',
  icalurl: 'https://calendar.google.com/calendar/ical/me%40gmail.com/private-12ab12ab12ab12ab12ab12ab/basic.ics'
}

and then add it to a column:

Code: Select all

columns[1] = {}
columns[1]['blocks'] =  [
  calendars.me
  ]

This should work ...

[TankySpanky]

Sorry i forgot Dashticz version

"version": "2.5.10",
"branch": "beta",

I have placed copied it as stated, but i do get the bar with the lightbulb but nothing below or next to it,
even make a app. for next saturday ( for private ) and it does nog show
All other things are not visable too


UPDATE:

Typo found
Its working now ...
THANKS

crap i think i spend all together about 11 hours of copie paste type and redo / reinstall restart apache2 Name it...

/BOW /HUG

[Lokonli]

Sorry i forgot Dashticz version

"version": "2.5.10",
"branch": "beta",

I have placed copied it as stated, but i do get the bar with the lightbulb but nothing below or next to it,
even make a app. for next saturday ( for private ) and it does nog show
All other things are not visable too


UPDATE:

Typo found
Its working now ...
THANKS

crap i think i spend all together about 11 hours of copie paste type and redo / reinstall restart apache2 Name it...

/BOW /HUG

Excellent!
For my curiosity: what was the typo?
Maybe I can improve the error handling in Dashticz ...

[TankySpanky]

Hello

Because i copy pasted the info u posted i pasted it and then copied my own ics url at the end which resulted in a double path to the google calendar

Code: Select all

 icon:'far fa-calendar',  icalurl: 'https://calendar.google.com/calendar/ical/https://calendar.google.com/calendar/ical/aad.*****%40gmail.com/private-d***********/basic.ics

So it was totally my fault.

now i started to think if i can host my own calendar for the family so all access and one calendar to display
I can do the combined one for my wife's and mine i guess to start with
Now its working i can move on with it

ty again

[TankySpanky]

Works like a charm

Code: Select all

calendars.combined = {}
calendars.combined.maxitems = 14;
calendars.combined.width = 6;
calendars.combined.icon = 'far fa-calendar';
calendars.combined.calendars = [
	{ color:'White',calendar:calendars.simone }, 
	{ color:'Yellow',calendar:calendars.aad }
]
calendars.combined.url = 'https://calendar.google.com/calendar';