Uhr auf FHEM-Seite

Aus FHEMWiki
Version vom 12. Januar 2018, 20:23 Uhr von Trelle (Diskussion | Beiträge) (→‎Links: Link ergänzt)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Das "lächelnde Haus" ist natürlich das FHEM-Logo. Doch könnte es ja sein, dass eine eher nüchterne Seitendarstellung gewünscht ist, etwa, indem dort eine sekundengenaue Uhr eingeblendet wird.

Dazu sind - bei Verwendung von pgm2 - folgende Schritte vorzunehmen. Im Verzeichnis /fhem/www/pgm2 sind die zu ändernden Dateien zu finden.

1.Modifikation der Datei svg.jsAns Ende wird der folgende Code gestellt:

function GetClock(){
 d = new Date();
 nhour = d.getHours();
 nmin  = d.getMinutes();
 if(nmin <= 9){nmin="0"+nmin}
 document.getElementById('logo').innerHTML=nhour+":"+nmin;
 setTimeout("GetClock()", 1000);
}
window.onload=GetClock;

Selbstverständlich könnte man die Anzeige auf Sekunden ausdehnen, oder noch etwas komplizierter gestalten - der obige Code soll nur als Beispiel dienen. Auch erfolgt die Abfrage hier alle 1000 Millisekunden - das kann man bei reduziertern Genauigkeitsanforderungen auch heraufsetzen.

2. Modifikation der Datei style.css(bzw. von <xxx>style.css, wenn man einen anderen als den Default-Style verwendet)

Der Selektor für den Bereich des Logos wird ausgetauscht gegen:

#logo  { position:fixed; top:30px; left:20px;
      width:100px; height:105px; text-align:center;
      font-family:Times-Roman; font-size:xx-large; font-weight:bold;
      }

Selbstverständlich kann man hier noch verschiedene eigene Attribute einbauen, etwa die Farbe und Schriftgröße an eigene Wünsche anpassen.

Links