(Schöne) Uhr in FHEM statt Logo

[Aladin222]

@KernSani,

support wäre prima
Ich bin mit einem Mac unterwegs und der Safaribrowser zickt mit der Uhr leider etwas !
Der Aussenkreis und die Minuten & Sekundenstriche sind bei mir ( Safari ) nicht sichtbar
Nutze ich Chrome funktioniert alles bestens ...
Könnte ein MacUser das mal testen ?

[FHEm2005]

Hi KernSani,

schön, dass Du wieder hier bist. Ich habe 2 Punkte

1. Die aktuelle Version in #1 einpflegen wäre schön.

2. In der letzten Version ist der Übergang vom .png-Zifferblatt zum SVG-Zifferblat ja bereits vollzogen. Damit die Farbgestaltung durchgängig möglich ist, fehlt noch die Farbanpassung der Zeiger. Die svg-Grafiken dafür sind fertig und die notwendigen Variablen auch bereits definiert und in der angehängten .js-Datei eingetragen. Ich habe es nicht geschafft diese Zeiger funktionsfähig "einzuarbeiten". Die Farben sind in den einzelnen Zeigern unter je einer eigenen Layer-Id ansprechbar.

Sekundenzeiger = "layer4"
Minutenzeiger    = "layer5"
Stundenzeiger   = "layer6"

Die Dateien habe ich Dir hier mal angehängt. Wäre schön wenn es Dir gelingt die Zeiger so einzuarbeiten, dass sie über die bereits definierten Variablen "einstellbar" wären.

Eine etwas ausführlichere Bedienungsanleitung habe ich auch schon halb fertig. Will sie aber erst komplettieren, wenn die Zeiger funktionieren. Damit es keine Verwirrung mit unterschiedlichen Varianten gibt. Ich kann sie Dir gerne vorab per PN zusenden.

An alle anderen, die nicht KernSani heißen:   
Das hier sind Arbeitsdateien, die zwar funktionstüchtig sind, aber halt  Arbeitsdateien!!

Gruß
Eberhard

[Deckoffizier]

Hallo,

Gibt es eine Möglichkeit die Uhr komplett     nur   im Floorplan z.B. in die Mitte zu verschieben.
Habe mit meinen gegen Null Programmierkentnissen leider keine gut gehende Lösung gefunden.

Was geht ist durch editieren der fhem_nicelocks.js wie Zeile logo.style.left="10px"; die Uhr zu verschieben.
Man muss aber jedes mal von extern ein Editor bemühen und gerät leicht in Vergessenheit.

Die Idee wie in Antwort 93 eine eigene css Datei zu benutzen habe ich schon mal in Benutzung und nochmals Danke dafür !
Scheint aber hierfür nicht zu gehen um aus FHEM heraus etwas ändern zu können oder ??

Ein Versuch die fhem_nicelocks.js zu kopieren dann umzubenennen und als Attribut im Floorplan zu benutzen funktionierte leider nicht vermute es der exakte Dateiname wir intern benutzt ??

Letzte Idee war die Uhr als dummy anzulegen und dann im Floorplan mit floorplan arrange die Position elegant zu verschieben habe ich nicht hinbekommen.

Man möge mir mein stümperhaftes Vorgehen verzeihen vielleicht kennt Jemand von Euch noch einen Lösungsansatz.....


Danke

Hans-Jürgen

[tagedieb]

Hallo zusammen
zuerst einmal vielen Dank für die tolle Idee und die guten Anleitungen.
ich verfolge diesen Thread schon von Anfang an, jedoch habe ich es erst jetzt geschafft die Uhr anzuzeigen.
Ich habe auch die Anweisung für den FLOORPLAN befolgt, jedoch hier bleibt stur das FHEM logo stehen

Habe ich etwa übersehen,oder muss ich ausser den

Code Auswählen Erweitern

attr Wohnung CssFiles niceclocks/niceclocks.css
attr Wohnung JavaScripts niceclocks/niceclocks.js
attr Wohnung userattr niceclocksParam
noch etwas beachten?
als mein style habe ich dark eingestellt

Hinweise und Hilfe nehme ich gern an

grüsse tagedieb

[Deckoffizier]

Hallo tagedieb,

müsste die letzte Zeile vollständig nicht ungefähr so Aussehen in Deiner fhem.cfg   sind die attr gesetzt?

attr Wohnung niceclocksParam {"clockStyle" : "analog","clockFace" : "blue","keepBg" : false,"fixMenu" : false,"keepHeader" : true }

