HomePlus - Hybrid frontend mobile-app UI-Framework (Android, iOS, Web)

[Real-TTX]

@Pfriemler: Bin heute am späten Nachmittag wieder zu Hause. Schaue es mir an! Weiteres folgt mit Beispielen...

@DerBaer: Welchen Browser hast jetzt?

Gesendet von meinem Pixel XL mit Tapatalk

[DerBaer]

@DerBaer: Welchen Browser hast jetzt?

Gesendet von meinem Pixel XL mit Tapatalk

Urm joa, hab den Fehler gefunden, IE is halt einfach kacke...
Mit Chrome gehts naturlich einwandfrei.

[Pfriemler]

IE is halt einfach kacke...

Mein Reden seit ... 

Mit Chrome gehts naturlich einwandfrei.

Auch da gibt es Macken, anderer Art.

@Real-TTX: Zum Log-Prob lies bitte meinen ersten aktualisierten Post. "Schuld" ist mit an Sicherheit grenzender Wahrscheinlichkeit Martins HomeMatic-template-Editor, habs im Fred allda auch gepostet.

Der Aufruf an die Beispiele geht genauso an alle, die hier schon erfolgreich konfiguriert haben. Aber insbesondere die "neuen" UI-Elemente wären hilfreich.

[Real-TTX]

@Pfriemler - ich aktualisiere/lade beim Start die jsonlist2. Der Rest ist lokal...  Also keine Einzel abfragen...

Gesendet von meinem Pixel XL mit Tapatalk

[Pfriemler]

@Pfriemler - ich aktualisiere/lade beim Start die jsonlist2. Der Rest ist lokal...  Also keine Einzel abfragen...

Ah ... Du lädst den gesamten Kladderatatsch. Das erklärt, warum der Aufruf so lange dauert. jsonlist2 dauert bei mir etliche Sekunden - und erzeugt den Fehlerblock.
Ursache bestätigt, Dein Modul ist raus...
Ich nutze 98_HMTemplate.pm schon länger, aber der Fehler kam wohl mit dem neuen Update. War nur eine unglückliche Korrelation.

[Swen]

Der Aufruf an die Beispiele geht genauso an alle, die hier schon erfolgreich konfiguriert haben. Aber insbesondere die "neuen" UI-Elemente wären hilfreich.

Denn von mir mal ein paar kleine Beispiele die schon umgesetzt sind, nix dolles aber funktioniert:

FlowerSens (Blumen Monitor):

Code Auswählen Erweitern


Attributes:
   room       FlowerSens,Wohnzimmer
   uiDeviceIcon ion-battery-half;ion-thermometer;ion-ios-sunny-outline;ion-waterdrop # (geht noch nicht)
   uiDeviceType LABEL-VALUE-LIST
   uiDeviceTypeParameter Batterie;Temperatur;Helligkeit;Wasserstand
   uiDisplayRoom Pflanzen
   uiGet      [[DEVICE:Pfennigbaum:battery|TEXT:%1% %]];[[DEVICE:Pfennigbaum:temperature|TEXT:%1% C°]];[[DEVICE:Pfennigbaum:lux|TEXT:%1% Lux]];[[DEVICE:Pfennigbaum:moisture|TEXT:%1% %]]
   uiShow     1


MiLight Licht:

Code Auswählen Erweitern


Attributes:
   IODev      MilightBridge
   devStateIcon {(MilightDevice_devStateIcon($name),"toggle")}
   event-on-change-reading state,transitionInProgress
   lightSceneParamsToSave hsv
   restoreAtStart 1
   room       Wohnzimmer
   uiDeviceIcon ion-power; ; 
   uiDeviceType SWITCH-RANGE
   uiDeviceTypeParameter Fernseher;0;100;1
   uiDisplayName Beleuchtung
   uiDisplayRoom Wohnzimmer
   uiGet      [[DEVICE:Wz.LedFernsehen:state|REGEX:(on\|off)|IF:"%2%"="on",1,0]];[[DEVICE:Wz.LedFernsehen:brightness]]
   uiOption   optionHeaderHide
   uiSet      set Wz.LedFernsehen [[IF:"%VALUE%"="1",on,off]];set Wz.LedFernsehen dim %VALUE%
   uiShow     1


MiLight Farbauswahl dummy

Code Auswählen Erweitern


