Releases: djdevil/AlertTicker-Card
Release list
v1.3.4
AlertTicker Card — v1.3.4
🐛 Bug Fixes
Weather badge alignment in cinematic style (#167)
The high/low temperature, AQI and humidity row inside the weather badge was missing its base display: flex; align-items: center CSS rule. All other rows (row1, row2, row3) were explicit flex containers, but row-minmax rendered as a plain block element.
In cinematic style — where the badge arranges all rows horizontally — this caused a visible vertical misalignment of the humidity value and the elements that follow it (wind speed, condition label).
Fixed by adding the missing base flex rule to atc-cw-badge-row-minmax. No configuration changes needed.
conditions_logic: or incorrectly triggering on primary state match alone (#168)
When conditions_logic: or was set, the primary entity state check (primaryOk) was accidentally included inside the OR group alongside the conditions. This meant the alert fired if:
- the entity was in the configured state ← (alone, without any condition passing)
- OR any condition was true ← (alone, without the entity being in the configured state)
The correct behavior is:
- the entity must be in the configured state AND
- at least one condition must be true (the OR applies only among the conditions)
# Expected: shows only when door is OPEN *and* alarm is enabled or someone is home
alerts:
- entity_filter: "sensor.interlogix*"
state: "open"
conditions_logic: or
conditions:
- entity: input_boolean.alarm_enabled
state: "on"
- entity: binary_sensor.someone_home
state: "off"Fixed in both the card render path and the cross-view overlay watcher.
Editor "entities match" counter ignoring label_filter and area_filter (#170)
The entity count shown next to the device class and text filter fields in the visual editor only applied its own single filter — it did not take into account any label_filter or area_filter that was also set. This caused the count to be inflated (e.g. "120 entities match" for device_class: temperature even when label_filter: [SMART] reduced the real set to a handful).
The runtime behavior was always correct. Fixed by replicating the same combined filter logic (device_class + text filter + label + area) in both editor counter paths.
Card blank when casting to Google Home (#171)
When casting a Lovelace dashboard to a Google Home display, AlertTicker Card rendered as a completely blank card.
Root cause: The Google Cast runtime declares adoptedStyleSheets on ShadowRoot (so Lit's supportsAdoptingStyleSheets feature-detection check passes), but the setter throws "TypeError: Failed to set the 'adoptedStyleSheets' property on 'ShadowRoot': Failed to convert value to 'CSSStyleSheet'" at runtime. This is a Cast runtime bug — it advertises the API but can't handle Constructable StyleSheets objects. Because Lit relies on this path to inject the card's CSS, all styling is silently lost and the card renders blank.
Fix: At load time, ShadowRoot.prototype.adoptedStyleSheets setter is patched with a try-catch wrapper. When the native setter throws (Cast environment), the fallback iterates over each CSSStyleSheet, reads its rules via cssRules, and injects them as a <style> element inside the shadow root. Normal HA browsers take the fast path (native setter succeeds) with zero overhead.
No configuration changes needed.
📦 Update Instructions
- Download
alert-ticker-card.jsandalert-ticker-card-editor.js - Replace both files in your
www/folder (or the path you set in Resources) - Hard-reload the browser: Ctrl+Shift+R / Cmd+Shift+R
HACS users: update from the HACS panel — no manual steps needed.
Full changelog: CHANGELOG.md
☕ If this card saves you time, consider buying me a coffee — it keeps the updates coming!
v1.3.3
AlertTicker Card — v1.3.3
✨ New Features
{entity} placeholder in conditions for entity_filter alerts (#163)
When using entity_filter (or device_class, wildcard filters) the matched entity is not known at config time, so conditions requiring a fixed entity ID couldn't reference it. Now you can use entity: "{entity}" (or entity: "this.entity_id") in any condition to dynamically reference the matched entity — enabling compound AND/OR tests on both state and attributes for every expanded entity.
# Show only entities that are both ON and have notification_control = enabled
alerts:
- entity_filter: "alert2.zigbee*"
state: "on"
conditions:
entity: "{entity}"
attribute: notification_control
operator: "="
state: enabledWorks in all condition paths: normal, on_change, and the cross-view overlay watcher.
Per-alert native HA card override (#159)
New card property on each alert. When set, the themed rendering is replaced by any native HA card type — tile, entity, button, glance, custom cards, or anything else HA supports. The card's visibility evaluation, cycling logic, snooze, history, and time windows remain completely intact — only the visual content changes.
alerts:
# Show a tile card instead of the default theme
- entity: sensor.front_door
state: "on"
card:
type: tile
entity: this.entity_id
name: Front door
icon: mdi:door-open
# Custom card
- entity: sensor.smoke
state: "on"
card:
type: custom:mushroom-entity-card
entity: this.entity_id
name: Smoke detectedthis.entity_id placeholder
Use 'this.entity_id' anywhere inside the card config to reference the alert's matched entity. This is especially useful for entity_filter alerts that expand into multiple entities — each slide automatically gets the correct entity ID substituted.
alerts:
- device_class: door
state: "on"
card:
type: tile
entity: this.entity_id # ← resolved to each matched door entityVisual editor
The card field is available as a YAML editor under each alert's settings section in the visual editor — no need to write raw YAML. Available in all 12 supported languages.
Per-alert and card-level animation disable (#157)
New disable_animation flag available at both card level and per-alert level. Suppresses all ambient looping animations without touching the theme styling:
- Emergency pulsing glow + flashing icon
- Warning/calendar blinking dot
- Neon scanning line
- Matrix cursor blink
- Door/window icon swings
- All weather widget effects (aurora, fog, rain, lightning, etc.)
Cycle transitions and ticker scrolling are not affected.
Card-level — silence all alerts at once:
type: custom:alert-ticker-card
disable_animation: truePer-alert — silence a specific noisy alert while others keep animating:
alerts:
- entity: binary_sensor.front_door
theme: door
state: "on"
disable_animation: true # icon won't swing
- entity: binary_sensor.smoke
theme: emergency
state: "on"
# ← still pulses/flashesThe per-alert flag overrides the global setting. Both are available in the visual editor — card-level in the Cycling & Animation section, per-alert in each alert's settings panel (all 12 languages).
Per-alert overlay exclusion + global priority gate (#160)
Two new controls for the cross-view overlay system:
overlay: false per alert
Set overlay: false on any individual alert to prevent it from ever triggering a cross-view overlay banner. The alert continues to appear in the ticker card as usual — only the overlay projection is suppressed.
alerts:
- entity: sensor.routine_info
state: "on"
overlay: false # shows in ticker, never overlaysoverlay_min_priority global threshold
Set a global priority ceiling so only high-priority alerts trigger overlay banners. Alerts with a priority value higher than the threshold are silently excluded from overlay. Defaults to no gate (all alerts can overlay).
overlay_min_priority: 2 # only priority 1 and 2 alerts can overlayPriority scale: 1 = critical, 2 = high, 3 = normal (default), 4 = low.
Both controls work together — overlay: false always wins regardless of priority.
Visual editor
overlay_min_priority is available in the global overlay settings section. The per-alert overlay toggle appears in each alert's settings when overlay mode is enabled. Both are available in all 12 supported languages.
🐛 Bug Fixes (also in this release)
-
card_heightnot applying to the all-clear state (#145) —card_heightonly applied to the active-alert render path, not to the "all clear" card (no active alerts). Setting it had no visible effect until an alert was simulated. Fixed by wrapping the clear card in the sameatc-inner-clipcontainer used by active alerts. Additionally, whencard_heightis larger than the natural content size, the content is now vertically centered in the available space. -
TypeError: css is not a function(#155) — crash on mount in certain HA builds whereLitElement.prototype.cssis undefined. Fixed with a standards-compliant inline fallback. -
Overlay fires outside configured
time_range(#153) — cross-view overlay banners ignoredtime_rangewindows. Fixed by adding the_evalTimeRange()guard to the overlay watcher's_evalAlert(). -
snooze_actionnot fired on swipe (#146) — swiping left withswipe_to_snooze: trueskippedsnooze_actionexecution. Fixed for full parity with the snooze button tap. -
card_background: trueignoring HA theme (#129) —var(--ha-card-background)was unresolved inside shadow DOM. Fixed viagetComputedStyle(this)on the host element.
📦 Update Instructions
- Download
alert-ticker-card.jsandalert-ticker-card-editor.js - Replace both files in your
www/folder (or the path you set in Resources) - Hard-reload the browser: Ctrl+Shift+R / Cmd+Shift+R
- Clear the HA frontend cache if the editor still shows the old version
HACS users: update from the HACS panel — no manual steps needed.
Full changelog: CHANGELOG.md
☕ If this card saves you time, consider buying me a coffee — it keeps the updates coming!
v1.3.2.6
AlertTicker Card — v1.3.2.6
🐛 Bug Fixes
TypeError: css is not a function (#155)
In certain HA builds or loading contexts, LitElement.prototype.css is undefined. The card crashed on mount before rendering anything.
Fixed by adding a standards-compliant fallback: if LitElement.prototype.css is not available, a css tagged-template function is constructed inline that produces the CSSResult-compatible object ({ cssText, _$cssResult$: true }) that Lit's static get styles() expects.
Overlay fires outside configured time_range (#153)
The overlay watcher's _evalAlert() helper checked _evalVisibleTo() but never _evalTimeRange(). Cross-view overlay banners appeared at any hour regardless of the configured window (e.g. time_range: { from: "21:00", to: "07:00" }).
Fixed by adding a _evalTimeRange(a) guard at the top of _evalAlert(), mirroring the check already present in the card's own _computeActiveAlerts().
snooze_action not fired when swiping to snooze (#146)
With swipe_to_snooze: true, swiping left called _snoozeAlert() directly — skipping the snooze_action execution that always runs when the snooze button is tapped. If you had a service call (e.g. toggling a boolean helper) configured as snooze_action, it silently did nothing on swipe.
Fixed by firing snooze_action in the swipe path before calling _snoozeAlert(), giving the swipe gesture full parity with the button tap.
card_background: true not picking up the HA theme background (#129)
When card_background: true, the card was setting --atc-card-bg-override to the string var(--ha-card-background, ...). Because this is a custom property stored inside a shadow-DOM element, the inner var(--ha-card-background) reference could not be resolved by the browser — it stayed literal and the background always fell back to the hardcoded rgba(0,0,0,0.55) regardless of the active HA theme.
Fixed by reading the resolved value directly from getComputedStyle(this) on the host element. The host lives in the light DOM and participates in the full HA theme cascade, so --ha-card-background resolves to the actual color at call time. That resolved value is stored as the override, and shadow DOM children just receive a plain color string — no unresolvable var() chain.
# Now correctly picks up your HA theme background
type: custom:alert-ticker-card
card_background: true
alerts:
- entity: sensor.front_door
message: "Front door open"📦 Update Instructions
- Download
alert-ticker-card.jsandalert-ticker-card-editor.js - Replace both files in your
www/folder (or the path you set in Resources) - Hard-reload the browser: Ctrl+Shift+R / Cmd+Shift+R
- Clear the HA frontend cache if the editor still shows the old version
HACS users: update from the HACS panel — no manual steps needed.
Full changelog: CHANGELOG.md
☕ If this card saves you time, consider buying me a coffee — it keeps the updates coming!
v1.3.2.5
AlertTicker Card — v1.3.2.5
✨ New Features
🔁 on_change + conditions now work together (#83)
Two related fixes that make on_change: true + conditions behave as expected:
1 — Primary state guard
When state and operator are defined alongside on_change: true, they now act as a current-state filter. The alert fires on any state change, but is only shown while the entity is actually in the declared state. This suppresses alerts on idle / paused / buffering transitions when only playing is meaningful.
2 — Single-object conditions accepted
conditions can now be written as a single inline object as well as a list — previously a single object was silently ignored.
# Fires on every track change, visible only while the speaker is playing
alerts:
- entity: media_player.living_room_speaker
operator: "="
state: playing
on_change: true
conditions:
entity: media_player.all_speakers
operator: "="
state: playing
auto_dismiss_after: 15
theme: music
message: "{{ state_attr('media_player.living_room_speaker','media_artist') }} – {{ state_attr('media_player.living_room_speaker','media_title') }}"🎨 Per-alert custom accent color (#143)
New color property on each alert. Overrides the card border and badge color for that specific alert, independent of its theme. Works with any CSS color value.
alerts:
- entity: sensor.front_door
theme: door
color: "#ff4500"
message: "Front door open"
- entity: sensor.smoke
theme: alarm
color: "var(--error-color)"
message: "Smoke detected"Available as a color picker + text field in the visual editor under the icon section of each alert — always visible, no toggles required. Leave empty to use the theme's default color.
🐛 Bug Fixes
Bottom border clipped on some themes (#141)
Themes that render an outer border (emergency, prism, and others) occasionally showed the bottom border clipped. The sub-pixel rounding of box-sizing: content-box borders caused the bottom edge to fall fractionally outside .atc-inner-clip's overflow: hidden boundary.
Fixed by adding transform: translateZ(0) to .atc-inner-clip, promoting it to a compositor layer with integer pixel snapping.
{state} placeholder not replaced in the ticker scrolling theme (#140)
The ticker theme was rendering a.message raw, skipping the _resolveMessage() call that all other themes use. As a result, {state}, {name}, {entity}, {device}, {timer}, and Jinja2 templates were displayed literally instead of being evaluated.
Fixed by routing the ticker item message through _resolveMessage(), consistent with all other themes.
Snooze menu and history panel appear behind adjacent cards (#142)
isolation: isolate (added in v1.3.2.4 to fix #127) created a stacking context that trapped the menu's z-index inside the card, causing it to render behind neighboring cards.
Fixed by toggling a CSS class atc-popup-open on :host while any popup is open. The class overrides isolation to auto and adds position: relative; z-index: 9999, making the card a stacking context root at z-index 9999 in the masonry/grid layout — above all sibling cards at z-index: auto. isolation: isolate is restored the moment the popup closes, so the #127 fix remains fully intact.
📦 Update Instructions
- Download
alert-ticker-card.jsandalert-ticker-card-editor.js - Replace both files in your
www/folder (or the path you set in Resources) - Hard-reload the browser: Ctrl+Shift+R / Cmd+Shift+R
- Clear the HA frontend cache if the editor still shows the old version
HACS users: update from the HACS panel — no manual steps needed.
Full changelog: CHANGELOG.md
☕ If this card saves you time, consider buying me a coffee — it keeps the updates coming!
v1.3.2.4
AlertTicker Card — v1.3.2.4
🚨 Critical Fix — HA 2026.5 compatibility
All visual editor text inputs disappear after HA 2026.5 upgrade (#133)
Home Assistant 2026.5 removed the ha-textfield component (part of Material Web Components). Every text input in the visual editor — entity filters, messages, attributes, URLs, durations, and more — was silently rendered invisible as a result.
Fixed by replacing every ha-textfield instance with the new ha-input component across alert-ticker-card-editor.js. This also resolves #136 (multi-entity filter inputs not accessible) and #137.
⚠️ If you are on HA 2026.5 or later, this update is required to use the visual editor.
☕ If this card saves you time, consider buying me a coffee — it keeps the updates coming!
✨ New Features
🎨 All-Clear icon customization
Three new options to match the all-clear card's icon to your alert cards — same size, color, and MDI icon:
show_when_clear: true
clear_use_ha_icon: true
clear_icon: "mdi:check-circle-outline"
clear_icon_size: "2em"
clear_icon_color: "#4caf50"All three are available via icon picker in the visual editor under ✅ All Clear.
⛈️ 2 New Weather Forecast Themes
| Theme | Category | Effect |
|---|---|---|
storm |
Diagonal rain streaks + double lightning flash every ~3.5 s that shakes the icon on impact | |
frost |
ℹ️ Info | Three layers of falling snowflake dots + a slow icy shimmer sweeping left-to-right |
alerts:
- entity: sensor.weather_alert
state: "storm"
theme: storm
message: "Thunderstorm approaching"
- entity: sensor.weather_alert
state: "snow"
theme: frost
message: "Snowfall expected tonight"🇹🇷 Turkish (TR) language support (#134)
Full Turkish translation contributed by @yunusuztr, covering all card runtime labels, visual editor UI, theme default messages, TTS prefixes, operator names, category group names, and overlay strings. The card now supports 12 languages.
🐛 Bug Fixes
Overlay banner fires on the same view as the card (#135)
Two related bugs in the cross-view overlay watcher:
-
Banner visible when card is on screen — the watcher could fire the overlay banner on the same dashboard where the ticker card was already visible. Fixed by using the native
el.isConnectedDOM property alongside the internal_mountedflag for a more reliable visibility check, and by auto-dismissing any watcher overlay the instant its card reconnects to the DOM. -
Banner does not dismiss when alert resolves — the overlay always waited for the full
overlay_durationtimer to expire, even if the alert condition became inactive in the meantime. Fixed by tracking the currently-displayed alert and calling_hide()within the next 2-second watcher tick as soon as the alert goes inactive.
fire-dom-event action not firing
_handleAction was missing the fire-dom-event case, causing browser_mod popups and other custom DOM events to be silently ignored. Fixed by dispatching an ll-custom event with the full action config. Applies to all action slots: tap_action, hold_action, double_tap_action, clear_tap_action, clear_hold_action, clear_double_tap_action.
Snooze / history / counter buttons appear above Bubble Card popups (#127)
The :host shadow root was missing isolation: isolate, so the card's absolutely-positioned elements participated in the global stacking context and rendered above external popup layers (e.g. Bubble Card). Fixed by adding isolation: isolate to :host.
📦 Update Instructions
- Download
alert-ticker-card.jsandalert-ticker-card-editor.js - Replace both files in your
www/folder (or the path you set in Resources) - Hard-reload the browser: Ctrl+Shift+R / Cmd+Shift+R
- Clear the HA frontend cache if the editor still shows the old version
HACS users: update from the HACS panel — no manual steps needed.
Full changelog: CHANGELOG.md
v1.3.2.3
AlertTicker Card v1.3.2.3
12 new features · 2 bug fixes
✨ What's New
🎨 8 Spectacular 3D Themes
Eight brand-new themes designed for maximum visual impact using layered CSS animations and CSS 3D transforms. Each brings a unique cinematic effect to every alert slide.
| Theme | Category | Effect |
|---|---|---|
portal |
🚨 Critical | Two counter-rotating conic-gradient discs form a crimson dimensional vortex; the icon spins and pulses with each cycle |
void |
🚨 Critical | A 3D-perspective accretion disk spins around a deep violet core — a cosmic black hole in your dashboard |
volt |
Horizontal CRT scanlines + an electric bolt that discharges every ~1.2 s; icon strobes on impact | |
nebula |
Three independently drifting gas clouds (purple · blue · teal), softly blurred with separate animation timing | |
prism |
ℹ️ Info | A skewed rainbow light sweep crosses the card; the icon cycles through full-spectrum drop-shadows |
arcade |
ℹ️ Info | Tron-style 3D perspective grid scrolling toward the viewer, monospace badge font |
diamond |
✅ OK | Crystalline facet overlay + specular shimmer that sweeps left-to-right; icon catches light with a gentle tumble |
quantum |
✅ OK | Two atomic orbital rings rotating in opposite directions in CSS 3D perspective around a pulsing nucleus |
alerts:
- entity: binary_sensor.front_door
state: "on"
theme: portal # or: void · volt · nebula · prism · arcade · diamond · quantum
message: "Motion detected"All 8 themes are fully compatible with ha_theme: true — decorative 3D layers fade to ~15–20% opacity and badge colors follow HA semantic color variables (--error-color, --warning-color, etc.).
📐 icon_size — Per-alert Icon Size Override (#128)
New per-alert option to override the default icon size with any CSS value. Useful when different icon types (e.g. mdi:battery vs a thin sensor state icon) have different visual weights at the same nominal size.
alerts:
- device_class: battery
use_ha_icon: true
icon_size: "1.2em" # shrink battery icon to match other alertsAccepts any CSS length: em, px, rem. Configurable in the visual editor under the icon section.
🖼️ HA Theme Card Variables (#129)
The card now fully respects all three standard Lovelace card CSS variables:
| Variable | Effect |
|---|---|
--ha-card-border-radius |
Card corner rounding (was already supported) |
--ha-card-box-shadow |
Applied to :host — theme-defined shadows now render correctly |
--ha-card-border-width + --ha-card-border-color |
Used as border source when card_border is not explicitly enabled |
No config changes required — any HA theme that sets these variables will automatically apply to the card.
🎨 card_background — Custom Background / Transparency (#130)
New global toggle that overrides the alert theme's background with a custom color or the HA theme variable.
card_background: true # use --ha-card-background from HA theme
card_background: "rgba(20,20,30,0.7)" # fixed semi-transparent dark background
card_background: "rgba(255,255,255,0.05)" # near-transparent glass effectWhen true, uses var(--ha-card-background) automatically so the card blends with other dashboard cards. Toggle and color picker (with opacity slider) available in the visual editor under Layout & Appearance.
🔗 Jinja2 Templates in navigation_path (#126)
tap_action.navigation_path (and hold_action, double_tap_action) now resolves {{ states('...') }} and {{ state_attr('...','...') }} templates at the moment of the tap, enabling dynamic navigation based on entity state.
tap_action:
action: navigate
navigation_path: "{{ states('sensor.room_presence') }}"The same mini-evaluator used for message fields handles the template synchronously at tap time. If the template is too complex for the local evaluator, the raw string is used as a fallback.
🐛 Bug Fixes
| Fix |
|---|
Music player cover art invisible with ha_theme: true (#119) — the blanket [class$="-bg"] { opacity: 0.25 !important } HA theme rule was matching .mu-art-bg, dropping album art to 25% opacity. Fixed with :not(.mu-art-bg) exclusion + explicit dark base color for the player container. |
Grouped alert snooze ignores snooze_default_duration — 💤 on a group slide always opened the duration menu even when snooze_default_duration was set. Fixed by applying the same fixed-duration logic to the group code path for an immediate one-tap snooze. |
📦 Installation
HACS (recommended)
Search for AlertTicker Card in HACS → Frontend, or click:
Manual
Download alert-ticker-card.js and alert-ticker-card-editor.js from this release and copy both files to /config/www/. Then hard-reload your browser (Ctrl+Shift+R).
If this card saves you time, consider buying me a coffee ☕
v1.3.2.1
[1.3.2.1] - 2026-05-03
Fixed
-
Music player cover art invisible with
ha_theme: true(#119) — the v1.3.2 fix restored the art in HA's default theme but broke under the "Adapt to HA theme" option. Root cause: theha_themeCSS block contains a blanket[class$="-bg"] { opacity: 0.25 !important }rule intended to dim decorative backgrounds; it also matched.mu-art-bg(the blurred album art layer), dropping it to 25% opacity. Additionally, the generic.at-fold-wrapper > div { background: var(--card-background-color) !important }rule overwrote the dark base color of the music player. Fixed by adding:not(.mu-art-bg)to the opacity rule and a specific.atc-ha-theme .at-music--player { background: #0c0a14 !important }override so the player retains its dark background regardless of the active HA theme. -
Grouped alert snooze ignores
snooze_default_duration— clicking 💤 on a group slide always opened the duration picker menu even whensnooze_default_durationwas configured. Root cause:_renderSnoozeButtonhad a separate code path for group slides (alert._isGroup) that always rendered the menu, bypassing thefixedDurationcheck used for individual alerts. Fixed by applying the same logic to the group path: ifsnooze_default_durationis set, the button directly calls_snoozeGroup(alert, duration)with a single tap; the menu is shown only when no default duration is configured.
v1.3.2
AlertTicker Card v1.3.2
2 new features · 12 bug fixes
✨ What's New
🕐 Clock Widget Color Customization
Three new options let you fully customize the appearance of the clock clear-state display without writing CSS. Compatible with all clock styles (aurora, gold, matrix) — the custom value always takes precedence over the style's built-in palette. All three pickers are available in the visual editor under ✅ All Clear → Custom colors. (#124)
show_when_clear: true
clear_display_mode: clock
clear_clock_color: "#00e5ff"
clear_clock_date_color: "rgba(0,229,255,0.5)"
clear_clock_background: "#0a0a1a"| Option | Description |
|---|---|
clear_clock_color |
CSS color for the clock digits (hex, rgb, named color) |
clear_clock_date_color |
CSS color for the date text below the time |
clear_clock_background |
CSS color or gradient for the card background |
🌡️ Custom Sensor Overrides for the Weather Widget
Five new optional per-card options let you replace any individual weather field with a reading from your own sensor — without creating a template weather.* entity. The clear_weather_entity remains required for the condition icon, animated background, and forecast grid. (#123)
show_when_clear: true
clear_display_mode: weather_forecast
clear_weather_entity: weather.home
clear_weather_temperature_entity: sensor.local_temperature
clear_weather_humidity_entity: sensor.local_humidity
clear_weather_temp_high_entity: sensor.today_max_temp
clear_weather_temp_low_entity: sensor.today_min_temp
clear_weather_aqi_entity: sensor.pm25| Option | Description |
|---|---|
clear_weather_temperature_entity |
Override current temperature with a local sensor |
clear_weather_humidity_entity |
Override humidity with a local sensor |
clear_weather_temp_high_entity |
Override today's high with a sensor |
clear_weather_temp_low_entity |
Override today's low with a sensor |
clear_weather_aqi_entity |
Add air quality / PM2.5 reading (🌿 badge) |
All five are independent and optional. Pickers available in the visual editor under ✅ All Clear → Custom sensors.
🐛 Bug Fixes
| # | Fix |
|---|---|
| #119 | Music player cover art disappears in HA light themes — the blurred art background (position: absolute) was missing a positioned containing block on the player container. In HA's dark theme the card wrapper happened to serve as the ancestor; in light theme a different ancestor was resolved, pushing the art layer out of view. Fixed by adding position: relative; overflow: hidden to .at-music--player, plus an explicit dark base color so the card renders correctly even while art is loading. |
| #113 | Manual ‹ › navigation resets to first alert in test mode — _preview_index was re-evaluated on every HA state update (which fires continuously). Any manual navigation away from the preview alert was immediately overridden on the next update. Fixed by tracking _lastAppliedPreviewIndex — the jump now only fires when the editor actually changes the preview selection, not on every state update. |
| — | {%-only Jinja2 templates not rendered in overlay — messages built exclusively with {%...%} blocks (no {{...}}) were returned raw by the mini-evaluator and never sent to HA's WebSocket renderer. Fixed by including {% in the residual-syntax guard inside _evalTemplate. |
| — | Camera stream audio persists after overlay dismissal — <ha-camera-stream> was hidden with display: none but left in the DOM, keeping the WebRTC/HLS audio track alive. Fixed by removing the stream element before hiding the overlay, which triggers disconnectedCallback and correctly stops all media tracks. |
| — | Camera snapshot proportions wrong in overlay — the snapshot <img> was not wrapped the same way as the live stream fix. Applied the same <div> wrapper pattern (overflow: hidden, line-height: 0, border-radius) for consistent sizing across all camera aspect ratios. |
| — | clear_clock_background ignored on aurora / gold / matrix styles — style-specific CSS rules applied hardcoded background values at the same specificity as the variable, overriding user-defined colors. Fixed using the var(--atc-ck-bg, <hardcoded>) fallback pattern. |
| — | Weather high/low temperatures missing in plain weather mode — the forecast subscription (_subscribeForecast) was only started for weather_forecast and forecast modes. Users on plain weather mode never saw today's min/max. Fixed by starting the subscription for weather mode as well. |
| — | History entries show raw Jinja2 for complex templates — the 500 ms async cancel timer in _recordHistory fired before HA returned results for multi-statement templates. Replaced with a done-flag pattern and a 5 s abort timeout. |
| — | History recorded during visual editor preview — config changes in the editor triggered _recordHistory, writing phantom entries from incomplete or test configurations. Fixed with an _isEditMode() guard. |
| — | state: "{{ }}" trigger templates intermittently cleared — _syncTemplates only kept message/secondary-text subscriptions alive. Trigger-condition templates were cancelled and their cache deleted on every set hass(), causing alerts to briefly disappear between state updates. Fixed by including alert.state templates in the keep-alive set. |
| — | Test mode preview broken with YAML-pasted configs — alerts whose entities do not exist in the current HA instance were filtered out even in test mode, preventing the preview jump from working. Fixed by bypassing the entity-existence check when test_mode is active. |
| — | Humidity hidden in stage weather theme — humidity was placed in .atc-cw-badge-row2 which the stage style suppresses. Moved to .atc-cw-badge-row-minmax alongside high/low and AQI. |
📦 Installation
HACS (recommended)
Search for AlertTicker Card in HACS → Frontend, or click:
Manual
Download alert-ticker-card.js and alert-ticker-card-editor.js from this release and copy both files to /config/www/. Then hard-reload your browser (Ctrl+Shift+R).
If this card saves you time, consider buying me a coffee ☕
v1.3.1
AlertTicker Card v1.3.1
5 new features · 7 bug fixes
✨ What's New
📹 Live Camera Stream in Overlay Banner
When a camera_entity is set, the new per-alert toggle camera_live: true replaces the static snapshot in the overlay banner with a live HLS / WebRTC stream powered by <ha-camera-stream>. Falls back silently to the static snapshot when the streaming component is not yet loaded by HA.
alerts:
- entity: binary_sensor.front_door_motion
state: "on"
message: "Motion at front door"
camera_entity: camera.front_door
camera_live: true
overlay_mode: trueConfigurable in the visual editor — 📷 Camera section → Live stream toggle (visible only when a camera entity is selected).
🖼️ Camera as Alert Card Background
New per-alert toggle camera_in_card: true shows the configured camera image as a full-bleed background layer behind the alert card slide — visible on every rotation, not just when the overlay fires. The card content is overlaid on top with a semi-transparent backdrop so all text and buttons remain readable. Works with all 41 themes.
alerts:
- entity: binary_sensor.front_door_motion
state: "on"
message: "Motion at front door"
theme: intruder
camera_entity: camera.front_door
camera_in_card: true🔘 Hide History / Snooze Buttons
Two new global options (both default true) to completely remove the action buttons from the card — useful for minimal layouts or dashboards where history and snooze are not needed. (#118)
show_history_button: false # hide 📋
show_snooze_button: false # hide 💤➡️ secondary_value_align: right — Per-Alert Layout
Move the secondary value (secondary_text, secondary_entity, or {timer}) to the right column on the same row as the message title instead of below it. This is a per-alert option — each alert in the card can use a different layout independently. The nav counter slot is hidden when active. (#118)
alerts:
- entity: sensor.co2_ppm
operator: ">"
state: "1000"
message: "CO₂ level critical"
secondary_entity: sensor.co2_ppm
secondary_value_align: right📝 history_message — Custom History Log Entry
Override what gets written to the history log for any alert. Useful when message is a complex Jinja2 template that would produce a verbose or meaningless log entry. Supports {name}, {state}, {entity} placeholders. When not set, the main message is recorded as before (non-breaking). (#114)
alerts:
- entity: sensor.power_meter
operator: ">"
state: "3000"
message: "{{ state_attr('sensor.power_meter','current_power') | round(0) }} W · {{ now().strftime('%H:%M') }}"
history_message: "High power usage detected"🐛 Bug Fixes
| # | Fix |
|---|---|
| #110 | Music player badge_label ignored — badge_label now replaces "NOW PLAYING" when set; falls back to "NOW PLAYING" when absent |
| #110 | Music player: entity/room name missing for entity_filter alerts — matched entity's friendly name is now shown as a subtitle below the artist line (respects show_filter_name: false) |
| #117 | Timer secondary text invisible on HA light themes — timer_pulse and timer_ring themes now use var(--primary-text-color) for secondary text instead of the hardcoded white that was correct for dark themes only |
| #113 | Card flicker with mixed {{ }} + {name} templates — WebSocket subscriptions that already have a cached result are no longer discarded on each set hass() call, eliminating the flicker between raw template and resolved value |
| #112 | auto_dismiss_after not dismissing — timer callback now calls _computeActiveAlerts() directly instead of requestUpdate(), so the alert is actually removed from the rendered list when the timer expires |
| #107 | trigger_delay fires early with multi-entity conditions — elapsed time is now computed from Math.max(last_changed) across all condition entities, not just the primary entity |
| #105 #119 | Music player cover art blank with local HA image URLs — reads entity_picture_local first, falls back to entity_picture; fixes blank art with Spotify, local media, and iOS Companion App |
📦 Installation
HACS (recommended)
Search for AlertTicker Card in HACS → Frontend, or click:
Manual
Download alert-ticker-card.js and alert-ticker-card-editor.js from this release and copy both to /config/www/. Then hard-reload your browser (Ctrl+Shift+R).
If this card saves you time, consider buying me a coffee ☕
v1.3
AlertTicker Card v1.3
📱 Mobile push notifications
Per-alert push notifications via any HA notify.* service. When an alert activates, the card sends a notification with a configurable title and message — both support full Jinja2 templates and fall back to the alert badge label / message when left empty.
alerts:
- entity: binary_sensor.front_door
state: "on"
theme: door
message: "Front door opened"
push_notify: true
push_notify_service: mobile_app_my_phone
push_notify_title: "🚪 Door Alert"
push_notify_message: "Front door has been opened — state: {state}"| Key | Description |
|---|---|
push_notify |
Enable push notification for this alert |
push_notify_service |
notify.* service name (e.g. mobile_app_my_phone, notify.telegram) |
push_notify_title |
Optional title (Jinja2). Defaults to alert badge label |
push_notify_message |
Optional message (Jinja2). Defaults to alert message |
A global 📱 Push Notifications section in the General tab provides a master toggle (push_notify_enabled) to disable all push notifications at once without changing individual alerts. Everything is configurable in the visual editor — no YAML required.
🎵 Music player — MDI icons, iOS rendering, button fix
Four improvements to the music_player alert type:
- MDI icons for all controls — play/pause, previous, next, and mute now use
<ha-icon mdi:...>instead of emoji characters, rendering correctly in the HA Companion App on all platforms. - Buttons unresponsive on desktop when
tap_actionis set — play/pause, prev/next, mute and the volume slider had no effect when the alert had atap_actionordouble_tap_action. The card's outer pointer handler was intercepting events and suppressingclickviapreventDefault. Fixed withstopPropagationon all button elements. - Blurred art and vinyl not rendering on iOS — the album art background and spinning vinyl disc were invisible on iOS Safari. Root cause:
inset: 0shorthand not supported on iOS Safari < 15.4, missing-webkit-filterprefix, and missingwill-change: transformfor GPU compositing. All three are now applied. - Cover art too dark on desktop — background brightness raised from
0.4to0.55for a better visual balance.
🌐 Full Jinja2 {% if %} / {% else %} block tag support
Template fields (message, secondary_text, group_message, group_expanded_message, group_secondary_text, overlay messages) now correctly evaluate Jinja2 block tags even without any {{ }} expression. The {{ "" }} workaround is no longer needed:
message: >
Waste collection in {state}
{% if state_attr('sensor.bins','daysTo') == 1 %} day {% else %} days {% endif %}🗂️ Group tap / hold actions + custom secondary text
Three new options for grouped filter alerts, all configurable in the visual editor:
alerts:
- device_class: update
group: true
group_message: "🐳 {count} updates available"
group_secondary_text: "Tap to manage · {count} pending"
group_tap_action:
action: navigate
navigation_path: /update
group_hold_action:
action: url
url_path: http://portainer.local| Key | Description |
|---|---|
group_tap_action |
Action when tapping the collapsed group header. Default: expand/collapse (non-breaking) |
group_hold_action |
Action when holding the collapsed group header |
group_secondary_text |
Custom secondary line replacing the auto-generated entity name list. Supports {count}, {names}, Jinja2 |
💤 Snooze menu: 1 week and 1 month
The snooze duration menu now includes 1 week (168 h) and 1 month (720 h) alongside the existing 1h / 4h / 8h / 24h options, available in all 11 supported languages.
For a fixed long snooze without a menu (single tap),
snooze_duration: 168andsnooze_default_duration: 720already worked in previous versions.
🔔 Overlay improvements
- Fires for ALL matching entities in filter-mode — when a
device_class,entity_filter,label_filter, orarea_filteralert had multiple entities simultaneously satisfying the condition (e.g. 3 batteries below 20%), the overlay fired only for the first entity. Now every matching entity gets its own banner, fired one at a time (2 s apart), with the correct per-entity message. When an entity recovers it is removed from the notified set so it can re-fire if the condition becomes active again. - Respects
trigger_delay— the overlay watcher now correctly waits the full configured delay before firing. - No longer fires in the same view as the card — three overlapping bugs caused the overlay to fire even when the card was visible on the active dashboard view. All three are fixed:
_basesnot stamped on first watcher tick when mounted, card-ID-based dedup key preventing cross-instance suppression, and_overlayShowngate blocking multiplesuppress()calls.
🐛 Bug fixes
trigger_delayresets to zero on page load (#88) — if an entity was already in the trigger state when the dashboard was opened, the card restarted the full delay from scratch instead of firing immediately. Fixed by readingentity.last_changed, subtracting the already-elapsed time, and activating instantly if the delay has already passed.- Snooze pill not visible over the clear widget (#106) — when
show_when_clear: trueand all alerts were snoozed, the snooze bar was returned early and blocked the weather/clock widget entirely. Now the widget renders correctly with the 💤 pill overlaid on top. hold_action: urlon desktop —window.open("_blank")inside asetTimeoutloses user-activation and is silently blocked by popup blockers. Fixed by deferring the open topointerup, a direct user-interaction event that is never blocked.hold_action: urlon mobile/touch — iOS/Safari sendspointercancelinstead ofpointerupafter a long-press (WKWebView limitation), so the URL was never opened. Fixed by usingwindow.location.hrefdirectly from the hold timer for touch gestures.- Overlay
secondary_textwith{% %}blocks — secondary text in overlay banners containing only Jinja2 block tags was rendered verbatim instead of being evaluated server-side.
📦 Full changelog
See CHANGELOG.md for the complete list of changes.
☕ If this update saves you time, consider buying me a coffee — it keeps the development going!
