New FHEM Tablet UI

roman1528 · 05 Januar 2016, 01:27:33

Zitat von: Gunther am 05 Januar 2016, 01:23:12
Leute, Ihr seid super. Und das um diese Zeit!

Das / hinter dem www... hat gefehlt.

Danke Euch!
Dann geht es nun ums umbauen, oder sagen wir mal neu aufbauen für 10 Zoll.
Bin mal gespannt, ob mein Kram von vor einigen Wochen nach dem Update noch geht.

Muss ich eigentlich etwas beachten, wenn ich update und mehrere Versionen (7, 10 Zoll und Iphone) habe, oder wird das Update immer global gemacht?
Kommt es vor, dass neue css-Dateien oder ähnliches dazukommt und ich das ggf. gar nicht mitbekomme, diese aber in meine index.html-Dateien intergrieren müsste?

Dazu kommen und integrieren müssen wäre setstate's Gebiet^^

So wie ich das sehe wird das update nur in fhem/www/tablet/ installiert. Also müsste man manuell die updates durchführen. kommt auf mich ja jetzt auch zu...

viegener · 05 Januar 2016, 01:47:47

Zitat von: Gunther am 05 Januar 2016, 01:23:12
Leute, Ihr seid super. Und das um diese Zeit!

Muss ich eigentlich etwas beachten, wenn ich update und mehrere Versionen (7, 10 Zoll und Iphone) habe, oder wird das Update immer global gemacht?
Kommt es vor, dass neue css-Dateien oder ähnliches dazukommt und ich das ggf. gar nicht mitbekomme, diese aber in meine index.html-Dateien intergrieren müsste?

Es geht auch, dass man nur die eigenen Dateien in den verschiedenen tablet07/tablet10-Verzeichnissen hat. Von dort aus verwendet man dann die Dateien in ./www/tablet/...

Dazu muss natürlich in der index.html (und anderen Dateien beim Laden der javascript / js Dateien die URLs auf dem ursprünglichen Wert /fhem/tablet/... bleiben statt /fhem/tablet07/...

Dadurch hat man alle gemeinsam genutzten Dateien nur einmal, die HTML-Dateien und etwaige spezifische CSS-Dateien aber jeweils lokal und der Original-Update funktioniert auch weiterhin.

Gunther · 05 Januar 2016, 01:58:48

Super Idee, so werde ich das machen! Danke Dir!

moelski · 05 Januar 2016, 09:09:23

Moin !

Kann man eigentlich das Fadein / Fadeout der Seiten verhindern? Sieht zwar nett aus, aber nervt auf Dauer irgendwie.

Grüße Dominik

roman1528 · 05 Januar 2016, 09:52:49

Zitat von: moelski am 05 Januar 2016, 09:09:23
Moin !

Kann man eigentlich das Fadein / Fadeout der Seiten verhindern? Sieht zwar nett aus, aber nervt auf Dauer irgendwie.

Grüße Dominik

Statt pagetab als data-Type mal push oder pagebutton verwenden.

Achim · 05 Januar 2016, 14:15:51

Hallo,

ich bekomme die HTTPSRV Definition nicht zum funktionieren.

Aufruf mit:

Zitathttps://raspberry-prod.fritz.box:8083/fhem/ftui

Zitathttps://raspberry-prod.fritz.box:8083/fhem/ftui/

bringt beides mal die Fehlermeldung:

ZitatFile not found: ./www/tablet/index.html

Code Auswählen

define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet Frontend

der direkte Aufruf von

Zitathttps://raspberry-prod.fritz.box:8083/fhem/www/tablet/index.html

funktioniert. Der komplette Pfad und Inhalt des Verzeichnisses auf dem RPi ist folgender:

Zitatroot@raspberry-prod:/usr/share/fhem/www/tablet# pwd
/usr/share/fhem/www/tablet
root@raspberry-prod:/usr/share/fhem/www/tablet# ls -l
total 88
drwxr-xr-x 2 root root 4096 Dec 15 20:39 Backup
drwxr-xr-x 2 fhem dialout 4096 Dec 19 18:30 css
drwxr-xr-x 2 fhem dialout 4096 Dec 12 18:44 fonts
drwxr-xr-x 2 fhem dialout 4096 Dec 15 20:22 images
-rw-r--r-- 1 fhem dialout 14033 Dec 18 06:07 index-example.html
-rw-r--r-- 1 fhem dialout 2013 Dec 20 21:50 index.html
drwxr-xr-x 2 fhem dialout 4096 Dec 15 20:23 js
drwxr-xr-x 4 fhem dialout 4096 Dec 15 20:22 lib
-rw-r--r-- 1 fhem dialout 811 Dec 15 18:55 menu.html
-rw-r--r-- 1 fhem dialout 4830 Jan 1 10:35 sub1.html
-rw-r--r-- 1 fhem dialout 17313 Jan 1 13:20 sub2.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub3.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub4.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub5.html

Das Problem habe ich von Anfang an. Aufgrund der Erläuterung von viegener habe ich noch die verschiedenen "Möglichkeiten" probiert, keine führte zum Erfolg.

Wenn ich die Erläuterungen richtig gelesen habe, ist die Basis des Webservers "/usr/share/fhem". die Angabe "./www/tablet" ist bezogen auf diese Basis. Somit müsse das eigentlich passen. Vielleicht kann mir da jemand einen Tipp geben, wie ich da weiterkomme.

Viele Grüße
Achim

viegener · 05 Januar 2016, 14:34:30

Zitat von: Achim am 05 Januar 2016, 14:15:51
ich bekomme die HTTPSRV Definition nicht zum funktionieren.

Das sollten wir gelöst bekommen. Ein paar Fragen und DInge die mehr Klarheit bringen sollten:

1) Läuft FHEM unter dem Benutzer fhem?

