55_InfoPanel.pm - Wer 02_RSS.pm mag, wird auch das hier lieben...

[betateilchen]

kannst du mir sagen warum

Ja, aber Du kommst da sicher auch selbst drauf, wenn Du mal ein bisschen nachdenkst. Zum Beispiel darüber, welche Befehle Dein "Receiver" überhaupt versteht.

[fh168]

Danke Jungs, ihr habt mir wieder den Abend versaut.

Jetzt habe ich mit dem InfoPanel wieder ein neues Projekt

Klappt super.

[betateilchen]

Standardmässig arbeite ich auf meinem Panel mit einem refresh von 20 Sekunden. Das ist für meine Zwecke völlig ausreichend. Die InfoPanels, die auf einem externen Webserver bereitgestellt werden, werden sogar nur alle 300 Sekunden aktualisiert.


In der nächsten Version ist die Angabe des hostname im DEFINE nicht mehr notwendig. Das Modul ermittelt den Parameter über das Betriebssystem selbst. Bereits vorhandene devices müssen im DEF entsprechend angepasst werden.

[betateilchen]

Wir können auch mit Gruppen arbeiten

Kommen wir noch einmal auf das Beispiel "Button mit Statusanzeige" zurück:

Code Auswählen Erweitern


button 13 0 0 160 80 0 0 {"http://192.168.123.241:8083/fhem?XHR=1&cmd.az_Drucker=set%20az_Drucker%20toggle"} {"Drucker an"}
condition {ReadingsVal('az_Drucker','state','off') eq 'on'}
rgb "FF0000FF"
circle - 20 20 5 1
rgb "4D4D4DFF"
condition 1


Dieser Code erzeugt an der linken oberen Ecke (0,0) einen Button mit der Breite 160 und der Höhe 80.
In diesem Button befindet sich 20 Pixel von links und 20 Pixel von oben ein kleiner roter Kreis als Statusanzeige.


Wenn man diesen Button nun nicht in der oberen linken Ecke des InfoPanels haben möchte, sondern beispielsweise in der zweiten Reihe (80px) und dritten Spalte (480px), müsste man ja alle Positionsangaben umrechnen:

Code Auswählen Erweitern



button 13 480 80 640 160 0 0 {"http://192.168.123.241:8083/fhem?XHR=1&cmd.az_Drucker=set%20az_Drucker%20toggle"} {"Drucker an"}
condition {ReadingsVal('az_Drucker','state','off') eq 'on'}
rgb "FF0000FF"
circle - 500 100 5 1
rgb "4D4D4DFF"
condition 1



Muss man aber nicht. SVG bietet die Möglichkeit, mehrere Elemente als "Gruppe" zu betrachten und bestimmte Eigenschaften auf alle Elemente in der Gruppe zu vererben. Das bedeutet, der Button wird immer mit identischen Positionsangaben definiert und die tatsächliche Position wird in der Gruppendefinition festgelegt.

Code Auswählen Erweitern



group button23 open 480 80
button 23 0 0 160 80 0 0 {"http://192.168.123.241:8083/fhem?XHR=1&cmd.az_Drucker=set%20az_Drucker%20toggle"} {"Drucker an"}
condition {ReadingsVal('az_Drucker','state','off') eq 'on'}
rgb "FF0000FF"
circle - 20 20 5 1
rgb "4D4D4DFF"
condition 1
group - close



Alle Positionsangaben zwischen "group open" und "group close" werden damit automatisch in die richtigen Koordinaten umgerechnet.
Das erleichtert die Positionierung von Elementen erheblich.

Die generelle Syntax für group lautet:

Code Auswählen Erweitern



group <id> open <x> <y>

group <id> close



[Benni]

Hallo betateilchen,

ich muss einfach mal ganz spontan meiner Begeisterung Ausdruck verleihen: Danke für dieses tolle Modul! 

bisher habe ich bereits meine Panel-Hauptübersicht von RSS auf InfoPanel portiert und muss sagen, die Grafikqualität und die Geschwindigkeit überzeugen sehr. Ganz davon abgesehen, dass außerdem  mein FHEM durch das Wegfallen des Renderns der RSS-Grafiken wieder deutlich besser reagiert.

Gerade bin ich daran meine, bisher auf separatem Raspberry liegenden, statischen Button-Panels in InfoPanel umzusetzen. Da kommen mir die Gruppen gerade recht. Sehr geile Idee!

