FTUI 2.2/2.4

Hier meine Demo der FTUI 2.2/2.4 als Video.

Basierend auf dem Slideout-Menü plus einigen Java-Script-Spielereien (SlideUp/Down; Bestätigungsabfragen, CSS-Effekte).

Grundsätzlich für den Fully Fullscreen Browser optimiert inkl. Java-Script-Steuerung (Schließen des Browsers).

  Stand: 13.01.2017

Die Sektion "Anrufe" auf der Seite "Home" lässt sich auch ausklappen. Diese habe ich allerdings aus Datenschutzgründen herrausgeschnitten.

Die drehende Sanduhr ist das von mir geschriebene Widget "loading", welches, zugegeben, nicht 100%ig funktioniert aber seinen Zweck erfüllt. "loading" ist im FTUI Repository verfügbar.

Auf der Seite "DWD" ist lediglich das von mir verbesserte Widget "gds" eingefügt. Auch "gds" ist über das FTUI Repository verfügbar.

Weitere Info's und Verwendungshinweise zu FTUI findet ihr HIER

Die html-Files stelle ich wieder in einer ZIP-Datei zur Verfügung:

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

Viel Spaß!

Grüße^^

Comments are now closed for this entry

Kommentare

0 # Fully Exit klappt nicht — Marcus 2017-05-08 06:46

Hallo.
Spitzen Oberfläche.
Ich habe aber ein kleines Problem. Wenn ich oben rechts auf das X klicken will um alle aufgeklappten Felder zu schließen erhalte ich immer den Error, fully exit nicht konfiguriert. Finde aber nicht, wo oder wie ich den einrichten muss. Kannst Du mir mal bitte sagen, was ich da tun muss. Danke.

0 # Fully Exit — Roman 2017-06-09 17:37

Moin.

Vorraussetzung dafür ist natürlich, dass du FTUI in der Fully App für Android geöffnet hast. Und es hat auch nichts mit aufgeklappten Feldern zu tun, sondern damit schließt du die Fully App.
Dein Kommentar liest sich so als wäre das nicht klar.

Um die Funktion richtig nutzen zu können, muss in den Fully-Einstellungen die Option "Enable Website Integration" unter "Other Settings" aktiviert sein.

Grüße^^

0 # Icons & FTUI2.6 — Christian 2017-04-16 10:08

Hallo, tolle Arbeit.
Ich habe ftui 2.6 laufen und versuch es grad für mein Lumia Startklar zu machen.
Woher kommen die ma Icons bei den Anrufen. Die werden bei mir nicht angezeigt?

Ist schon in Aussicht wann bei Dir die 2.6 Config hochgeladen wird?

Vielen Vielen dank

0 # Fehler bei ftui — Sven 2017-04-10 14:20

Kann ich direkt ftui 2.4 nutzen oder muss ich 2.2 verwenden? Habe beides ausprobiert und erhalte beim Start immer...
×
Error
ShortPoll Request Failed, will retry in 3s
error, Bad Request

muss ich in meiner fhem.cfg noch etwas anpassen ?

0 # Slide up/down mit IOS / iPhone — Thomas 2017-03-23 10:19

hi, hich habe gerade das Slide up/down für mein Tablet UI 2.2 übernommen.

Am Windows Recher klappt der Slider wie gewünscht auf (Firefox/Chrome)
Auf dem iPhone und iPad (Safari,Chrome) wird es nicht aufgeklappt. An was könnte dies liegen?

0 # iOS — Roman 2017-03-25 18:45

Moin.
Wie schon oft erwähnt kann ich niemandem bei Problemen mit iOS helfen...

Tatsache ist: Bei Push-Widget funktioniert onclick nicht richtig bis garnicht! Auf Windows (Firefox und Chrome) funktioniert's, auf Android nicht.

Ich habe das so gelöst:



EDIT
P.S. Deine Mail-Adresse läuft nicht...

0 # Möchte nur das umliegende — Stefan 2017-03-21 22:19

Hi Roman.
Sieht immer wider super aus was du so machst. Ich würde gerne nur das mit der Blauenleiste oben und das wo die einzelen Räume drunter sind benutzen. Mein problem liegt aber darin das ich nicht finde wie ich wieder normale Kächsten bekomme. So wie im in deinem 1. Modul. Kannst du mir oder vielleicht wer anders dabei helfen??

danke schon mal im vorraus

0 # gridster — Roman 2017-03-25 18:42

Moin.

Du kannst Gridster genau so weiter verwenden wie sonst auch... theoretisch... hab's nicht getestet.

Einfach den Inhalt der div auf den content_*.html Seiten ändern... wie gewohnt mit gridster-elementen befüllen.

