eberueck.comFTUI 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!
Alle Funktionen sind nur in Fully (Android) und Mozilla Firefox getestet.
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
ich würde gern noch das "blau" im Volumen-Slider vom Sonos bei gestoppt ebenfalls ausgrauen oder von der Farbe den anderen Buttons anpassen. Erst wenn der Player gestartet ist dann wieder das "blau" über "data-background-color" einschalten. Hast du da eine Idee für?
Grüße^^
ja mit der Last wird stimmen.
Cooler wäre es schon mit "ausgrauen" bei Stop und einfärben bei Play. Viecht wenn ich mal 98% umgesetzt habe mache ich mich dann da mal dran.
... das wird dauern ... :)
Gruß
ich fange gerade mit Tablet UI an und finde deine Arbeit / Style sehr ansprechend. Daher die Version 2.7 gewählt.
Nun häge ich an folgenden Problemen:
Bei den Sonos Geräten würde ich noch min. gern den Mute-Modus einbauen. Kommen aber nicht mit der Syntax zurecht. Kannst du mir hier helfen?
Zweiter Wunsch die Senderliste als "circlemenu" mit den Sendericons. Wo müssen die Icons liegen oder eingebunden werden?
Dankeschön
Gruß Alex
Hi.
Ich habe bei mir auf einen Mute-Button verzichtet, weil man auch einfach auf Stop oder Pause drücken könnte...
Möglich wäre aber:
//gestrichen, weil geht nicht.
Ich habe nur leider feststellen müssen, dass das Reading Mute kein Event erzeugt... somit bekommt ftui keine Änderung des Mute-Status mit...
Mit einem Push-Widget würde das so gehen:
// Push-Widget - Mail mir...
Man bekommt nur leider nicht den aktuellen Status angezeigt.
Circle-Menu benutze ich persönlich auch gar nicht bzw. ungern wegen dem Platzbedarf des Widgets. Solltest du das aber unbedingt haben wollen, schreib einfach nochmal, dann kann ich sicherlich was zusammen bauen.
Grüße^^
habe dir eine E-Mail geschickt
zunächst einmal vielen Dank für die exzellente Arbeit und Veröffentlichungen der Beispiele. Ich habe zunächst beide Versionen ausprobiert, die 1.x und die 2.6. Letztendlich habe ich mich aus rein optischen Gründen für die 1.x entschieden. Ich konnte fast alles übernehmen und war sehr glücklich, dass alles funktioniert. Gestern habe ich dann über FHEM das Update durchgeführt, dabei wurde auch FTUI aktualisiert. Leider wurde im FTUI einiges zerschossen. Einige meiner Einträge wurden gelöscht/ersetzt, das war nich schlimm da ich es relativ schell rekonstruieren konnte. Es funktioniert wieder alles, leider ist jedoch das Gesamtbild "verkleinert". Die Page Buttons sind nicht mehr untereinander sondern verkleinert nebeneinander.Kannst du mir die Stelle nennen, wo ich Einfluss nehmen kann um auf die ursprüngliche Darstellung zu kommen? Besten Dank.
Das ist genau das was ich immer sage...
Ihr sollt keine 1:1 Kopien machen sondern euch nur inspirieren lassen.
Zudem sollte jedem klar sein, dass man immer erst ein Update machen sollte... wie bei einer FHEM-Neuinstallation.
Da ich aktuell kein Pagetab mehr verwende und auch meine alte Vorlage ja komplett über den Haufen geworfen habe, kann ich dir leider nicht sagen was du ändern müsstest. Zudem besitze auch ich leider keine Glaskugel... Ich weiß also nicht wie es gerade bei aussieht. Schick mir doch mal eine Mail (Kontakt) mit Screenshots oder so.
Grüße^^
In der Content_home ist die Rede von einer „doif_heatingcontrol_auto“
Und ein dazugehörigen dummy „heatingcontrol_dummy“
In deiner config kann man leider nichts finden dazu
Wäre nett wenn du mir das gibst möchte gern deine Heizungssteuerung
Nachbauen habe hier ähnliche Hardware
Ines
Wollte den Teil mit der Heizungsteuerung
nachbauen nur leider paßt deine fhem.cfg
nicht mehr dazu.
Kannst du vielleicht den relevanten Teil dazu hier
posten oder per email
Danke Ines
Was genau meinst du? In den Räumen der Teil unter "Soll-Temperatur"?
Grüße^^
bin auch über deine Oberfläche gestolpert und möchte gerne die Logik für das Ein-/Ausklappen in meine Oberfläche übernehmen.
Ich habe dazu den Code aus Deinem Ambilight Beispiel kopiert. Grundsätzlich funktioniert das auch, allerdings sind beim mir die Elemente standardmäßig eingeblendet. Bei Dir sind diese jedoch standardmäßig ausgeblendet. Hast Du ne Idee, was ich noch anpassen muss?
Viele Grüße
Marc
Damit du etwas sichtbar machen kannst (ausklappen) muss es natürlich ersteinmal unsichtbar (eingeklappt) sein. Dazu in deine ...-user.css folgendes:
#dropambi {
display: none;
}
Damit sollte es klappen. "#dropambi" musst du natürlich anpassen, solltest du die id="" von deinem "dropdown" geändert haben
Grüße^^
ja, das war es.
Ich danke Dir, für Deine Hilfe.
LG
Marc
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
Grüße
besteht die Möglichkeit den Teil Deiner cfg mit der Postme definiton zu bekommen?
Gruß Marcel
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^^
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
geht es denn wenn du etwas in das textfeld eingibst und enter (tastatur) drückst?
stimmt. Ohne einen klick auf das Link-Widget funktioniert es.
Gruß Marcel
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^^
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.
Mich würde der Hintergrund von der Packstation interessieren?!
Gruß Marcel
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^^
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
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^^
https://forum.fhem.de/index.php/topic,44177.msg927891.html#msg927891
Grüße^^
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!!!
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^^
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
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^^
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
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.
index.html Zeile 224
... div onclick="fully.exit()" ...
Grüße^^
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*
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^^
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!
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^^
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
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^^