New FHEM Tablet UI

[setstate]

Ha, wunderbar! Damit klappt es jetzt auch. Ich muss zugeben das ich bisher auch nicht alle 30 Seiten des Threads gelesen habe, sondern mich eher an der Beschreibung auf github orientiert habe. Vielleicht kann man da das data-cmd mit aufnehmen? Oder habe ich eine Passage uebersehen die das erklaert?

Hallo hillbicks,

schön, dass es jetzt klappt und vielen Dank für den Hinweis mit der Readme. Ich habe es auch gleich aktualisiert.

[chris1284]

Kann man eigentlich alles gut per CSS regeln. Tipp: Mit negativen Abständen ala margin-top:-20px !important experimentieren

Daumen hoch, danke!

[hotwebnet]

Hallo, kann ich die Container auch fixieren, ich verschiebe die immer auf meinem Tablet

[bjoernbo]

guck mal tread 408

<meta name='gridster_disable' content='1'>

[hotwebnet]

Danke, ich hatte es schon einmal gelesen, aber nicht mehr gefunden....

[bjoernbo]

Habe mal eine Frage: Einige von euch haben ja bereits erfolgreich den Kalender integriert. Daran habe ich mich heute versucht. Eigentlich ganz erfolgreich, allerdings geht beim Update des Kalender mein Raspberry Pi B+ mächtig in die Knie. Ich habe eine Auslastung von 98% und das über einen Zeitraum von 20 Minuten bis der Googlekalender "upgedatet" ist. Das Verhalten hatte ich schon vor einigen Monaten und habe mich dann vom KalenderView verabschiedet und mir stattdessen eine "abfallkalender.holiday"-Datei erstellt.

Hat jem. ggf. schon mal versucht für das UI auch solche Dateien auszuwerten und als Kalender darstellen zu lassen? Ist das möglich?

Beispiel: "abfallkalender.holiday"

# Abfuhrkalender 2015
# Restmüll
# Papier
# Leichtverpackungen
# Kellerdienst

1 01-28 Kellerdienst
1 01-30 Leichtverpackungen

1 02-04 Kellerdienst
1 02-05 Papier
1 02-09 Restmüll
1 02-13 Leichtverpackungen
1 02-23 Restmüll
1 02-27 Leichtverpackungen

1 03-04 Kellerdienst
1 03-05 Papier
1 03-09 Restmüll
1 03-13 Leichtverpackungen
1 03-23 Restmüll
1 03-27 Leichtverpackungen

1 04-01 Papier
1 04-01 Kellerdienst
1 04-07 Restmüll
1 04-11 Leichtverpackungen
1 04-20 Restmüll
1 04-24 Leichtverpackungen
1 04-30 Papier

das ganze sieht in FHEM dann so aus:

(//)

...das mit "in X Tagen" benötige ich nicht. Das Datum reich vollkommen aus!

[chris1284]

geht beim Update des Kalender mein Raspberry Pi B+ mächtig in die Knie...
habe mich dann vom KalenderView verabschiedet

das sind 2 verschiedene module. zur problemlösung hatte ich dir ja schon geraten mal den entwickler des calendar-moduls anzusprechen (da du auch der erste mir bekannte mit dem problem bist).

HEM/57_Calendar.pm          borisneubert         http://forum.fhem.de Unterstuetzende Dienste

zum anderen versuch mal genau zu klären wer den pi auslastet (CALNEDAR oder CalView).
da mein calview-widget bisher gut bei mir funktioniert (und auch jemadn hier ein per gute "per hand lösung" gepostet hat). ist evtl einfacher als eine holiday-datei auszulesen / das problem zu umgehen als es zu lösen 

[bjoernbo]

  jetzt muss ich mal überlegen.....

Nicht das ich ws verwechsle. Der View setzt ja den Kalender voraus, richtig? Der View als solches ist ziemlich flott. Der bereitet keine Probleme. Der Kalender, also dort wo ich den Pfad zu Google hinterlege, welcher alle 12 Stunden eine Aktuallisierung vornimmt, haut den PI aus den Socken.
Hatte gestern Abend erstmal alles wieder gelöscht. Dafür aber im gleichem Zug den Raspberry Pi 2 bestellt  . Wenn der morgen da ist, werde ich am WE einen Umzug vorbereiten und den Kalender nochmal einbauen und feedback geben.

[nesges]

Neues widget: weather

Das widget kopiert das Standard label-Widget und reduziert es auf die bereits enthaltene Wetter-Icon-Funktion. Ergänzt sind die Wetterbezeichnungen des Moduls Weather (fhem.de/commandref.html#Weather), das Wetterdaten von Yahoo bezieht. Die Screenshots im Anhang zeigen komplexe Beispiele, die das Widget einbinden. HTML-Code zum ersten befindet sich in der Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/#weather. Der zweite Screenshot benutzt das mit fhem ausgelieferte, alternative imageset "kleinklima"

[setstate]

Hallo geneigte User,

heute mal wieder ein kleines Update:

New Feature: "circleMenu"
Damit kann man unter einem einzigen Button, viele andere verstecken, die man selten braucht oder ähnlich einem Kontextmenü.

So sieht der HTML Code aus:

Code Auswählen Erweitern

<div class="left">
        <div class="cell circlemenu">
            <ul class="menu">
              <li><div data-type="push" data-icon="fa-wrench"></div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
              <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
            </ul>
        </div>
        <div data-type="label" class="cell">Woofer</div>
</div>


In der index.html muss dazu die extra Library circleMenu.js eingebunden werden:

<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>

So sieht es aus:
(http://knowthelist.github.io/fhem-tablet-ui/circle_menu.png)   (http://knowthelist.github.io/fhem-tablet-ui/circle_menu_open.png)

[nesges]

Cool! Das circleMenu schafft endlich Platz in der "Favoriten-Ecke" Danke dafür!

Nur ne Kleinigkeit: Die Änderung in der fhem-tablet-ui.css

Code Auswählen Erweitern

.cell:not([data-type="label"]) {
min-height: 52px;
min-width: 52px;
}

zerschiesst mir's Layout, weil die Abstände zwischen den Widgets nicht mehr passen.

[setstate]

Neues widget: weather

Das widget kopiert das Standard label-Widget und reduziert es auf die bereits enthaltene Wetter-Icon-Funktion. Ergänzt sind die Wetterbezeichnungen des Moduls Weather (fhem.de/commandref.html#Weather), das Wetterdaten von Yahoo bezieht. Der Screenshot im Anhang zeigt ein komplexes Beispiel, das das Widget einbindet. HTML-Code dazu in der Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/#weather

'nabend nesges,

sehr gute Idee, Label und Weather zu trennen. Ist viel übersichtlicher und verständlicher. Hat mich auch schon etwas gestört, das aufgepumpte Label-Widget.
Vorschlag: Ich entschlacke das Label Widget wieder und kopiere das Weather Widget ins Hauptrepository ...

[alex885]

Bonsoir nesges,
Bonsoir setstate,

danke für die grossartige Arbeit!

finde beide neue Widgets toll!
und das UI sowieso! Um es bei steigender Komplexität weiterhin visuell reduziert zu halten ist grade der circle Button toll!
Beim neuen Wetter.widget würde ich mir sowas ähnliches wünschen: erst  wird nur das Wetter icon gezeigt, beim click wird das widget grösser und zeig mehr Daten; nach ca 2. sec schrumpfts wieder zusammen. So ähnlich wie das Dimmer widget.
Ich (NOOB!) hab das Gefühl das die Möglichkeiten von Gridster hier (statisch) noch nicht so richtig genutzt werden; toll würd ich es finden wenn sich ein Grid-Element bei Bedarf vergrößert, und dann nach getaner User Eingabe auch wieder verkleinert.
So könnte man total elegant nur einen Knopf für z.b. eine HUE-Lampe haben. Normalerweise ein/aus  - bei einem langen click jedoch werden die entsprechenden Regler für Farbe / Helligkeit eingeblendet.
So könnte man auch die Thermostat.widgets mit der von manchen gewünschten Boost/on/off Funktion erweitern.
Ein Standard Rolladen Button wäre rauf/runter ein longpress/extended würde verschiedene Zwischenstufen einblenden.
Ein Lichtschalter könnte für alle Lampen im Zimmer gelten, longpress zeigt die einzelnen Lampen.
etc...

So stell ich mir zur Zeit das perfekte UI vor! 
die wenigen relevanten Daten /Knöpfe sichtbar, das komplexere bei Bedarf, und eigentlich sollte es ja eh automatisch gehen 

my 2cents
merci encore für die bisherige Arbeit,
Alex 

[setstate]

zerschiesst mir's Layout, weil die Abstände zwischen den Widgets nicht mehr passen.

Mmmm, schade. Das ist für das notwendige div vor dem ul menu.

Code Auswählen Erweitern

<div class="cell">
<ul class="menu">


Dann müssen wir für solche Zellen einen neuen Class Namen einführen "cellforce" (oder andere vorschlag)

Code Auswählen Erweitern

<div class="cell cellforce">
<ul class="menu">


und im CSS

Code Auswählen Erweitern


.cellforce {
min-height: 52px;
min-width: 52px;
}


[nesges]

Vorschlag: Ich entschlacke das Label Widget wieder und kopiere das Weather Widget ins Hauptrepository ...

Von mir aus sehr gerne! Wobei ich mir bei der Zuordnung von Bezeichnern und Meteocons noch nicht so ganz sicher bin ob's überall passt.

@alex: Das sind sehr gute Ideen! Das meiste davon übersteigt meine JS-Fähigkeiten allerdings - hoffen wir auf setstate