Grüße^^

0 # Danke — Stefan 2017-03-25 20:29

Danke werde es probieren

0 # Klappt nicht — Stefan 2017-03-26 12:55

Hi Roman.

Du sag mal hast du irgendwo noch eingetragen das es sectionen sein sollen?? Ich kann so leider nix finden. Den ich habe meine andere (alte Tablet ui) so umgebaut wie es hätte klappen müssen, diese sortiert er leider nur weiterhin als Sectionen an.

0 # muss klappen — Roman 2017-03-26 15:11

Leider habe ich bei mir gridster völlig eliminiert... deswegen kann ich auf die schnelle nix testen.

Aber:



Du musst halt alles so machen wie von anfang an bei gridster... nur dass die gridster-elemente in die div auf der jeweiligen seite müssen.

gridster konfiguration im "head" auf der index.html nicht vergessen.

schon blöd dass man für ftui so massive html kenntnisse braucht -.-

Grüße

0 # danke — Stefan 2017-03-26 20:52

schon blöd dass man für ftui so massive html kenntnisse braucht -.-

Ja das ist schon sehr blöd. Und ja ich tu mich damit auch echt schwer. Aber es wird besser ;)

0 # FTUI-Widget - GDS — Roman 2017-03-19 14:36

Das Widget ist aktuell, läuft ab Version 2.6 stabil und ist HIER zu finden.

Grüße^^

0 # Tablet ui kein update der icons — Erwin 2017-03-08 18:15

Hallo Roman, gratuliere zu deiner Arbeit hat mir sehr geholfen;-)) Konnte vieles bei meiner Steurung einbauen, leider macht meine tablet ui kein updates mehr. Sitze sicher schon 3 Tage dabei. Schalten funktioniert nur di icons ändern den Satus nicht. Hast du irgend eine Idee woran es liegen kann.
Danke SG Erwin

0 # Update? — Roman 2017-03-09 19:32

alles updaten... und ggf. FTUI wieder auf longpoll stellen. Ich arbeite auch wieder mit longpoll statt mit websocket, weil sonst 2 meiner tablets ihren dienst quittieren.

Grüße^^

P.S. Forum lesen hilft immer! Stichwort csrf-Token. Ich habe Ihn auf none gestellt (fhem)

0 # Wetterwarnung — Ingo298 2017-03-08 12:33

Funktioniert bei Dir aktuell in der FTUI 2.4 die Wetterwarnung über das GDS Modul noch ??
Bei mir werden leider nur noch alter alert in FTUI angezeigt in Fhem selber wird alles richtig angezeigt

0 # GDS — Roman 2017-03-09 19:30

Ja läuft.. allerdings habe ich parallel zu den FTUI Updates auch immer mein GDS-Widget aktualisiert.

Ich hänge es mal oben mit unter den Beitrag inkl. Beschreibung.

Grüße^^

0 # DropDown Funktion — Stefan 2017-03-07 14:41

Hallo Roman,
Zunächst mal vielen Dank für deine super Arbeit. Gefällt mir echt gut!
Ich habe allerdings Probleme mit selbst erstellten DropDown-Kästen. Habe die IDs geändert aber jetzt ist jeder Kasten mit neuer Idee von Anfang an geöffnet.
Ich schätze mal die IDs müssen noch irgendwo eingetragen werden, aber ich habe diese Stelle bisher noch nicht finden können.
Könntest du mir da weiterhelfen?
MfG, Stefan

0 # DropDown — Dominik 2017-03-07 21:14

Findest du in der fhem-tablet-ui-user.css unter #dropanruf {
display: none;
}

0 # DropDown — Stefan 2017-03-07 22:54

Vielen Dank :)

0 # dropDown — Roman 2017-03-09 19:28

Jep.. genau so^^

Grüße^^

0 # IOS WebClip Icon — Henrik 2017-02-12 23:52

Guten Abend und besten Dank für deine bereits getane Arbeit.
Ich habe folgendes Problem. Ich versuche unter IOS eine Homescreen-Verknüpfung anzulegen. Dies klappt auch, nur leider nimmt er das hinterlegte App-Icon nicht, sonder macht stattdessen einen Screenshot.
Verwendeter Code ist in der Index.html:

Ich nutze ein iPhone 6s, die Größe der icon.png entspricht 120px mal 120px.
Hast du evtl eine Idee hierzu?

0 # Nachtrag — Henrik 2017-02-13 15:44

