New FHEM Tablet UI

[setstate]

Gibt es in FHEM wirklich keine (persistente) Timerfunktion? Kann ich mir bei Rudolf eigentlich gar nicht vorstellen...

Für den on-for-timer Fortschrittsring benutze ich einen Timer, der direkt auf dem Client läuft, völlig unabhängig von FHEM.
Wenn der etwas länger läuft und ein Browser-Refresh gemacht wird, ist es dahin mit der reellen Restzeit-Anzeige.
Wir dachten: da wäre doch ein Timer schön, der nach einem Refresh einfach weiter läuft. FHEM liefert die Restzeit auch nicht bei jedem Device direkt per Reading, weil der on-for-timer meist direkt auf dem Device läuft.

[Thorsten Pferdekaemper]

Für den on-for-timer Fortschrittsring benutze ich einen Timer, der direkt auf dem Client läuft, völlig unabhängig von FHEM.
Wenn der etwas länger läuft und ein Browser-Refresh gemacht wird, ist es dahin mit der reellen Restzeit-Anzeige.
Wir dachten: da wäre doch ein Timer schön, der nach einem Refresh einfach weiter läuft. FHEM liefert die Restzeit auch nicht bei jedem Device direkt per Reading, weil der on-for-timer meist direkt auf dem Device läuft.

Hi,
ich denke, dass man dafür schon etwas im Backend braucht. Entweder kann man rein prinzipiell die "Restzeit" gar nicht herausfinden, dann hat man komplett verloren. Diesen Fall muss man also gar nicht betrachten. (Oder man bleibt bei der reinen Frontend-Darstellung.)
Ansonsten müsste man verlangen, dass das Device (im Backend) eben die Daten zur Verfügung stellt. Ich kann mir dann am Frontend Parameter wie 'data-total="totaltime" data-processed="timespent"' vorstellen. Am Backend berechnet man die dann per userReading, einem at oder sonstwie (gibt es eigentlich in FHEM so etwas wie readings die "bei Bedarf" berechnet werden?).
Das Frontend könnte dann bei der Initialisierung des Widgets einmal einen Backend-Aufruf machen und von da an "alleine" weitermachen. Der Hit wäre, wenn das Widget zyklisch im Backend nachfragen würde und die Anzeige entsprechend korrigiert. Damit bekäme man dann einen allgemeinen "Progress Indicator" hin.
Ich weiß allerdings nicht wirklich, ob das mit der gegebenen Architektur wirklich sinnvoll machbar ist.
Gruß,
   Thorsten

[viegener]

Vielleicht können wir dem Standard-Slider ja eine Option verpassen, mit der die Richtung umgekehrt wird. Deine Anpassung würde mich auf jeden Fall interessieren.

Oops, 2 Tage nicht gelesen und schon bin ich 2 Seiten zurück 

Also mein umgekehrter Slider ist zu hier zu finden:

https://github.com/viegener/fhem-tablet-ui/blob/master/www/tablet/js/widget_negslider.js

Der negslider.js ist im wesentlichen eine Kopie, wobei der darzustellende Wert umgedreht wird (die Farben sind dabei zwar noch wie vorher).
Ausserdem unterstützt er auch regexp für data-on und data-off, da meine Rolläden hier mehrere Statuswerte liefern.

Ich habe ganz bewusst keine Option in Deinen Slider eingebaut, da ich sonst immer wieder beim Merge Mehraufwand habe.

Lass mich wissen, wenn ich das lieber in Deinen Slider einbauen soll und dann einen Pull-Request schicken soll?

[elfrinjo]

Hallo zusammen,

ich habe dieses Frontend gerade erst entdeckt und muss sagen, dass ich ehrlich beeindruckt bin!!

Was das Layout angeht fühle ich mich allerdings als hätte ich noch nie Code bearbeitet...
Kann mir jemand ein Code Snippet für Folgendes geben?
Ein "Feld", 2x2 groß
In der ersten Zeile ein Thermostat und ein Fenster Symbol
In der zweiten Zeile zwei Schalter, und zwar nebeneinander

Vielen Dank schonmal!!

Cheers, Jörg

[elfrinjo]

Ahh, und jetzt habe ich die HTML Tabelle wiederentdeckt...

never mind!

[berndp]

Hallo zusammen,

ich habe dieses Frontend gerade erst entdeckt und muss sagen, dass ich ehrlich beeindruckt bin!!

Was das Layout angeht fühle ich mich allerdings als hätte ich noch nie Code bearbeitet...
Kann mir jemand ein Code Snippet für Folgendes geben?
Ein "Feld", 2x2 groß
In der ersten Zeile ein Thermostat und ein Fenster Symbol
In der zweiten Zeile zwei Schalter, und zwar nebeneinander

Vielen Dank schonmal!!

Cheers, Jörg

Geht vielleicht noch schöner. Ich machs zumindest immer so:

Code Auswählen Erweitern

<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>Genialstes Frontend</header>
<div class="cell">
<div data-type="thermostat"  data-device="WZ_Temperatur"  data-get="desired-temp"  data-temp="measured-temp"  class="cell inline" ></div>
<div data-type="contact" class="inline"  data-device="WZ_Tuer_Ost_FK" data-get-on="on" data-get-off="off"></div>
</div>
<div class="cell">
<div data-type="push" data-device="SB_WZ" data-icon="fa-play" data-background-icon="-" data-set="pause" class="inline"></div>
<div data-type="push" data-device="SB_WZ" data-icon="fa-pause" data-background-icon="-" data-set="pause" class="inline"></div>
</div>
</li>