Attributes:
  ui.LedFernsehen.color uiDeviceIcon ion-power; ;
  ui.LedFernsehen.color uiDeviceType COLOR-PICKER
  ui.LedFernsehen.color uiDeviceTypeParameter Fernseher;0;360;1
  ui.LedFernsehen.color uiDisplayName Farben
  ui.LedFernsehen.color uiDisplayRoom Wohnzimmer
  ui.LedFernsehen.color uiGet [[DEVICE:Wz.LedFernsehen:hue]]
  ui.LedFernsehen.color uiOption optionHeaderHide
  ui.LedFernsehen.color uiSet set Wz.LampeTisch hue %H%
  ui.LedFernsehen.color uiShow 1


Max! Wandthermsotat:

Code Auswählen Erweitern


Attributes:
   IODev      MAXLAN
   alias      Wz.Wandthermostat
   room       MAX,Wohnzimmer
   uiDeviceType THERMOSTAT
   uiDeviceTypeParameter 5;30
   uiDisplayRoom Wohnzimmer
   uiGet      [[DEVICE:MAX_0f4319:temperature]];[[DEVICE:MAX_0f4319:desiredTemperature]]
   uiOption   optionHeaderHide
   uiSet      set MAX_0f4319 desiredTemperature %VALUE%
   uiShow     1


Max! Fensterkontakt:

Code Auswählen Erweitern


Attributes:
   IODev      MAXLAN
   alias      Wz.Balkonkontakt
   room       MAX,Wohnzimmer
   uiDeviceType LABEL-VALUE
   uiDeviceTypeParameter Fenster
   uiDisplayRoom Wohnzimmer
   uiGet      [[DEVICE:MAX_109884:state|IF:"%1%"="closed",geschlossen,geöffnet]]
   uiOption   optionHeaderHide
   uiShow     1


Vielleicht hilft es dem einen oder anderen.

Gruß,
Swen

[Real-TTX]

@Pfriemler: Habe schon angefangen, eine Art depency list aufzubauen um anschließend einiges an Overhead zu sparen. Im Moment fehlen mir noch einige Filterfunktion in dem jsonlist2 cmd....

Gesendet von meinem Pixel XL mit Tapatalk

[Pfriemler]

Also wenn ich ein

Code Auswählen Erweitern

jsonlist2 uiShow=[0-9]

auf der FHEM-Kommandozeile eingebe, sind meine derzeit 7 Geräte in unter 1s gelistet, statt vorher 10 (mit dann allen 150 oder so).
Würdest Du level 1 als alle Geräte definieren und 0 als disabled, könnte man auf [1-9] regexen bzw gleich nur auf den Bereich, der mit den Einstellungen überhaupt zulässig ist, und hätte gleichzeitig die Option, ungestört pfriemeln zu können mit einem entsprechenden Level, ohne dass der Produktiveinsatz parallel leidet. uiShow=0 wäre für mich dann ein disabled - oder debug-Status.

Und noch ein neuer Fehler: frage ich bei uiGet ein ungültiges Register eines Devices ab, bricht die Darstellung komplett ab (die Geräte werden zwar noch angezeigt, aber optionHeaderHide, uiDisplayOrder und uiGet funktionieren nicht). Das passiert leider auch wenn ich das uiShow zu Debugzwecken lösche. Mit der gefiltertenl jsonlist2 wäre zumindest letzteres gelöst.
Hab mir heute ne Weile den Wolf gesucht bis ich meinen copy&paste-Fehler gefunden habe.

via Tapatalk

[Real-TTX]

Ja, dass man nach Attributen Filtern kann, weiß ich. Damit kann man aber nicht alle Fälle abdecken. Bei jeder Definition, die ein beliebiges anderes Gerät verwendet würde das Filtern so nicht mehr funktionieren...

Danke für den Hinweis. Werde mir den Fehler anschauen

Gesendet von meinem Pixel XL mit Tapatalk

[Pfriemler]

... nach Attributen Filtern ... Damit kann man aber nicht alle Fälle abdecken. Bei jeder Definition, die ein beliebiges anderes Gerät verwendet würde das Filtern so nicht mehr funktionieren...