kenne mich leider nicht weiter aus

Gruß Hans-Jürgen

[tagedieb]

Guten Morgen Hans-Jürgen

Danke für den Hinweis - es hat geholfen, denn ich hatte die attr nur unter WEB,WEBphone etc

ich wünsche einen tollen Start in die neue Woche

Gruss
Annette

[FHEm2005]

Hallo Hans-Jürgen,

wird die Uhr bei Dir überhaupt im Floorplan angezeigt? In meinem Floorplan ist sie nicht zu sehen. Das Javascript wird vom Floorplan nicht aufgerufen. Das scheint wohl im FP zu liegen.

Gruß
Eberhard

[Deckoffizier]

Hallo Eberhard,

Ja wie vorher geschrieben, die Uhr wird bei mir im Floorplan angezeigt oder verstehe ich etwas falsch ?

Gesetzt ist attr <myFloorplan> userattr niceclocksParam

Dazu noch ....
CssFiles pgm2/myCSS_6668.css niceclocks/niceclocks.css
die extra myCSS_6668 benutze ich um die Schrift für Datum etwas zu verkleinern damit es in der Standardansicht besser passt.(überdeckt Menü etwas)

niceclocksParam {"clockStyle" : "analog","clockFace" : "blue","keepBg" : false,"fixMenu" : false,"keepHeader" : true }

und JavaScripts niceclocks/fhem_niceclocks.js

verschieben der Uhr geht auch über editieren in der fhem_nicelclocks.js aber nicht so direkt aus fhem heraus und bin auf der Suche nach einem anderen Weg wie meine Eingangsfrage mit meinen gescheiterten Versuchen.

Gruß

Hans-Jürgen
   

   


   

[KernSani]

Hallo zusammen,

Ich bin nun endlich dazu gekommen, die hervorragenden Vorarbeit von FHEm2005 zu Ende zu bringen.
Im Anhang eine beta-Version mit konfigurierbaren Zeigern. Die einstellbaren Parameter (und ihre default-Werte) sind damit:

Code Auswählen Erweitern


clockStyle : "analog", /* Define the clock style: 'analog' or 'digital' */
clockCircle: "white",       /* outer Circle of the Clock */
clockHours: "white",        /* strokes of the hours */
clockSeconds: "white",      /* strokes of the seconds */     
hourHand: "white",          /* Stundenzeiger */
minuteHand: "white",         /* MinutenZeiger */
secondHand:"white",        /* Sekundenzeiger */
visCircle: "inline",        /* shows outer circle */
visHours: "inline",         /* shows lines of the hours */
visSeconds: "inline",       /* shows lines of the seconds */
visHourHand: "inline",      /* Sichtbarkeit des Stundenzeigers */
visMinuteHand: "inline",    /* Sichtbarkeit des MinutenZeigers */
visSecondHand: "inline",    /* Sichtbarkeit des Sekundenzeigers */
analogBorder: false, /* draw a border around clock */
fixMenu : true, /* Set to "true" to fix the menu (only content scrollable) */
keepBg : true, /* Keep the background image (if you have your own) */
keepHeader : false, /* Set to "false" if you don't have a command field */
verbose: 3


Grüße,

Oli

[newby]

Hallo zusammen,

super Idee mit der Uhr.
Habe es gestern installiert und lief auch direkt.
Seit heute wird bei der digitalen Uhr nach einem Refresh mal der Sekundenzeiger angezeigt , mal fehlen die Minuten, oder die Sekunden springen nur noch.
Egal ob FHEM WEB oder Floorplan.
Die Analog Uhr funktioniert einwandfrei.
Auch Neustart hilft nicht.
Der Link im Floorplan um auf fhem zurück zukommen wird bei der digital Version auch vom Datum überdeckt. Analog ok.
FHEM update von gestern
Style = Dark
Hat da jemand eine Idee?

update
wenn man von analog auf digital in der cfg ändert wird sie korrekt angezeigt, ein erneuter refresh vom Browser bringt den Fehler wieder.
Ich nutze Firefox.

Gruß

Sven

[FHEm2005]

Hallo newby,

die digitale Variante war bisher fast nicht Gegenstand dieses Threads. Welches Betriebssystem? Wie sieht die fhem.cfg in diesem Umfeld aus?
Vielleicht gibt es Jemanden dann da draußen Einen, der die gleiche Konfiguration hat wie Du.

Gruß Eberhard

