yeah, the console doesnt show anything connected with the calendar and I have few events in next days
Very nice work! One question, how did you get the “send congrats” button for the birthdays?
That’s commented out in the source code for now at least
Post your config
Found the mistake - typo in account address.
Sorry to bother you 
Thank you
1 Like
Hi guys,
So I have now moved to the lovelace-ui by using the addon and converted the configurations.yaml file.
The thing I’m struggling with now is to get the calendar card working.
So i followed the link you posted and I tried the following:
- I copied this into my configurations.yaml file but the the conf. check fails at custom.updater
custom_updater:
card_urls:
- https://raw.githubusercontent.com/rdehuyss/homeassistant-lovelace-google-calendar-card/master/custom_updater.json
- Then I added this to my lovelace.yaml file
resources:
- url: https://unpkg.com/[email protected]/moment.js
type: js
- url: /local/custom_ui/calendar-card/calendar-card.js?v=1.0.1
type: module
- And finally I added this (with my own calendars)
- type: "custom:calendar-card"
entities:
- calendar.ronald_dehuysser
- calendar.contacts
But when I load the lovelace ui I see this:
“Custom element doesn’t exist: calendar-card”.
Is it because I haven’t downloaded that .js file and placed it somewhere?
Where should it be placed and can I do it through samba?
What about the other error, do you know why?
Your configuration expect it to be there.
tip: the local is the www dir
https://www.home-assistant.io/components/http/#hosting-files
Hey,
Still struggling. I opened the share and created a www directory - no luck:
\xxx.xxx.xxx.xxx\config\www\calendar-card.js
Still the same error on the lovelace interface:
Custom element doesn’t exist: calendar-card
What have I missed?
Looks very nice, thanks for that
This calendar is awesome, I want to highlight items happening in less than 48 hours.
Use case could be change background colour of that event when =<48 hours before or use the Lovelace markdown card and print that events details to a card at top of page leading up to it.
Any ideas where i would start with such a thing? I have seen template examples such as below but not sure how i could integrate that?
- condition: template
value_template: "{{ state_attr('calendar.XXX', 'start_time') =< (as_timestamp(utcnow().day) + (172800)) }}"
As per your 1st post above you are referencing the calendar-card.js in;
– url: /local/custom_ui/calendar-card/calendar-card.js?v=1.0.1
But, you are storing it in local/calendar-card.js
make the directory \xxx.xxx.xxx.xxx\config\www\custom_ui\calendar-card\
and move calendar-card.js there.
1 Like
Not sure if I should put a feature request here, or in the github?
Would it be possible to show “Today” instead of the date for events that are today? So the top event if there are events today. Just makes it easier to see what you have today.
Or, I can edit the .js, how would I go about doing that, I tried, but without success.
Sorry - yes I got that one corrected now.
Unfortunately, in the logs I see this error now:
http://xxx.xxx.xxx.xxx:8123/local/custom_ui/calendar-card/calendar-card.js?v=1.0.1:7:1 Uncaught SyntaxError: Unexpected token <
Same I see on the lovelace interface:
Custom element doesn’t exist: calendar-card
Any clue?
Not sure, but sounds like a javascript error.
I would make sure the contents of calendar-card.js exactly match what is in the repo.
Oh okay 
Thanks for you help so far!
Anyone else know what I might have missed?
Hi rdehuyss,
just wanted to thank you for that calendar component.
Works like a charm with my caldav calendar
1 Like
Anyone using this in combination with animated weather.
When i use them separately i dont have any issues but together theire layout gets scrambled.
Using both the animated weather card and the awesome Google calendar card with no issues.
I’m only getting one event show with google calendar, what am I doing wrong?
EDIT: Fixed it!
1 Like
Yes, I think they both use div class=“day”, and it messes up the css.
Hopefully fixed in a future version, but to temp fix, in calendar-card.js, I edited line 158 to
<div class="calendar_day"
and line 74 change .day { to
.calendar_day {
2 Likes