Hmmm... Stimmt auch wieder. Bei allen uiGets, die sich nicht auf das eigene Gerät beziehen, würde dann was fehlen. Das ist bei mir bisher nicht vorgekommen, aber es ist ja eigentlich eine Stärke Deines Ansatzes. Nur: Wie oft kommt das jetzt wirklich vor und was wäre, die dann noch fehlenden Stati/Readings "nachzufordern"?
Schade. Denn die Benutzbarkeit der aktuellen Lösung leidet für mich derzeit an der Reaktionszeit beim Start und Update.

Ich lasse mich überraschen was Du (später) dazu aus dem Hut zauberst ...

edit: Nochwas: Bei der Web-App im Android-Chrome-Browser öffnen sich die Dropdowns in "Settings" nur bei Tap-and-Hold - bug or feature?

Und: Button-Bar funktioniert klasse. Hier ein Beispiel zur Steuerung meines (älteren) Rolladens über einen Dummy RolloEGWzLi (die Änderungen des Wertes verarbeitet ein DOIF und schickt entsprechende Schaltkombinationen an zwei Relais, die die Buttons des Antriebs "fernbedienen")

Code Auswählen Erweitern


uiDeviceIcon ion-arrow-up-b;ion-close-round;ion-arrow-down-b
uiDeviceType BUTTON-BAR
uiDeviceTypeParameter auf;stop;zu
uiDisplayName Rollo Wohnzimmerfenster
uiDisplayRoom Rollos
uiSet set RolloEGWzLi Oeffnen;set RolloEGWzLi Stoppen;set RolloEGWzLi Schliessen
Die Kürze der Beschreibung der Buttons (auf/stop/zu) ist bewusst - längeres wird auf einem Handy abgeschnitten dargestellt.

[Real-TTX]

Soo.... Version 0.5.0 ist jetzt für mobile Geräte online! Habe meine build-Maschine wieder im Griff 

@Pfriemler:

1.) Lösung zum performanten Aktualisieren wird folgen!

2.) Kein Feature! Was für ne Android Version? Stock Android? Alpha- /Beta-Channel von Chrome? Auf meinem 7.1.1 gibts keine Problem.

3.) Lange Texte / Inhalte werden abgeschnitten: Habe hier noch keine gute Regel gefunden.... Hast ne Idee? Inhalte umrechen erinntert eher an 90er Anwendungen 

[Pfriemler]

Soo.... Version 0.5.0 ist jetzt für mobile Geräte online! Habe meine build-Maschine wieder im Griff 

Dann werde ich es auch damit probieren.

Zu 1.  Ich hatte keine Sekunde einen Zweifel daran 
Zu 2. Samsung S5 Stock-ROM 6.0.1, normaler Chrome, kein alpha oder beta.
Das Verhalten kenne ich von meinen Porgrammierversuchen mit Basic4Android. Dort wird bei Aktionen, auf die Elemente reagieren sollen, zwischen _Click und _Longklick unterschieden.
Ich weiß nicht ob Dein UI DROPDOWN auch davon betroffen ist. Wenn man es weiß, ist es eigentlich kein Problem.
Zu 3. Herrje, das ist eben so. Mit Basic4Android war das auch immer ein Krampf. Hier wird ja wenigstens gekürzt und mit Punkten ergänzt. Aber wenn von Aufwärts und Abwärts und Stoppen nur Au..., Ab... und Sto... übrig bleibt, sieht das halt komisch aus. Eventuell hart auf eine Zeichenlänge begrenzen, müsste man eigentlich schon in den FHEM-Attributen prüfen, aber wie soll das gehen?
Ein Check mit Report wäre vielleicht machbar (also Hinweise wo die Defs mit der GUI kollidieren könnten). Letztlich ist jeder am besten beraten, alles auszuprobieren und bei Bedarf ganz andere Texte zu nehmen, als es eine Umrechnungsroutine leisten könnte. Hilfreich wäre evtl. ein schmaler Zeichensatz oder bedarfsweise kleinere Schriftart.
Zur Buttonleiste:
Strenggenommen funktioniert eine Buttonleiste aber auch mit reinen Symbolen. Vertikal platzsparend ist ja dank optionHeaderHide schon einiges machbar, nur würde der Buttonleiste dann eine Beschriftung fehlen. Hier würde eine optionale Zusatzbeschreibung hilfreich sein. Ein "Wohnzimmerrollo [ /\ ] [ X ] [ \/ ]" zum Beispiel.
Ach ja, die Buttons könnten eine Abgrenzung voneinander haben, statt nahtlos aneinanderzukleben.
Aber das ist schon viel Extrawunsch.

