Wie Label- und Symbol-Widget kombinieren / stapeln? [Zahl im Kreis]

[travelling-man]

Guten Abend,

Das Problem dass sich der Wert im Label nur bei einem reloead der Seite aktualisiert habe ich auch.

Kann das Verhalten irgendwie umgangen werden?

Gruß Basti

[setstate]

Das ist tatsächlich ein Bug. Musste auch ganz schön suchen. Problem war: das eingebettete Widget muss initialisiert werden. Warum das vorher ging, und was sich geändert hat, ist mir bis jetzt noch ein Rätsel.
Update kommt später, ich teste die Lösung erst noch auf Nebenwirkungen.

[travelling-man]

Guten Abend,

Vielen Dank für die schnelle Antwort.

Falls ich was testen soll etc. stehe ich gerne zur Verfügung.

Grüße Basti

Update:

Nach einem Update von FTUI werden die Zahlen jetzt aktualisiert.

Danke für das schnelle Anpassen.

[Klingelbastler]

Hallo,

habe ebenfalls das Problem, dass ein in einem Push-Widget eingebettetes Label nicht aktualisiert wird - auch nach soeben durchgeführtem Update von FTUI und FHEM. Komisch dass es bei Basti funktioniert!?

Code Auswählen Erweitern

<div data-type="push" data-off-background-color="#aa55ff" data-on-background-color="ffccff" data-icon="" class="">
<div data-type="label" data-device="Bulb1" data-get="pct" data-color="white" data-unit="%" class="mini"></div>
</div>


Mache ich was falsch, wie ist das mit dem Initialisieren des eingebetteten Widgets gemeint?

Danke, Klingelbastler

[travelling-man]

Moin,

ich habe ein CircleMenü, was wie folgt aufgebaut ist:

Code Auswählen Erweitern

 
<div data-type="circlemenu">
  <ul>
    <li><div data-type="push" data-icon="">
      <div data-type="label" data-device="BOSE_A81B6A15B761" data-get="channel"></div>
    </div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 1" data-icon="">1</div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 2" data-icon="">2</div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 3" data-icon="">3</div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 4" data-icon="">4</div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 5" data-icon="">5</div></li>
    <li><div data-type="push" data-device="BOSE_A81B6A15B761" data-set-on="channel 6" data-icon="">6</div></li>
  </ul>
</div>


wenn ich folgenden Code hinzufüge und das CircleMenü betätige aktualisiert sich das Label aus dem hinzugefügten Code und das Label im CircleMenü.

Code Auswählen Erweitern


<div data-type="push" data-icon="">
  <div data-type="label" data-device="BOSE_A81B6A15B761" data-get="channel" data-color="white"></div>
</div>



VG
Basti

[Klingelbastler]

Danke Basti für die Antwort.

Leider hakt es immer noch bei mir, nutze ebenfalls ein Circle Menu.
Du musst den zweiten Code-Ausschnitt dem ersten noch hinzufügen? Wo genau fügst Du das ein?

Denn eigentlich ist ja auch in Deinem ersten Codeschnippsel schon genau dieser Abschnitt eingebettet, bis auf das fehlende data-color="white".

Danke, Klingelbastler

[Klingelbastler]

Kriege es leider nicht hin. So sieht mein Circle Menu aus - eigentlich ziemlich ähnlich wie bei Dir:

Code Auswählen Erweitern


<div data-type="circlemenu" data-circle-radius="45" class="inline top-space">
  <ul>
    <li>
      <div data-type="push" data-off-background-color="#aa55ff" data-on-background-color="ffccff" data-icon="">
        <div data-type="label" data-device="Bulb1" data-get="pct" data-color="white" data-unit="%" class="mini"></div>
      </div>
    </li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 1" data-icon="">1</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 20" data-icon="">20</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 40" data-icon="">40</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 60" data-icon="">60</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 80" data-icon="">80</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 100" data-icon="">100</div></li>
  </ul>
</div>


Wenn ich einen Menüeintrag anklicke wird das korrekte set Kommando ausgeführt, aber der Wert im Label wird nicht aktualisiert. Erst nach einem kompletten Page Reload.

Wo muss ich den zusätzlichen Code einfügen? Wäre um Hilfe dankbar.

Gruß Klingelbastler

[setstate]

kommt denn die Toast-Message "Full refresh done in ..." ?

Im Header muss dafür <meta name='debug' content='1'> stehen.

Wenn die Nachricht nicht kommt, stimmt etwas nicht mit der HTML-Syntax oder den angegebenen Parametern.
Da hilft die Seite Stück für Stück aufbauen und immer drauf achten, ob die Message kommt.

