data-hide für <li>

Begonnen von tomster, 05 Februar 2017, 00:24:22

Vorheriges Thema - Nächstes Thema

tomster

Servus zusammen!

Mir ist gerade beim Aufbau einer neuen FHEM/FTUI-Instanz die Idee gekommen, dass es vielleicht gar nicht schlecht wäre, wenn man <li> Sections über einen devicestate ein-/ ausblenden könnte.
Eine Anwendung ist bei mir ein rotor-Widget, welches Wetterdaten von mehreren Orten anzeigt. Ein anderes zeigt unterschiedliche Kalender. Nun wäre es nicht schlecht, wenn man die Anzeige der jeweiligen <li>-Elemente in Abhängigkeit z.B. der Jahreszeit (Sommer: Wetter am See, Winter: Skiwetter) oder des jeweilig vor dem FTUI stehenden Nutzers (möchte den RasPi mittels Kamera zur Gesichtserkennung nötigen) anzeigen lassen könnte. Was haltet ihr von dieser Idee?

setstate

Das geht mit dem universellen data-type="html"


<li data-row="1" data-col="3" data-sizex="1" data-sizey="1" data-type="html" data-class="dummy1:STATE" data-map-class='{"1":"show", ".*":"hide"}'>


Class wird gesteuert von Reading dummy1:STATE
Welche Klasse bei welchem Wert, wird mit dem data-map-class festgelegt

Leider gibt es noch eine Unzulänglichkeit in der Standard-CSS, die geändert werden muss

vorher

div.hide {
    display: none;
}


nachher

.hide {
    display: none;
}

tomster

#2
Danke, setstate.

Das funzt allerdings nur bei den "Toplevel"-<li>s, also durch die man die Gridster-Cards definiert.
Ein <li> innerhalb z.B. eines Rotor-Widgets lässt sich nicht damit schalten. Das wär aber genau was ich bräuchte...
Dieser Effekt lässt sich beim Ausblenden von gesamten TL-<li>s leider nicht erreichen.
LG,
Tom

MatthiasL

Ich habe heute ein Update von FHEM gemacht und seitdem funktioniert das ausblenden abhängig der data-map-class nicht mehr.
Hat wer eine Idee, woran es liegt?


<li data-row="2" data-col="1" data-sizex="2" data-sizey="1" data-type="html" data-class="avr:createcover" data-map-class='{"onplayingNET":"show",".*":"hide"}'>
                    <header>Titel - Künstler</header>
                    <div data-type="label"
                    data-device="Spotify"
                    data-get="track_name"
                    class="bigger">
                    </div>
</li>

minias

Habe heute auch ein Update gemacht und habe das selbe Problem.

<li data-class="g_pioneer_z1:power" data-map-class='{"on":"show", "off":"hide"}'  data-col="7" data-row="2" data-sizex="2" data-sizey="2" data-type="html">
<header>VOLUME WOHNZIMMER</header>
<div class="cell">
<div class="bigger top-space fullsize" data-device="g_pioneer_z1" data-get="volume" data-max="80" data-min="20" data-set="volume" data-type="volume"></div>
</div>
</li>