[Swen]

Danke es funktioniert

Ich denke aber das es mir zu kompliziert ist, mit Fhem selbst ist es schon schwer.
Tablet Ui ist da einfacher zu verstehen, vielleicht mache ich irgendwan in Zukunft eine Umstellung auf Home+.
Danke

@Hermann258,

so kompliziert ist es eigentlich nicht wenn man erst mal verstanden hat wie Real-TTX sich das gedacht hat.
Du solltest für jedes Device welches du im Home+ anzeigen möchtest z.B. folgende ui Attribute definieren.

uiDeviceType LABEL-VALUE-LIST
Der uiDeviceType bestimmt die Art wie das Gerät angezeigt werden soll (Knopf, Regler, ...) oder wie in diesem Beispiel eine Liste mit Werten.

uiDeviceTypeParameter Batterie;Temperatur;Helligkeit;Wasserstand
In diesem Fall wird der uiDeviceTypeParameter zur Anzeige der einzelnen Parameter angegeben.

uiDisplayRoom Pflanzen
uiDisplayRoom gibt an in welchem Raum (Register in der Home+ App) du das Device sehen möchtest.

uiGet [[DEVICE:Pfennigbaum:battery|TEXT:%1% %]];[[DEVICE:Pfennigbaum:temperature|TEXT:%1% C°]];[[DEVICE:Pfennigbaum:lux|TEXT:%1% Lux]];[[DEVICE:Pfennigbaum:moisture|TEXT:%1% %]]
Das uiGet Attribut liest die Werte aus den endsprechenden Devices.

uiShow 1
uiShow sagt platt gesagt einfach nur ob es in der App sichtbar sein soll oder nicht.

In diesem Beispiel benötige ich das uiSet Attribut nicht da es zur Übergabe aus der App an das Device ist. Beispiel (uiSet set Lampe %VALUE%)

Die Jungs sind stätig dabei die Dokumentation anzupassen. http://homeplus.risx.de/Docs.aspx
...und solltest du noch Fragen haben, wird dir hier sicher jeder helfen der kann!

Vielleicht konnte ich dir ein bisschen die "Angst" nehmen.
Besten Gruß,
Swen

[DerBaer]

so kompliziert ist es eigentlich nicht wenn man erst mal verstanden hat wie Real-TTX sich das gedacht hat.
Du solltest für jedes Device welches du im Home+ anzeigen möchtest z.B. folgende ui Attribute definieren.

Um ganz ehrlich zu sein, ich hab mich jetzt gestern auch mal bissl mit dem TabletUI befasst, ich finds TabletUI schöner und funktionsreicher, aber auch wesentlich komplizierter.
Homeplus hab ich recht schnell verstanden, aber mit HTML hab ich ned viel zu tun gehabt, bzw es is schon ewig her. Vlt mach ich mir nochmal die mühe das TabletUI zu verstehen, aber derweil reicht mit auch Homeplus und in Zukunft wird sich das sicher noch verbessern und mehr funktionalität bekommen.

Weil wir gerade dabei sind, wie siehts eigentlich mit Plots aus?
Bzw auch mit Anzeigen nebeneinander, da ja doch recht viel Platz verloren geht wenn ich das auf dem Tablet oder Browser am PC ansehe, wird ja lles lang gezogen ^^

[Real-TTX]

Hi, habe gerade Version 0.5.2 veröffentlicht: Neues Control PROGRESS, einige Fehler wurden beseitigt...

@DerBaer:

1.) Der Vergleich mit TabletUI hängt ein bisschen. Es sind zwei völlig verschiedene Ansätze. Der Fokus liegt hier in unterschiedlichen Bereichen...

2.) Plots ist so ne Sache... werden kommen. Sind aber in der Prio-Liste ein bisschen nach hinten gewandert. Ich selbst verwende kaum Plots im "Frontend" da mir die Informationen einfach nichts bringen - zumindest kenne ich keinen Anwendungsfall, bei dem ich auf eine Historie von Daten zugreifen möchte.

3.) Hier wäre denkbar, dass ich mehrere Spalten automatisch darstelle, sobald genug Platz vorhanden ist - gleiches Verhalten wie beim Menü - wird auch ab einer bestimmten Breite immer dargestellt.

Werde auch für alle meine Backlog veröffentlichen. Evtl kann man hier an den Prios bisschen schrauben