Mir ist soeben aufgefallen, dass der Code in meinem gestrigen Post nicht angezeigt wird nach Index.html... Deshalb hab nun die zusätzliche Info:
Ich habe mich bei der Umsetzung an diese Anleitung gehalten: http://www.kylejlarson.com/blog/adding-an-icon-for-iphone-ipad-android-to-your-website/
Wenn ich die URL der Icons aufrufe, werden diese auch angezeigt. Füge ich allerdings die Website dem Startbildschirm des Iphones hizu, wird das hinterlegte Icon (egal in wecher Größe) nicht verwendet.

Mit freundlichen Grüßen

der Henrik

0 # Äpfel — Roman 2017-02-19 20:28

da kann ich dir leider nicht weiter helfen...
ich besitze keine äpfel und werde auch nie welche besitzen... ok.. zugegeben... eine ausnahme... MacBookPro... aber wer kann sich das schon leisten!

Da wirst mal in iOs Foren fragen müssen oder ggf. auch im Fhem-Forum... wobei ich der Meinung bin dass das da nicht ganz rein passt.

Grüße^^

0 # Schliessen Fully Browser und SlideUp/SlideDown — Markus 2017-02-12 12:58

Hallo erstmal großes Lob
Leider funktioniert in der 2.2 Version das schliessen der Fully App (keine Fehlermeldung)nicht dafür das SlideUp bei der Alarmanlage. Bei der 2.4 Version geht das schliessen der Fully App (ReferenceError:fully is not defined) auch nicht und das SlideUp woran kann das liegen?

Danke Gruß
Markus

-1 # fully & slide — Roman 2017-02-12 16:40

Für das schließen des fully-browsers musst du in den einstellungen von fully unter other settings die option enable website integration aktivieren... sowas steht auch in der fully doku

slideup/down sind funktionen aus jquery und sollten definitiv laufen... warum das nicht geht kann ich mir nicht erklären.
ist javascript deaktiviert?

Grüße^^

0 # SlideUp/SlideDown Alarm — Wladimir 2017-02-17 08:59

Hallo Roman, vielen Dank für die hervorragende Arbeit! Hut Ab!

Bezüglich SlideUp/SlideDown beim Alarm - ich habe festgestellt, dass onclick() mit javascript nicht funktioniert, wenn ein div Element mit data-type="push" besetzt ist. Bei mir zumindest.

Ich habe es so gelöst:






So funktioniert SlideUp/SlideDown, aber da kommt ein nächstes Problem, das so nicht lösbar ist - "OK" Button.
Hast du eine Idee, was man an der Stelle sonst noch machen könnte?

Viele Grüße
Wladimir

0 # Code — Wladimir 2017-02-17 09:03

Quellcode wurde nicht akzeptiert. Zweiter Versuch :)

div onclick="if ($('#dropstumm').is(':hidden')) { $('#dropstumm').slideDown(500); } else { $('#dropstumm').slideUp(500); }" class="fa-stack fa-2x">
i id="bg" class="fa fa-stack-2x fa-circle-thin" style="color: rgb(136, 136, 136);"> /i
< i id="fg" class="fa fa-stack-1x ro-volume-mute2" style="color: rgb(136, 136, 136);"> /i
/div

0 # fully & slide — Markus 2017-02-19 19:59

Java ist aktiviert bei FTUI 2.6 geht es auch nicht sehr kohmisch Schliessen funktioniert

0 # ftui & slide — Roman 2017-02-19 20:25

schließen und slideUp/Down sind zwei paar schuhe...
schließen ist vom fully-browser implementiert
slideUp/Down ist von jQuery implementiert.

was ich gerade festgestellt habe ist, dass slideUp/down aus meinem ursprung überall funktioniert ... nur nicht mit android webview!

selbst auf nem rechner läuft es in chrome einwandfrei.. auf android nicht... müsste man mal google anschreiben was die da vermurkst haben... wobei ich der meinung bin dass es in letzter zeit kein webview update gab... schade.. dann wohl doch mit dem workarround von Wladimir^^

Und was soll mit deinem OK-Button sein Wladimir?

Grüße^^

+1 # ftui & slide — Markus 2017-02-20 02:23

Wenn man auf OK klickt sollte sich das Ziffernblatt schliesen das macht es nicht. Wenn man daneben drückt schliesst es (onclick="$('#dropstumm').slideUp(500);") das meint bestimmt Wladimir genau so verhält sich das mit dem popup und (onclick="$('.dialog-close').trigger('click');")

-1 # Icons und Müllkalender — Rolf 2017-02-11 16:06

