Lovelace: Clock Card

dicko · April 23, 2021, 7:14am

Mine works on all connections.

pw44 · July 28, 2021, 10:07pm

Not being able to make it work.

lovelace resources: /local/custom-lovelace/clockwork-card.js

under www directory, created the folder custom-lovelace and have clockwork-card.js on it.

Custom element doesn't exist: clockwork-card.
entity: sensor.date_time_iso
locale: en-GB
other_time:
  - America/New_York
  - Australia/Sydney
  - Australia/Brisbane
style: |
  .other_clocks { display: none; }
  .time { text-align: center; }
type: custom:clockwork-card

but no way to make it work.

Any hint?

dicko · July 29, 2021, 7:18am

I have my js card in my www folder and works great but I had issues when I first tried setting up this clock

pw44 · July 29, 2021, 11:32am

i’ve tried all - no luck - i give up.

dicko · August 8, 2021, 9:11am

Any ones world times disappeared on the right, my main time is still there but central now ? This happened after a reboot on 2021.7.3

Nothing changed

Snash · August 19, 2021, 7:23pm

This works awesome on HA core version 2021.6.6 In case it helps anyone…

I installed this through HACS clockwork-card

then added this in lovelace: Edit Dashboard → Add Card → scroll to the bottom “manual”

entity: sensor.date_time_iso
locale: en-GB
other_time:
  - Asia/Kolkata
  - America/Vancouver
style: |
  .other_clocks { display: none; }
  .time { text-align: center; }
type: custom:clockwork-card

I also added this in my configuration YAML

sensor:    
    platform: time_date
    display_options:
      - 'time'
      - 'date'
      - 'date_time'
      - 'date_time_utc'
      - 'date_time_iso'
      - 'time_date'
      - 'time_utc'
      - 'beat'

screenshot.322

paddy0174 · August 19, 2021, 7:44pm

You really should update your itallation…

Snash · August 19, 2021, 7:47pm

Nice catch fixed it is actually 2021.6.6 Seriously I need to focus more

dicko · August 19, 2021, 7:58pm

@Snash so does that fix work in 2021.8.* ?

Mine not worked for a couple of months now

finity · August 19, 2021, 8:13pm

What fix?

I haven’t changed anything on mine and it works fine an 2021.8.

dicko · August 19, 2021, 8:19pm

@finity Just trying to see if anyone has actually got it working as @Snash got his working in 2021.1.1 but mine not worked from 2021.6 I think. Its still not working in 2021.8 and Ive changed nothing and I havent seen any breaking changes. My code is same as above.

Cheers

Martyn

Snash · August 19, 2021, 8:21pm

@dicko My version is core-2021.6.6 My apologies I got it wrong but have since fixed my post

dicko · August 19, 2021, 8:26pm

if you upgrade, it may just change as mine is like this and I havent changed anything and I have 6 out of the 8 time options you have.

baz123 · October 29, 2021, 2:22pm

Can it display seconds?

Wrenchmonkey · November 25, 2021, 4:31pm

In the github instructions, what does this mean?

"Reference accordingly
resource:

url: /local/custom-lovelace/clockwork-card.js
type: js"

Where does one “reference” this? In the configuration.yaml, or what?

finity · November 26, 2021, 4:06am

I just realized there isn’t any (that I could find) instructions on how to add custom cards.

If you install the custom cards thru HACS it will automatically put the reference to the .js file in the right place.

if you install it manually and are using the Lovelace UI editor you need to add it to the resources tab at configuration->Lovelace Dashboards.

if you install it manually and don’t use the UI editor then you need to add the resource to the “lovelace:” section of the configuration.yaml file:

lovelace:
  mode: yaml
  resources:
    - url: /local/lovelace/clockwork-card.js
      type: module
    - url: /local/lovelace/tiles-card.js
      type: module
    - url: /local/lovelace/timetable-card.js?v=1
      type: module
etc.

dicko · November 28, 2021, 8:34am

Ive not had any other countries work on this for about 6 months.

Has anyone else ?

It just shows the current time for my timezone

acronce · November 29, 2021, 1:44am

This custom card has worked well for me for many months and on all clients (Safari, dedicated Android 9 tablets, and the HA iOS app). Today I’ve been trying to set up an Android 10 tablet and all it shows me is the time in UTC for every timezone. It’s the same in Chrome and Fully Kiosk Browser.

Only this one Android 10 tablet is wrong. Its timezone is correct. I’ve tried unsetting and resetting the timezone, clearing the browser cache, cookies, etc. and rebooting.

My config is very simple (and as mentioned works everywhere except this new tablet):

type: custom:clockwork-card
entity: sensor.date_time_iso
other_time:
  - Europe/London
  - America/New_York
  - Asia/Tokyo

Maybe I’m missing something that only the newer Chromium cares about?

dicko · November 29, 2021, 6:48pm

This is my code and it wasnt changed. It just stopped working. I use Chrome and Edge only. So you could be right.

entity: sensor.date_time_iso
locale: en-GB
other_time:
  - America/New_York
  - Australia/Sydney
  - Australia/Brisbane
style: |
  .other_clocks { display: none; }
  .time { text-align: center; }
type: custom:clockwork-card

acronce · November 30, 2021, 3:48pm

I left my new Android 10 tablet running and out of the blue the time information is now correct. I didn’t make any changes.

Weird, but at least it works now.