wassy92x/lovelace-digital-clock

A custom digital clock card for Home Assistant

lovelace-digital-clock's Issues

Digital Clock Card only updating every hour

Having an issue where the clock card is not updating. Seems to only be updating about every hour. This occurs no matter which device is being used to present my dashboard -- iPhone, iPad, Fire tablet, Windows.

I have confirmed the time is correct within HA, only the card is not updating.

I'm running:

• Core 2024.1.6
• Supervisor 2024.01.1
• Operating System 11.4
• Frontend 20240104.0
• Digital Clock v1.2.4

Here's my yaml:

type: custom:digital-clock
dateFormat:
  weekday: long
  day: 2-digit
  month: long
timeFormat: h:hh a
timeZone: America/Chicago
locale: en
card_mod:
  style: |
    ha-card {
      --ha-card-background: black;
      color: white;
      font-size: 11px;
      text-align-last: left;
    }

24 hour clock format

I like your clock, except I cannot get it to display the clock in 24 hr format. I have the UI code below:
- type: custom:digital-clock timeformat: hour: 2-digit minute: 2-digit hour12: false

I understood from another post this could be changed using the "hour12". However "hour12: false" has no impact. I have cleared the cache and retarted HA without any effect.

can't add tap actions

This clock was perfect for my needs, wanted a very small clock for a small panel I have running. However I was trying to add a tap action, to navigate to another dashboard with more calendar info, but the tap options don't seem to actually work.
Any thoughts?

type: custom:digital-clock
tap_action:
  action: navigate
  navigation_path: /living-room/calendar

Feature Request: Font Sizing.

Hi.

I love this add-on - my only issue is, i'm using it as the last button on my menu line, and the size of the fonts causes the tile to be truncated on my tablets. (example below)

I'd love an easy way to specify the date and time font sizes (separately if possible) in the yaml.

Thanks

24 Hour

Hello,

Is there a way to stipulate 24 hour clock format?

i.e 14:30 as opposed to 02:30?

Many thanks

What should be the timezone for India/Pune ?

This is more a question than an issue. What should be the timezone for India/Pune?

Possible to show seconds?

Hi, very nice card, was waiting for this!

Just a short question, is it possible to show seconds?

Thanks!!

Time updated hourly

Hi!

I've successfully added the clock to my Frontend but time is only updating hourly:

• Starts at 08:01 eg.
• Updates again at 09:01.

I've tried adding:
triggers_update:

• entity: sensor.time

And I can see the cards are blinking (updating) but the time stays the same until next hour..?

EDIT:
What seems to be the reason behind the problem was me adding "firstLineFormat: H:MM" to try to change the time from 12-hour to 24-hour. Is there a better way to do this without disrupting the clock advancing per minute?

EDIT 2:
Found the solution in previous questions asked here. Couldnt find a way to remove this one so marked it as complete. Sorry guys.

Deprecation lit-element

Hi,
Just saw this in developer tools:

The main 'lit-element' module entrypoint is deprecated. Please update your imports to use the 'lit' package: 'lit' and 'lit/decorators.ts' or import from 'lit-element/lit-element.ts'. See https://lit.dev/msg/deprecated-import-path for more information.
(anonymous) @ digital-clock.js?hacstag=373832981123:49

How do i add to HA dashboard?

Does not work on mobile app

Works in browser, but returns "Custom element doesn't exist: digital-clock" in mobile app.

Any way to make card fully transparent?

Love the clock and its clean look. Is there any way to make the card fully transparent so that time essentially sits on the background without any surround?

100% CPU on backend

I was experimenting and put this clock on a 'test' tab on one of my lovelace dashboards. Even though the component wasn't loaded on any dashboard the JS loaded on the client side randomly (from my POV) starts beating up the backend with a template render call every millisecond. Coming from 3 wall displays this was enough to crash home assistant. Taking it out of the resources file fixed the issue.

I ended up finding this with tcpdump looking at the network traffic, on the HA side its pretty hard to figure out where the calls are coming from. With debug logging on you'll see megabytes of messages like this:

2023-01-20 10:18:25.675 DEBUG (MainThread) [homeassistant.helpers.event] Template group [TrackTemplate(template=Template("{{as_timestamp(now())}}"), variables=None, rate_limit=None)] listens for {'all': False, 'entities': set(), 'domains': set(), 'time': True}, re-render blocker by super template: False 2023-01-20 10:18:25.676 ERROR (MainThread) [homeassistant.components.websocket_api.http.connection] [139717910366384] Client exceeded max pending messages [2]: 2048

Feature request: date component orders

I feel bad opening what appears to be the first issue, so...

First up, thank you: this is pretty close to exactly the component I was looking for.

That said, please could you consider a way to reorder the date components?

As an example:

    dateFormat:
      weekday: long
      day: 2-digit
      month: long

renders out as:
Tuesday, June 22

I would like to rearrange it to be "Tuesday, 22 June" (call it a regional/localization issue... )

Thanks!

24 hour time?

Is there a setting for 24 hour clock. 1600 vice 04:00 PM

enable 24 hour time

hello :).....

how do i enable 24 hour time?....

also....how do you use 'firstLineFormat'?.....what is the format?.....been messing with it...could you post a more complicated example?... i appreciate your time and effort :)

thank you :)

Year in date line

Thanks a lot for this wonderful digital clock. It's not an issue, what I am writing. Just an idea. Instead of only:

Donnerstag, 24. Juni

Will it be possible to have:

Donnerstag, 24. Juni 2021

With datefFormat year: short/long

Thanks a lot

Luxon Links do not work in Readme

The links to the LUXON docs have changed;
e.g.

https://moment.github.io/luxon/#/formatting?id=tolocalestring-strings-for-humans

Add Text behind Clock

is it possible to add a text behind the Clock?

Support Timezone

It seams the addon is using the browser Timezone. I'm not sure why, but for 2 different devices I have different timezones. I started noticing this recently. Perhaps related with countries summer time changes, not sure. Besides locale, could this addon also support timezone?

Custom element doesn't exist: digital-clock

I've downloaded (and repeat it twice) from /hacs/repository/373832981
Yes, I reloaded my browser.
And I copy/paste example from the official page:

cards: - **type: 'custom:digital-clock'** dateFormat: weekday: 'long' day: '2-digit' month: 'short' timeFormat: hour: '2-digit' minute: '2-digit' #show_header_toggle: false #entities: # - entity: sensor.time_date # name: Текущее время & дата - type: weather-forecast entity: weather.forecast_papernya name: '' show_forecast: true
But error appeared on evry reload (browser or mobile app the same)

Weekday Truncating

First, let me start by saying thatI love this card! Easy to use and set up and looks good!

I recently ran into an issue when tried to use the card in a grid. I have a grid comprising of 2 columns. The left column is 95% and contains the clock card and right column is 5% and has a chip card.

Despite the fact that I set the weekday: 'long' it displays the short one and I cannot figure out why?

Here is the code for my card:

`type: custom:layout-card
layout_type: custom:grid-layout
layout_options:
grid-template-columns: 95% 5%
grid-template-rows: auto
grid-template-areas: |
"left right"
cards:

• type: custom:digital-clock
  dateFormat: null
  weekday: long
  day: 2-digit
  month: long
  timeFormat: HH:mm
  hour: 2-digit
  minute: 2-digit
  seconds: 2-digit
  card_mod:
  style:
  .: |
  ha-card {
  background-color: transparent;
  box-shadow: none;
  border: 0px;
  }
  view_layout:
  grid-area: left
• type: custom:mushroom-chips-card
  chips:

  • type: template
    entity: alarm_control_panel.evo192_partition_area_1
    tap_action:
    action: none
    hold_action:
    action: none
    double_tap_action:
    action: none
    icon: |-
    {% set state = states(entity) %}
    {% if state == 'armed' %}
    mdi:shield-lock
    {% elif state == 'disarmed' %}
    mdi:shield-lock-open
    {% endif %}
    icon_color: |-
    {% set state = states(entity) %}
    {% if state == 'armed' %}
    red
    {% else %}
    green
    {% endif %}
    alignment: center
    card_mod:
    style: |
    ha-card {
    --chip-icon-size: 30px;
    --chip-height: 75px;

    --chip-border-width: 0px;
    --chip-box-shadow: none;
    --chip-background: none;
    }
    view_layout:
    grid-area: right`