2 kleine Fragen habe ich aber auch noch: Gibt es (oder wird es geben) eine Möglichkeit den Buttontext mehrzeilig auszuführen?
Gibt es (oder wird es geben) eine Möglichkeit einen Text-"Stil" mit anzugeben (bspw. Fett, kursiv, unterstrichen ...)?

Nochmal vielen Dank!
Echt klasse was du da machst!

Bin mal gespannt, was noch kommt

Gruß Benni.

[betateilchen]

Gibt es (oder wird es geben) eine Möglichkeit einen Text-"Stil" mit anzugeben (bspw. Fett, kursiv, unterstrichen ...)?

Hab ich bisher nicht drüber nachgedacht, sowas sollte aber kein großes Problem sein. Schauen wir mal...

[betateilchen]

Gibt es (oder wird es geben) eine Möglichkeit den Buttontext mehrzeilig auszuführen?

Aber das kannst Du Dir doch mit den bereits vorhandenen Möglichkeiten ganz einfach selbst bauen

Code Auswählen Erweitern


group multiline open 0 215
thalign "middle"
rgb "FFFF00FF"
rect 15_line 0 0 160 80 0 0 1
rgb "4D4D4DFF"
text 15_1 80 20 "Ich stehe in Zeile 1"
text 15_2 80 40 "Text in Zeile 2"
text 15_3 80 60 "Dritte Zeile"
area 15_area 0 0 160 80 "www.google.de"
thalign "start"
group - close


(http://up.picr.de/20850018bu.png)

Das Button-Tag macht letztendlich auch nichts anderes, als ein gefülltes Rechteck zu zeichnen und dann den Text draufzuschreiben. Schau doch mal in den html-Quelltext eines generierten ButtonPanels.

[Benni]

Aber das kannst Du Dir doch mit den bereits vorhandenen Möglichkeiten ganz einfach selbst bauen

Stimmt! Und durch die Gruppenbildung fast genau so komfortabel, wie der Button selbst.
Danke!

[Benni]

Stimmt! Und durch die Gruppenbildung fast genau so komfortabel, wie der Button selbst.
Danke!

Aber leider nur fast. 
Bei area habe ich keine Möglichkeit gefunden, als target zum Öffnen des Links "secret"
anzugeben. So wird er einfach im aktuellen Fenster geöffnet. Was einem bspw. beim Schalten von devices eine leere Seite präsentiert.

[betateilchen]

*erledigt*

Die Link-Logik von "button" funktioniert nun auch identisch bei "area"

Achtung: Das muss bei ALLEN bereits vorhandenen area Definitionen entsprechend angepaßt werden.

[betateilchen]

Neue Modulversion eingecheckt. Damit müssten nun auch alle images wieder funktionieren und nicht nur svg-Dateien

Wichtig: Diese neue Modulversion benötigt die ebenfalls aktualisierte Datei configDB.pm, falls man mit der Konfigurationsdatenbank arbeitet.

[Benni]

 Hallo betateilchen,

soeben ausgecheckt und getestet.
Läuft! 

Danke!
Gruß Benni.

[betateilchen]

Gibt es (oder wird es geben) eine Möglichkeit einen Text-"Stil" mit anzugeben (bspw. Fett, kursiv, unterstrichen ...)?

Du meinst so? 

(http://up.picr.de/20860079ry.png)

Code Auswählen Erweitern


#

rgb "FFFFFFFF"
pt 20
moveto 100 100

textdesign underline
text - x y "textdesign underline"

moveby 0 50
textdesign overline
text - x y "textdesign overline"

moveby 0 50
textdesign line-through
text - x y "textdesign line-through"

moveby 0 50
textdesign bold
text - x y "textdesign bold"

moveby 0 50
textdesign italic
text - x y "textdesign italic"

moveby 0 50
textdesign bold,italic,underline
text - x y "textdesign bold,italic,underline"

moveby 0 50
textdesign clear
text - x y "textdesign clear"

#


[Benni]

Ja! So hatte ich mir das vorgestellt.
Sehr schön!

Inzwischen habe ich übrigens neben der Hauptansicht auch das erste Button-Panel fertig portiert (s. Anhänge)

[betateilchen]

"Wohnen Schrank" klingt ziemlich ungemütlich *lach*