I-Frame-Inhalt in Abhängigkeit vom Device-State laden

[rasti]

Hallo,

ich habe in Tablet UI eine Seite, auf der in einem I-Frame die Seite meines Music-Players (Volumio) eingeblendet ist

Siehe Screenshot im Anhang. Hier der Tablet-UI-HTML-Code des Elements :

Code Auswählen Erweitern


<li data-row="2" data-col="3" data-sizex="6" data-sizey="4" class="semitransparent">

     <div class="wrapper">
    <div class="h_iframe">
        <img class="ratio" src="http://placehold.it/920x620/">
        <iframe src="http://192.168.178.7/playback" frameborder="0" ></iframe>
    </div>
</div>
</li>

Dieser I-Frame soll nun nur dann eingeblendet werden, wenn der Verstärkereingang auch
mit dem Musicplayer beschaltet ist. Wenn der Verstärker Radio abspielt, soll ein anderer
I-Frame kommen oder ein JPG-Bild. Der Verstärkereingang ist im FHEM-Device "Amplifier"
im Reading "Input" codiert und lautet beispielsweise für den Musicplayer  "CD" und für Radio "NET"

Also
Input steht auf "CD" => o.g. I-Frame zeigen
Input steht auf "NET" =>  anderer I-Frame oder ein JPG zeigen

Frage nun, wie muss der html bzw. js code lauten, um das zu bewerkstelligen ?

Viele Grüße

Ralf

[setstate]

man könnte dem Wrapper einem Classchanger hinzufügen

Code Auswählen Erweitern


<div class="wrapper"
     data-type="classchanger"
     data-device="dummy1"
     data-on-class="hide">


Wenn das Device dummy1 den Status on hat, wird der Wrapper ausgeblendet. Andere könnten so ähnlich gleichzeitig eingeblendet werden

[rasti]

Hallo setstate,

zunächst mal Danke für den Tipp !

Das Classchanger Widget war´in meiner angestaubten FHEM/Tablet UI Version aus 2016  leider noch nicht dabei 

Habe mir deshalb das widget_classchanger.js aus dem Repository zu den anderen Widgets  im /js/ Verzeichnis geladen und chmod gemacht, aber so einfach ging es nicht.  Also die Seite bleibt so wie gehabt unabhängig vom Status des Device dummy1 .

Habe dann in den Entwicklereinstellungen des Chromebrowsers das hier gefunden :

Code Auswählen Erweitern

Uncaught ReferenceError: widget_classchanger is not defined
    at eval (eval at <anonymous> (fhem-tablet-ui.min.js:1), <anonymous>:1:1)
    at Object.<anonymous> (fhem-tablet-ui.min.js:1)
    at j (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at x (jquery.min.js:4)
    at XMLHttpRequest.b (jquery.min.js:4)

Nun bitte nicht schimpfen dass ich fhem immer auf dem aktuellsten Stand halten muss....
Was muss ich denn noch ändern ?

Viele Grüße
Ralf