Der Homescreen

Fangen wir mit dem Homescreen meines Dashboards an. Dieser wird vom Browser nach 30 Sekunden (ist einstellbar) automatisch wieder aufgerufen und ist somit das Herzstück meiner Oberfläche:

Homescreen

Im Folgenden erkläre ich die einzelnen Bereiche und beschreibe kurz, wie ich sie technisch gelöst habe:

kamera Hier lasse ich eine Webcam anzeigen. Die Einbindung erfolgt als Bild. Dabei muss die Kamera das Kamerabild als Snapshot (snapshot.cgi) bereitsstellen. Drücke ich auf das Bild öffnet sich eine Seite, auf der das Kamerabild als Livestream (videostream.cgi) angezeigt wird. Da es sich dabei um Motion JPEG handelt, erfolgt die Einbindung ebenfalls als Bild (<img>). Hier ein Beispiel, wie ein Bild eingebunden werden muss:
quicklaunch_links quicklaunch_rechts Dies ist meine Info und Quick-Action Leiste (links im Bild geteilt, damit man es besser erkennt). Darüber werden wichtige System Events aber auch Staus und die Anwesenheit angezeigt.

stau_grau
stau_orange
stau_rot
Stau-Info: Beträgt der Weg 5 Minuten länger als normal, wird das Icon orange. Sind es 10 Minuten mehr, wird es rot und in der Zeit von 7-9Uhr (montags-freitags) leuchtet der LED Stripe um den Badezimmerspiegel rot, damit man morgens direkt weiß, dass auf der Fahrt zur Arbeit etwas anders ist als normal. Die Informationen werden mittels Cronjob alle 5 Minuten von der Google Directions API geholt und in meine Datenbank gespeichert.

wetter_warnung_grau
wetter_warnung_orange
Wetterwarnung: Liegt mindestens eine Wetterwarnung für meine Region vor, wird das Warnsymbol gelb. Im Hintergrund wird über PHP ein RSS Feed abgefragt und ausgewertet. Diese Infos gehen in meine Datenbank.

system_health_grau
system_health_orange
Systeminfo: Gibt es ein Problem bei einem Import von Daten, ändert sich das Warnsymbol auf gelb. Dabei wird zum Einen der erwartete Inhalt aber auch mittels Timestamp das Alter des letzten Eintrags in der Datenbank geprüft. Außerdem wird geprüft, ob das nächtliche Backup der Synology erfolgreich war.

online_gruen
online_orange
DSL Monitoring: Hier überwache ich meine Internet-Verbindung. Ist der Sync oder die PPPoE Verbindung unterbrochen, wird das Icon orange. Gab es einen Resync, dann wird das Icon für 6 Stunden orange. Darüberhinaus wird das Icon ebenfalls orange, wenn es in einer Stunde mehr als 100 CRC Fehler gibt. Somit lassen sich potentielle Probleme feststellen. Die Daten werden alle 10 Minuten per TR-064 Import aus der FritzBox in die Datenbank geladen.

wlan_grau
wlan_on
Gäste WLAN: Zeigt an, ob das Gäste-WLAN der FritzBox aktiviert ist.

anruf_grau
anruf_gruen
Anruf in Abwesenheit: Zeigt an, ob es in den letzten 6 Stunden einen Anruf in Abwesenheit auf dem Festnetz gab. Der Import erfolgt ebenfalls alle 10 Minuten aus der FritzBox in die Datenbank.

anwesend_grau
anwesend_gruen
Anwesenheit: Status, ob das gesamte System die Anwesenheit der vordefinierten Smartphones erkannt hat. Der Status wird mittels Hostname (MAC-Adresse ginge auch, dann muss das Script aber bei einem neuen Smartphone anpasst werden) über die TR-064 Schnittstelle der FritzBox ermittelt.

kino_dashboard Kino Filme: Link zur Seite, wo die aktuellen Kino Filme (Top 10) angezeigt werden. Die Abfrage der Filme erfolgt mittels PHP von einem RSS Feed.

