FTUI 2.6/2.7

Hier nun die Demo meiner FTUI in der Version 2.6.

Wie immer gibt es das ganze als Download am Ende des Beitrags. Als kleiner Tipp: Übernehmt meine Files nicht 1 zu 1 sondern lasst euch nur davon inspirieren was mit FTUI, CSS und JavaScript möglich sein kann. Es macht wenig Sinn die UI so zu übernehmen wie sie ist wenn euch all meine Devices fehlen und es zu keiner Darstellung kommt.

Wie auch schon zuvor in der Version 2.2/2.4 (schaut euch das Video an) sind hier einige Spielereien wie ausklappbare Felder mit weiteren Bedienelementen, JavaScript-Abfragen und diverse Darstellungstricksereien drin. Lass euch davon nicht irritieren!

warning 32 Alle Funktionen sind nur in Fully (Android) und Mozilla Firefox getestet.

information 32 Bei den folgenden Bildern sind (fast) alle Felder ausgeklappt ("Pfeil" zeigt nach oben).

 

 

Eventuell lasse ich mich noch dazu hinreißen wieder ein Video zu machen, um die Funktionen live zu erleben...

 

Weitere Info's und Verwendungshinweise zu FTUI findet ihr HIER

 

Datei Größe Datum
roman1528_FTUI2.6.zip 4,22 MB 11.06.2017
roman1528_FTUI2.7.13.zip 5,90 MB 09.04.2019

 

Auch hierzu wieder meine fhem.cfg: -> fhem.cfg

 

Kommentare  

0 # Menüpunkt listenAndreas 2019-07-25 20:04
Ich nochmal,
auf der Seite Listen verwendest du ein device PostMe. Ist dass das Postme Modul? Ich konnte es in deiner fhem.cfg nirgends finden.
Vielen Dank vorab
Antworten | Antworten mit Zitat | Zitieren
0 # PostmeRoman 2019-07-25 20:23
Ja, ist das Postme Modul.

Grüße
Antworten | Antworten mit Zitat | Zitieren
-1 # PostmeMarcel 2019-08-16 21:23
Hallo Roman,

besteht die Möglichkeit den Teil Deiner cfg mit der Postme definiton zu bekommen?

Gruß Marcel
Antworten | Antworten mit Zitat | Zitieren
0 # PostMe cfgRoman 2019-08-17 11:04
Moin... natürlich. Aber bringt das was?

define PostMe PostMe
setuuid PostMe XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXXXXXX
attr PostMe event-on-change-reading .*
attr PostMe group Informationen
attr PostMe room Status

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # FehlerMarcel 2019-08-24 20:02
Hi,

Ich versuchen gerade postme und deine tabletui.
Leider hab ich den Fehler
File not found: ./www/tablet//Initialized
Beim hinzufügen von Notizen
Jemand ne Idee?

Gruß Marcel
Antworten | Antworten mit Zitat | Zitieren
0 # LinkRoman 2019-08-24 20:04
Mit dem Link-Widet stimmt seit einiger zeit etwas nicht. es ist scheinbar nicht mehr zum senden mit values gedacht...

geht es denn wenn du etwas in das textfeld eingibst und enter (tastatur) drückst?
Antworten | Antworten mit Zitat | Zitieren
0 # LinkMarcel 2019-08-25 17:37
Hallo Roman,

stimmt. Ohne einen klick auf das Link-Widget funktioniert es.

Gruß Marcel
Antworten | Antworten mit Zitat | Zitieren
0 # deine FTUI OberflächeAndreas 2019-07-25 18:21
vielen Dank das du deine Variante zum Download angeboten hast. Konnte ich sehr leicht auf meine Config anpassen, und hab jetzt ne stylische Oberfläche. Konte nirgends nen Paypal donate oder so finden? Würde dir gerne was zukommen lassen als dank
Antworten | Antworten mit Zitat | Zitieren
0 # PayPal DonateRoman 2019-07-25 21:40
Hey.

Da du nicht der Erste bist der danach gefragt hat, habe ich jetzt mal so einen Button eingefügt.

Vielen Dank im Voraus

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # Packstation FTUI2.7Marcel 2019-06-02 13:28
Hallo Roman,

heute hab ich seit langem mal wieder Zeit gehabt und hab auf Deiner Seite geschaut. Da ist mir auch gleich den FTUI2.7 ins Auge gefallen. :D
Mich würde der Hintergrund von der Packstation interessieren?!

Gruß Marcel
Antworten | Antworten mit Zitat | Zitieren
0 # PackstationRoman 2019-06-12 17:37
Moin.
Auf meinem Smartphone habe ich Tasker laufen. Es wird der SMS-Eingang überwacht. Wenn eine SMS von DHL kommt wird diese per HTTP(S)-Request an FHEM in ein Dummy geschickt. Hier dann per userreading die mTAN ausgelesen und in ein eigenes Reading geschreiben. Ist dieses Reading nicht 0 (Null) wird das Symbol in FTUI blau und als "data-warn" die mTAN angezeigt.

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # onclick (in der Wettervorhersage) automatisch zurücksetzenPeter 2019-05-04 08:31
Hallo Roman,