Hallo Roman, erst mal vielen Dank für die Arbeit die du hier leistest. Ich habe mal deine Demo 2.4 zum teil übernommen und für mich angepasst. Leider bekomme ich zum einen manche Icons nicht wie du sie hast. Z.b. der Telefonhöhrer ind Callist, die Icons für den Receiver lauter und leiser und auch nicht die Müll Icons sowie auch keien roten Zahlen für die Resttage. In Fhem bekomme ich die Resttage angezeigt. Irgeneine Idee?

Danke und Gruß Rolf

0 # icons — Roman 2017-02-12 16:37

moin.

wenn du in meine index.html schaust siehst du, dass da ein eigener icon-font eingebunden ist (roman) da ist unteranderem auch das sofa, die mülltonne und die lauter/leiser icons drin.

die müllsäcke sind aus dem fhem-icon-font und sollten ohne weiteres funktionieren.

das mit den roten zahlen sollte sich nach einem update (widget_button.js) erledigen ... damit hatte ich auch kurze zeit probleme.

Grüße^^

0 # Icons — Rolf 2017-02-12 21:44

Hallo Roman. Das mit dem müllkalender war ein Schreibfehler bei get device meinerseits . Die Icons gehen jetzt. Super danke!

Gruß Rolf

0 # FTUI — myhome 2017-02-02 21:24

Hi, erst einmal super Arbeit!! Mein Problem nach dem heutigen update von Fhem und ftui stimmen die Icongrößen nicht mehr. Die werden RIESIG. Im Menu wir der Text nur noch unter dem Icon angezeigt. Also die größe der Icon von large auf medium dann passt es wieder. Nur mit dem Menu kann ich machen was ich will, der Name steht immer unter dem Icon.
Grüße

0 # Menü — Roman 2017-02-10 10:20

Moin.

Die Probleme hatten wahrscheinlich alle...
Mit der Anpassung von setstate bin ich auch nicht ganz zufrieden...

Für das Menü musst du mit Ausrichtungen arbeiten: left-align, right-align etc.

Grüße^^

+1 # Müllicons — Veit 2017-01-24 11:37

Hi Roman, i

ich stelle gerade vom FTUI 1.X auf die 2.5 um. Jetzt fehlen mir bei den Mülltonnenicons die Roten Zahlen die die Tage bis zur Leerung angeben. Wie kann ich das fixen ??

+1 # Müllicons. — Roman 2017-01-29 12:51

Wurde bei mir durch ein update gefixed.

Grüße^^

0 # Tolle Arbeit / Darstellung — Matthias 2017-01-15 13:06

Hallo Roman,

tolle Arbeit!!!

Kann ich denn das Ganze auch auf dem Tablet quer gut darstellen? Da sieht es bei mir verzogen aus.

LG
Matthias

0 # Darstellung Landscape — Roman 2017-01-15 15:17

zitiere Matthias:

Kann ich denn das Ganze auch auf dem Tablet quer gut darstellen? Da sieht es bei mir verzogen aus.
Matthias

Ich nutze Fully zur Anzeige auf Tablets und Smartphones.
Dort kannst du in den Einstellungen mit dem Zoom herumdoktorn.
Im Fully: Settings -> Zoom and Scaling -> Initial Scale

Bzw. du nutzt den platz in der breite für mehr Widgets.

Grüße^^

-1 # iIcons NAV Menü — Marco 2017-01-15 11:34

Darf ich fragen wie du die Icons kleiner bekommen hast?

Gruss
MArco

-1 # Icongröße im Menü — Roman 2017-01-15 15:12

zitiere Marco:

... wie du die Icons kleiner bekommen hast?
MArco

Als Beispiel:
.div data-type="link" class="medium top-space-mobile left-space-2"
data-width="205"
data-icon-left="fa-cogs"
data-color="white"
data-text-align="center"
data-url="config.html".Konfiguration
.div.


so wie man bei FTUI größen über die "class" beeinflusst.

Grüße^^

0 # Mach Bloss weiter so :-) — Marco 2017-01-14 12:02

Das ist echt der Wahnsinn was du machst
Gibst du mir ein Tipp wo ich die Icons finde die du nutzt? Insbesondere die für die Anruferliste

Grüsse

0 # Icons — Roman 2017-01-15 15:19

zitiere Marco:

Gibst du mir ein Tipp wo ich die Icons finde die du nutzt? Insbesondere die für die Anruferliste

Das müssten Material-Icons sein. Diese sind mittlerweile in FTUI integriert.

Schau mal HIER

0 # FTUI — toensi 2017-01-12 17:57

, Ein Traum , weiter so .................

0 # Super Sache — erdo_king 2017-01-12 07:52

Hi Roman,

ich finde FTUI einfach fantastisch! Vielen Dank für deine super Arbeit!