2) Ist FHEM wirklich /usr/share/fhem installiert (bei mir in /opt/fhem). Das heisst ist das Wurzelverzeichnis von FHEM wirklich /usr/share/fhem?

3) Kann es sein, dass noch alte HTTPSRV-Definitionen "herumspuken". Also mach vielleicht mal einen

Code Auswählen

list TYPE= HTTPSRV im FHEM und schaue mal ob da mehr als eine Definition ist.

4) Gibt es vielleicht FTUISRV-Definitionen? analog HTTPSRV?

5) Was passiert beim Aufruf von https://raspberry-prod.fritz.box:8083/fhem/www/tablet/sub5.html (Fehler oder Inhalt)?

christian-ruh · 05 Januar 2016, 14:58:54

Hallo,
gleich mal vorweg, Tablet UI ist super.
Hab fast alles einbinden und anpassen können.
Probleme hab ich mit der Fritz DECT200. Da kommt der Wert mit der Einheit vom Device.
Also z.B. "475.6 W". Somit ist es nicht möglich die Text-Farbe ab einem gewissen Wert zu ändern.
Folgendes hab ich in der INDEX Datei:

Code Auswählen


		<div data-type="label" data-device="FBDECT_17" 
			data-get="power" 
			data-limits='["0","500","2000"]' 
			data-colors='["#004d1a","#cc5200","#990000"]'
			class="cell big">
		</div>

Da der eingelesene Wert von "power" also keine reine Zahl ist sondern das " W" dranhängt funktioniert das nicht.
Gibt es dafür eine Lösung (z.B. die letzten 2 Zeichen abschneiden)?

Ich bedanke mich für Infos.
Einen schönen Tag noch.
Gruß
Christian

SvenJust · 05 Januar 2016, 15:18:35

Hallo,

Bei Zahl mit Einheit darf nur die Zahl im Label benutzt werden. Dafür gibt es

Code Auswählen

data-part="1"

VG
Sven

christian-ruh · 05 Januar 2016, 15:44:46

Wow, super.
Vielen Dank Sven für den Hinweis. Es funktioniert.
Gruß Christian

Achim · 05 Januar 2016, 16:29:18

Hallo viegener,

Zitat2) Ist FHEM wirklich /usr/share/fhem installiert (bei mir in /opt/fhem). Das heisst ist das Wurzelverzeichnis von FHEM wirklich /usr/share/fhem?

da liegt wohl der Fehler. Mein Wurzelverzeichnis ist /etc. Meine fhem.cfg is im Verzeichnis /etc.

