Files
ha-kiosk-dashboard/dashboard-kiosk-auto-scroll.yaml

142 lines
5.1 KiB
YAML

title: Kiosk Dashboard
path: dashboard-kiosk
icon: mdi:view-dashboard
panel: false
type: sidebar
views:
- title: Kiosk View
path: default_view
cards:
# Auto-scroll injection card (runs JavaScript on load)
- type: markdown
content: |
<script>
(function() {
setTimeout(function() {
const cards = Array.from(document.querySelectorAll('ha-card'));
if (cards.length === 0) {
setTimeout(arguments.callee, 1000);
return;
}
// Make cards full height and larger text
cards.forEach(card => {
card.style.minHeight = window.innerHeight + 'px';
card.style.fontSize = '2.5em';
const content = card.querySelector('.card-content, ha-card');
if (content) {
content.style.fontSize = '2em';
}
});
// Auto-scroll function
let currentIndex = 0;
function scrollToNext() {
if (cards.length === 0) return;
currentIndex = (currentIndex + 1) % cards.length;
cards[currentIndex].scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
// Start auto-scrolling every 5 seconds
setInterval(scrollToNext, 5000);
window.scrollTo({ top: 0, behavior: 'smooth' });
console.log('Auto-scroll enabled: ' + cards.length + ' cards');
}, 2000);
})();
</script>
<div style="display:none;">Auto-scroll initializing...</div>
- type: markdown
content: |
<h1 style="font-size: 72px; text-align: center; margin: 40px 0; padding: 60px;">{{ now().strftime('%A, %B %d, %Y') }}</h1>
<h2 style="font-size: 48px; text-align: center; margin: 20px 0;">{{ now().strftime('%I:%M %p') }}</h2>
- type: weather-forecast
entity: weather.forecast_home
name: Current Weather
show_forecast: true
forecast_type: daily
- type: entities
title: 🌅 Sun Information
entities:
- entity: sun.sun
name: Sun Position
icon: mdi:weather-sunny
- entity: sensor.sun_next_rising
name: Sunrise
icon: mdi:weather-sunset-up
- entity: sensor.sun_next_setting
name: Sunset
icon: mdi:weather-sunset-down
- entity: sensor.sun_next_dawn
name: Dawn
icon: mdi:weather-sunset-up
- entity: sensor.sun_next_dusk
name: Dusk
icon: mdi:weather-sunset-down
- type: entities
title: 🚆 Public Transport
entities:
- entity: sensor.roslagsbanan_line_28_to_stockholms_ostra
name: To Stockholm Östra
icon: mdi:train
- entity: sensor.roslagsbanan_line_28_to_akersberga
name: To Åkersberga
icon: mdi:train
- entity: sensor.sl_departure_sensor_9636_bravalavagen
name: SL Departure
icon: mdi:bus
- entity: sensor.next_departure_time
name: Next Departure
icon: mdi:clock-outline
- type: entities
title: 📹 Camera Status
entities:
- entity: binary_sensor.backyard_motion
name: Backyard Motion
icon: mdi:motion-sensor
- entity: binary_sensor.frontdoor_motion
name: Front Door Motion
icon: mdi:motion-sensor
- entity: binary_sensor.driveway_motion
name: Driveway Motion
icon: mdi:motion-sensor
- entity: binary_sensor.roofcam_motion
name: Roof Camera Motion
icon: mdi:motion-sensor
- type: entities
title: 👥 Occupancy Summary
entities:
- entity: sensor.backyard_person_count
name: Backyard People
icon: mdi:account-group
- entity: sensor.frontdoor_person_count
name: Front Door People
icon: mdi:account-group
- entity: sensor.driveway_person_count
name: Driveway People
icon: mdi:account-group
- entity: sensor.roofcam_person_count
name: Roof Camera People
icon: mdi:account-group
- type: entities
title: 🌐 Network Status
entities:
- entity: sensor.xe75_download_speed
name: Download Speed
icon: mdi:download
- entity: sensor.xe75_upload_speed
name: Upload Speed
icon: mdi:upload
- entity: sensor.external_ip
name: External IP
icon: mdi:ip-network
- entity: binary_sensor.xe75_wan_status
name: WAN Status
icon: mdi:router-wireless
- type: markdown
content: |
<div style="height: 100vh;"></div>