[FHEM-Tablet-UI] User-Demos

[setstate]

Weil solch ein WYSIWYG Designer ganz viel Arbeit macht, für etwas, was man nur einmal macht, eine UI designen. Also zählt das unter 'Nice to have'. Wen jemand viel Zeit und Lust dafür hat, nur her damit. Wie ich aber schon vor vielen Monaten geschrieben habe, konzentriere ich mich auf die Kernkomponenten.

[jnewton957]

Hallo zusammen,

nachedem wir ja jetzt sogar hier in Köln mal Schnee (Schneeflocken, Puderzucker) haben, habe ich mir das mal in meine mobile Seite eingebaut.

Code Auswählen Erweitern

<div data-type="label" class="inline"><medium>&nbsp;&nbsp;&nbsp;Regen/Schnee&nbsp;&nbsp;&nbsp;<br></medium></div><br>☔
<div data-type="label" data-device="WUweather" data-get="fc0_rain_day" data-limits="[-20,-15,-10,-5,0,5,10,15,20,25,30,35]" data-colors='["#483D8B","#1874CD","#9AC0CD","#CAE1FF","#F5FFFA","#98FB98","#9ACD32","#FFA500","#FF4500","#FF3030","#EE2C2C","#8B1A1A"]' data-unit=" mm" class="inline"></div>❄
<div data-type="label" data-device="WUweather" data-get="fc0_snow_day" data-limits="[-20,-15,-10,-5,0,5,10,15,20,25,30,35]" data-colors='["#483D8B","#1874CD","#9AC0CD","#CAE1FF","#F5FFFA","#98FB98","#9ACD32","#FFA500","#FF4500","#FF3030","#EE2C2C","#8B1A1A"]' data-unit=" mm" class="inline"></div>


Umsetzung basiert auf Idee Waschbaer
Grüße
Jörg

[kvo1]

Hi Jörg,

sieht gut aus 

kvo1

[Wasserwerk33]

Hab da Mal eine Speciale Frage. Und zwar wie oder wo muss ich etwas anlegen damit ich eine Tablet ui Seite für mein Handy erhalte. Für mein Tablet habe ich eine.

Danke für die Hilfe

[jnewton957]

Hab da Mal eine Speciale Frage. Und zwar wie oder wo muss ich etwas anlegen damit ich eine Tablet ui Seite für mein Handy erhalte. Für mein Tablet habe ich eine.

Danke für die Hilfe

Unter /fhem/www/ ein Unterverzeichnis "mobile" anlegen. URL ist dann http://192.168.2.xx:8083/fhem/mobile/index.html

Dann kopierst du dir alle deine Dateien von TabletUi (inkl. Unterverzeichnisse) nach /mobile.