Zitatroot@raspberry-prod:/usr/share/fhem/www/tablet# ps aux | grep fhem
fhem 4682 11.5 23.8 46384 44124 ? S Jan04 165:03 /usr/bin/perl /usr/bin/fhem.pl /etc/fhem.cfg
root 6994 0.0 0.9 3548 1804 pts/0 S+ 16:24 0:00 grep fhem

Mit der Definition

Code Auswählen

define TABLETUI HTTPSRV ftui/ ../usr/share/fhem/www/tablet Tablet Frontend
funktioniert der Aufruf aus der fhem-Oberfläche heraus.

Wenn ich allerdings

Code Auswählen

https://raspberry-prod.fritz.box:8083/fhem/ftui
direkt als URL eingebe (ohne / als letztes Zeichen), wir die fhem-Oberfläche mit der FTUI Oberfläche überlagert. Mit "/" als letztes Zeichen geht es. Das Thema hast du gestern mit roman1528 schon hier im Thread diskutiert. Gibt es da eine Lösung?

Zitat5) Was passiert beim Aufruf von https://raspberry-prod.fritz.box:8083/fhem/www/tablet/sub5.html (Fehler oder Inhalt)?

mit dem Aufruf bekomme ich nur eine reine Textanzeige mit "Punkten" und nicht die gewünschte "Fensteranzeige"

Zitat
EXAMPLE1
EXAMPLE2
EXAMPLE3
EXAMPLE4
EXAMPLE5

Ich habe mal meine HTML Dateien von meiner Grundstruktur angehängt. Ich habe die aus einem Beispiel von hier.

Viele Grüße
Achim

kvo1 · 05 Januar 2016, 16:59:16

Zitat von: viegener am 05 Januar 2016, 01:10:38
Ich denke warum setstate das defer aufgenommen hat, kann er vermutlich selber besser erklären.
In Deinem HTML ist aber wohl eine Mischung von Skripts die sofort ausgeführt werden und welchen die defer verwenden. Problem ein grosser Teil der Skripte setzt aufeinander auf und insbesondere das jquery.min.js ist elementar für alle widgets und auch alle anderen Skripte die jquery im Namen haben.

Eine Alternatvie wäre also alle Skripte auf defer zu setzen.

Hallo Johannes,
ich habe die index.html mal entsprechend geändert, alle ohne defer !

Der Aufruf geht generell nur so (mit / )

define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI

Beim Start kommt meist eine leere Seite ausser das die 3 frames
- menu-datetime.html
- main-menu.html
- status.html

zu sehen sind, ohne Inhalt bzw. wird Datum/Uhrzeit im main-menu.html dargestellt.

in der Browsereingabe steht http://server_oder_ip:8083/fhem/ftui/

Müsste da nicht die erste Seite aus der main-menu.html erscheinen?

also in meinem Fall so http://server_oder_ip:8083/fhem/ftui/subw1.html

Nach mehrmaligem strg+f5 steht dann http://server_oder_ip:8083/fhem/ftui/#subw1.html

Oft kommt es auch vor, das nach dem umschalten der SUB´s wieder die icon´s im Menü (main-menu.html) fehlen,
als ob diese nicht ordentlich geladen wird !?

Gruss
Klaus

PS. Das ist bei FireFox und Safari gleich

viegener · 05 Januar 2016, 17:00:14

@Achim:

Ich würde vorschlagen dann Deine HTTPSRV-Definition ähnlich wie Du sie angelegt hast zu machen:

Code Auswählen

define TABLETUI HTTPSRV ftui /usr/share/fhem/www/tablet Tablet Frontend
Also also absoluter Pfad, damit es da keine Probleme gibt. Dann solltest Du allerdings in Deine index.html noch den kurzen Javascript-schnipsel aus meinem Post miteinzubauen (Das ist auch die von mir bevorzugte Lösung für das von Dir beschriebene Problem, dass der / nicht am Ende steht).

Du kannst auch

Code Auswählen

define TABLETUI HTTPSRV ftui/ /usr/share/fhem/www/tablet Tablet Frontend
nehmen, wenn es bei Dir funktioniert, HTTPSRV ist da inzwischen deutlich fehlertoleranter.

