New FHEM Tablet UI

Phil__ · 20 Mai 2015, 09:34:30

Zitat von: mc-hollin am 20 Mai 2015, 07:53:38
Hallo,
ich nutze für den Abfallkalender folgendes Script in FHEM:
http://forum.fhem.de/index.php/topic,24646.msg293851.html#msg293851
Als Datensource hole ich mir die ICS Datei meines Abfallentsorgers.
Das Script berechnet die Tage bis zur Leerung und diese zeige ich im UI als Bag-Symbol mit warn an.
Also alle Tonnen als Übersicht. Somit kann ich auch doppelte Leerungen sehen.
Das Symbol wird bei <= 1Tag als blinkend angezeigt.

Kannst du deinen FTUI HTML code hier mal posten?

mc-hollin · 20 Mai 2015, 10:38:04

Zitat von: Phil__ am 20 Mai 2015, 09:34:30
Kannst du deinen FTUI HTML code hier mal posten?

Erledigt! Werde heute abend auch mal ein Bild einfügen.

Stril · 20 Mai 2015, 15:40:59

Hallo!

Ich hätte noch eine Frage:
Beim Dimmer gibt es zwar die Option "data-set-off", aber nicht die Option "data-set-on". Wäre es möglich, diese Option einzubauen?

Ich habe ein Dummy-Device, das ich mit dem Dimmer bediene, aber das springt immer auf "0" und ein "on" löst ein "dim 0" aus. Wäre toll, diese Option zu haben.

Grüße
Phil

tomster · 20 Mai 2015, 16:34:49

...und vielleicht in den Slider-Knopf die Anzeige des Dim-Werts/ der Lautstärke? Ganz wie in der class "warn".

setstate · 20 Mai 2015, 16:49:21

Zitat von: tomster am 20 Mai 2015, 16:34:49
...und vielleicht in den Slider-Knopf die Anzeige des Dim-Werts/ der Lautstärke? Ganz wie in der class "warn".

meinst du so was:

http://forum.fhem.de/index.php/topic,34233.msg294251/topicseen.html#msg294251

tomster · 20 Mai 2015, 16:52:29

Nicht ganz. Ich dachte daran den Wert in den "grauen Knopf" zu integrieren...

trilu · 20 Mai 2015, 18:08:42

das ist ja richtig klasse - werde meine ui auch umbauen.
da mir das mit den widgets sehr gut gefällt hatte ich mich auch schon nach alternativen zu fhem umgesehen, die haben aber auch alle ihre einschränkungen. das mit den widgets ist wirklich das fehlende puzzle stück.

gibt es eine möglichkeit/bedarf für ein widget zum steuern des wochenprogramms für max oder homematic heizkörperregler?

mc-hollin · 20 Mai 2015, 18:45:17

Gibt es eine Möglichkeit das aktuelle WetterIcon als Hintergrundbild zu platzieren?
Oder generell ein Widget welches ein Image aus FHEM Werten als Hintergrund anzeigen kann?
Also ein DIV um das gesamte Template mit background-image.

Ich habe mal versucht das Wetter aus Windows nach zu bauen.
Die Werte und die Texte sind kein Problem. Nur für das Hintergrund Tages-Image sehe ich keinen Ansatz.

setstate · 20 Mai 2015, 18:49:37

sowas?

http://www.w3.org/WAI/UA/TS/html401/cp0301/0301-CSS-DIV-BACKGROUND-IMAGE.html

update71 · 20 Mai 2015, 18:56:28

Hallo Freunde,

ich hab mich grad eine Weile an den Pagetabs versucht aber erstmal schön alles durcheinander gebracht

Gibt es irgendwo eine Erklärung wie genau das alles zusammenspielt?
Ich hatte ja schon einmal gefragt ob es nicht möglich wäre kleine Beispielseiten zu erstellen, so dass auch der NOOB den Einstieg findet.
Was genau muss auf welche Seite dass das ganze hinhaut? Was passiert denn eignetlich wenn ich eine Pagetab Seite aufrufe?

Ein ganz einfaches Beispiel mit der index und 2 Unterseiten ohne großen Inhalt würde mich vermutlich weiterbringen

Ich hab derzeit eine menu.html wie aus dem Beispiel und es werden auch Seiten aufgerufen nur irgendwie komm ich nicht zurück auf index.html da kommt dann immer nur ne leere Seite mit dem unformatierten Wochentag :/

das mal aus der index.html

Code Auswählen

<div class="gridster ready">
	<ul style="height: 705px; width: 1008px; position: relative;">
		<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.html" class="gs-w">
		</li>
		<li data-row="1" data-col="2" data-sizex="1" data-sizey="2" class="gs-w">
		<header>Heute</header>

Das ist die menu.html

Code Auswählen