was mich allerdings irritiert ist dein Link auf den eval-Branch im Github...
"Commits on Sep 6, 2016" - ich denke das ist nicht der aktuelle Stand oder ;)

Wenn du hier committen würdest bekommst du sicherlich auch (hilfreiche) bugs gemeldet!

Viele Grüße
erdo_king


P.s.: Immer weiter so!!!

0 # eval vs. master & V 2.4 — Roman 2017-01-13 15:52

zitiere erdo_king:

was mich allerdings irritiert ist dein Link auf den eval-Branch im Github...
"Commits on Sep 6, 2016" - ich denke das ist nicht der aktuelle Stand oder ;)

Moin.
Habe mir das mal angeschaut und du hast natürlich Recht. Das ist das große Problem wenn man nicht benachrichtigt wird bzw. nicht mitbekommt, dass setstate den 2.2 eval-Branch in den master-Branch gemerched hat... Und wir ja scheinbar mittlerweile bei Version 2.4 sind.

Ganz toll. Hab gerade 'nen Backup gemacht und werde mal updaten^^

Grüße^^

+1 # FTUI 2.2 Demo — Roman 2017-01-07 17:39

ONLINE!

Viel Spaß!

Grüße^^

0 # FTUI2.2 — toensi 2017-01-07 17:29

THX, sieht TOP aus! Jetzt fehlt nur noch die FHEM.CFG zum nachbauen. Danke schonmal vorab und weiter so....toller Job. THX
Viel erfolg bei der neuen Arbeit !!! nice WE !

0 # FTUI 2.2 — toensi 2017-01-05 10:15

In ein paar Tagen werde ich meine Demo der FTUI 2.2 hier zur Verfügung stellen.
TOP, freu mich drauf, weiter so.........SUPI !!!

0 # 2.2 Demo — kvo1 2016-12-31 17:07

Hi Roman,
bin auch schon ganz gespannt auf deine 2.2er Version.
Einstweilen guten Rutsch

Klaus

0 # 2.2 DEMO — Roman 2016-12-23 12:51

Ja sie soll immer noch kommen... Ich habe aber leider immer noch keine Zeit und kein vernünftiges Tool gefunden um meinen Screen zu Capturen (Video) da ich einige gimmicks eingebaut habe und sich alle Seiten scrollen lassen.

Ihr müsst euch noch gedulden.

TIP: gleich 2.2 installieren!

Grüße^^

0 # Schade — Andreas 2016-12-08 17:52

Ich vermute mal, dass es hier keine neue Version geben wird. Wenn doch dann wäre es nett ein kurzes Feedback zu geben. ...

0 # AW: Schade — Eddie 2016-12-08 22:46

Hallo Andreas, ich wollte auch zuerst die Screenshots sehen, aber ich habe mir das FTUI installiert und dann das Update installiert, optisch ändert sich nichts es sieht genau so aus wie vorher. Es sind ein paar Widgets etc dazugekommen.
Guck mal hier gibt es ein Thread und dort werden etliche User Demos gezeigt, dort kannst Du Dir reichlich Ideen holen. https://forum.fhem.de/index.php/topic,37378.0.html

0 # tabletui — Erwin Zipper 2016-12-08 15:41

Hallo Roman, danke für deine Arbeit und beiträge. Sind sehr hilfreich für mich. leider funktionieren keine deiner files bei mir, was könnte ich falsch gemacht haben. Ich habe alle files im orfner tablet gespeichert, beim öfnnen bleibt der bildschirm leider schwarz.
lG
Erwin

0 # Neuigkeiten? — Lucien 2016-07-23 10:25

Hallo Roman,
gibt es schon neuigkeiten bzgl. der 2.2 Demo?
Bin schon gespannt.

Gruß

0 # Demo 2.2 — Roman 2016-05-28 13:26

Ihr müsst euch noch etwas gedulden. Tut mir leid.

Trete Montag eine neue Arbeit an und habe einiges vorzubereiten...
Dazu noch alle anderen Projekte die parallel laufen.

Kann leider nicht sagen wann es so weit ist... Ihr werden es als erste erfahren

Grüße^^

0 # kanns schon kaum erwarten — Eddie 2016-05-25 14:52

Ja mich würde auch interessieren, ich kann es schon kaum erwartet. Ich habe mir auch den einen oder anderen Button hier abgeguckt!

0 # DEMO2.2 — helmi55 2016-05-14 13:20

Servus
danke nochmals für deine ausführlichen Erklärungen im FORUM. Wann wird es eine DEMO deiner 2.2 geben. Deine Vorlagen waren für mich eine wertvolle Ideenvorlage
Schöne Pfingsten Liebe Grüße Helmut

JComments