[newby]

Hallo,

fhem läuft auf einem Raspi.
Das Problem mit der digitalen Anzeige ist nach einem update des Firefox bis jetzt nicht mehr aufgetreten.
Es wird zwar bei einem refresh noch kurz der Zeiger angezeigt, springt aber dann auf die Sekunden um.
Das Problem mit dem fhem-Link im Floorplan vermute ich liegt daran das die Uhr über dem Link liegt.

Code Auswählen Erweitern


#FHEM WEB
attr WEB CssFiles niceclocks/niceclocks.css
attr WEB JavaScripts niceclocks/fhem_niceclocks.js
attr WEB niceclocksParam {"clockStyle" : "digital","keepBg" : false,"fixMenu" : false,"keepHeader" : true }

#Floorplan
attr Temperaturen userattr niceclocksParam
attr Temperaturen CssFiles niceclocks/niceclocks.css
attr Temperaturen JavaScripts niceclocks/fhem_niceclocks.js
attr Temperaturen niceclocksParam {"clockStyle" : "digital","keepBg" : false,"fixMenu" : false,"keepHeader" : true }



Ich hoffe das hilft weiter

Gruß

Sven

[FHEm2005]

Hallo newby,

kennst Du Dich etwas mit CSS aus? Hast Du schon mal versucht in der niceclocks.css - Datei die Position der Uhr zu verändern? Oder mit index die Reihenfolge in der Anzeige zu verändern? Die Eigenschaft z-index:-99 schiebt die Anzeige ganz in den Hintergrund.

Für Firefox gibt es Firebug. Darin kannst Du wunderbar Veränderungen für die CSS austesten ohne die eigentliche CSS-Datei zu zerschießen.

Ich habe bei mir leider keinen Floorplan um Deine Konfiguration auszutesten.

Gruß
Eberhard

[newby]

Moin,
ich kenne mich bedingt mit CSS aus.
Firebug zeigt mir an das es das DIV Logo aus der darkfloorplanstyle.css ist.

Code Auswählen Erweitern


<div id="logo" style="top: 20px; font-size: xx-large; text-align: center; font-weight: bold; left: 40px; width: 120px; height: 200px; background-image: none; visibility: visible;">
<div id="clockdigital" style=""><img id="digitalhour" src="/fhem/niceclocks/images/digitalhours.gif" style="transform: rotate(240deg);"><img id="digitalminute" src="/fhem/niceclocks/images/digitalminutes.gif"
style="transform: rotate(198deg);"><img id="digitalsecond" src="/fhem/niceclocks/images/digitalseconds.gif" style="transform: rotate(241deg);">
<div style="opacity: 0.8;">&nbsp;</div><div style="opacity: 0.8;">&nbsp;</div></div><div id="ncDate" style="padding-top: 80px; font-size: medium; font-weight: normal;"><p>Mittwoch, </p><p>25. März 2015</p></div></div>


Wenn ich im Firebug height von 200px auf 165px setze ist es in Ordnung.
Das Logo selbst hat aber eine Höhe vonn600px.
Soweit die Theorie.
In der Praxis habe ich nur das Problem das er mir auch anzeigt das die CSS in fhem/css/ liegt.
Den Ordner habe ich aber nicht.
Bei mir liegt die Datei unter fhem/www/pgm2.
Und in dieser ist kein Eintrag zu dem Logo zu finden.
Ich habe den Floorplan auch nur definiert ohne weiteres hinzuzufügen.

Gruß
Sven

[FHEm2005]

Hallo Newby,

die von Dir gezeigten Eigenschaften befinden sich nicht in der Datei floorplan.css sondern in der Datei /opt/fhem/www/niceclocks/fhem_niceclocks.js ab Zeile 250 auf Notepad++ bezogen.  Wenn Du dort etwas änderst, hat das nicht nur im Floorplan Auswirkungen, sondern auch in der normalen Web-Oberfläche.

Ich hatte schon mal ein ähnliches Problem. Deshalb mein Tip: eine eigene CSS-Datei anlegen. Siehe hierzu:

http://forum.fhem.de/index.php?topic=28939.0 und in diesem Thread siehe #93 habe ich beschrieben, wie es geht.

Du müsstest bei Dir eintragen:

Code Auswählen Erweitern

logo.style.height = "165px";

Du kannst also eine myfloorplan.css anlegen, dort die Änderungen ablegen und sie als attr aufrufen.

Viel Erfolg!

Gruß
Eberhard