[FHEM-Tablet-UI] User-Demos

[bjoernbo]

Super ! Ich denke da werde ich mir noch das ein oder andere "abkupfern" 

[jnewton957]

Laufende Bilder sagen oft mehr...

Ich habe mal ein Video meiner aktuellen Installation gemacht:

https://youtu.be/E4nZGjGl0lo

Gruß Detlef

Hallo Detlef,

danke für die Mühe.
Schon Klasse, wenn man 21" Platz auf dem tablet hat

Grüße
Jörg

[chris1284]

Schon Klasse, wenn man 21" Platz auf dem tablet hat

verleitet aber schnell viel zu viel anzuzeigen (fhem in der ui, update, backup, systemfunktionen allgemein )... ich finds aber schön mal die uis der anderen live zu sehen und es sind echt nette lösungen für einige sachen dabei detlef

[jnewton957]

Hallo zusammen.

ich habe in der Wetterseite die Abbildung der Mondpahse integriert.

Code Auswählen Erweitern

<li class="halbTransparent" data-row="5" data-col="7" data-sizex="1" data-sizey="1">
<header>MOND</header>
<div data-type="image" data-device="mondphasen" data-get="ftui"
data-size="100px" class=""></div>
</li>

Das ist mit  sizex="1" und sizey="1" recht klein.

Nun möchte ich entweder in einem zweiten Seite (link auf mond.html) oder noch besser mit Klick auf den Mond als z.B. popup das größere Bild haben.

Reading ftui ist /fhem/images/phasenbilder/95.png

FYI: 100 Bilder sind jeweils die aktuelle Mondphase.

Wie kann man das bewerkstelligen ?

Danke
Grüße
Jörg

[chris1284]

aus welchem modul ziehst du die daten zur mondphase?

[jnewton957]

aus welchem modul ziehst du die daten zur mondphase?

59_Moon.pm

https://forum.fhem.de/index.php/topic,37467.msg431487.html#msg431487

Aber darauf achten, dass man vorher die Zusatmodule mit cpan eingebunden hat. Steht aber alles im thread.

Grüße
Jörg

[Aeroschmelz]

Hallo Jörg,

das sieht großartig aus. Könntest du bitte den Code teilen?

Danke schön.

Viele Grüsse
Marcus

Mein aktueller Stand des Servermonitors als Kombination einiger Tips.

