New FHEM Tablet UI

[setstate]

Ich wollte mir gerade eine Userdemo hier (https://github.com/knowthelist/fhem-tablet-ui) runterladen (bin eingeloggt).
Leider ist in den heruntergeladenen html-Dateien nicht der richtige Code enthalten. Mache ich etwas falsch?

Es spielt nicht alles sofort out of the box. Die HTML sind nur Beispiel als Kopiervorlage und das Projekt mehr ein Framework als eine fertiges Userinterface.  Man muss die Widgets an seine eigenen Devices anpassen.

[setstate]

Im Prinzip habe ich das so,  <meta name="longpoll" content="1">

Code Auswählen Erweitern


<div data-type="label"
       data-device="wz_WandThermostat"
       data-get="mode"
       class="inline cell top-space-2x big">
/div>


Dies funktioniert auf der normalen Website, jedoch nicht bei einem geöffnetem Popup. Dieses muss ich erst schließen, einen PageReload machen und das Popup neu öffnen, dann stimmts.

aha!? muss ich mir anschauen, hätte ich nicht gedacht 

[mircoby]

aha!? muss ich mir anschauen, hätte ich nicht gedacht 

Das wäre super. Der Vollständigkeithalber hier die komplette section:

Code Auswählen Erweitern

<li data-row="2" data-col="6" data-sizex="1" data-sizey="1">
        <header>Wohnzimmer</header>
        <div data-type="popup" data-width="328" data-height="500">
             <div data-type="label"
                  data-device="wz_WandThermostat"
                  data-get="temperature"
                  data-unit="%B0C%0A"
                  class="inline cell top-space-2x big">
             </div>
             <div data-type="reload"
                  data-device="RELOAD"
                  data-get="action"
                  data-reload-on="1"
                  data-reset-to="0">
             </div>
             <div class="dialog">
             <table>
                <tr><td>
                  <header>Temperatur Wohnzimmer</header>
                  <div data-type="thermostat"
                       data-device="wz_WandThermostat"
                       data-get="desiredTemperature"
                       data-set="desiredTemperature auto"
                       data-temp="temperature"
                       data-valve="valveposition"
                       data-off="off"
                       data-boost="boost"
                       data-step="0.5"
                       data-min="10"
                       data-max="25"
                       data-angleoffset="0"
                       data-width="300"
                       data-height="300"
                       class="cell top-space-2x">
                  </div>
                 </td></tr>
                 <tr><td>
                  <header>Betriebsart</header>
                  <div data-type="switch"
                       data-icon="fa-car"
                       data-device="wz_WandThermostat"
                       data-cmd="set"
                       data-get="mode"
                       data-get-on="auto"
                       data-get-off="manual"
                       data-set-on="desiredTemperature auto"
                       data-set-off="desiredTemperature 5"
                       class="cell top-space-2x">
                  </div>
                  <div data-type="label"
                       data-device="wz_WandThermostat"
                       data-get="mode"
                       class="inline cell top-space-2x big">
                  </div>
                 </td></tr>
             </div>
             </table>
        </div>
</li>
Der Bereich RELOAD ist noch nicht wirklich funktional, da bin ich noch am experimentieren. Im idealfall kann er entfallen.

Sollte das demnächst funktionieren, möchte ich noch folgendes umsetzen:

Abhängig vom Zustand des Readings mode (kann "auto" oder "manuell" sein) möchte ich gerne beim verstellen der Temperatur den "set" Befehl verändern.

Dies hat folgenden Hintergrund:
- Aktuell wird immer gesendet: "set wz_Wandthermostat desiredTemperature <value> auto"
- Dies führt dazu das der veränderte Wert übernommen wird, der automatikmodus aktiviert ist/wird und ab dem nächsten zeitlichen Schaltpunkt die Automatik weiter läuft (für die meisten fälle OK).
- Möchte ich jedoch die Heizung auf Manuell und eine bestimmte Temperatur einstellen, so ist dies aktuell nicht möglich. Es funktioniert nur manuell, mit der vordefinierten Temperatur (in diesem Beispiel 5 Grad Celcius).

Es müsste also der Abschnitt "data-set-on=" in Abhängigkeit von data-get="mode" des wz_Wandthermostat verändert werden.

Code Auswählen Erweitern


auto:                      data-set-on="desiredTemperature auto"
manuell:                   data-set-on="desiredTemperature"

Lässt sich sowas evtl mit einer RegEx lösen? Falls das alles zu kompliziert wird, muss ich mir ein anderes Bedienkonzept überlegen.

[setstate]

10 mal durchgelesen, ich erfasse es aber immer noch nicht. 
Es ist mir zu vermischt. Der Switch für den Mode und der Thermostat für die Einstellung der Solltemp.

Aber jetzt gibt es beim Thermostat auch Modusangaben mit und beim Switch Temperaturen, das verwirrt mich.
Beim Thermostat würde ich nicht mit Mode hantieren, nur Temp einstellen. Wenn man beim Switch Mode und gleich eine feste Temp einstellen will, kann man im data-set-on mit Semikolon mehrere FHEM Befehle aneinanderreihen. Nach dem ersten Semikolon muss man aber den vollen Befehl angeben. Also: set wz_* desiredTemp 5

Code Auswählen Erweitern

<div data-type="switch"
                       data-icon="fa-car"
                       data-device="wz_WandThermostat"
                       data-cmd="set"
                       data-get="mode"
                       data-set="mode"
                       data-get-on="auto"
                       data-get-off="manual"
                       data-set-on="auto;set wz_WandThermostat desiredTemperature 20"
                       data-set-off="manual;set wz_WandThermostat desiredTemperature 5"
                       class="cell top-space-2x">
                  </div>


[sbiermann]

Hallo,
ich bin gerade dabei mit der Tablet UI zu spielen, dabei ist mir aufgefallen das bei mir die Webseite oft nicht richtig geladen wird. Teilweise wird sieht man sogar nur den Inhalt irgend einer JavaScript Datei oder CSS-Datei. Manchmal werden auch einfach nur nicht die Images geladen oder Werte. Liegt das jetzt daran das mein RasPI Model B das nicht schafft oder am Apache als Reverse Proxy davor oder direkt an Tablet UI? Hat jemand auch schon solche Erfahrungen gemacht oder hat einen Tipp woran es liegen könnte.

Viele Grüße
Stefan

[fh168]

Wie angekündigt, habe ich für Euch vom genialen Tablet-UI einen Blog-Beitrag geschrieben. Es wäre zu schade, wenn Tablet-UI in den unendlichen Weiten des Forums untergehen würde.

http://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-tablet-ui/

LG
/robin

[mircoby]

10 mal durchgelesen, ich erfasse es aber immer noch nicht. 
Es ist mir zu vermischt. Der Switch für den Mode und der Thermostat für die Einstellung der Solltemp.

Aber jetzt gibt es beim Thermostat auch Modusangaben mit und beim Switch Temperaturen, das verwirrt mich.
Beim Thermostat würde ich nicht mit Mode hantieren, nur Temp einstellen. Wenn man beim Switch Mode und gleich eine feste Temp einstellen will, kann man im data-set-on mit Semikolon mehrere FHEM Befehle aneinanderreihen. Nach dem ersten Semikolon muss man aber den vollen Befehl angeben. Also: set wz_* desiredTemp 5

Code Auswählen Erweitern

<div data-type="switch"
                       data-icon="fa-car"
                       data-device="wz_WandThermostat"
                       data-cmd="set"
                       data-get="mode"
                       data-set="mode"
                       data-get-on="auto"
                       data-get-off="manual"
                       data-set-on="auto;set wz_WandThermostat desiredTemperature 20"
                       data-set-off="manual;set wz_WandThermostat desiredTemperature 5"
                       class="cell top-space-2x">
                  </div>


Habe mich vielleicht ein wenig zu kompliziert ausgedrückt... Bzw. unvollständig, wenn man das MAX! System nicht im Detail kennt.
- Grundsätzlich gibt es die Betriebsarten "auto" und "manuell".
- auto bedeutet Solltemperaturen werden nach Zeitprogramm angefahren
- manuell, wie der name schon sagt. Die eingestellte Temperatur wird "für alle Ewigkeit" gehalten.

Soweit so gut. Typischerweise nutze ich den Automatikmodus. Wenn ich jetzt eine Temperatur verstellen möchte (ohne den Automatikmodus zu verlassen) mache ich das so:
- set wz_WandThermostat desiredTemperature <value> auto
Lässt man das "auto" am ende weg (set wz_WandThermostat desiredTemperature <value>), wird der Sollwert gesetzt und das Thermostat in den manuellen Modus geschaltet, das ist die Krücke.

Ich muss daher je nach dem ob ich im Automatikmodus bleiben will das "auto" mitsenden, oder wegelassen, falls ich den manuellen Modus haben möchte.

Das Umschalten des modus erfolgt daher immer mit einem "set wz_WandThermostat desiredTemperature", also mit dem setzen einer Temperatur, nicht eines modes.

[setstate]

Hallo microby (krrrkrrr),

ich muss noch bisschen doof nachfragen ...

Das Thermostat sendet doch in der jetzigen Version das so, oder hast du da schon was umgebaut?

set wz_Wandthermostat desiredTemperature auto <value>

und nicht wie du brauchst

set wz_Wandthermostat desiredTemperature <value> auto

zweite Frage: du brauchst Änderungen am data-set-on für den Switch (Post #2627)? Warum genau? Kann Max! nicht

set wz_Wandthermostat mode manual

verarbeiten, das muss auch über desiredTemperature passieren?

[setstate]

Wie angekündigt, habe ich für Euch vom genialen Panel-UI einen Blog-Beitrag geschrieben. Es wäre zu schade, wenn Panel-UI in den unendlichen Weiten des Forums untergehen würde.

http://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-panel-ui

LG
/robin

Hallo Robin,

vielen Dank für deinen Blog-Beitrag. Super Sache das!
Du hast Recht, FTUI ist ausserhalb des  "FHEM Forum » FHEM » Frontends »" Kosmos kaum bekannt.
Aber dass der Thread hier so viel Resonanz findet ist unglaublich. Es erstaunt und erfreut mich jeden Tag aufs neue.
Vielen Dank für Nutzen/Probieren von FTUI

[mircoby]

Hallo microby (krrrkrrr),

ich muss noch bisschen doof nachfragen ...

Das Thermostat sendet doch in der jetzigen Version das so, oder hast du da schon was umgebaut?
und nicht wie du brauchst
zweite Frage: du brauchst Änderungen am data-set-on für den Switch (Post #2627)? Warum genau? Kann Max! nicht verarbeiten, das muss auch über desiredTemperature passieren?

Kein Thema, dafür ist das Forum ja da...

Zur ersten Frage: Das Thermostat sendet "auto <value>" das passt auch. Habe nichts daran geändert. Brauche es nicht anders herum das war ein Denkfehler, sorry.

Was ich bräuchte wäre der data-set-on="" Befehl abhängig von dem Betriebsmode des Thermostats.
Im auto mode:      data-set-on="set wz_WandThermostat desiredTemperature auto <value>"
Im manuell mode: data-set-on="set wz_WandThermostat desiredTemperature <value>"

Zur zweiten Frage: Max kann den mode leider nur über desiredTemperature umschalten. Versuche ich es wie Du vorgeschlagen hast mit set wz_Wandthermostat mode manual kommt die Fehlermeldung "Unknown Argument mode..."

[Gunther]

Es spielt nicht alles sofort out of the box. Die HTML sind nur Beispiel als Kopiervorlage und das Projekt mehr ein Framework als eine fertiges Userinterface.  Man muss die Widgets an seine eigenen Devices anpassen.

Das habe ich verstanden.
Wenn ich z. B. rein die index.html von Phil verwende sehe ich unter meinem FHEM-Tablet-Link http://192.168.0.22:8083/fhem/ftui/ das angehängte Bild. Warum sehe ich nicht die Tablet-Oberfläche?

Ich finde in der index.html keinen Code, der sich auf die Oberfläche bezieht. Ich hoffe, ich drücke mich verständlich aus.

So sieht die heruntergeladene Datei aus.

[setstate]

Wenn ich z. B. rein die index.html von Phil verwende sehe ich unter meinem FHEM-Tablet-Link http://192.168.0.22:8083/fhem/ftui/ das angehängte Bild. Warum sehe ich nicht die Tablet-Oberfläche?

Ich finde in der index.html keinen Code, der sich auf die Oberfläche bezieht. Ich hoffe, ich drücke mich verständlich aus.

Hallo Gunter,

da hast du vermutlich etwas falsches heruntergeladen. Das ist keine index.html für FHEM Tablet UI.
Lade das zip runter und nimm daraus eine index.html deiner Wahl.

Hier der direkte Link zum Klicken:
https://github.com/ovibox/fhem-ftui-user-demos/archive/master.zip

Auf der Githubseite ist der Link rechts unten und sieht so aus:

[Gunther]

Daaaanke Dir! Ich war einfach vernebelt! Direkt die Dateien runterzuladen scheint nicht zu klappen.
Jetzt kann es losgehen

[setstate]

Dies funktioniert auf der normalen Website, jedoch nicht bei einem geöffnetem Popup. Dieses muss ich erst schließen, einen PageReload machen und das Popup neu öffnen, dann stimmts.

Ich sehen Grund, warum das nicht klappen soll. Rein aus der Implementierung her und gerade habe ich es bei mir getestet. Ein Label und auch ein Switch werden auch auf einem Popup-Dialog per Longpoll refreshed
Deshalb sehe ich hier keine Notwenigkeit von Reload.

Achtung! Das longpoll startet erst nach 10 Sekunden.

[Stril]

Hallo!

Gibt es eigentlich irgendeine Möglichkeit, dass ein "push"-Button auch je nach State eingefärbt ist?

Explizit geht es mir um:

Code Auswählen Erweitern


<div class="cell">
    <div class="doublebox-h">
        <div data-type="push" data-device="aJs_Schlafzimmer"
             data-icon="fa-angle-up" data-background-icon="fa-square-o"
             data-set="up">
        </div>
        <div data-type="push" data-device="aJs_Schlafzimmer"
             data-icon="fa-angle-down" data-background-icon="fa-square-o"
             data-set="down">
        </div>
    </div>
</div>


--> Wenn die Jalousie ganz unten ist, soll der Button "runter" sich einfärben und umgekehrt.

Ist das möglich?

Danke und Grüße
Phil