No description
- JavaScript 61.7%
- HTML 21.8%
- CSS 16.3%
- Shell 0.2%
| Filename | Latest commit message | Latest commit date |
|---|---|---|
| assets | ||
| config | ||
| src | ||
| .gitignore | ||
| .gitlab-ci.yml | ||
| alarm-renderer.js | ||
| alarm-styles.css | ||
| alarm.html | ||
| build-linux.sh | ||
| index.html | ||
| main.js | ||
| package.json | ||
| pip-styles.css | ||
| pip.html | ||
| README.md | ||
| renderer.js | ||
| styles.css | ||
Home Assistant PiP Monitor
Un'applicazione Electron per monitorare i sensori di Home Assistant e visualizzare flussi video delle telecamere in modalità Picture-in-Picture (PiP).
Caratteristiche
- Connessione WebSocket con Home Assistant: Ascolta gli eventi dei sensori
binary_sensoreinput_boolean - Visualizzazione PiP: Mostra flussi video delle telecamere in finestre ridimensionabili e trascinabili
- Configurazione Flessibile: Associa più sensori a diverse telecamere con impostazioni personalizzate
- Gestione Multi-Eventi: Mostra più finestre in cascata per eventi simultanei
- Tema Chiaro/Scuro: Interfaccia minimalista con tema automatico o manuale
- Modalità Non Disturbare: Disattiva temporaneamente le notifiche video
- Test Integrato: Verifica il funzionamento delle telecamere direttamente dall'app
- Stato Sensori: Monitora in tempo reale lo stato dei sensori configurati
Requisiti
- Node.js 16+
- Home Assistant con token di accesso a lunga durata
- Telecamere configurate in Home Assistant
Installazione
- Clona questo repository:
git clone <repository-url>
cd home-assistant-pip-monitor
- Installa le dipendenze:
npm install
- Avvia l'applicazione in modalità sviluppo:
npm start
Configurazione
1. Impostazioni Home Assistant
- Vai nella scheda "Impostazioni" dell'app
- Inserisci l'URL di Home Assistant (es:
https://homeassistant.local:8123) - Genera un token di accesso a lunga durata in Home Assistant:
- Vai in Profilo utente > Token di accesso a lunga durata
- Crea un nuovo token e copialo
- Inserisci il token nell'app e salva le impostazioni
2. Configurazione Sensori-Telecamere
- Vai nella scheda "Sensori"
- Clicca su "Aggiungi Mappatura"
- Seleziona un sensore (binary_sensor o input_boolean)
- Seleziona una telecamera o inserisci un URL diretto
- Configura durata, audio e dimensioni
- Salva la mappatura
3. Impostazioni PiP
- Durata predefinita: Secondi di visualizzazione del video (default: 10s)
- Posizione iniziale: Dove appariranno le finestre PiP
- Modalità multi-evento: Mostra più finestre in cascata (modalità predefinita)
- Audio predefinito: Abilita/disabilita l'audio di default
- Dimensione predefinita: Formato video (piccolo, medio, grande, quadrato, orizzontale, verticale)
Utilizzo
Funzionamento Automatico
- L'app si connette a Home Assistant via WebSocket
- Quando un sensore configurato passa a stato "on", appare automaticamente una finestra PiP con il video della telecamera associata
- La finestra si chiude automaticamente dopo il tempo configurato
Controlli Finestra PiP
- Trascinamento: Clicca e trascina l'header per spostare la finestra
- Muto/Attiva audio: Clicca sull'icona dell'altoparlante
- Chiusura manuale: Clicca sulla X per chiudere immediatamente
- Timer: La barra inferiore mostra il tempo rimanente
Modalità Test
- Vai nella scheda "Test"
- Seleziona una telecamera o inserisci un URL
- Configura le impostazioni desiderate
- Clicca "Avvia Test PiP" per verificare il funzionamento
Modalità Non Disturbare
- Clicca con il tasto destro sull'icona nella tray
- Seleziona "Non Disturbare" per disattivare temporaneamente le notifiche
- Puoi anche attivarla dalla dashboard principale
Struttura del Progetto
home-assistant-pip-monitor/
├── main.js # Processo principale Electron
├── index.html # Interfaccia principale
├── renderer.js # Logica dell'interfaccia
├── styles.css # Stili interfaccia principale
├── pip.html # Finestra PiP
├── pip-styles.css # Stili finestra PiP
├── package.json # Dipendenze e script
├── assets/ # Icone e risorse
└── README.md # Documentazione
Risoluzione Problemi
Connessione Fallita
- Verifica l'URL di Home Assistant
- Controlla che il token sia valido e non scaduto
- Assicurati che Home Assistant sia accessibile dalla rete
Video Non Caricato
- Verifica che la telecamera sia configurata correttamente in Home Assistant
- Controlla che l'URL del flusso video sia corretto
- Prova con un URL diretto del flusso video
Finestra PiP Non Appare
- Verifica che il sensore sia configurato correttamente
- Controlla che la modalità "Non Disturbare" sia disattivata
- Verifica lo stato del sensore nella dashboard
Sviluppo
Build per Produzione
Per Windows:
npm run build-win
Per Linux:
npm run build-linux
I file build verranno generati nella cartella dist/.
Modifiche
Il progetto è strutturato per essere facilmente modificabile:
main.js: Logica di backend, connessioni WebSocket, gestione finestrerenderer.js: Logica dell'interfaccia utente, gestione eventistyles.cssepip-styles.css: Stili personalizzabili tramite variabili CSS
Licenza
MIT License
Supporto
Per problemi o richieste di funzionalità, apri una issue nel repository del progetto.