Modul PostMe: Unterschied zwischen den Versionen
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
Zeile 12: | Zeile 12: | ||
=Allgemeines= | =Allgemeines= | ||
Das Modul ''95_PostMe.pm'' stellt eine komfortable Oberfläche bereit, um per Webinterface beliebige Listen ähnlich wie gelbe Klebezettel (Post-It™) zu verwalten. | Das Modul ''95_PostMe.pm'' stellt eine komfortable Oberfläche bereit, um per Webinterface beliebige Listen ähnlich wie gelbe Klebezettel (Post-It™) zu verwalten. | ||
== | ==Definition== | ||
==Einbinden in die FHEM-Anzeige | Die folgende beispielhafte Definition setzt das PostMe-System mit dem Devicenamen '''PostIt''' in Betrieb: | ||
define PostIt PostMe | |||
attr PostIt postmeStd Einkaufsliste,Baumarktliste ''Standard-Listen, die immer vorhanden sind (nicht löschbar)'' | |||
attr PostIt icon <embed src="/fhem/PostMe_widget?type=pins&postit=PostIt"/> ''siehe unten'' | |||
attr PostIt postmeTTSDev GalaxyTab | |||
attr PostIt postmeMailFun DebianMail | |||
attr PostIt postmeMsgFun Telegram | |||
attr PostIt postme01MailRec ''<mail-Adresse Person 1>'' | |||
attr PostIt postme01MsgRec ''<messenger-Adresse Person 1>'' | |||
attr PostIt postme02MailRec ''<mail-Adresse Person 2>'' | |||
attr PostIt postme02MsgRec ''<messenger-Adresse Person 2>'' | |||
attr PostIt postmeStyle HTML | |||
attr PostIt postmeClick 0 ''siehe unten'' | |||
attr PostIt postmeIcon images/default/pin_red_32.png | |||
=Einbinden in die FHEM-Anzeige= | |||
PostMes können in jede beliebige Webseite eingebunden werden. Beispielsweise kann auch das Standard-Attribut ''icon'' des diesem Postme-System zugeordneten Devices durch einen der folgenden Codes ersetzt werden. | PostMes können in jede beliebige Webseite eingebunden werden. Beispielsweise kann auch das Standard-Attribut ''icon'' des diesem Postme-System zugeordneten Devices durch einen der folgenden Codes ersetzt werden. | ||
* Mit dem Code | * Mit dem HTML-Code | ||
<embed src="/fhem/PostMe_widget?type=pins&postit=''<devicename>''"/> | <embed src="/fhem/PostMe_widget?type=pins&postit=''<devicename>''"/> | ||
wird eine interaktive Liste aller Titelzeilen der PostMes dieses Systems angezeigt. | wird eine interaktive Liste aller Titelzeilen der PostMes dieses Systems angezeigt. | ||
Zeile 21: | Zeile 40: | ||
<embed src="/fhem/PostMe_widget?type=pin&postit=''<devicename>''&name=''<name>''"/> | <embed src="/fhem/PostMe_widget?type=pin&postit=''<devicename>''&name=''<name>''"/> | ||
wird ein einzelnes PostMe mit dem Namen ''<name>'' als Titelzeile angezeigt. | wird ein einzelnes PostMe mit dem Namen ''<name>'' als Titelzeile angezeigt. | ||
==Art der Widgets== | |||
In diesen Darstellungen kann durch die Maus erreicht werden, dass zur einzeiligen Anzeige der Titelzeile der volle Inhalt des PostMes angezeigt wird. | In diesen Darstellungen kann durch die Maus erreicht werden, dass zur einzeiligen Anzeige der Titelzeile der volle Inhalt des PostMes angezeigt wird. | ||
* Wenn das Attribut ''postmeClick'' auf 0 gesetzt ist (Default-Wert), erfolgt die Anzeige und das Löschen des PostMe-Inhaltes durch Überfahren bzw. Wegfahren des Mauszeigers auf die Titelzeile. | * Wenn das Attribut ''postmeClick'' auf 0 gesetzt ist (Default-Wert), erfolgt die Anzeige und das Löschen des PostMe-Inhaltes durch Überfahren bzw. Wegfahren des Mauszeigers auf die Titelzeile. | ||
Zeile 29: | Zeile 48: | ||
* Wenn ''postmeStyle=HTML", erfolgt die Anzeige in einem neuen (kleinen) Browser-Fenster. | * Wenn ''postmeStyle=HTML", erfolgt die Anzeige in einem neuen (kleinen) Browser-Fenster. | ||
* Wenn ''postmeStyle=SVG", erfolgt die Anzeige in einer SVG-Viewbox. | * Wenn ''postmeStyle=SVG", erfolgt die Anzeige in einer SVG-Viewbox. | ||
==Aussehen der Widgets== | |||
Die oben genannten Widgets werden in ihrem Aussehen über Cascading Stylesheets gesteuert. Drei Klassen sind dafür relevant, sie sollten in die Datei '''style.css''' (oder, wenn man einen anderen Stylesheet-Präfix gesetzt hat, <präfix>style.css) eingetragen werden. Mit beispielhafter Farbe für die Widgets: | Die oben genannten Widgets werden in ihrem Aussehen über Cascading Stylesheets gesteuert. Drei Klassen sind dafür relevant, sie sollten in die Datei '''style.css''' (oder, wenn man einen anderen Stylesheet-Präfix gesetzt hat, <präfix>style.css) eingetragen werden. Mit beispielhafter Farbe für die Widgets: | ||
.postmeclass { background-color:#ffee80; padding:10px; border-color:black; border:groove} | .postmeclass { background-color:#ffee80; padding:10px; border-color:black; border:groove} | ||
.postmeclass2 { background-color:#ffee80; padding:10px;} | .postmeclass2 { background-color:#ffee80; padding:10px;} | ||
div.ui-widget-content {background-color: #ffee80; border-color:red;margin-top:-20px} | div.ui-widget-content {background-color: #ffee80; border-color:red;margin-top:-20px} |
Version vom 31. Oktober 2016, 20:02 Uhr
Achtung: Work in progress. Bitte vorläufig Finger weg !
PostMe | |
---|---|
Zweck / Funktion | |
Das Modul stellt eine komfortable Oberfläche bereit, um per Webinterface beliebige Listen ähnlich wie gelbe Klebezettel (Post-It™) zu verwalten. | |
Allgemein | |
Typ | Hilfsmodul |
Details | |
Dokumentation | EN / DE |
Support (Forum) | Unterstuetzende Dienste |
Modulname | 95_PostMe.pm |
Ersteller | Prof. Dr. Peter A. Henning |
Wichtig: sofern vorhanden, gilt im Zweifel immer die (englische) Beschreibung in der commandref! |
Allgemeines
Das Modul 95_PostMe.pm stellt eine komfortable Oberfläche bereit, um per Webinterface beliebige Listen ähnlich wie gelbe Klebezettel (Post-It™) zu verwalten.
Definition
Die folgende beispielhafte Definition setzt das PostMe-System mit dem Devicenamen PostIt in Betrieb:
define PostIt PostMe attr PostIt postmeStd Einkaufsliste,Baumarktliste Standard-Listen, die immer vorhanden sind (nicht löschbar) attr PostIt icon <embed src="/fhem/PostMe_widget?type=pins&postit=PostIt"/> siehe unten
attr PostIt postmeTTSDev GalaxyTab attr PostIt postmeMailFun DebianMail attr PostIt postmeMsgFun Telegram attr PostIt postme01MailRec <mail-Adresse Person 1> attr PostIt postme01MsgRec <messenger-Adresse Person 1> attr PostIt postme02MailRec <mail-Adresse Person 2> attr PostIt postme02MsgRec <messenger-Adresse Person 2>
attr PostIt postmeStyle HTML attr PostIt postmeClick 0 siehe unten attr PostIt postmeIcon images/default/pin_red_32.png
Einbinden in die FHEM-Anzeige
PostMes können in jede beliebige Webseite eingebunden werden. Beispielsweise kann auch das Standard-Attribut icon des diesem Postme-System zugeordneten Devices durch einen der folgenden Codes ersetzt werden.
- Mit dem HTML-Code
<embed src="/fhem/PostMe_widget?type=pins&postit=<devicename>"/>
wird eine interaktive Liste aller Titelzeilen der PostMes dieses Systems angezeigt.
- Mit dem Code
<embed src="/fhem/PostMe_widget?type=pin&postit=<devicename>&name=<name>"/>
wird ein einzelnes PostMe mit dem Namen <name> als Titelzeile angezeigt.
Art der Widgets
In diesen Darstellungen kann durch die Maus erreicht werden, dass zur einzeiligen Anzeige der Titelzeile der volle Inhalt des PostMes angezeigt wird.
- Wenn das Attribut postmeClick auf 0 gesetzt ist (Default-Wert), erfolgt die Anzeige und das Löschen des PostMe-Inhaltes durch Überfahren bzw. Wegfahren des Mauszeigers auf die Titelzeile.
- Wenn das Attribut postmeClick auf 1 gesetzt ist, muss die Titelzeile angeklickt werden, um den Inhalt zu sehen - und das entsprechens Fenster bzw. die Dialogbock explizit geschlossen werden.
Welcher Art die Anzeige des PostMe-Inhalte sist, wird durch ein anderes Attribut geregelt.
- Wenn postmeStyle=jQuery" (Default-Wert), erfolgt die Anzeige in einer jQuery-Dialogbox.
- Wenn postmeStyle=HTML", erfolgt die Anzeige in einem neuen (kleinen) Browser-Fenster.
- Wenn postmeStyle=SVG", erfolgt die Anzeige in einer SVG-Viewbox.
Aussehen der Widgets
Die oben genannten Widgets werden in ihrem Aussehen über Cascading Stylesheets gesteuert. Drei Klassen sind dafür relevant, sie sollten in die Datei style.css (oder, wenn man einen anderen Stylesheet-Präfix gesetzt hat, <präfix>style.css) eingetragen werden. Mit beispielhafter Farbe für die Widgets:
.postmeclass { background-color:#ffee80; padding:10px; border-color:black; border:groove} .postmeclass2 { background-color:#ffee80; padding:10px;} div.ui-widget-content {background-color: #ffee80; border-color:red;margin-top:-20px}