Javascript | Button Hintergrundfarbe nach Wert

[MCU]

@tg70 Die hast du auf Deinem System.

[TG70]

ja die vis-views.json
Du meinst jetzt in Verbindung mit dem VIS-Hintergrund zentral editieren/anpassen?

Also ich habe meine Buttons so aufgebaut, dass keine direkten Farben eingetragen sind, sondern nur Bindings, d.h. ich ändere einen Farbwert und alle Widgets werden angepasst.
Und über meine Setup View kann das direkt angepasst werden. Die ist aber erst im Aufbau.
D.h. die Button Hintegrund Farbe #171717 wird hier eingetragen und man sieht das Ergebnis oben auch gleich wie es aussehen wird:

[MCU]

@tg70 Ja genau. Aber erst kopieren als Sicherung.
Dort kannst du dann nach background-color suchen und ersetzen:

Aber nicht alle backgroundcolor ersetzen nur die von den views.

[TG70]

@mcu ... ja sehr geschickte Variante... ich hätte das gerne über eine VIS ändern wollen, so wie eben meine Widgets etc. auch... ist sowas möglich?

[MCU]

@tg70 Verstehe ich nicht das ist doch die VIS und dort passt du dann Deine Farbe #171717 in ein Binding an.
Funktioniert anscheinend nicht.!!!

[TG70]

@mcu .. genau ich schreibe einfach im dem Beispiel mit "Button" die Farbe #171717 in den Datensatz, wo alle Widgets Hintergründe mit Bindings angebunden sind.

So in der Art möchte ich das eben mit den VIEW Hintergründen machen, ggf. auch mit Hintegrundbildern

[MCU]

@tg70 Bei den allgemeinen Hintergründe funktioniert ein Binding anscheinend nicht:

[TG70]

@mcu ... genau, das habe ich auch probiert. Wie wäre sowas dann möglich?

[MCU]

@tg70 Ich hatte es gehofft. Muss noch daran arbeiten.

[TG70]

@mcu Soll ich da mal einen neuen Thread aufmachen?

[MCU]

@tg70 Du willst doch nur zwischen zwei Farben hin und herschalten? Maximale Anzahl der Farben?

[TG70]

@mcu du meinst jetzt die Hintergründe oder was meinst du?

[MCU]

@tg70 Ja
Kannst auch mal hier schauen:
https://forum.iobroker.net/topic/765/css-hintergrund-für-view

Wenn man nur in CSS folgenden Eintrag macht, sind alle View mit Hintergrund green:

[TG70]

schau ich mir gleich an ... bin gespannt....

DU schau mal, die Farbe "red" funktioniert bei mir nicht

{v:coronavirus-statistics.0.Germany.Stadt.Nürnberg.cases7_per_100k; (v<50)? "green": (v<100)? "yellow": (v>100)? "red": "grey"}

Spoiler

[{"tpl":"tplValueFloat","data":{"oid":"coronavirus-statistics.0.Germany.Stadt.Nürnberg.cases7_per_100k","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","is_comma":false,"factor":"1","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"digits":"1"},"style":{"left":"142px","top":"583px","background":"{v:coronavirus-statistics.0.Germany.Stadt.Nürnberg.cases7_per_100k; (v<50)? "green": (v<100)? "yellow": (v>100)? "red": "grey"}","width":"54px","height":"16px","border-width":"1px","border-style":"solid","border-radius":"4px","border-color":"grey","color":"black","text-align":"center","font-size":"16px","font-weight":"bolder","font-variant":"normal","background-color":""},"widgetSet":"basic"}]

[MCU]

@tg70

{v:coronavirus-statistics.0.Germany.todayDeaths;(v<0)? "green": (v<35)? "yellow": (v>50)? "red": "grey"}

Bei mir schon:

[TG70]

Hast du mein Widget probiert... bei mir gehts leider nicht
Das als Beispiel > 100 (128)

{v:coronavirus-statistics.0.Germany.Kreis.Nürnberger_Land.cases7_per_100k;(v<50)? "green": (v<100)? "yellow": (v>100)? "red": "grey"}

[MCU]

@tg70 Kann ich nicht:

[TG70]

@mcu .. das ist aber seltsam

Farbe Rot

Spoiler

[{"tpl":"tplValueFloat","data":{"oid":"coronavirus-statistics.0.Germany.Stadt.Nürnberg.cases7_per_100k","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","is_comma":false,"factor":"1","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"digits":"1"},"style":{"left":"142px","top":"602px","background":"{v:coronavirus-statistics.0.Germany.Kreis.Nürnberger_Land.cases7_per_100k;(v<50)? "green": (v<100)? "yellow": (v>100)? "red": "grey"}","width":"54px","height":"15px","border-width":"1px","border-style":"solid","border-radius":"4px","border-color":"grey","color":"black","text-align":"center","font-size":"16px","font-weight":"bolder","font-variant":"normal","background-color":""},"widgetSet":"basic"}]

Farbe Gelb

Spoiler

[{"tpl":"tplValueFloat","data":{"oid":"coronavirus-statistics.0.Germany.Kreis.Nürnberger_Land.cases7_per_100k","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","is_comma":false,"factor":"1","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"digits":"1"},"style":{"left":"205px","top":"602px","background":"{v:coronavirus-statistics.0.Germany.Kreis.Nürnberger_Land.cases7_per_100k; (v<50)? "green": (v<100)? "yellow": (v>100)? "red": "grey"}","width":"54px","height":"15px","border-width":"1px","border-style":"solid","border-radius":"4px","border-color":"grey","color":"black","text-align":"center","font-size":"16px","font-weight":"bolder","font-variant":"normal"},"widgetSet":"basic"}]

[MCU]

@tg70 Kann ich beide nicht importieren?
Bei Dir wird nicht korrekt exportiert:

Es sind keine

"\"

vor den ", deswegen kommt der Import damit nicht klar.
Achso, du musst die Code-Tags nehmen!
</> im Spoiler

-> Erst Spoiler klicken, danach direkt Code-Tags (</>) und dann mit STRG+V, den Code einfügen.

[TG70]

@mcu ich hab das über den Export Button gemacht. Ist das nicht richtig?