(https://forum.fhem.de/index.php?action=dlattach;topic=37378.0;attach=63689)

Danke@Eisix und Danke@Masterfunk

Grüße
Jörg

[setstate]

Hallo zusammen.

ich habe in der Wetterseite die Abbildung der Mondpahse integriert.

Code Auswählen Erweitern

<li class="halbTransparent" data-row="5" data-col="7" data-sizex="1" data-sizey="1">
<header>MOND</header>
<div data-type="image" data-device="mondphasen" data-get="ftui"
data-size="100px" class=""></div>
</li>

Das ist mit  sizex="1" und sizey="1" recht klein.

Nun möchte ich entweder in einem zweiten Seite (link auf mond.html) oder noch besser mit Klick auf den Mond als z.B. popup das größere Bild haben.

Reading ftui ist /fhem/images/phasenbilder/95.png

FYI: 100 Bilder sind jeweils die aktuelle Mondphase.

Wie kann man das bewerkstelligen ?

Basis Layout eines Popup sieht so aus.

Code Auswählen Erweitern


<div data-type="popup" data-height="150px" data-width="250px">
  <div><!-- click object to open the popup --></div>
  <div class="dialog">
      <header>DIALOG</header>
      <div><!-- widget(s) inside the popup dialog --></div>
  </div>
</div>



Außen macht man einen kleines Vorschau Bild zum Klicken. Innen ein großes.

[jnewton957]

Basis Layout eines Popup sieht so aus.

Außen macht man einen kleines Vorschau Bild zum Klicken. Innen ein großes.

Danke @setstate

Code Auswählen Erweitern

<li class="halbTransparent" data-row="5" data-col="7" data-sizex="1" data-sizey="1">
<header><div data-type="label" data-device="mondphasen" data-get="STATE" class=""></div></header>

<div data-type="popup" data-height="650px" data-width="650px">
  <div><div data-type="image"
data-device="mondphasen"
data-get="ftui"
data-size="100px">
</div></div>

  <div class="dialog">
      <header><div data-type="label" data-device="mondphasen" data-get="STATE" class=""></div></header>
      <div><div data-type="image"
data-device="mondphasen"
data-get="ftui"
data-size="600px">
</div></div>
  </div>
</div>
</li>

Funktioniert einwandfrei.

==> Steigerung.
Wenn ich im popup nun auf den Mond klicke, verlinkt er auf mond.html

Wie mache ich das ?

Grüße
Jörg

[Aeroschmelz]

Hallo,

habe gleich noch eine Frage. Wenn ich das in FHEM einfüge, bekomme ich eine sehr große Anzahl an Updates angezeigt (ca. 1800), wenn ich allerdings manuell in der Fhem Befehlszeile "Update" eingebe, steht dort "Nothing to Do", d.h. es gibt keine Updates. In opt/fhem/FHEM sind beide Textdateien vorhanden. Ist das irgendwie erklärbar?

Grüsse
Marcus

Code Auswählen Erweitern



define UPDATE CustomReadings
attr UPDATE event-on-update-reading FHEM,FTUI,ALL
attr UPDATE interval 21600
attr UPDATE readingDefinitions FHEM:qx(wget -qO - http://fhem.de/fhemupdate/controls_fhem.txt| diff - /opt/fhem/FHEM/controls_fhem.txt |grep ">"|grep "UPD"|wc -l),FTUI:qx(wget -qO - https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt| diff - /opt/fhem/FHEM/controls_fhemtabletui.txt |grep ">" |grep "UPD"|wc -l),ALL:{ReadingsNum($name, "FHEM", 0) + ReadingsNum($name, "FTUI", 0)}



[jnewton957]

Hallo,

habe gleich noch eine Frage. Wenn ich das in FHEM einfüge, bekomme ich eine sehr große Anzahl an Updates angezeigt (ca. 1800), wenn ich allerdings manuell in der Fhem Befehlszeile "Update" eingebe, steht dort "Do Nothing", d.h. es gibt keine Updates. In opt/fhem/FHEM sind beide Textdateien vorhanden. Ist das irgendwie erklärbar?

Grüsse
Marcus

Hallo Marcus,

habe es mir auch gerade angesehen. Gleiches Ergebnis: FHEM 1834 Updates und FTUI 0

Jörg

[Eisix]

Hallo,

das online controllfile ist nicht mehr mit wget abzurufen.

Code Auswählen Erweitern


wget http://fhem.de/fhemupdate/controls_fhem.txt
--2016-12-11 14:20:34--  http://fhem.de/fhemupdate/controls_fhem.txt
Resolving fhem.de (fhem.de)... 88.99.31.202, 2a01:4f8:10a:806::2
Connecting to fhem.de (fhem.de)|88.99.31.202|:80... connected.
HTTP request sent, awaiting response... 403 Forbidden
2016-12-11 14:20:34 ERROR 403: Forbidden.


Dadurch werden alle Zeilen des lokalen files beim diff gezählt.
Mal sehen ob das temporär oder dauerhaft ist. ansonsten muss das custom reading auf den Perlcode vom update umgestellt werden.

Gruß
Eisix

[meddie]

Hallo zusammen,

ich habe eine Frage, ich passe gerade mein FTUI an, mir hat die Lösung vom Björn recht gut gefallen, und er hat ja hier seinen Code geteilt, er hat ja oben bei der Überschrift: Übersicht rechts daneben die Icons für die Müllabfuhr sowie Anwesenheit,Fenster usw. Außerdem vrwendet der Björn ja Bilder in den Widgets für Personen die Anwesend sind, ich würde gerne auch Bilder bei mir rein tun aber nicht als Widget sondern oben in diese Leiste.

siehe Bild (ich bin gerade unterwegs und kann kein Bild von mir reinstellen, daher verwende ich zur Verdeutlichung das Bild vom Björn)
https://forum.fhem.de/index.php?action=dlattach;topic=37378.0;attach=63646

Ich habe dazu diesen Coder verwendet

Code Auswählen Erweitern

<div data-type="image"
     data-width="25" data-height="25"
     data-url="pics/rr1.jpg"
</div>

Leider wird mir das Bild oben in der Leiste zwar angezeigt aber ist ist in der Zeile nicht mittig ausgerichtet sondern ist direkt oben in der Zeile die nachfolgenden Icons sind aber mittig.
Wenn ich ein top-space einsetze dann hat zwar mein Bild etwas Abstand von Oben aber dafür sind dann die restlichen Icons auch etwas versetzt.

Habt Ihr ein Tipp für mich wie ich das Bild und die Icons sauber in die Zeile bekomme

Danke
Gruß Eddie

[bjoernbo]

bau mal ein ....

<div class="cell centered>
<div data-type="image"
     data-width="25" data-height="25"
     data-url="pics/rr1.jpg"
</div>
</div>

ggf. nach dem

<div class="cell centered>

noch ein oder zwei

</br>

ein.

[setstate]

Im Grunde geht das so am besten.

Code Auswählen Erweitern


        <header id="header-nav" class="bg-lightgray fixed row">
            <div class="center">
                <div data-type="slideout" class="col-1-6 big center-align notouch"></div>
                <div id="linkname" class="col-1-4 large bold center-align middle"></div>
                <div class="round" data-type="image" data-device="ftuitest" data-state-get="homie1" data-states='["anwesend","abwesend"]' data-classes='["","faded"]' data-width="30" data-height="30" data-url="http://lorempixel.com/150/150/people/1"></div>
            </div>
        </header>


Ich weiß aber nicht, was du von Björn mit in die Header-Leiste reingenommen hast. Da sind noch kleine Ungereimtheiten drin, die das wieder durcheinander bringen könnten. z.B.

"<div class="right top space-2x">Außen</br>"

und col-1-x mit inline vermischt und col-1-9 gibt es nicht in der Standard-CSS ...

Wenn es nicht klappt, musst du mal deinen Code-Teil posten