tomasrudh / analogclock Goto Github PK

Hallå
I can't change the colour of the text for weekdays

BR
Kenneth

Add a configurable time zone. Request from @kenge1967

Copied and pasted one of your examples.

Used HACS to install

Added the extra resource reference mentioned
https://unpkg.com/[email protected]/min/moment-with-locales.js

Restarted HA, using vanilla HA version 2021.6.2

'moment not defined' shows up in card with no hands

This card does not show up in the list, when you activate "Add card" in a dashboard.
I have downloaded it via HACS and restarted.

I wanted to install your analog clock card but I have a problem with the moment.js installation.
I followed the installation procedure as follows:

1. created the ui-lovelace.yaml file with the section 'resources' with the following content

• url: https://unpkg.com/[email protected]/min/moment-with-locales.js
  type: js

2. installed the card using the HACS installation method and the analog-clock is installed at /config/www/community/analogclock/analogclock.js.
3. added the new card using your example:

views:
- type: custom:vertical-layout
cards:
- type: custom:analog-clock
hide_SecondHand: true
color_HourHand: '#326ba8'
color_MinuteHand: '#3273a8'
color_DigitalTime: '#CCCCCC'
color_FaceDigits: '#a83832'
hide_minorticks: true
timezone: America/Fortaleza
timezonedisplayname: UTC-3
dateformat: MMM Do YYYY
time format: hh mm
``
4) restarted the HA service
and I am getting the following message
"moment is not defined".

I am sure that HA service has access to https://unpkg.com/[email protected]/min/moment-with-locales.js
I am using HA version 2023.6.1
I cannot find any error in the log file (logger: default: info
logs: custom_components.hacs: debug
aiogithubapi: debug

Can you advice how to troubleshoot this problem or fix it?
NYFB

I really don't know how to install it. But I'd really want to try it... Can you walk me through?

On my Safari this card doesn't make trouble.

But If I use Fully Browser on my Android 10 Tablet, it shows up with this error message.

Config is like this:

type: custom:analog-clock
diameter: 180
timezone: Europe/Berlin

This card is amazing. If you are in desperate need for new features ideas, may I suggest a color change that indicates if it is day or night. It would mean to define a day color and a night color, maybe for the background, and it would use day colors from 6 to 18 and night colors for the other half of the day. It would make using the card multiple times as a world clock even more useful. A little bit like GMT wrist watches do it. Example:

Thank you for the work with the analog clock!

I hope this is the right way to go about the request.

I was hoping to be able to adjust the background color of the clock, based on time and perhaps on-demand timer.
My thoughts was to have a set schedule, that would enable me to color code different time-areas to certain colors, that would represent an action, that would cover the time from geetting home, and bedtime and beyond.
Something like:
15:00 - 18:00 Playtime
18:00 - 18:30 Bathtime
18:30 - 19:00 Get ready to bed
19:00 - 00:00 Sleepy time

My kids 3 years old, so we don't have homework yet - but it would be perfect for that as well.

The on-demand timer I was mentioning, would be for dinner-time.
This could either be done with a button, that turns the next 20-30 minutes into the dinnertime color - or something I could set with a setting in another card and have the length predetermined, and just input todays estimated dinnertime, so that it shows on the clock.

Thank you for reading.

Is it possible to use color variables like var(--secondary-text-color) to have the clock adapt to theme changes (light/dark) automatically?
I tried with

color_digitaltime: '--secondary-text-color'
color_hourhand: var(--label-badge-green)

but these variations have no effect.

I agree with Pieter, that this is the best analog clock for HA.

Just two suggestions, in case you are bored one day :)

1.) It would be nice to be able to configure the way the date is displayed, maybe using strftime syntax like HA does.

2.) An option to configure if the digital time is displayed in 24 or 12 hour format would be great too

Cheers,
Julian

This is the first analogue clock for HA that I actually like. Thanks!

Would it be possible to have an option to have the face text overlay the hands so that the hands appear behind? I think it would be easier to read the text. Alternatively, you could allow for the alpha channel to be specified for the hand colours.

If one can use theme variables for colours that would be great too. Currently, it's only the background that makes use of a theme colour. You have your own theme option but I think it would be more seamless if theme variables are used, especially where one has an HA instance that automatically changes between a light and dark theme depending on whether the sun's up or down.

An option to hide the minor ticks would also be useful to someone that wants a more minimalistic look.

Instead of displaying the timezone, it would be great just to specify your own name or label. This is useful where you specify a timezone but the city or town you have in mind is different.

Hi,
my plan was to use a analog clock in a horizontal stack. However, I ran into an issue where there are no hands and no digital time/date shown when in a horizontal or vertical stack or grid. It does work without the stack and in the lovelace-layout-card (https://github.com/thomasloven/lovelace-layout-card).
I cleared the cache of my browser (Firefox 106.0.1 on Win 10 64-bit) multiple times to no avail. The Moment resource is installed according to your readme.

Here are my .yaml codes and corresponding behaviour:

type: horizontal-stack
cards:
  - type: custom:analog-clock
    hide_minorticks: true
    hide_secondhand: true
    style_hourhand: 3
    style_minutehand: 3
    diameter: 150
  - type: thermostat
    entity: climate.thermostat_hc1

type: custom:layout-card
layout_type: custom:horizontal-layout
layout:
  width: 180
cards:
  - type: thermostat
    entity: climate.thermostat_hc1
  - type: custom:analog-clock
    hide_minorticks: true
    hide_secondhand: true
    style_hourhand: 3
    style_minutehand: 3
    diameter: 150

If you need anything else or if I miss something, please let me know.

Hej Tomas.
How do I do to change the color of the background, I use the theme midnight for my display but the square around the clock stays white.

title: iPad
views:

• path: default_view
  title: Home
  theme: midnight
  panel: false
  badges: []
  cards:

Maybe it happens only in New Year day?

Hi Tomas, thanks for your great job, I´ve been using your card for some moths and haven´t had problems with it untill now.

The problem I´m havig is this:

I added the resource https://unpkg.com/[email protected]/min/moment-with-locales.js as a JavaScript Module (just module is not an option in my lovelace) and configure the dateformat as the last example (dateformat: "MMM Do YYYY").
When I do this, the clock desappear of my dashboard. I edit the code with the raw editor of lovelace and I see that the editor erases the quotation marks (whenever I use double or simple).
I erase the line with the dateformat option, and the clock appears again. It seems to me that the lovelace editor, I don´t know why, erases the quotation marks every time, therefore the clock desappear

Thank´s for your help!

Hello and happy new year

after last hassio update and restart i see this on screen (in a red box :-) )

Custom element doesn't exist: analog-clock.
type: 'custom:analog-clock'
hide_SecondHand: true
locale: IT
diameter: 200
color_HourHand: '#326ba8'
color_MinuteHand: '#3273a8'
color_DigitalTime: '#CCCCCC'
color_FaceDigits: '#a83832'
color_Ticks: Silver

what's happen ?
could you help me ?
wbr

Tiziano

Hi Tomas
thanks a lot for this analog clock
After installation , we can put info on config file ?
wbr
Cippo

Does not work with timezone

I am thinking this is a locale bug?

v. ?? not sure what v stands for.
I thought this was a version number for the first 10 minutes... until I tried to get rid of it and realized its week 51 and it says v. 51
In English (us) "v." usually means version.

We dont have a shorthand for Week. maybe WK

Hi! On iOS (iPad) I get 'invalid time' showing over the clock face. There are no minute nor second hands. This occurs on the HA application as well as in Chrome and Safari. It works fine on my Windows browsers and Android app.