Uhr auf FHEM-Seite: Unterschied zwischen den Versionen

Aktuelle Version vom 12. Januar 2018, 20:23 Uhr

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

Eine weitere Möglichkeit, auf der FHEM-Seite eine Uhr darzustellen, wird in diesem Forenthread beschrieben
Und noch eine Möglichkeit (PTB/Bahnhofsuhr), auf der FHEM-Seite eine Uhr darzustellen, wird in diesem Forenthread beschrieben
Eine clock.js inkl. f18 für die Bahnhofsuhr aus diesem Beitrag gibt es in diesem Beitrag

@@ Zeile 2: / Zeile 2: @@
 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.js'''Ans Ende wird der folgende Code gestellt:
@@ Zeile 25: / Zeile 26: @@
        }</nowiki>
 Selbstverständlich kann man hier noch verschiedene eigene Attribute einbauen, etwa die Farbe und Schriftgröße an eigene Wünsche anpassen.
+== Links ==
+* Eine weitere Möglichkeit, auf der FHEM-Seite eine Uhr darzustellen, wird in {{Link2Forum|Topic=31912|LinkText=diesem Forenthread}} beschrieben
+* Und noch eine Möglichkeit (PTB/Bahnhofsuhr), auf der FHEM-Seite eine Uhr darzustellen, wird in {{Link2Forum|Topic=53286|LinkText=diesem Forenthread}} beschrieben
+* Eine clock.js inkl. f18 für die Bahnhofsuhr {{Link2Forum|Topic=53286|Message=449780|LinkText= aus diesem Beitrag}} gibt es {{Link2Forum|Topic=53286|Message=746696|LinkText= in diesem Beitrag}}
 [[Kategorie:Code Snippets]]