Gibt es einen Grund warum bei Dir FHEM (Tablet) und Konfigurationsdateien so verteilt sind?
Ok Daten und Konfiguration entsprechend zu verteilen ist ja eigentlich normal, aber für FHEM macht es manche Dinge schwieriger (abweichende Pfade bei Infos im Forum, Sichern einer kompletten FHEM-installation ist schwieriger, denn dazu gehören eigentlich auch viele anderen Dateien.

viegener · 05 Januar 2016, 17:11:12

Zitat von: kvo1 am 05 Januar 2016, 16:59:16
Hallo Johannes,
ich habe die index.html mal entsprechend geändert, alle ohne defer !

Der Aufruf geht generell nur so (mit / )

define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI

Beim Start kommt meist eine leere Seite ausser das die 3 frames
- menu-datetime.html
- main-menu.html
- status.html

zu sehen sind, ohne Inhalt bzw. wird Datum/Uhrzeit im main-menu.html dargestellt.

in der Browsereingabe steht http://server_oder_ip:8083/fhem/ftui/

Müsste da nicht die erste Seite aus der erscheinen main-menu.html ?

also in meinem Fall so http://server_oder_ip:8083/fhem/ftui/subw1.html

Nach mehrmaligem strg+f5 steht dann http://server_oder_ip:8083/fhem/ftui/#subw1.html

Oft kommt es auch vor, das nach dem umschalten der SUB´s wieder die icon´s im Menü (main-menu.html) fehlen,
als ob diese nicht ordentlich geladen wird !?

Gruss
Klaus

PS. Das ist bei FireFox und Safari gleich

Hallo Klaus,
ja der URL-Aufruf ohne / am Ende also

Code Auswählen

http://SERVER_oder_IP:8083/fhem/ftui kann nur gehen, wenn in der index.html das von mir gepostete Javascript enthalten ist. Wie schon beschrieben ist HTTPSRV inzwischen fehlertoleranter, so dass Du auch mit der Definition

Code Auswählen

define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI arbeiten kannst, wenn es das einfacher macht.

Ich habe Deine Dateien bei mir (Windows/Firefox und Chrome) installiert und laufen lassen, Nach entfernen des defers sind die Fehlermeldungen zu unbekanntem $ im log verschwunden. Welche Plattfomr und welchen Browser verwendest Du?

Die Seite:

Code Auswählen

http://SERVER_oder_IP:8083/fhem/ftui/#subw1.html

ist auch richtig, denn eigentlich wird ja immer noch die Einstiegsseite (index.html bzw. leer) gezeigt und in dieser Seite eingebettet (#) der pagetab subw1.html. Damit ist das eigentlich aequivalent zu

Code Auswählen

http://SERVER_oder_IP:8083/fhem/ftui/index.html#subw1.html

Mainmenu und menu-datetime werden so nicht im aktuellen fenster geladen sondern vom Javascript im hintergrund. Deshalb werden diese in der Adresszeile des Browsers auch nicht angezeigt.

Ein Refresh mit F5 oder Strg-F5 deutet auf ein komplett getrenntes Problem hin (Netzwerkaussetzer / Geschwindigkeit des FHEMservers)?
Ohne Infos zu Plattform und Browser ist das aber raten

Aladin222 · 05 Januar 2016, 17:26:25

hi @all ,

ich bräuchte mal Hilfe beim einbinden eines Himematic Dimmers :

Code Auswählen

<div data-type="label" class="narrow">Wohnzimmer</div>
							<div data-type="dimmer" data-device="WzDimmer" class="cell
                          data-get="onoff"
                          data-get-on="1" data-get-off="0"
                          data-set=""
                          data-set-on="on" data-set-off="off"
                          data-dim="pct">
                      </div>

Der Dimmer lässt sich über das Tablet UI schalten

-wenn ich den Button drücke ( ein 100% und 0% aus ) allerdings wird der Zustand nur auf dem Tablet UI angezeigt, welches benutzt wurde ! ( iPad )
Auf dem Tablet UI auf dem iMac wird der Button nicht auf "eingeschaltet" angezeigt

Die Dammstufen werden allerdings komplett richtig auf allen Endgeräten übernommen , nur der Button nicht ..... was mache ich denn da falsch ?

Das Bild im Anhang zeigt den Ausschnitt auf dem iMac ( Tablet UI ) nachdem über das iPad der Dimmer eingeschaltet wurde

Also es wird nur der Dimmlevel übernommen ,der eigentliche Button zeigt immer noch "aus" an .

thx

Aladin212