Is it my coding so something with the card?

Disable time or date

Is there a way to turn off the date and only have the time?

Feature request: Background picture

Thank you for your work:) May I suggest something?

1. It would be great if we can set a background picture for the card. It would be even better If it can change automatically based on time (night mode/day mode )
2. Display a custom text (for example name day).
   Thank you

Time drift on internet disconnected tablet

When firewalling home assistant tablets display tablets, especially in Fire HD tablets running FireOS, the local device time can be off by several minute due to drift and therefore inconsistent with automations.

Currently my Fire HD tablets are off by 4 minutes, and NTP is not configurable in FireOS.

Technically this isn't an issue with the digital clock card, but I think there may be interest in avoiding local device time in preference for the home assistant server time. Allowing the card to pull the time from a sensor instead of the browser time using javascript would avoid this issue.

Height for digital clock

Any way to add a height attribute? This would be great for users who use HA as a night stand clock.... like me. Currently this is the best digital clock option in HA, and a height option would make this absolutely great. Any chance of adding this in?

12hr Display Mode

First up, a quick thanks, this clock is 99% perfect, just the 12/24hr thing was bugging me and I seen nothing in the documentation on changing it, so I decided to mess about and figured it out.

Just in case anyone else is wondering, as every single clock I looked at for Home Assistant was using 24hr mode, the following will give you 12hr mode as wifes and kids dont understand 24hr clocks properly:

type: custom:digital-clock
timeFormat: h:mm a
dateFormat:
weekday: long
day: 2-digit
month: short

This will display your clock like this:

Feature Request: Add seconds option

Could the seconds be added as an option, please?

24 hour clock?

Hi, thanks for this addon, it's super useful - is it possible to set the time to use a 24 hour clock instead of AM/PM ?

Thanks!

Custom element not found: digital-clock

Just installed, created a custom card, and pasted the following. What am I missing?

type: 'custom:digital-clock'
dateFormat:
weekday: 'long'
day: '2-digit'
month: 'short'
timeFormat:
hour: '2-digit'
minute: '2-digit'

Deprecation of polymer

Hi,
Noticed today when i upgraded HA to 2023.4.0 that polymer is not going to be supported in 2023.5.0.
https://developers.home-assistant.io/blog/2023/04/04/deprecating_polymer/

And i saw that this repository uses that one. Any plans on replacing polymer with LIT? 😄

Brg
Robin

24h TIME

We are using 24h time format. How to make it show 24h time and get rid of AM/PM symbols?

24 hour

Hi there.
Is there a way to get a 24h time format instead of am/pm ?

Thanks

Question: 24h clock available?

Hi,

First of all, thanks for the work you did creating this HA addon.

Is there any way to show a 24h clock rather than AM/PM.

Many thanks in advance!
Koen

SUGGESTION: Add a slot(s) for optional entities, second row next to date. Current weather and temperature would make it perfect.

Add a slot(s) for optional entities, second row next to date. Current weather and/or temperature would make it perfect.

The clock would not change visually if slot stays empty. Oterwise temp value woud be added after date.

Option to remove AM/PM and support for 24 hour

Hello. I have timeFormat set to hour: 2-digit and minute 2-digit. This renders the clock as:

01:18 PM

I would like clock to appear as 13:18
Without the PM. Is this possible? Thank you very much.

Possibility to change fontsize

Thanks for your card. I would like to use this on my wallpanel however I would need a larger font. The time (firstline need to baout 3x larger). I would like to see an option to set the fontsize for both the first and second line. The card height either need to autoadjust so the text can be seen or it is also configurable. E.g.

type: 'custom:digital-clock'
dateFormat:
  weekday: 'long'
  day: '2-digit'
  month: 'short'
  fontsize: 12px
timeFormat:
  hour: '2-digit'
  minute: '2-digit'
  fontsize: 36px

How to align text ?

Hi! Love the clock!
I would like to align it to the left so the time is sitting in the upper left corner of my dashboard. I already managed to make it transparent using card-mod however I can’t seem to change the text alignment. Thanks !