TabletUI: Bild A oder Bild B anzeigen, in Abhängigkeit eines Readings

[M.Piet]

Hallo Zusammen,

ich habe je nach Kalenderwoche ein anderes State von einem DOIF:

Code Auswählen Erweitern

DOIF_Kinder_KW:Ungerade-Woche
DOIF_Kinder_KW:Gerade-Woche

Jetzt möchte ich in TabletUI je nach State ein anderes Bild anzeigen:

Code Auswählen Erweitern

DOIF_Kinder_KW:Ungerade-Woche -> www.einetesturl.de/pics/ungeradewoche.jpg
DOIF_Kinder_KW:Gerade-Woche -> www.einetesturl.de/pics/geradewoche.jpg

Ich habe mir alle Widgets soweit angeschaut, aber ich finde für meine Anforderung nicht das richtige Widget. Jemand eine Idee wie ich das umsetzten könnte?

Hintergrund: Meine Kids haben im wöchentlichen Wechsel eine kleine tägliche Aufgabe zu erledigen. Ständig zoffen sie sich, wer in dieser Woche dran ist. Und ich vergesse es auch.... Dazu habe ich bereits (dank der Hilfe im Forum) einen DOIF eingerichtet, der mir ein entsprechenden State liefert.

[Ulm32b]

Siehe https://wiki.fhem.de/wiki/FTUI_Widget_Symbol
und dort data-hide.

[Loetkolben]

Hi,
ich habe so etwas für die Anzeige eines Stundenplans (Woche A und Woche B) gemacht.
Der Stundenplan ist als PNG gespeichert, für die gerade und ungerade Woche liegt also jeweils eine Datei auf meinem Web-Server.
Ein DOIF setzt (Sonntag-Abend um 20:00Uhr) die URL des entsprechenden PNG, das dann über TabletUI angezeigt wird.

Code Auswählen Erweitern


define di_Stundenplan_URL DOIF ( [20:00|So] and (POSIX::strftime("%V", gmtime time) &1) == 1)
(set Stundenplan_URL http://<SERVER>/stundenplan/Stundenplan_A.png)
DOELSE
(set Stundenplan_URL http://<SERVER>/stundenplan/Stundenplan_B.png)


Code Auswählen Erweitern


define Stundenplan_URL dummy


Code Auswählen Erweitern


<li data-row="4" data-col="4" data-sizex="5" data-sizey="2">
  <header><div data-type="label" class="large">Stundenplan</div></header>
    <div data-type="image"
        data-device="Stundenplan_URL"
        data-size="65%"
        data-get="STATE">
    </div>
</li>


Ist nicht alls auf meinem Mist gewachsen!


   Andreas

[M.Piet]

@Ulm32b
Danke für deinen Vorschlag. Aber das wird nicht gehen. Ich kann nur Icons in Abhängigkeit des Readings anzeigen lassen, keine Bilder.

@Loetkolben
Ja, das hört sich rund an. Das werde ich so umsetzten. Ich danke dir.

[dt2510]

Ich hab' sowas ähnliches mit dem Hintergrundbild gemacht (zeigt ein Bild entsprechend dem aktuellen Wetter an), vielleicht kannst du das anpassen ....

widget_weatherbackground.js

Code Auswählen Erweitern

var Modul_weatherbackground = function () {

    function init() {

        me.elements = $('div[data-type="' + me.widgetname + '"]', me.area);
        me.elements.each(function (index) {
            var elem = $(this); 
            elem.initData('get', 'STATE');
            me.addReading(elem, 'get');
        });
    }

    function update(device, reading) {     

        me.elements.filterDeviceReading('get', device, reading)
        .each(function (index) {
           var elem = $(this);
           var value = elem.getReading('get').val;
           if (value) {
               document.body.style.backgroundImage = "url(weatherimages/" + value + ".jpg)";
           }
        });
}

    var me = $.extend(new Modul_widget(), {
        widgetname: 'weatherbackground',
        init: init,
        update: update,
    });

    return me;
};

Aufruf in TabletUI

Code Auswählen Erweitern

<div data-type="weatherbackground" data-device="Wetter" data-get="code"></div>

In meinem Fall ist "code" im data-get "0" bis "47" und die zugehörigen Dateien müssen im Verzeichnis "weatherimages" liegen und heißen entsprechend 1.jpg bis 47.jpg

[drhirn]

Code Auswählen Erweitern


define di_Stundenplan_URL DOIF ( [20:00|So] and (POSIX::strftime("%V", gmtime time) &1) == 1)
(set Stundenplan_URL http://<SERVER>/stundenplan/Stundenplan_A.png)
DOELSE
(set Stundenplan_URL http://<SERVER>/stundenplan/Stundenplan_B.png)


Code Auswählen Erweitern


define Stundenplan_URL dummy


Wenn du cmdState verwendest, brauchst du nicht mal mehr den Dummy.

[M.Piet]

@drhirn
Genau. So habe ich es gemacht. Und auf den dummy kann ich auch verzichten.

Code Auswählen Erweitern

define DOIF_Kinder_KW DOIF ([00:01] and $week % 2)
attr DOIF_Kinder_KW cmdState http://www.www.meine_domain.net/files_fhem/hannah.jpg|http://www.meine_domain.net/files_fhem/lara.jpg


TabletUI

Code Auswählen Erweitern

    <div data-type="image"
        data-device="DOIF_Kinder_KW"
        data-size="85%"
        data-get="STATE">
    </div>

[Loetkolben]

... das sieht ja wesentlich schlanker aus, probiere ich auch mal.

Danke.

[M.Piet]

Ist nicht von mir. Habe ich hier aus dem Forum.

[Ulm32b]

@Ulm32b
Danke für deinen Vorschlag. Aber das wird nicht gehen. Ich kann nur Icons in Abhängigkeit des Readings anzeigen lassen, keine Bilder.

Wirklich? data-hide geht doch auch bei image.

[M.Piet]

Wirklich? data-hide geht doch auch bei image.

OK, das weiß ich jetzt nicht. Ich hatte es auf deinen Vorschlag "FTUI Widget Symbol" bezogen, und dort kann ich nur Symbole, aber keine Bilder erscheinen lassen.