warn-icon

[setstate]

es gab ein Update bei famultibutton-ähnlichen Widgets (Symbol, Switch, Push usw.)

neu:

data-warn-icon

Damit kann man andere Symbole rechts oben anzeigen als nur die roten Kreise.

Beispiel: ein Schloss-Symbol, wenn die Tür abgeschlossen ist. Das Symbol zeigt primär, ob die Tür offen oder zu ist.

Code Auswählen Erweitern

<div data-type="symbol" class="big height-narrow"
data-device="Eingangstuer" data-icon="ftui-door" 
data-warn="EingangstuerRiegel:state"
data-warn-on="closed" 
data-warn-off="open"
data-warn-icon="fa-lock large fa-fw"
data-warn-color="#d44"
data-warn-background-color="transparent"></div>



btw.: ich benutze bei mir schon Fontawesome-5 Icons => siehe Switch oben mit dem neuen Lampen-Symbol.
Die Änderung ist optisch etwas gewöhnungsbedürftig 

https://fontawesome.com/icons?d=gallery&m=free

Die Namen bleiben abwärts-kompatibel, aber sehen dann vielleicht etwas anders aus.
Update werde ich demnächst vorbereiten.

[tomster]

Großartig! Auf DAS warte ich schon lange.
Wenn es die Funktion auch noch in das Weather Widget schafft, dann glaub ich wär ich am Ziel...

Vielen, vielen Dank aber schon Mal, setstate!

[Waldmensch]

Ich muss mal den Fred hochholen

Ich möchte das Das Warn Icon nutzen, um den Status meines Photovoltaik Speichers anzuzeigen (siehe Screenshot). Das Warnsymbol soll über ein on/off reading (Wechselrichter1:Bat_DrainState) eingeblendet werden. Der Blitz soll grün bei Ladung sein und rot bei Entladung. Ich habe ein Reading (Wechselrichter1:Bat_Drain), was mir den jeweiligen Farb Hexcode zur Verfügung stellt. Scheinbar akzeptiert das Attribut data-warn-color kein Reading. Trage ich dort einen festen Hexwert ein, wird er dargestellt. Mit einem Reading bleibt der Blitz weiß. Liegts an mir?

Code Auswählen Erweitern

<div data-type ="symbol"
data-device ="Wechselrichter1"
data-limits ='[1,25,50,75,99]'
data-colors ='["#FF0000","#FFC300","#3FFF33","#3FFF33","#3FFF33"]'
data-get="Bat_SoC"
data-icons='["fa-battery-empty blink","fa-battery-quarter", "fa-battery-half", "fa-battery-three-quarters", "fa-battery-full"]'
data-warn-background-color="transparent"
data-warn="Wechselrichter1:Bat_DrainState"
data-warn-color="Wechselrichter1:Bat_Drain"
data-warn-on="on" 
data-warn-off="off"
data-warn-icon ="fa-bolt"
class="big right-space top-space-2x">
</div>

[somansch]

Hallo @setstate,

ich nutze "data-warn-icon" nun schon umfangreich. Ist das eigentlich schon irgendwo dokumentiert?!

Ich hätte einen Feature-Requests dazu:

• auch für data-type "Label": Dies ist hilfreich, wenn man den Ausfall des Temperatursensors direkt bei der Anzeige der Temperatur visualisieren möchte

Danke und Gruß
Andreas

[Ulm32b]

... ich nutze "data-warn-icon" nun schon umfangreich.
Ich hätte einen Feature-Requests dazu:

• auch für data-type "Label": Dies ist hilfreich, wenn man den Ausfall des Temperatursensors direkt bei der Anzeige der Temperatur visualisieren möchte

Diese Anforderung lässt sich doch auch mit Bordmitteln lösen: Mittels data-hide bei Vorliegen eines Fehlers (geeignetes Reading auslesen) das Label aus- und ein selbst bestimmtes Symbol einblenden, ggf. ergänzt um einen ebenfalls eingeblendeten Warntext.

[somansch]

Diese Anforderung lässt sich doch auch mit Bordmitteln lösen: Mittels data-hide bei Vorliegen eines Fehlers (geeignetes Reading auslesen) das Label aus- und ein selbst bestimmtes Symbol einblenden, ggf. ergänzt um einen ebenfalls eingeblendeten Warntext.

Ich denke nicht, das folgende Anforderung im Moment realisierbar ist:

- die Temperatur wird als Label angezeigt
- wenn das Device-Reading "active" nicht "ok" ist, soll ein rotes Ausrufezeichen rechts oben zusätzlich auf der Temperatur angezeigt werden

Falls du eine Lösung hast, gerne posten 

Danke vorab
Andreas

[yersinia]