[elfrinjo]

Cool, danke.
Das sieht natürlich noch besser aus.

Cheers, Jörg

[nesges]

Ich habe ganz bewusst keine Option in Deinen Slider eingebaut, da ich sonst immer wieder beim Merge Mehraufwand habe.
Lass mich wissen, wenn ich das lieber in Deinen Slider einbauen soll und dann einen Pull-Request schicken soll?

Mir gefällt's! Ich wäre dafür, das als Option in den normalen Silder zu übernehmen, schick da bitte ruhig mal nen Pull-Request. Das letzte Wort hat aber setstate

[viegener]

@viegener: Herzlichen Dank für Deine Anregung, das ist in etwa das, was ich heute auch schon mache. (Natürlich etwas weniger schön gelöst, als Du das machst)

Bleibt noch eine Frage: Du siehst damit aber auch nicht, welchen aktuellen Zustand Dein Rollo hat, oder?

Bitte gern geschehen.

Doch ich sehe den aktuellen Zustand und auch Updates während der Bewegung.
Allerdings hängt das nicht mit dem Tablet UI sondern mit meiner SOMFY-Umgebung zusammen.
Ich habe ein verändertes Somfy-Modul, dass noch der Übernahme in den Standard harrt und dieses sendet auch aktuelle Zustände und Updates während des Bewegens.

Das gehört aber nicht wirklich in diesen Thread....

[viegener]

@viegener: beim Slider dürfte zur Zeit
data-on='(on|closed|down)' data-off='(open|off)'
leider nicht funktionieren. RegEx versteht der an der Stelle noch nicht.
Würde ich noch nachrüsten.

Edit: was ist eigentlich der Unterschied zwischen deiner Triplebox Class und der doublebox? Die Zahlen sehr gleich aus.

@setstate: Ja, ich habe eine Variante des Sliders, der umgekehrt funktioniert (passend zu den Rolläden), da habe ich auch gleich die Regexp für On und Off eingebaut. Die Triplebox habe ich erzeugt, um die drei Buttons (Hoch/Stop/Runter zusammenzufassen, vielleicht geht das auch eleganter, aber ich bin nicht so der CSS-Held...

@nesges und setstate: Inzwischen habe ich meinen Slider nochmal deutlich überabreitet, denn bei mir wird kein Kommando gesetzt, wenn man mit der Maus oder dem Finger zu weit über Min/Max hinauszieht. Ausserdem wollte ich noch eine optionale Werteanzeige haben, die auch während des Ziehens angepasst wird.

Leider ist das mit dem Pull-Request nicht so einfach, denn es gibt eine Abhängigkeit zu einem powerrange-Update (ist zwar nur eine Zeile, aber leider gibt es keinen Workaround).

Ich habe die Dateien zu meinem Slider und die angepassten powerrange-Dateien (als min und lesbar) angehängt.

Johannes

[setstate]

Vielen Dank viegener,
deine Version werde ich mir heute Abend mal unter die Lupe nehmen ...

[bjoernbo]

Moin!

Da ich nun fast alles nach meinen wünschen eingerichtet habe, geht es nun an das optimieren. Dabei stehe ich gerade auf dem Schlauch oder ich habe was überlesen. Dabei geht es um eine ganz einfache Sache.

Wie kann ich ein widget in der Höhe und Breite zentrieren ?? 

[setstate]

Links rechts müsste es zentriert sein, das bringt das Gridster Style mit. Nach oben würde ich nicht lange rumdoktern und einfach feste Abstände nutzen: top-space, top-space-2x
Mit der Class "cell" wird auch etwas Raum nach links und oben erzwungen. Man kann auch mal probieren, "cell" wegzulassen, wenn es sich negativ hinsichtlich der Ausrichtung auswirkt. Bei mehreren Widgets, die sich eine Sektion teilen müssen, ist "cell" wichtig damit Abststand gewährleistet bleibt.
Es gibt (glaube ich ohne nachzusehen) auch noch left-space, left-space-2x usw.

[bjoernbo]

Danke!

Mit

class="top-space"

wird es richtig ausgerichtet!

[Phil__]

Hallo,

da ist man mal 2 Wochen beruflich komplett eingespannt und schon kommt man kaum noch mit! 

Eine Frage zu Beginn:
Hier wird viel über Radios geschrieben, bzw die Steuerung für Kodi, Sonos usw....
Gibt es auch die möglichkeit einen Internetradio Stream einzubinden, mit ZB Start/Stop Button.
Das eigentliche Problem, der Radiosender soll dann nicht auf dem Server (Fhem-Server) abgespielt werden sonder auf dem Tablet auf dem FTUI angezeigt wird.
Das Tablet soll das ganze dann per Bluetooth zur Stereoanlage weitergeben.

Gibt es eine Lösung den Stream auf dem Tablet zu starten?



======================================================================

Ein wenig was habe ich mit FTUI auch schon gebastelt, soviel die Zeit eben hergibt.
Ich hänge mal ein paar Screenshots an vllt findet ja der eine oder andere eine Anregung für sich selbst oder hat einen Verbesserungsvorschlag 
Das Ganze wir bei mir auf einem 7 Zoll "Wand"-Tablet dargestellt!
Stelle bei Bedarf auch gerne den html-Code zur Verfügung!

Viele Grüße Philipp