<html>
<body>
    <header>Räume</header>
    <div class="cell">
        <div data-type="pagetab" data-url="index.html"  data-icon="fa-home" class="cell"></div>
        <div data-type="pagetab" data-url="multimedia.html" data-icon="fa-sliders" class="cell"></div>
        <div data-type="pagetab" data-url="denon.html" data-icon="fa-music" class="cell"></div>
        <div data-type="pagetab" data-url="gaestezimmer.html" data-icon="fa-hotel" class="cell"></div>
        <div data-type="pagetab" data-url="kueche.html" data-icon="fa-music" class="cell"></div>
        <div data-type="pagetab" data-url="paul.html" data-icon="fa-user" class="cell"></div>
        <div data-type="pagetab" data-url="schlafzimmer.html" data-icon="fa-fax" class="cell"></div>
    </div>
</body>
</html>

was genau muss ich tun um über den Homeknopp wieder nach index.html zu kommen und was muss in die unterseiten alles rein?

Ich danke euch und weiß dass ich nerve

Th.

mc-hollin · 20 Mai 2015, 19:18:37

Zitat von: setstate am 20 Mai 2015, 18:49:37
sowas?

http://www.w3.org/WAI/UA/TS/html401/cp0301/0301-CSS-DIV-BACKGROUND-IMAGE.html

Das Hintergrundbild generell ist nicht das Problem.
Ich muss es ja anhand des Wertes vom Wetter aus FHEM wechseln.
So wie im Weather-Widget.
Ich hatte die Hoffnung, dass eventuell ein vorhandenes Widget schon ein Image auch als Hintergrund darstellen kann und ich über data-get='icon' dieses darstelle.

tomster · 20 Mai 2015, 20:19:06

Zitat von: update71 am 20 Mai 2015, 18:56:28
was genau muss ich tun um über den Homeknopp wieder nach index.html zu kommen und was muss in die unterseiten alles rein?

Das macht pagetab eigentlich alles alleine.

Hier Dein Wunsch nach 2 Seiten:
Du erstellst einfach eine 2. Seite, die eine genaue Kopie der index.html ist. Nur nennst Du sie multimedia.html.
Jetzt hast du 2 Seiten und kannst jeweils mit den ersten beiden Menubuttons zwischen diesen Seiten wechseln. Die anderen Menupunkt sind "tot". Du hast ja schließlich (noch) keine entsprechenden Seiten hinterlegt.

viegener · 20 Mai 2015, 23:53:37

Zitat von: setstate am 19 Mai 2015, 00:55:42
ich habe den Eindruck, es läuft flotter, aber es werden beim Start und Refresh immer noch zwei Seiten nacheinander geladen. Beim Start zweimal die Index.html. Kann man da noch was optimieren?

@setstate: Bei mir wird die Index.html nur einmal geladen, auf jeden Fall aber macht es Sinn Index.html auf das Laden der Skripte und CSS-Files zu beschränken. Der Rest ist absolut minimal, also in meiner Umgebung zum Beispiel ist im BODY von index.html nur folgendes enthalten (Wobei "room_home.html" bei mir die Seite ist, die geladen werden soll, wenn keine andere Seite ausgewählt ist):

Code Auswählen


<body>
<div class="gridster" >
  <ul>
      <div data-type="pagetab" data-url="room_home.html"  data-icon="-" class=""></div>
  </ul>
</div>
</body>

Mir ist nicht klar, warum index.html bei Dir mehrfach geladen wird. Betreibst Du die Seiten über HTTPSRV oder auf einem getrennten Server?
Bei mir werden zu jeder Seite die verwendeten Widgets wieder geladen, dass ist aber eigentlich so gewollt.

Gruss,
Johannes

update71 · 21 Mai 2015, 00:07:05

Wenn der ganze Stylesheet Kram über die Index geladen wird muss es dann ach noch in die unterseiten?
Oder reicht hier alles was sonst im Body steht?

Ich hab jetzt eine Index die das Menü holt und 2 Unterseiten Start und Multimedia
Bei allen Unterseiten hab ich genau das was und der Index steht plus die Unterschiede.
Ist das so richtig?

viegener · 21 Mai 2015, 00:46:34

Hallo Thomas,
Nein generell ist das nicht nötig. Bei mir enthält die Index.html im Head alle includes (also css und js-Dateine).

Die einzelnen Seiten, die als pagetab geladen werden, enthalten dann im wesentlichen nur noch den Seiteninhalt. Ich habe sie weiterhin als vollwertige HTML-Seiten ausgeführt aber nur noch die eigentlichen Gridster-Element mit den widgets:

Code Auswählen


<!DOCTYPE html>
<html>
<head>
	<title>Detail</title>
</head>
<body>

<div class="gridster">

<ul>

<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>

<!-- *******Hier kommen dann die einzelnen widgets als weitere li-Einträge  *********** -->

</ul>
</div>
</body>
</html>

Gruss,
Johannes