Add setup-auto-scroll.sh

2025-12-31 04:26:56 -08:00
parent 809adbd67a
commit 0b5db3d541
1 changed files with 104 additions and 0 deletions
--- a/setup-auto-scroll.sh
+++ b/setup-auto-scroll.sh
@@ -0,0 +1,104 @@
+#!/bin/bash
+# Inject auto-scroll JavaScript into Firefox
+# This will make the dashboard auto-scroll every 5 seconds
+
+echo "Setting up auto-scroll for Home Assistant Dashboard..."
+echo ""
+echo "This script will create a Firefox user script that auto-scrolls the dashboard."
+echo ""
+
+# Create Firefox user script directory
+FIREFOX_PROFILE="$HOME/.mozilla/firefox"
+USER_SCRIPT_DIR="$FIREFOX_PROFILE/auto-scroll-script"
+
+mkdir -p "$USER_SCRIPT_DIR"
+
+# Create the auto-scroll script
+cat > "$USER_SCRIPT_DIR/auto-scroll.js" << 'EOF'
+// Auto-scroll script for Home Assistant Kiosk Dashboard
+(function() {
+    console.log('Auto-scroll script loaded');
+    
+    let currentIndex = 0;
+    const scrollInterval = 5000; // 5 seconds
+    let cards = [];
+    let scrollTimer = null;
+    
+    function initAutoScroll() {
+        // Wait for cards to load
+        cards = document.querySelectorAll('ha-card');
+        
+        if (cards.length === 0) {
+            console.log('No cards found, retrying...');
+            setTimeout(initAutoScroll, 1000);
+            return;
+        }
+        
+        console.log(`Found ${cards.length} cards`);
+        
+        // Make each card full viewport height
+        cards.forEach((card, index) => {
+            card.style.minHeight = window.innerHeight + 'px';
+            card.style.scrollMargin = '0';
+        });
+        
+        // Function to scroll to next card
+        function scrollToNext() {
+            if (cards.length === 0) return;
+            
+            currentIndex = (currentIndex + 1) % cards.length;
+            const targetCard = cards[currentIndex];
+            
+            if (targetCard) {
+                targetCard.scrollIntoView({
+                    behavior: 'smooth',
+                    block: 'start'
+                });
+                console.log(`Scrolled to card ${currentIndex + 1} of ${cards.length}`);
+            }
+        }
+        
+        // Start auto-scrolling
+        console.log('Starting auto-scroll: changing card every 5 seconds');
+        scrollTimer = setInterval(scrollToNext, scrollInterval);
+        
+        // Scroll to first card immediately
+        if (cards.length > 0) {
+            window.scrollTo({ top: 0, behavior: 'smooth' });
+            setTimeout(() => {
+                cards[0].scrollIntoView({ behavior: 'smooth', block: 'start' });
+            }, 500);
+        }
+    }
+    
+    // Start when page loads
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initAutoScroll);
+    } else {
+        initAutoScroll();
+    }
+    
+    // Re-initialize if cards change (for dynamic content)
+    const observer = new MutationObserver(() => {
+        const newCards = document.querySelectorAll('ha-card');
+        if (newCards.length !== cards.length) {
+            console.log('Cards changed, re-initializing...');
+            if (scrollTimer) clearInterval(scrollTimer);
+            initAutoScroll();
+        }
+    });
+    
+    observer.observe(document.body, { childList: true, subtree: true });
+})();
+EOF
+
+echo "✓ Created auto-scroll script at: $USER_SCRIPT_DIR/auto-scroll.js"
+echo ""
+echo "To inject this script into Firefox:"
+echo "1. Open the dashboard in Firefox"
+echo "2. Press F12 to open Developer Tools"
+echo "3. Go to Console tab"
+echo "4. Copy and paste the contents of: $USER_SCRIPT_DIR/auto-scroll.js"
+echo "5. Press Enter"
+echo ""
+echo "Or, you can inject it automatically by adding it to the dashboard launch script."