Index.html auf deine Größe des Handy anpassen. (Bei mir:

Code Auswählen Erweitern

<meta name="widget_base_width" content="90">
        <meta name="widget_base_height" content="104">

Dann musst du dir die html Seiten "umbauen". Du hast ja jetzt "nur" ca. 6 Zeilen und 4 Spalten.
Also alles umgestalten und vom Konzept etwas umdenken.

Oder:
Ein guter Start ist die webseite von http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui/ftui-mobile .
Da würdest du gleich mit der zip Datei ein Unterverzeichnis mobile mit vielen Inhalten bekommen, die du dann auf deine devices anpassen kannst.

Grüße
Jörg

[Wasserwerk33]

Danke schön für die gute Anleitung. Werde ich mich doch Mal direkt dran machen

[Wasserwerk33]

@newton 957

Ich habe gesehen Du benutzt auch Wundergrund wetter. Könntest du mir sagen welche Daten du nimmst um die trennst als Pfeile zu erhalten?

[jnewton957]

@newton 957

Ich habe gesehen Du benutzt auch Wundergrund wetter. Könntest du mir sagen welche Daten du nimmst um die trennst als Pfeile zu erhalten?

Hallo,

gute Frage !

Hier nehme ich das Modul Proplanta (device Wetter_Pro) und dann statTemperatureTendency

Code Auswählen Erweitern

<center>
<div data-type="klimatrend" data-device="Wetter_Pro" data-get="statTemperatureTendency" data-refperiod="6" data-stagnating-color="rgb(80,80,80)" data-icon="fa-angle" data-rising-color="rgb(180,80,80)" data-falling-color="rgb(80,80,180)" data-highmark="1" data-highmark-icon="fa-angle-double"  data-highmark-rising-color="rgb(255,80,80)" data-highmark-falling-color="rgb(80,80,255)" class="inline"></div>
<div data-type="klimatrend" data-device="Wetter_Pro" data-get="statTemperatureTendency" data-refperiod="3" data-stagnating-color="rgb(80,80,80)" data-icon="fa-angle" data-rising-color="rgb(180,80,80)" data-falling-color="rgb(80,80,180)" data-highmark="1" data-highmark-icon="fa-angle-double"  data-highmark-rising-color="rgb(255,80,80)" data-highmark-falling-color="rgb(80,80,255)" class="inline"></div>
<div data-type="klimatrend" data-device="Wetter_Pro" data-get="statTemperatureTendency" data-refperiod="2" data-stagnating-color="rgb(80,80,80)" data-icon="fa-angle" data-rising-color="rgb(180,80,80)" data-falling-color="rgb(80,80,180)" data-highmark="1" data-highmark-icon="fa-angle-double"  data-highmark-rising-color="rgb(255,80,80)" data-highmark-falling-color="rgb(80,80,255)" class="inline"></div>
<div data-type="klimatrend" data-device="Wetter_Pro" data-get="statTemperatureTendency" data-refperiod="1" data-stagnating-color="rgb(80,80,80)" data-icon="fa-angle" data-rising-color="rgb(180,80,80)" data-falling-color="rgb(80,80,180)" data-highmark="1" data-highmark-icon="fa-angle-double"  data-highmark-rising-color="rgb(255,80,80)" data-highmark-falling-color="rgb(80,80,255)" class="inline"></div>
</center>

Grüße
Jörg

[demaya]

Guten Abend in die Runde,

da ich aktuell noch keine eigene Demo präsentieren kann, möchte ich gerne auf meiner Seite (https://demaya.de) die oft angesprochene bzw. angefragte Galerie für Demo-Installationen hosten. So möchte ich gerne etwas zurückgeben, da mir die FHEM-Community täglich neue Ideen und Problemlösungen zu meinem wachsenden Smarthome bietet.

Wäre das aus Eurer Sicht eine Bereicherung? Ich würde für jede Installation einen Blogeintrag anlegen und Screenshots, Sources sowie eine kleine Zusammenfassung schreiben.

So lerne ich was und andere Neuanfänger können sich einfach durch die Galerie klicken.

Gruß
demaya

[Wasserwerk33]

Habe ein Problem seit dem letztem Update gestern und zwar bekomme ich bei wunderground keine Wetter Icon mehr. Habe nur ein jpg Emblem. Was habe ich verkehrt gemacht und wie bekomme ich diese wieder?

[moonsorrox]

da ich aktuell noch keine eigene Demo präsentieren kann, möchte ich gerne auf meiner Seite (https://demaya.de) die oft angesprochene bzw. angefragte Galerie für Demo-Installationen hosten. So möchte ich gerne etwas zurückgeben, da mir die FHEM-Community täglich neue Ideen und Problemlösungen zu meinem wachsenden Smarthome bietet.

das kannst du gerne tun, ich denke hier hat niemand etwas dagegen... 
jetzt kommt das ABER... wenn ich bei dir sehe das du Geld für Downloads haben möchtest, dann wird das hier nicht so gut ankommen...
Das hat immer eine kleinen Beigeschmack...!  keine Kritik nur ne Anmerkung

[demaya]

das kannst du gerne tun, ich denke hier hat niemand etwas dagegen... 
jetzt kommt das ABER... wenn ich bei dir sehe das du Geld für Downloads haben möchtest, dann wird das hier nicht so gut ankommen...
Das hat immer eine kleinen Beigeschmack...! 

Danke für dein Feedback moonsorrox. Die Downloads sind für die "Ausbildung der Ausbilder"-Prüfung. Die Userdemos inkl. Screenshots / Sourcecodes / Konfigurationen würde ich jederzeit kostenlos bereitstellen und zum Download anbieten. Das geistige Eigentum liegt ja beim eigentlichen Author. Meine Arbeit liegt ja in der Aufbereitung / Zusammenfassung / Bereitstellung und den rechtlichen Risiken bzgl. Urheberrecht usw.

Gruß

[moonsorrox]

OK, mach das ist auf jeden Fall eine Bereicherung und evtl. für einen Einstieg eine gute Sache

[demaya]

Gibt es noch andere Meinungen?

Wessen Layout dürfte ich denn als Pilot übertragen?

Gruß

[Wasserwerk33]

Habe ein Problem seit dem letztem Update gestern und zwar bekomme ich bei wunderground keine Wetter Icon mehr. Habe nur ein jpg Emblem. Was habe ich verkehrt gemacht und wie bekomme ich diese wieder?

Keine eine Idee wie ich das wieder hin bekomme?