Add Aurora Livecam video player enhancements

- Add SettingsManager class for admin settings (settings.json) - Add timelapse controls with slider, speed (1x/10x/100x), and reverse playback - Add daily video player to play videos in main player window - Add admin settings panel for viewer display and video mode configuration - Add CSS styles for new player controls - Include integration guide for existing index.php
2026-01-10 10:08:17 +00:00
parent cac3768885
commit 367aa4c67b
7 changed files with 1066 additions and 0 deletions
@@ -0,0 +1,140 @@
+/**
+ * Admin Settings Manager - AJAX ohne Reload
+ */
+const AdminSettings = {
+    settings: {},
+
+    init: function() {
+        this.loadSettings();
+        this.setupEventListeners();
+    },
+
+    loadSettings: function() {
+        fetch(window.location.href, {
+            method: 'POST',
+            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
+            body: 'settings_action=get'
+        })
+        .then(r => r.json())
+        .then(data => {
+            if (data.success) {
+                this.settings = data.settings;
+                this.updateUI();
+            }
+        })
+        .catch(err => console.error('Settings load error:', err));
+    },
+
+    updateSetting: function(key, value) {
+        fetch(window.location.href, {
+            method: 'POST',
+            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
+            body: `settings_action=update&key=${encodeURIComponent(key)}&value=${encodeURIComponent(value)}`
+        })
+        .then(r => r.json())
+        .then(data => {
+            if (data.success) {
+                this.showNotification('✓ Einstellung gespeichert', 'success');
+                // Sofort UI aktualisieren
+                this.applySettingImmediately(key, value);
+            } else {
+                this.showNotification('✗ Fehler beim Speichern', 'error');
+            }
+        })
+        .catch(err => {
+            console.error('Settings update error:', err);
+            this.showNotification('✗ Netzwerkfehler', 'error');
+        });
+    },
+
+    applySettingImmediately: function(key, value) {
+        // Sofortige Anwendung ohne Reload
+        switch(key) {
+            case 'viewer_display.enabled':
+                const viewerEl = document.querySelector('.viewer-stat');
+                if (viewerEl) {
+                    viewerEl.style.display = value === true || value === 'true' ? 'inline-flex' : 'none';
+                }
+                break;
+
+            case 'viewer_display.min_viewers':
+                // Wird beim nächsten Heartbeat angewendet
+                window.minViewersToShow = parseInt(value);
+                break;
+        }
+    },
+
+    updateUI: function() {
+        // Checkbox für Zuschauer-Anzeige
+        const viewerEnabled = document.getElementById('setting-viewer-enabled');
+        if (viewerEnabled) {
+            viewerEnabled.checked = this.settings.viewer_display?.enabled ?? true;
+        }
+
+        // Mindestanzahl
+        const minViewers = document.getElementById('setting-min-viewers');
+        if (minViewers) {
+            minViewers.value = this.settings.viewer_display?.min_viewers ?? 1;
+        }
+
+        // Video-Modus
+        const playInPlayer = document.getElementById('setting-play-in-player');
+        if (playInPlayer) {
+            playInPlayer.checked = this.settings.video_mode?.play_in_player ?? true;
+        }
+
+        const allowDownload = document.getElementById('setting-allow-download');
+        if (allowDownload) {
+            allowDownload.checked = this.settings.video_mode?.allow_download ?? true;
+        }
+    },
+
+    setupEventListeners: function() {
+        // Zuschauer-Anzeige Toggle
+        document.getElementById('setting-viewer-enabled')?.addEventListener('change', (e) => {
+            this.updateSetting('viewer_display.enabled', e.target.checked);
+        });
+
+        // Mindestanzahl Zuschauer
+        document.getElementById('setting-min-viewers')?.addEventListener('change', (e) => {
+            this.updateSetting('viewer_display.min_viewers', e.target.value);
+        });
+
+        // Video im Player abspielen
+        document.getElementById('setting-play-in-player')?.addEventListener('change', (e) => {
+            this.updateSetting('video_mode.play_in_player', e.target.checked);
+        });
+
+        // Download erlauben
+        document.getElementById('setting-allow-download')?.addEventListener('change', (e) => {
+            this.updateSetting('video_mode.allow_download', e.target.checked);
+        });
+    },
+
+    showNotification: function(message, type) {
+        const notification = document.createElement('div');
+        notification.className = `admin-notification ${type}`;
+        notification.textContent = message;
+        notification.style.cssText = `
+            position: fixed;
+            top: 20px;
+            right: 20px;
+            padding: 15px 25px;
+            border-radius: 8px;
+            background: ${type === 'success' ? '#4CAF50' : '#f44336'};
+            color: white;
+            font-weight: bold;
+            z-index: 10000;
+            animation: slideIn 0.3s ease;
+        `;
+        document.body.appendChild(notification);
+        setTimeout(() => notification.remove(), 3000);
+    }
+};
+
+// Initialisierung nur im Admin-Bereich
+document.addEventListener('DOMContentLoaded', function() {
+    if (document.getElementById('admin-settings-panel')) {
+        AdminSettings.init();
+    }
+});