Ich vermute worauf Ulm32b hinaus will ist, dass es durchaus mit CSS gehen könnte. Theoretisch kann ich mir sowas vorstellen:
- die Temperatur wird als Label angezeigt: eigenes widget_label wie gehabt
- wenn das Device-Reading "active" nicht "ok" ist, soll ein rotes Ausrufezeichen rechts oben zusätzlich auf der Temperatur angezeigt werden: zusätzliches widget_symbol mit data-hide* auf den nicht gewünschten Wert inkl Farbe. Allerdings müsste man diesen div container dann via eigener CSS Klasse oder inline CSS (style="") positionieren. Das könnte aber in Frickelei ausarten....

[setstate]

Ich hatte dazu schon etwas probiert. Ich schaue mal nach...

[Ulm32b]

Ich vermute worauf Ulm32b hinaus will ist, dass es durchaus mit CSS gehen könnte. Theoretisch kann ich mir sowas vorstellen:
- die Temperatur wird als Label angezeigt: eigenes widget_label wie gehabt
- wenn das Device-Reading "active" nicht "ok" ist, soll ein rotes Ausrufezeichen rechts oben zusätzlich auf der Temperatur angezeigt werden: zusätzliches widget_symbol mit data-hide* auf den nicht gewünschten Wert inkl Farbe. Allerdings müsste man diesen div container dann via eigener CSS Klasse oder inline CSS (style="") positionieren. Das könnte aber in Frickelei ausarten....

Stimmt, vor allem der Hinweis auf die "Frickelei".

Eigentlich habe ich aber den Begriff "Anforderung" etwas allgemeiner ausgelegt.

Ich denke nicht, das folgende Anforderung im Moment realisierbar ist:
- die Temperatur wird als Label angezeigt
- wenn das Device-Reading "active" nicht "ok" ist, soll ein rotes Ausrufezeichen rechts oben zusätzlich auf der Temperatur angezeigt werden

Verstehe ich das richtig, dass eine Temperatur angezeigt werden soll, von der man weiß, dass sie falsch ist?   
Mein Vorschlag lautet, sich bei ausgefallenem Sensor auf den Hinweis zu beschränken, dass aktuell keine Temperatur verfügbar ist. Dies könnte durch ein Warn-Icon und vielleicht den Text "Temp n/a" o.ä. erfolgen. Und das geht mit den aktuell verfügbaren Widgets via data-hide. Aber jeder wie er mag.

[setstate]

Code Auswählen Erweitern


<li data-row="1" data-col="6" data-sizex="3" data-sizey="2">
    <header>Badge</header>
    <div class="hbox">
        <div class="white">Room1</div>
        <div class="badge" data-type="html" data-content="family:residentsTotalPresent" data-class="family:residentsTotalPresent" data-map-class='{"0":"hide", ".*":"show"}'>0</div>
    </div>
</li>

<li data-row="10" data-col="6" data-sizex="2" data-sizey="3">
  <header>Badge</header>
  <div class="hbox">
    <div class="tall thin" data-type="label" data-device="KellerClimateSensor" data-get="temperature"  data-unit="°C"></div>
    <div class="badge big" data-type="html" data-class="KellerClimateSensor:error" data-map-class='{"0":"hide", ".*":"show"}'>!</div>
  </div>
</li>


Oder anstatt hbox geht auch inline

Code Auswählen Erweitern


<li data-row="14" data-col="6" data-sizex="2" data-sizey="3">
  <header>Badge</header>
  <div>
    <div class="tall thin inline" data-type="label" data-device="KellerClimateSensor" data-get="temperature"  data-unit="°C"></div>
    <div class="badge big inline" data-type="html" data-class="KellerClimateSensor:error" data-map-class='{"0":"hide", ".*":"show"}'>!</div>
  </div>
</li>


eine kleine Änderung bei der CSS class .badge war nötig (im aktuellen Update zu finden)

[somansch]

Funktioniert bei mir. Habe noch die Background-Farbe angepasst. Ist zwar nicht das gleiche "!", kann ich aber mit Leben 

Danke dir
Andreas

[setstate]

ja, background color einfach per class anpassen. Gegebene nutzen oder per user-css. Am besten, nicht zu viele unterschiedliche Farben. Weniger ist mehr!

Code Auswählen Erweitern

div class="badge big bg-orange"

[Waldmensch]

@setstate, kannst Du nochmal schauen, warum sich data-warn-color nicht von einem Reading setzen lässt, sondern nur mit Hexwert hardcoded funktioniert? (s. letzen Beitrag von mir weiter oben)

[setstate]

data-warn-color ist nicht als Reading-Abfrage gebaut. Nur statisch festlegbar.

Aber mit dem u.g. extern-badge kannmal das realisieren

Code Auswählen Erweitern



  <div class="hbox">
    <div class="bigger thin" data-type="label" data-device="KellerClimateSensor" data-get="temperature"  data-unit="°C"></div>
    <div class="badge" data-type="html"
         data-class="KellerClimateSensor:error"
         data-map-class='{"0":"hide", "1":"show bg-green", "2":"show bg-red"}'
         data-content="KellerClimateSensor:error" >
    </div>
  </div>