in der Datei content_wetter verwendest Du im auskommentierten Teil (Vorhersage) onclick auf den Vorhersagetag, um weitere Informationen zu dem entsprechenden Tag einzublenden. Zum Schließen dieser Einblendung muß man wieder draufklicken. Wenn man diese weiteren Informationen offen läßt (also nicht mehr "zu-klickt") und die Seite stehen läßt, kommt irgendwann der Screensaver, der aber nicht die ganze Ansicht überdeckt, die aufgeklappten Informationen bleiben stehen.

Gibt es eine Möglichkeit, den "zu-Klick" automatisch nach einer bestimmten Zeit auszulösen, um die Seite wieder auf die Standardgröße zu reduzieren?
Ich suche so etwas ähnliches wie den "data-return-time" bei popup.

Gruß und dickes Lob und Danke für die freundliche Bereitstellung der Oberfläche

Gruß
Peter
Antworten | Antworten mit Zitat | Zitieren
0 # ^^Roman 2019-06-12 17:40
Moin.
Ich habe mir das mal ein wenig angeschaut. Es ist definitiv möglich, bin aber noch zu keiner schönen Lösung gekommen.

Rein theoretisch wird bei mir aber immer komplett zum Seitenanfang (scroll.top) gescrollt bevor der Screensaver aktiviert wird. Irgendwo hatte ich das auch schon mal gepostet. Ich suche das nochmal raus.

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # Beitrag scrollTopRoman 2019-06-12 17:43
Da ist es^^

https://forum.fhem.de/index.php/topic,44177.msg927891.html#msg927891

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # 'FTUI-Smartphine-AnsichtAndi 2019-04-09 14:07
Servus Roman erstmal vielen Dank für diese tolle Vorlage!!

Ich bin noch realtiv neu im HTML/CSS Spektrum und habe
deinen Ordner komplett in meinen www/tablet kopiert aber wenn ich die Seite mit dem Smartphone aufrufe wird mir alles nur in Textform angezeigt.

Was läuft da falsch bei mir??

Falls du Zeit und Lust hast mir zu helfen kann ich dir auch gerne einen Screeenshot davon schicken, hier habe ichnichts anhängen können.

MfG und nochmals Danke für die Mühen!!!
Antworten | Antworten mit Zitat | Zitieren
0 # ^^Roman 2019-04-09 14:30
Moin Andi.
Ein Problem könnte sein, welches ich auch versucht habe ganz oben zu erleutern, dass du 1 zu 1 kopiert hast.
Du hast in deinem FHEM doch gar nicht meine Devices. So kann es beim start/laden von FTUI dazu kommen, dass er abbricht und die Seite nicht fertig lädt.

Alternativ ist es immer eine gute Idee die Seite "absolut" aufzurufen, also:
http(s)://[IP]:[PORT]/fhem/tablet/index.html
So können die relativen Pfadangaben zu den Ressouren besser verarbeitet werden.

Ansonsten schick mir mal eine Mail über das Kontaktformular. Ich antworte dir, anschließend kannst du mir Info's über Browser, URL-Aufruf und Screenshots schicken.

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # vertikaler Zeilenabstand, ElementeabstandPeter 2019-04-08 19:37
Hallo Roman,

erstmal ein dickes Lob für die gute Arbeit und vor allem für die Bereitstellung der Dateien.

Ich habe inzwischen dank Deiner Vorlage die Dateien (eigentlich nur die content_...) an meine Komponenten angepasst. Aber seit einem FHEM update all (dabei wird auch www-tablet aktualisiert) hat sich der Zeilenabstand bei den Zeilenumbrüchen sowie der Abstand zwischen den Linienelementen (inline-block) deutlich vergrößert, das sieht leider gar nicht mehr gut aus. Was wurde mit dem Update geändert, daß so etwas passiert? Was kann ich ändern, damit dies nicht bei jedem Update wieder passiert?
Ich habe leider viel zu wenig Ahnung, um die Ursache zu lokalisieren un zu ändern.

Gruß, Peter
Antworten | Antworten mit Zitat | Zitieren
0 # line-highRoman 2019-04-09 14:25
Moin Peter.
In der Tat hat setstate vor 2-3 updates die line-high angepasst bzw. wohl wieder auf Normalwerte gesetzt.
Ich habe gerade mal meine -user.css durchgestöbert, aber nichts gefunden was das fixen könnte. Und ehrlich gesagt ist das auch schon eine Weile her und ich erinnere mich nicht mehr daran, was ich getan habe, damit es wieder passt.

