Hallo zusammen,
ich würde gerne FTUI für mein 14Zoll Tablet und eine für mein Handy bauen.
eine Möglichkeit wäre das mit dem template-Modul http://forum.fhem.de/index.php/topic,43110.0.html zu machen.
Ist mir aber auf dem ersten Blick zu kompliziert und ich brauche nicht die ganzen Infos vom Tablet auf dem Handy.
1. Wie habt ihr das gemacht?
2. Wie installiere ich eine zweite FTUI Instanz und wird die dann auch upgedatet mit
update add https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
MFG Benny
Ich habe es Quick-n-dirty mit einer anderen index-Datei gelöst.
Tablet-Seite --> https://192.168.1.2:8083/fhem/ftui/
Smartphone-Seite --> https://192.168.1.2:8083/fhem/ftui/#index_m1.html
Moin.
Die Möglichkeit von oggy ist gut. Aber was machst du wenn du tatsächlich mehrere Seiten darstellen möchtest?
Ich nutze FTUI auch auf Tablet und Smartphone. Mit PageTab-Widget!!!
Dazu habe ich neben /www/tablet den Ordner /www/mobile angelegt. Dort sind die HTML-Dateien für's Smartphone drin. Sowie (/mobile/css) eine *-user.css für's Smartphone (geänderte Abstände usw. weil alles etwas kleiner ist) und (/mobile/images) für Smartphonespezifische Bilder wie z.B. ein Hintergrundbild. Ansonsten greift die "Mobile-UI" auf die gleichen /css, /lib, /fonts und /js zu wie die "Tablet-UI"...
Die Anpassung an die Auflösung habe ich (bei Tablet und Smartphone) wie folgt gemacht.
- Ein Hintergrundbild in der passenden Auflösung gesucht/erstellt (Passende Auflösung (Darstellungs- oder Css-Auflösung) ist nicht immer gleich der Bildschirmauflösung!!!)
- Die "widget-base-width" und "widget-base-height" so lange angepasst bis man einen einigermaßen gleichmäßigen Außenrand hat. Dabei ist drauf zu achten, Das pro gridster-Element wenigstens 1 (ein) Botton/Switch/Symbol vernünftig Platz hat. Vorher eventuell mit der x- und y-Anzahl der gridster-Elemente jonglieren.
Du kannst dir dazu MEIN FTUI (siehe Signatur) anschauen. Dort sind beide Versionen in eine .ZIP verpackt. Wenn man sich etwas durch die <head>-Tags in den jeweiligen index.html durchworschtelt kommt man drauf. Eventuell als Demo installieren in einem extra-Ordner.
Viel Spaß^^
Grüße^^
ich habe eine gemeindame index.html, die per javascript abfragt, ob es ein handy oder tablet ist und dann entsprechend das grid anpasst. du findest den code in dem demo thread...
Zitat von: roman1528 am 03 März 2016, 20:11:38
Aber was machst du wenn du tatsächlich mehrere Seiten darstellen möchtest?
Ich nutze FTUI auch auf Tablet und Smartphone. Mit PageTab-Widget!!!
bei mir ist die index.html, die Tablet-Version und die index_m1.html ist meine Smartphone-Version. Wenn ich die Smartphone-Version wie oben aufrufe, holt er sich die Gridster-Einstellungen zwar von der Tablet-Version, zeigt dann aber die mobile Version an. In der index_m1.html verweise ich per PageTab-Widget nur auf die mobilen Seiten und umgekehrt in der index.html nur auf die Tablet-Versionen
Eine extra mobile Gridster-Version habe ich aufgegeben, da ich 4 unterschiedliche Darstellungen auf meinen Geräten hatte. Die 3 Tablets und beide Handys zeigen die Seiten jeweils unterschiedlich an. Ich habe mir dann eine Zellen-Auflösung rausgesucht, die bei allen passt und dann dementsprechend nur die Anzahl der Reihen und Zeilen angepasst. ... wie immer führen viele Wege nach Rom. :)
Zitat von: oggy am 04 März 2016, 09:35:37
bei mir ist die index.html, die Tablet-Version und die index_m1.html ist meine Smartphone-Version. Wenn ich die Smartphone-Version wie oben aufrufe, holt er sich die Gridster-Einstellungen zwar von der Tablet-Version, zeigt dann aber die mobile Version an. In der index_m1.html verweise ich per PageTab-Widget nur auf die mobilen Seiten und umgekehrt in der index.html nur auf die Tablet-Versionen
Eine extra mobile Gridster-Version habe ich aufgegeben, da ich 4 unterschiedliche Darstellungen auf meinen Geräten hatte. Die 3 Tablets und beide Handys zeigen die Seiten jeweils unterschiedlich an. Ich habe mir dann eine Zellen-Auflösung rausgesucht, die bei allen passt und dann dementsprechend nur die Anzahl der Reihen und Zeilen angepasst. ... wie immer führen viele Wege nach Rom. :)
Geil!
Würde ich mein Smartphone im Landscape nutzen... Beste Lösung^^ auf jeden fall!
Aber da ich auch von unterwegs darauf zu greifen kann (Dyn-DNS / Basic-Auth) und man dann häufig nur eine Hand frei hat habe ich meine "Mobile-FTUI" im Portrait Modus gestaltet... Da passt deine Vorgehensweise leider nicht -.-
Danke für eure Antworten ich werde mich mal am WE daran machen.
Ich werde Romans vorlagen nutzen schön das da auch die fhem.cfg dabei ist das macht es leichter.
Nochmals Herzlichen Dank euch beiden
MFG Benny
Zitat von: FhemPiUser am 03 März 2016, 21:30:04
ich habe eine gemeindame index.html, die per javascript abfragt, ob es ein handy oder tablet ist und dann entsprechend das grid anpasst. du findest den code in dem demo thread...
Der Code würde mich interessieren ;) Welchen Demo Thread meinst du?
ich habe nur eine index.html für mobile und tablet, da ich nicht zwei versionen pflegen wollte. ich frage per javascript in der index.html zu beginn ab, ob es ein smartphone oder ipad browser client ist. enstprechend passt er dann die gridster anordnung von jedem "<li data-row / data-col" an. bei einem smartphone alles nur untereinander mit maximal sizex=2, bei einem tablet nebeneinander und untereinander so, dass die breite des tablets optimal ausgenutzt wird...
Zitat von: FhemPiUser am 02 Mai 2016, 19:29:07
ich habe nur eine index.html für mobile und tablet, da ich nicht zwei versionen pflegen wollte. ich frage per javascript in der index.html zu beginn ab, ob es ein smartphone oder ipad browser client ist. enstprechend passt er dann die gridster anordnung von jedem "<li data-row / data-col" an. bei einem smartphone alles nur untereinander mit maximal sizex=2, bei einem tablet nebeneinander und untereinander so, dass die breite des tablets optimal ausgenutzt wird...
Klingt interessant. Magst du ein Beispiel posten? 8)
Zitat von: SirMarco am 04 Mai 2016, 20:14:50
Klingt interessant. Magst du ein Beispiel posten? 8)
habe ich schon, siehe unter users demos https://forum.fhem.de/index.php/topic,37378.msg393679.html#msg393679 (https://forum.fhem.de/index.php/topic,37378.msg393679.html#msg393679)
Dein Lösungsansatz gefällt mir sehr gut. Ich überlege schon die ganze Zeit, wie man das in eine allgemeine Funktion für FTUI gießen könnte. 8)