Schönen Nachmittag
ich habe in meiner Poolsteuerung einen dummy für meinen Poolroboter erstellt.
Ziel ist es, wenn dieser Schalter aktiviert wird und der Pool Master auch auf on ist durch ein DOIF den Roboter um 3 Uhr morgens einzuschalten und ihn dann
bis 7 Uhr laufen zu lassen.
Jetzt habe ich in meiner FTUI einen Schalter der auf den dummy verweist. Ich sehe aber nicht den eigentlichen Aktor der den Roboter schaltet?
Ist natürlich kein muss um diesen Aktor zu sehen wäre aber ein nice to have.
Ja ich könnte einen zusätzlichen Schalter in FTUI erstellen - aber ich glaube das wird zu unübersichtlich.
Wäre da Circle Menu zu verwenden oder habt ihr einen besseren Vorschlag
Danke und Gruß
Helmut
Zitat von: Helmi55 am 21 Februar 2016, 16:46:43
Schönen Nachmittag
ich habe in meiner Poolsteuerung einen dummy für meinen Poolroboter erstellt.
Ziel ist es, wenn dieser Schalter aktiviert wird und der Pool Master auch auf on ist durch ein DOIF den Roboter um 3 Uhr morgens einzuschalten und ihn dann
bis 7 Uhr laufen zu lassen.
Jetzt habe ich in meiner FTUI einen Schalter der auf den dummy verweist. Ich sehe aber nicht den eigentlichen Aktor der den Roboter schaltet?
Ist natürlich kein muss um diesen Aktor zu sehen wäre aber ein nice to have.
Ja ich könnte einen zusätzlichen Schalter in FTUI erstellen - aber ich glaube das wird zu unübersichtlich.
Wäre da Circle Menu zu verwenden oder habt ihr einen besseren Vorschlag
Danke und Gruß
Helmut
Moin.
Mit einem Symbol deinen Aktor auslesen und neben dem Schalter (vermutlich switch) für den Dummy darstellen.
Also in etwa so:
<div class="inline">
<div data-type="switch"
data-device="ROBO_DUMMY"
data-icon="ICON_DEINER_WAHL">
</div>
<div data-type="label"
class="">Automatisch<br />robottern
</div>
</div>
<div class="inline">
<div data-type="symbol"
data-device="ROBO-AKTOR"
..... <!-- data-get oder irgendwas, was noch wichtig ist um den Aktor auszulesen. -->
data-icon="fa-power"
data-on-color="green"
data-off-color="red">
</div>
<div data-type="label"
class="">Robo<br />Status
</div>
</div>
Eventuell das zweite "<div class="inline">" noch mit "left-narrow" etwas dichter ran schieben.
Grüße^^
Hallo
ok danke - das Zauberwort ist "inline" oder?
So habe ich es jetzt hin bekommen:
<li data-row="1" data-col="7" data-sizex="1" data-sizey="1">
<div class="inline">
<div data-type="switch"
data-device="Roboter"
data-set-on="off"
data-set-off="on"
data-get-on='["off","on"]'
data-icon="fa-power"
data-background-colors='["red","green"]'
class="small">
</div>
<div data-type="label"
class="">Automatisch<br />robottern
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Roboter_sw4"
data-set-on="off"
data-set-off="on"
data-get-on='["off","on"]'
data-icon="fa-power"
data-background-colors='["red","green"]'
class="small">
</div>
<div data-type="label"
class="">Robo<br />Status
</div>
</div>
</li>
Jetzt muss ich nur noch die Formatierung schaffen - hätte die anzeige gerne rechts unten und den Schalter so wie er ist links oben.
So wie von dir vorgeschlagen - mit Symbol - funktioniert es leider nicht, da wird kein Icon angezeigt.
Ich kann ja auch ein class readonly drauflegen oder? Damit der Schalter nur view ist und nicht schaltbar??
Danke
Gruß
Helmut
Zitat von: Helmi55 am 21 Februar 2016, 20:07:47
das Zauberwort ist "inline" oder?
inline bewirkt, dass die <div>'s nebeneinander angezeigt werden.
Zitat von: Helmi55 am 21 Februar 2016, 20:07:47
Jetzt muss ich nur noch die Formatierung schaffen - hätte die anzeige gerne rechts unten und den Schalter so wie er ist links oben.
Schau dir mal diesen Beitrag an und probier ein wenig rum: http://forum.fhem.de/index.php/topic,49576.msg412952.html#msg412952 (http://forum.fhem.de/index.php/topic,49576.msg412952.html#msg412952)
So kannst du die Elemente wie in einer HTML-Tabelle anordnen... Ich selber habe mich damit noch nicht beschäftigt.
Zitat von: Helmi55 am 21 Februar 2016, 20:07:47
So wie von dir vorgeschlagen - mit Symbol - funktioniert es leider nicht, da wird kein Icon angezeigt.
Ich wusste ja nicht wie dein Device genau aussieht.... Natürlich geht das auch mit Symbol!
Ich habe das bei mir mal mit Dummys getestet....
<li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
<header>ROBO</header>
<div class="left">
<div data-type="switch"
data-device="Roboter"
data-set-on="off"
data-set-off="on"
data-get-on="off"
data-get-off="on"
data-icon="fa-power-off"
data-on-background-color="green"
data-off-background-color="red"
class="small">
</div>
<div data-type="label"
class="">Automatisch<br />robottern
</div>
</div>
<div class="top-space-3 right right-space">
<div data-type="symbol"
data-device="Roboter_sw4"
data-get-on="off"
data-get-off="on"
data-icon="fa-power-off"
data-on-color="green"
data-off-color="red"
class="small">
</div>
<div data-type="label"
class="">Robo<br />Status
</div>
</div>
</li>
Wenn du "data-get-on" als Array verwendest ist das falsch. Wenn dann musst du "data-states" nehmen. Macht bei 2 "states" aber nicht groß Sinn.
Siehe: https://github.com/knowthelist/fhem-tablet-ui#symbol-widgets (https://github.com/knowthelist/fhem-tablet-ui#symbol-widgets)
Das gleiche gilt für Switch!
Zitat von: Helmi55 am 21 Februar 2016, 20:07:47
Ich kann ja auch ein class readonly drauflegen oder? Damit der Schalter nur view ist und nicht schaltbar??
Kannst du auch ja...
Grüße^^
P.S. Das mit den Icons war mein Fehler... Hatte den flaschen Namen verwendet^^
Hallo und Danke
Kannst du mir bitte noch verraten wie ich das Auto Roboter Icon (der Switch)
noch um 2oder 3 px nach rechts verschieben kann. Sonst klebt es so am linken Rand
Habe es mit text-indent:2px versucht - aber das funktioniert anscheinend nur für Texteinrückungen
Danke und nice eve
Helmut
<div class="left" style="padding-left:5px;">
<div data-type="switch"
data-device="Roboter"
data-set-on="off"
data-set-off="on"
data-get-on="off"
data-get-off="on"
..........USW............
Ich habe da nochmal schnell was gezaubert.... schau es dir an:
<li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
<header>ROBO</header>
<div class="row top-space">
<div class="col-1-4">
<div data-type="switch"
data-device="Roboter"
data-set-on="off"
data-set-off="on"
data-get-on="off"
data-get-off="on"
data-icon="fa-power-off"
data-on-background-color="green"
data-off-background-color="red"
class="small">
</div>
<div data-type="label"
class=""> Auto
</div>
</div>
<div class="col-2-4">
</div>
</div>
<div class="row">
<div class="col-2-4">
</div>
<div class="col-1-4">
<div data-type="symbol"
data-device="Roboter_sw4"
data-get-on="off"
data-get-off="on"
data-icon="fa-power-off"
data-on-color="green"
data-off-color="red"
class="small">
</div>
<div data-type="label"
class="">Status
</div>
</div>
</div>
</li>
Grüße^^
Danke - so ist es perfekt
Werde mich durch deine HTML Dateien durcharbeiten.....
Learning bei doing
Nice eve
Helmut
Zitat von: Helmi55 am 22 Februar 2016, 21:04:28
Danke
Learning bei doing
Bitte gern.
So habe ich auch mit HTML angefangen... de.selfhtml.org (http://de.selfhtml.org) ist auch immer einen Blick wert. Volle HTML und CSS Referenz.
Grüße^^