Hallo,
ich würde gerne Elemente dauerhaft verstecken und nur anzeigen lassen, wenn ein Reading bestimmte Zustände annimmt.
Das wäre z.B. nützlich bei einem Geburtstagskalender, wo ein Symbol nur eingeblendet werden soll, wenn days_left=0 oder 1 ist. Bei jedem anderen Wert, soll es ausgeblendet bleiben.
Auch bei Homematic Rauchmeldern wäre dieses Verhalten super. Dort wird ein Alarm mit dem Reading Level angezeigt, welches in dem Fall 200 (=Alarm) oder 199 (=Alarm stumm) ist.
Leider schaffe ich das so nicht. Wenn ich mit dem üblichen "data-hide" in Kombination mit "data-hide-on" arbeite, muss ich definieren, wann das Element NICHT angezeigt werden soll und ich kann nicht vorgeben, wann es angezeigt wird. Ich hatte gehofft, dass ich data-hide-on einfach weglassen kann und einfach mit data-hide-off="(199|200)" am Beispel der Rauchmelder das Symbol bei Alarm anzeigen lasse. Dies klappt aber leider nicht.
Daher bin ich auf die Idee gekommen mit Classchanger zu abeiten:
<div data-type="classchanger" data-device="rauchmelder" data-get="STATE" data-get-on="(199|200)" data-off-class="hide" data-on-class="" class="center-align" style="width:105px;">
<div data-type="symbol"
data-device="testdummy"
data-get="state"
data-states='["199","200"]'
data-colors='["white","#ff0000"]'
class="large">
</div>
</div>
Das klappt vom Prinzip her, aber wenn die Seite neu geladen wird, wird das Element zunächst immer angezeigt. Erst wenn sich das Reading nochmal aktualisiert, wird das Element wie gewünscht bei Werten, die anders als 199 oder 200 sind, ausgeblendet.
Ist das so gewünscht, dass Classchanger erst dann arbeitet, wenn nach dem Laden der Seite ein Reading nochmal aktualisiert wird?
Hat jemand vielleicht noch eine andere Idee, wie ich meinh Vorhaben umsetzen könnte? Ich habe leider keinen weiteren Ansatz mehr...
Hi,
das hier müsste eigentlich funktionieren:
<div data-type="symbol"
data-device="testdummy"
data-get="state"
data-hide="state"
data-hide-on="199|200"
data-hide-off="(?!199|200).{3}"
class="large">
</div>
Wenn state 199 oder 200 ist, wird das Symbol ausgeblendet, bei allen anderen Werten ist es sichtbar.
Ich glaube, Du willst das anders herum. Dann musst Du einfach hide-on und hide-off tauschen.
Auch hier kann es sein, dass das Symbol ganz kurz nach dem Laden der Seite sichtbar ist. In meinen Augen ist das aber eine Frage der Sichtweise, ob das nun gut oder schlecht ist.
Hallo Standarduser,
ich möchte gerne die umgekehrte Variante. Ein data-hide-on="(?!199|200).{3}" würde leider nicht funktionieren, da der Rauchmelder standardmäßig ohne Alarm einen Level 0 anzeigt, was im Regex nicht berücksichtigt wird. Sicherlich könnte man einen komplizierteren Regex verwenden, aber schön fände ich es wenn man allgemein nur die Zustände angeben könnte, wann angezeigt wird und nicht wann ausgeblendet werden soll.
ZitatAuch hier kann es sein, dass das Symbol ganz kurz nach dem Laden der Seite sichtbar ist. In meinen Augen ist das aber eine Frage der Sichtweise, ob das nun gut oder schlecht ist.
Bei meinem Versuch das Problem mit Classchanger zu lösen war es nicht so, dass das Symbol nur kurz angezeigt wurde. Das würde mich nicht stören. Classchanger wirkte so, dass das Symbol nach einem Reload der Seite permanent angezeigt wurde und erst wenn ein erneuter Statuswechsel des data-device eintrag, wurde die CSS Klasse entsprechend angewendet - auch wenn der Status beim Reload schon den Wert hatte, bei dem eigentlich ausgeblendet werden soll.
Ich hätte dann noch diese Lösung für Dich:
<div data-type="symbol"
data-device="testdummy"
data-get="state"
data-hide="state"
data-hide-off="199|200"
data-hide-on="^([0-9]|[1-9][0-9]|[1-9][0-9][0-8])$"
class="large">
</div>
So kompliziert ist es garnicht, aber ich verstehe, was du meinst. Eine ganz allgemeine Lösung ist (glaube ich) nur in die andere Richtung implementiert. Du kannst also mit data-hide-on einen Zustand definieren, bei dem das Widget ausgeblendet wird und mit data-hide-off="!on" sagen, dass es in jedem anderen Fall sichtbar sein soll.
Vielleicht kann setstate ja da noch einen Tipp geben.
Ich baue deinen Regex so ein, das ist eine gute Lösung für die Rauchmelder!
Allgemein habe ich aktuell noch nicht verstanden, warum es data-hide-on und data-hide-off in Kombination gibt. Wenn ich ein Element verstecken möchte, definiere ich eine Bedingung wann das passieren soll. Ist die Bedingung wahr wird versteckt, ist sie nicht wahr, wird angezeigt. Was nutzt dann die zusätzliche Definition von data-hide-off? Ich kann sie weglassen und alles funktioniert wie erwartet. Habe ich bei dem Mechanismus noch irgendwas nicht verstanden?
Wäre es nicht eine praktische Funktionserweiterung, wenn man den Mechanismus so verändern würde, dass entweder data-hide-on ODER device data-hide-off definiert wird? data-hide-off würde dann bewirken, dass IMMER versteckt wird, außer wenn die definierte Bedingung wahr ist.
So ist es auch: wenn data-hide-off nicht angegeben ist, wird es automatisch auf data-hide-off="!on" gesetzt, also alles ausser der Wert unter data-hide-on
Mein Vorschlag bezog sich eher auf den anderen Fall:
data-hide-on ist nicht gesetzt und mit data-hide-off wird bestimmt wann angezeigt wird.
Das scheint momentan so nicht vorgesehen zu sein.
Ich habe das gerade mal ausprobiert:
<div data-type="symbol"
data-device="testdummy"
data-get="state"
data-hide="state"
data-hide-off="199|200"
data-hide-on="!off"
class="large">
</div>
Funktioniert bestens.
Ich hatte die ganze Zeit einen Denkfehler! Standarduser, durch Dein letztes Beispiel habe ich das Prinzip verstanden!!
Damit klappt alles wie gewünscht.
Danke!
Mir war auch nicht bewusst, dass das wirklich funktioniert. Hatte das auch noch die getestet.