aufgaben Aufgaben: Hier werden die Aufgaben angezeigt, die auf der Aufgaben Unterseite verwaltet werden. Aufgaben ohne Fälligkeit oder mit einer Fälligkeit ferner als 3 Tage erscheinen im grünen Bereich. Aufgaben die eine Fälligkeit kleiner als 3 Tage haben, erscheinen im orangen und überfällige Aufgaben im roten Bereich. Hier ein Screenshot der Aufgaben-Seite:

aufgaben

 statusarea Anzeige der aktuellen Uhrzeit und des Datums (geht über eine einfache PHP Funktion). Darunter erfolgt die Abfrage aus der Datenbank, ob eine Musikquelle aktiv ist. Dort erscheint dann der Name des Radio-Senders oder Spotify. Die Steuerung erfolgt über die Musik-Unterseite. Darunter befindet sich ein Quick-Action Bereich. Dort können 4 System-Zustände im Lightmanager angetriggert werden. Sind die entsprechenden Zustände aktiv, ändert sich die Hintergrundfarbe. Zum Beispiel:

quickactionstatus

 wetter Link zur Wetterseite. Das Icon der ändert sich immer passend zur aktuellen Wettersituation und zur Tageszeit. Darunter befindet sich die aktuelle Außentemperatur, welche über die Darksky.net API bezogen und in die Datenbank geschrieben wird. Der Pfeil daneben zeigt an, ob die Temperatur aktuell steigt, sinkt oder gleichbleibt.
 countdown
Bereich für „Krims-Krams“. Z.B. für einen Countdown zum nächsten Urlaub oder bis zum neuen Jahr. Dieser Countdown kann sehr einfach über PHP realisiert werden.
 gutenacht
Ein Druck auf den Button aktiviert den „Kind schläft“ Modus. Es werden folgende Aktionen durchgeführt:

  • Das Deckenlicht im Kinderzimmer wird zum ins Bett bringen auf 18% gedimmt.
  • Am Kinderbett befindet sich ein Funk Schalter (4-fach). Dort werden für 2 Stunden die Lichteinschalter deaktiviert, damit das (noch kleine) Kind nicht beim Einschlafen daran rum spielt und das Licht einschaltet. Die Ausschalter bleiben aktiv, damit man nach dem Singen direkt das Licht ausschalten kann.
  • Die akustische Türklingel wird deaktiviert und stattdessen blinken alle LED Stripes 1 Minute lang, wenn jemand klingelt.

Der Button im Dashboard wird deaktiviert, damit man nicht aus Versehen das Licht nochmal einschaltet, wenn das Kind bereits schläft. Der Text ändert sich dann auch auf „XYZ schläft“.

Um 6 Uhr morgens wird der Schlaf-Modus automatisch deaktiviert und alle Regeln wieder zurückgesetzt.

temperatur

Hier ein Beispiel für einen Link zu den einzelnen Räumen. Da wo Temperatur- und Luftfeuchtigkeits-Sensoren installiert sind, werden die Werte in der Kachel mit angezeigt. Momentan habe ich 3 Erfassungsmethoden der Werte, die dann alle in der Datenbank gesammelt werden:

  • Die Temperatur im Wohnzimmer wird vom internen Thermometer des Lightmanager Airs aus der params.htm Datei gezogen.
  • Die Temperatur/Luftfeuchtigkeit im Kinderzimmer wird 1x pro Minute von einem Raspberry Pi mit DHT22 Modul erfasst.
  • Die Temperatur/Luftfeuchtigkeit im Schlafzimmer kommt von einem Oregon Scientific Thermometer, welches direkt mit dem Lightmanager gekoppelt ist.

 

Bei allen anderen Bereichen des Homescreens handelt es sich um einfache Links ohne Sonderfunktionen. Deshalb werde ich diese hier nicht weiter erläutern.

Tolle und auch viele kostenlose Icons findet ihr auf www.flaticon.com. Infos zu den von mir im Dashboard verwendeten Icons: