Evaluierungsversion 2.2

[FHEm2005]

Hat sich erledigt, denn der Zutritt zur Branch:eval ist jetzt auf einmal erreichbar. Ich verstehe nix mehr. Aber egal.

Gruß Eberhard

[Roman]

Hallo, ich stell das nochmal ein, hat jemand eiine Idee dazu ?

ich bin jetzt mit der 2.2 Version auch schon einige Tage am Testen. Mir ist folgendes bei 'pagebutton' augefallen.

Bei den Widget's slider und chart werden die Daten nicht geladen, sondern sind erst nach einem Reload vorhanden (und damit auf den anderen Seiten wieder ohne Wert)

Beschreibung:
Seite 1: mit Slidern
Seite 2: mit Slidern
Seite 3: mit Charts

Wird Seite 1 geladen werden die Slider Werte richtig auf Seite 1 angezeigt.
Wechsel über Pagebutton zu Seite 2 ->  dort sind alle Slider Werte auf '0', erst ein Reload im Browser bringt die richtigen Werte. Dabei gehen dann aber wieder die Slider-Werte von Seite 1 verloren.
Gleiches Problem bei Charts, die sind erst nach einem reload vorhanden und sind nur so lange vorhanden bis wegen der Slider eine andere Seite mit reload aktualisiert wurde.

Der Status von z.B. Switches wird korrekt über alle Seiten geladen/angezeigt, auch ohne reload.

Gruß
Roman

[setstate]

Hallo Roman,

das kann durchaus noch eine schlechte Konstellation sein, die zu dem von dir genannten Fehlerbild führt.
Ich muss das bei mir erst auf 1-2 Testseiten nachstellen und die Ursache suchen. Kann dir aber noch nicht sagen, wann ich dazu komme.

[Roman]

Hallo setstate,

ich wollte nicht drängeln, nur nachdem fast 2 Seiten an neuen Einträgen dazu kamen, hatte ich die Befürchtung, das es untergeht.

Gruß
Roman

[setstate]

ach, das Problem bei den Slidern liegt in der benutzen Lib "powerange.js". Die hat das Problem, dass die Berechnung der Position nur bei sichtbarem Element funktioniert. Ist das Teil versteckt, kommt 0 bei offsetWidth und  offsetHeight raus und der Slider zeigt nix an. Das bekommt man nur gelöst, wenn man ein anderes Grundelement als Basis für dieses FTUI Widget benutzt. Ich gehe mal auf Suche ...

Update
Das Problem mit dem Slider konnte ich lösen, im powerange.js selbst. Ich habe die benutzten JS Funktionen 'offsetWidth' und 'offsetHeight' durch die jQuery Funktionen height() und width() ersetzt. Damit ist powerange.js jetzt nicht mehr Pure JS, aber wen störts ... wir nutzen ja eh jQuery. height() und width() liefern die richtigen Werte, auch wenn das Element gerade nicht sichtbar ist.

[Roman]

Hallo setstate,

gleiches Problem beim Chart-Widget, evtl. ein ähnliches Problem ?

Gruß
Roman

[setstate]

Zum Chart muss eki was sagen, damit kenne ich mich nicht aus.

Zum Nachstellen:
- index_page_demo.html aus den eval Beispielen (https://github.com/knowthelist/fhem-tablet-ui/tree/eval/www/tablet_eval)
- erstes Widget auf die page_content1.html
- zweites Widget auf die page_content2.html

Seite wird geladen  > content1 ist okay > Klick auf pagebutton zum Wechsel auf content2 > Bum

[guna83]

Wäre toll wenn die aktuelle Version des Fullcallview-Widgets (Seite 2 im Thread https://forum.fhem.de/index.php/topic,48562.0.html) in die tablet_eval käme.
Gibt es jemanden der das Readingsgroup-Widget am laufen hat? Mit der bei der EVAL mitgelieferten Version funktioniert es nicht, ich habe versucht die anzupassen, aber leider bisher nicht ganz erfolgreich.
Gibt es jemanden der Highcharts schon portieren konnte? Vermisse auf meiner 2.2er FTUI-Instanz die Wetteranzeige von yr.no :-D.
Ansonsten läuft die 2.2 hier super und stabil!

[wildea]

Hallo Leute

ich habe Schwierigkeiten die Symbole aus der openautomation.css anzeigen zulassen. Ich habe die css in der index.html normal eingebunden

Code Auswählen Erweitern

<link rel="stylesheet" href="lib/openautomation.css" />

und versuche sie in einem Pagetab anzeigen zu lassen.

Code Auswählen Erweitern

<div data-type="pagetab"
    data-device="bu_alert"
    data-icon="oa-scene_office"
    data-states='["off","on"]'
    data-url="index_buero.html"
    data-background-icon="fa-circle-thin"
    data-on-background-color="#aa6900"
    data-on-color="#808080"
    data-off-color="#808080"
    data-icons='["oa-scene_office","oa-scene_office warn"]'
    class="big">
    </div>

woran kann das denn liegen?

[Roman]

Hallo setstate,

das slider und pagebutton klappt nun ohne Probleme, habs mit deiner Demo und meinen Testseiten durchprobiert.

Wegen den Charts frag ich mal bei eki nach.

Gruß Roman

[FhemPiUser]

kurze Frage: Ich habe in meiner 2.0er index.html folgenden pagebutton zum Laden einer externen Webseite, die ich nicht cachen möchte:

Code Auswählen Erweitern

<div data-type="pagebutton" data-url="cam.html" data-icon="fa-video-camera" class="cell narrow"></div>

Kann ich das so weiter verwenden in der 2.2er Version, da es ohne "data-load" ist oder muss ich dafür Parameter wie "nocache" angeben?

Der Beispielcode in index.zeigt nur die Referenzierung auf page-widgets / content-ids der gleichen html-Datei...

Ich frage bei, da die 2.2er Version bei mir gefühlt deutlich langsamer den ersten poll bzw. fresh der readings nach online-event abschliesst als die 2.0er Version und ich überlege, ob es daran liegen kann, dass er versucht die ganzen externen Seiten zu cachen...

[Roman]

Hallo setstate,

ich hab bei weiteren Tests festgestellt, dass das Homestate Widget in Verwendung mit Pagebuttons auch nicht geladen wird, wenn es beim Reload nicht auf der aktuellen Seite ist. (wie beim slider)

Edit: Kommando zurück, Homestate funktioniert mit Pagebutton, nach einem Löschen des Browser-Caches wird das auch auf einer inaktiven Seite normal geladen.

Gruß
Roman

[Michi240281]

Hallo zusammen,

habe mir jetzt die 2.2 installiert und baue mir damit eine "Mobile-UI"! Nutze dafür die Demo-Dateien.

Eine Frage dazu: Wie bekomme ich das slideout-Menu auf die rechte Seite statt linke Seite?

Was hat es mit den id´s zu tun?

Und kann man irgendwie eine Zeit definieren, nach der das Slidermenu sich wieder von selbst einklappt? Das wäre sehr praktisch!

Und dann noch eine Frage: Ich habe die Müllanzeige vom Tablet-UI einfach mal kopiert, da wird aber alles seltsam angezeigt:

Code Auswählen Erweitern

<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="" id="Abfall">
<li data-row="2" data-col="2" data-sizex="4" data-sizey="6">
<header>ABFALL</header>
        <div class="cell">
            <div>
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_GelberSack"
                    data-off-color="#E6E600"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-recycle","fa-recycle warn","fa-recycle warn blink"]'
                    data-fhem-cmd="setreading abfall_GelberSack alarm done"
                    data-on-colors='["#E6E600","#E6E600","#E6E600"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_GelberSack" class="thin small"></div>
            </div>
            <div>
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Biomuell"
                    data-off-color="#996633"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Biomuell alarm done"
                    data-on-colors='["#996633","#996633","#996633"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Biomuell" class="thin small"></div>
            </div>
            <div>
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Papier"
                    data-off-color="blue"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Papier alarm done"
                    data-on-colors='["blue","blue","blue"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Papier" class="thin small"></div>
            </div>
            <div>
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Restmuell"
                    data-off-color="grey"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Restmuell alarm done"
                    data-on-colors='["gray","gray","gray"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Restmuell" class="thin small"></div>
            </div>
      </div>
</li>
</div>
</body>
</html>


Woran könnte das liegen?


Besten Dank schon mal!

EDIT: ALso grundsätzlich habe ich Probleme, wenn ich in der mobilen Version versuche, mit list- und gridster-Elementen zu arbeiten! Da passt einfach nicht wirklich viel! Was muss ich denn tun, damit ich die gridster-Elemente genauso anordnen kann wie in 1.*? Mir ist außerdem aufgefallen, dass die Einträge generell nur angezeigt werden (bei Verwendung von list-Elementen), wenn ich das <ul>.....</ul> weglasse! Sonst bleibt die Seite leer!

Ich hänge hier mal alle meine Dateien fürs Smartphone an, vllt kann mir ja jmd helfen!

Besten Dank im vorraus!

[Michi240281]

Noch eine Frage:

Ich habe jetzt auch begonnen, mein "Tablet-UI" auf 2.2 umzustellen. Habe dabei auf der "index_page_demo.html" aufgebaut. Soweit funktioniert alles und die Geschwindigkeit ist der Hit!!!

Allerdings wird folgendes gridster nicht korrekt angezeigt:

Code Auswählen Erweitern

<li data-row="4" data-col="5" data-sizex="1" data-sizey="2" class="semitransparent">
        <header>ABFALL</header>
        <div class="cell">
            <div class="space_10pxTop">
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_GelberSack"
                    data-off-color="#E6E600"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-recycle","fa-recycle warn","fa-recycle warn blink"]'
                    data-fhem-cmd="setreading abfall_GelberSack alarm done"
                    data-on-colors='["#E6E600","#E6E600","#E6E600"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_GelberSack" class="thin small"></div>
            </div>
            <div class="space_10pxTop">
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Biomuell"
                    data-off-color="#996633"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Biomuell alarm done"
                    data-on-colors='["#996633","#996633","#996633"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Biomuell" class="thin small"></div>
            </div>
            <div class="space_10pxTop">
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Papier"
                    data-off-color="blue"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Papier alarm done"
                    data-on-colors='["blue","blue","blue"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Papier" class="thin small"></div>
            </div>
            <div class="space_10pxTop">
                <div
                    data-type="pagebutton"
                    data-background-icon="fa-circle-thin"
                    data-off-background-color="#7A7A7A"
                    data-on-background-color="#7A7A7A"
                    data-device="abfall_Restmuell"
                    data-off-color="grey"
                    data-get="alarm"
                    data-get-on='["off","warn|done","blink"]'
                    data-icons='["fa-trash","fa-trash warn","fa-trash warn blink"]'
                    data-fhem-cmd="setreading abfall_Restmuell alarm done"
                    data-on-colors='["gray","gray","gray"]'
                    class="large">
                </div>
                <div data-type="label" data-device="abfall_Restmuell" class="thin small"></div>
            </div>
      </div>
</li>

Im Anhang mal 2 Fotos, einmal auf 1.* und das neue auf 2.2! Genau das gleiche Problem mit der Anzeige habe ich auch auf dem Smartphone mit 2.2! Was mache ich falsch?

[SirMarco]

Ich würde sagen die Icons sind in 2.2 nicht vorhanden.