[Klingelbastler]

Ich habe die Seite jetzt komplett runtergestript nur noch auf das Circlemenu, und habe dabei die Vorlage von Basti verwendet (und auch meine eigene versucht).
Es wird die gewünschte Aktion ausgeführt, aber das Label nicht aktualisiert.

Wenn ich im Browser per Taste F5 einen Reload erzwinge, kommt folgende Meldung:
Full refresh done in 0.0s for 4 parameters

Wenn ich mit dem Circlemenu einen Wert ändere, kommt diese Meldung nicht - sollte sie?

Fehler im HTML Code kann ich nicht erkennen, jedes Beginn-Tag hat ein Ende-Tag.
Hier die komplette Seite:

Code Auswählen Erweitern

<!DOCTYPE html>
<html>

<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="js/fhem-tablet-ui.js" defer></script>


    <!-- Remove this line to enable for usage with WebViewControl
    <script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
    <script src="../pgm2/cordova-2.3.0.js" defer></script>
    <script src="../pgm2/webviewcontrol.js" defer></script>
    <!-- End for WebViewControl -->

    <title>FHEM-Tablet-UI</title>
    <meta name='debug' content='1'>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2"><header>Kinderzimmer Süd</header>

<div data-type="circlemenu">
  <ul>
    <li><div data-type="push" data-icon="">
      <div data-type="label" data-device="Bulb1" data-get="pct"></div>
    </div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 1" data-icon="">1</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 20" data-icon="">2</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 40" data-icon="">3</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 60" data-icon="">4</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 80" data-icon="">5</div></li>
    <li><div data-type="push" data-device="Bulb1" data-set-on="pct 100" data-icon="">6</div></li>
  </ul>
</div>

</li>
</ul>
</div>
</body>

</html>


[travelling-man]

Das Problem kann der nicht gesetzte Meta-Tag Longpoll sein.

https://wiki.fhem.de/wiki/FHEM_Tablet_UI_FAQ

Füge bitte folgenden Tag hinzu:

Code Auswählen Erweitern


<meta name="longpoll" content="1">

[setstate]

funktioniert

Code Auswählen Erweitern

<div data-type="label" data-device="Bulb1" data-get="pct"></div>

ausserhalb vom Circlemenu?

Benutzt du eine Version von nach dem 01.11.17 ?

[Klingelbastler]

Tut mir leid dass ich Eure Nerven mit diesem vermutlich banalen Problem strapaziere, bin noch recht neu in FHEM. Danke für Eure Geduld.

Basti:
Das Hinzufügen des Longpolls ändert nichts am Verhalten.

Setstate:
Das Label ausserhalb des Circlemenu funktioniert verlässlich und wird sofort aktualisiert wenn ich einen neuen Wert wähle - dabei erhalte ich übrigens keine Meldung "Full refresh done in ...".
Das eingebettete Label dagegen erfordert einen kompletten Webbrowser Page Reload mit F5.

Wie erkenne ich die Version des Widgets?
Meine FHEM Basisinstallation habe ich vor ~2 Monaten gemacht, also vor dem 01.11.2017.
Anschließende Updates per "update".
Tablet UI wie im Wiki angegeben per

Code Auswählen Erweitern


update check https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt


Das hab ich die letzten Tage öfters durchgeführt, da sind auch Updates gekommen, aktuell meldet er aber nur "nothing to do".

Verstehe ich es richtig, dass es hier anfangs ein Problem mit eingebetteten Labels gab, dies mittlerweile aber gefixt sein sollte?
Als letzter Ausweg bleibt noch eine komplette Neuinstallation, wenn Ihr sagt dass es eigentlich funktionieren müsste...

Schönen Abend!

[setstate]

Sorry, doch ein Bug.
Das ist schon wieder kaputt-repariert. Seit dem Update zur Vermeidung von Doppel-init funktioniert das nicht mehr. Ich schaue mir das an ...

[Wiesel]

Bin heute durch Zufall auf das gleiche Problem gestoßen.
Zum Glück wurde schon was dazu geschrieben, hab schon an mir gezweifelt 

setstate wir glauben an dich 

Schönen Abend!

[Klingelbastler]

Ich glaube Setstate war fleissig - gerade kam ein Update und nun geht es!?!?!!!

Ich kann nur sagen herzlichen Dank Setstate für den schnellen Fix - toll was Du und Deine Entwicklerkollegen leistet!

Freue mich über die schönen Knöpfe mit Beschriftung