Ich lade im laufe des Tages mal meine aktuellen Files als 2. Download hoch. vielleicht kannst du dann unterschiede herausfiltern.

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # lline-highPeter 2019-04-15 15:11
Hallo Roman,

nachdem ich 2 Tage Unterschiede gesucht habe und mit versuchter Fehlerbereinigung meine Oberfläche endgültig zerschossen habe (gottseidank gibt es eine Sicherung), habe ich einen anderen Weg versucht: ich habe einfach alle Verzeichnisse im Ordner tablet aus Deiner neuen Version übernommen und die content_xxxx unverändert von meiner Version gelassen - und es funktioniert wieder! Spaßeshalber habe ich nochmal ein update des ftui versucht, auch dieses hat jetzt nichts mehr zerstört.
Dieser Lösungsweg hat zwar jetzt nicht den Lernfaktor für mich gehabt, aber wenigstens läuft es so wieder.

Danke für die freundliche Unterstützung!
Gruß, Peter
Antworten | Antworten mit Zitat | Zitieren
0 # Das "X" => fully.exitEike 2017-11-01 14:03
Hallo Roman,

mir macht die Anpassung Deiner FTUI Dateien viel Spaß. Mir ist allerdings nicht klar wo die in der Index.html hinterlegte Funktion zum Beenden von Fully definiert werden muss.
Antworten | Antworten mit Zitat | Zitieren
0 # XRoman 2017-11-03 19:42
Moin.

index.html Zeile 224

... div onclick="fully.exit()" ...

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # X - mir fehlt GrundwissenEike 2017-11-06 21:30
Moin Roman,

danke für den Hinweis. Die Stelle onclick="fully.exit()"... habe ich. Aber ist das nicht eine Variable, die irgendwo definiert werden muss? Fully sagt beim Klick "Index.html: 238 / ReferenceError: fully is not defined".

Grüße,
Eike

p.s. Hatte ich eigentlich erwähnt, dass ich keine wirkliche Ahnung von HTML oder Javascript habe?!?! Ich kann doch nur anpassen *grins*
Antworten | Antworten mit Zitat | Zitieren
0 # XRoman 2017-11-11 18:09
Moin.

fully.exit() ist eine Funktion welche von Fully selbst bereitgestellt wird.

Damit diese "integriert" wird musst du in den Fully Einstellungen die WebSite-Integration aktivieren.

Settings -> Other-Settings -> Enable Website Integration (PLUS)

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # XEike 2017-11-14 15:06
Ah, ok. Das wusste ich nicht. Nun bin ich wieder ein Stück schlauer. Danke :).
Antworten | Antworten mit Zitat | Zitieren
0 # AntwTorsten 2017-10-31 18:33
Hi Roman,
vielen Dank für Deine schnelle Antwort.
Leider hat es bei mir nicht funktioniert.
Habe es, wie beschrieben, in die fhem-tablet-ui-user.css eingetragen.
Die Position innerhalb des Files ist doch egal, oder?

Viele Grüße!
Antworten | Antworten mit Zitat | Zitieren
0 # Seite zu "lang"Roman 2017-10-31 20:42
In der tat...
ich hatte erst den Fehler gemacht und es in der fhem-tablet-ui.css geändert. Gestern bei meiner Antwort korrigiert und es funktioniert jetzt auch nicht mehr.
Wenn du allerdings folgendes ind deine fhem-tablet-ui-user.css einfügst läuft es:

html,
body,
main,
.page {
height: calc(100% - 55px) !important;
width: 99.99% !important;
}

Grüße^^
Antworten | Antworten mit Zitat | Zitieren
0 # Seite zu großTorsten 2017-10-30 09:18
Hallo Roman,
zunächst Danke für das Teilen Deines tollen FTUI.
Mir ist aufgefallen, dass die Seite zu groß ist, sprich es ist immer ein Scrollbalken vorhanden.
Dies trifft auch auf bei Seiten auf, die die volle Seitengröße nicht verwenden, beispielsweise bei "Einstellungen.
Es scheint, als würde die Header Leiste dem Body hinzugerechnet.

Hast Du vielleicht eine Idee, wie man das Lösen könnte?

Viele Grüße
Torsten
Antworten | Antworten mit Zitat | Zitieren
0 # Seite zu "lang"Roman 2017-10-30 21:01
Moin.

Genau das habe ich gestern Mittag tatsächlich in den Griff bekommen...

fhem-tablet-ui-user.css -> folgendes hinzufügen:

.page {
height: calc(100% - 55px) !important;
width: 99.99% !important;
}

- 55px ist die Höhe der Navigations- bzw. Titelleiste oben. Wenn du dort eine andere Größe hast musst das natürlich dementsprechend ändern.

width auf 99.99% weil ich auch in der Breite hier und da eine Unstimmigkeit hatte.

Grüße^^
Antworten | Antworten mit Zitat | Zitieren