Neues FTUI Widget PinPad für Alarmanlagen

[Syrex-o]

Hi,

also auch die aktuelle Version verrichtet Ihren Dienst tadellos. Wieder 20x versucht und 20x hats geklappt.

Welche Browser verwendet Ihr und auf welcher Plattform?

Ich habe den FullyBrowser (Plus-Version) auf einem 60€-China-Tablet mit Android 7 laufen...

VG

Klingt gut. Bin aktuell nicht zuhause, aber werde den Browser mal testen. Funktioniert denn fullscreen ?
Ich tippe aktuell auf ein Problem beim cache, da ich logs gesetzt habe und das Modul in ca. 40% der Fälle überhaupt nicht ausgelöst wird.
Verwende chrome.

Bei Verbesserungsvorschlägen bitte einfach antworten.
Liebe Grüße

P.s. was für praktische Widgets würden euch noch in Tablet Ui fehlen ?

[Gunther]

Ich bin auch mit Chrome am Rechner (Mac) und Fully am Androidtab unterwegs.

Ein Tabellenwidget wäre cool um tabellarisch Infos aufbauen zu können.

[Ulm32b]

...
P.s. was für praktische Widgets würden euch noch in Tablet Ui fehlen ?

Behalte ich im Hinterkopf.

Mein größter Nikolaus-Wunsch bezieht sich allerdings auf ein vorhandenes Widget: eine Möglichkeit, durch einen Event automatisch auf eine bestimmte Pagebuttonseite wechseln zu können.
Wer ein Widget programmieren kann, hat bestimmt auch den richtigen Blick auf vorhandenen Programmcode. Wäre schön, wenn Du da mal einen Blick drauf werfen könntest.
Ziel bleibt natürlich, das via setstate zum neuen Standard zu machen. Aber der gute Mann braucht ja nicht alles selbst zu machen.

[ioT4db]

...Funktioniert denn fullscreen ?
...

Hi, ja Fullscreen. Selbst wenn ich den Browser schließe und wieder öffne kommt sofort das PinPad in den Vordergrund.

VG

PS: Fully verwendet ja (meines wissens nach) auch die Chromium-Engine...

[setstate]

Mein größter Nikolaus-Wunsch bezieht sich allerdings auf ein vorhandenes Widget: eine Möglichkeit, durch einen Event automatisch auf eine bestimmte Pagebuttonseite wechseln zu können.
Wer ein Widget programmieren kann, hat bestimmt auch den richtigen Blick auf vorhandenen Programmcode. Wäre schön, wenn Du da mal einen Blick drauf werfen könntest.
Ziel bleibt natürlich, das via setstate zum neuen Standard zu machen. Aber der gute Mann braucht ja nicht alles selbst zu machen.

Das muss schon mal funktioniert haben. Ich sehe aber gerade, macht's nicht ....
Bin dran.
Update: funktioniert

[Ulm32b]

Super. Herzlichen Dank. Habe es bei mir zum Laufen gebracht.
Allerdings brauchte ich etwas Zeit, um die Attribute zusammenzustöpseln, weil das im Wiki (https://wiki.fhem.de/wiki/FTUI_Widget_Pagebutton) bisher nicht dokumentiert war. Das muss natürlich geändert werden, deshalb nachfolgend meine Erkenntnisse, verbunden mit der Frage, ob das so o.k. und vollständig ist.

Als Ausgangspunkt nehmen wir das Beispiel aus dem Wiki (Hinweis für Nachahmer: Der nachfolgende Code betrifft nur die Menüleiste und stellt keine vollständige Lösung einer Pagebuttonnavigation dar):

Code Auswählen Erweitern

<li data-row="1" data-col="1" data-sizex="1" data-sizey="4">
    <div data-type="pagebutton"
         data-url="#page1.html"
         data-load="#page1"
         data-active-pattern=".*#page1.html"
         data-icon="mi-weekend"
         class="default"></div>
    <div data-type="pagebutton"
         data-url="#page2.html"
         data-load="#page2"
         data-active-pattern=".*#page2.html"
         data-icon="mi-music_video"></div>
    <div data-type="pagebutton"
         data-url="#page3.html"
         data-load="#page3"
         data-active-pattern=".*#page3.html"
         data-icon="mi-tv"></div>
</li>

#page2 soll automatisiert aufgerufen werden, wenn das device Musik den Zustand on annimmt. Dafür ist der Code folgendermaßen zu ergänzen:

Code Auswählen Erweitern

...
    <div data-type="pagebutton"
         data-url="#page2.html"
         data-load="#page2"
         data-active-pattern=".*#page2.html"
         data-icon="mi-music_video"
         data-device="Musik"
         data-get="STATE"
         data-get-on="on"></div>
...

Kleiner Schönheitsfehler (?): Wenn das Device Musik anschließend wieder auf off geht, bleibt die Seite aufgerufen (das ist gewollt), das Symbol in der Menüleiste geht aber wieder auf den Zustand off. Die ggf. eingestellte Rückkehr zur Hauptseite (data-return-time) funktioniert weiterhin.

Diese Erklärung könte ich ins Wiki aufnehmen. Außerdem ist das Attribut data-return-time zu ergänzen. Fehlt sonst noch etwas?

[setstate]

Das ist richtig.
data-device, data-get,  data-get-on und ggf. data-get-off ist nötig, um die gesteuerte Umschaltung per Reading zu realisieren.

Idealerweise mit einem Reading, was die Zustände für alle "Knöpfe" abbildet. Also, Reading-Wert="1" dann Button 1 aktiv, Reading-Wert="2" dann Button 2 aktiv, usw.
Somit haben alle Buttons das selbe data-device und data-get und Button 1 hat data-get-on="1", Button 2 hat data-get-on="2" usw.

Wenn du nur ein Reading mit on/off für einen bestimmten Pagebutton hast, müsste man mindestens den Home-Pagebutton mit data-get-on="off" versehen, damit dorthin zurück gesprungen werden kann.

[Ulm32b]

Alles klar. Ist jetzt auch im Wiki nachzulesen. Ich bin sicher, dass sich weitere Anwender finden werden.

[Gunther]

So, ich habe heute die letzte Version aus dem ersten Thread nochmal getestet. Kann es sein, dass da wieder eine ältere Version drin ist?

1. Pins mit Nullen gehen nicht.
2. Bekomme ich im Toast eine Fehlermeldung (geht sehr schnell, daher nur so ungefähr)

Code Auswählen Erweitern

cannot read property ''length" - undefined
3. Mein Popup-Problem ist leider noch nicht gelöst. Es wäre super, wenn das grundlegend gelöst wird.
Vielleicht kann Setstate nochmal draufschauen?

[Syrex-o]

1. Pins mit Nullen gehen nicht.

War ein Tippfehler. Ist wieder gelöst.

2. Bekomme ich im Toast eine Fehlermeldung (geht sehr schnell, daher nur so ungefähr)

Mach bitte einfach mal die Console auf, da stehen die selben Fehlermeldungen.
Bei mir kommt dieser Fehler nicht, daher schwer zu reproduzieren.

3. Mein Popup-Problem ist leider noch nicht gelöst. Es wäre super, wenn das grundlegend gelöst wird.

Wie vorher schon manche geschrieben haben, hängt es auch vom Browser ab. Daher solange bis die Lösung gefunden ist einfach: class="pop" benutzen.
So weit ich verstanden habe, war es doch das was du gebraucht hast oder?

Grüße

[Gunther]

Zu 1. Danke! Teste ich.
Zu 2. welche Konsole meinst Du?
Zu 3. muss gestehen, dass ich die class Version noch nicht getestet habe. Mache ich.

[Syrex-o]

welche Konsole meinst Du?

Meine die Entwickler Werkzeuge.
In Chrome "Strg + Umschalt + I"

Grüße

[Gunther]

- Für @Gunter: da das Popup nicht geht habe ich die Möglichkeit über class: pop eingebaut, die bisher nur auf on und off reagiert.
on = zeigt pinpad, off = versteckt pinpad.
Stehe nur gerade auf dem Schlauch, wie man es haben will, dass man den Alarm auch wieder scharf stellen kann. Dies geht aktuell nur aus der normalen Oberfläche. Vorschläge sehr willkommen.

Wie muss der Code den aussehen, wenn ich mit dem class pop arbeite? Wie kann ich da verhindern, dass das Popup geschlossen wird?

So schaut mein Code momentan aus:

Code Auswählen Erweitern

<!-- ============= Alarmanlage================== -->
<div data-type="popup"
data-draggable="false"
data-device="Alarm"
data-get-on="on"
data-get-on="off"
data-height="470px"
data-width="300px"
class="interlock"">
<!-- ============= Widgetinhalt Start  ================== -->
<div data-type="symbol"
data-device="Alarm"
      data-states='["on","off"]' 
      data-icons='["mi mi-lock_outline","mi mi-lock_open"]'
      data-colors='["#ad3333","#6699FF"]'
      data-background-icon=""
      class="big">
</div>
<div  data-type="label" data-device="Alarm" data-get="state" class="darker"/>
<!-- ============= Widgetinhalt Ende  ================== -->
<!-- ============= Popupinhalt Start  ================== -->
<div class="dialog">
        <header>Pin Alarmanlage</header>
            <div data-type="pinpad"
            data-device="Alarm"
            data-get="STATE"
            data-get-pin="pin"
            data-text-locked="scharf"
        data-text-unlocked="unscharf"
data-locked-time="10"
        data-tries="3">
      </div>
    </div>
<!-- ============= Popupinhalt Ende ================== -->
</div>
<!-- ============= Alarmanlage Ende ================== -->

[Syrex-o]

Wie muss der Code den aussehen, wenn ich mit dem class pop arbeite? Wie kann ich da verhindern, dass das Popup geschlossen wird?

Aktuell einfach so:

Code Auswählen Erweitern


<div     data-type="pinpad"
           data-device="Alarm"
           data-get="STATE"
           data-get-pin="pin"
           data-text-locked="scharf"
           data-text-unlocked="unscharf"
   data-locked-time="10"
           data-tries="3"
           class="pop">
</div>

Dann reagiert das Widget auf: "on" und "off".
Also musst du aktuell das device zum Beispiel mit einem Notify wieder scharf stellen.

Für deinen Code bedeutet es, dass das Popup komplett weg fällt.
Ich werde eventuell noch einbauen, dass es auf andere States reagiert.

Schreibe aber gerade Klausuren in der Uni und muss das leider vorziehen 

Grüße

[Mikka]

Hallo zusammen,

Super. Herzlichen Dank. Habe es bei mir zum Laufen gebracht.
Allerdings brauchte ich etwas Zeit, um die Attribute zusammenzustöpseln, weil das im Wiki (https://wiki.fhem.de/wiki/FTUI_Widget_Pagebutton) bisher nicht dokumentiert war. Das muss natürlich geändert werden, deshalb nachfolgend meine Erkenntnisse, verbunden mit der Frage, ob das so o.k. und vollständig ist.

Als Ausgangspunkt nehmen wir das Beispiel aus dem Wiki (Hinweis für Nachahmer: Der nachfolgende Code betrifft nur die Menüleiste und stellt keine vollständige Lösung einer Pagebuttonnavigation dar):

Code Auswählen Erweitern

<li data-row="1" data-col="1" data-sizex="1" data-sizey="4">
    <div data-type="pagebutton"
         data-url="#page1.html"
         data-load="#page1"
         data-active-pattern=".*#page1.html"
         data-icon="mi-weekend"
         class="default"></div>
    <div data-type="pagebutton"
         data-url="#page2.html"
         data-load="#page2"
         data-active-pattern=".*#page2.html"
         data-icon="mi-music_video"></div>
    <div data-type="pagebutton"
         data-url="#page3.html"
         data-load="#page3"
         data-active-pattern=".*#page3.html"
         data-icon="mi-tv"></div>
</li>

#page2 soll automatisiert aufgerufen werden, wenn das device Musik den Zustand on annimmt. Dafür ist der Code folgendermaßen zu ergänzen:

Code Auswählen Erweitern

...
    <div data-type="pagebutton"
         data-url="#page2.html"
         data-load="#page2"
         data-active-pattern=".*#page2.html"
         data-icon="mi-music_video"
         data-device="Musik"
         data-get="STATE"
         data-get-on="on"></div>
...

Kleiner Schönheitsfehler (?): Wenn das Device Musik anschließend wieder auf off geht, bleibt die Seite aufgerufen (das ist gewollt), das Symbol in der Menüleiste geht aber wieder auf den Zustand off. Die ggf. eingestellte Rückkehr zur Hauptseite (data-return-time) funktioniert weiterhin.

Diese Erklärung könte ich ins Wiki aufnehmen. Außerdem ist das Attribut data-return-time zu ergänzen. Fehlt sonst noch etwas?

Dieses hier von Ulm32b beschriebene Coole-Feature geht vermutlich nur mit dem pagebutton-widget und nicht mit dem link-widget oder? Meine versuche landeten in einer Fehlermeldung

Code Auswählen Erweitern


        <div data-type="link" class="nocache large top-space-2x left-space-3x"
            data-width="150"
            data-icon-left="fa-music"
            data-color="white"
            data-text-align="right"
            data-load="div#content7"
            data-url="#content_musik.html"
            data-active-color="cornflowerblue"
            data-device="myMPD"
            data-get="STATE"
            data-get-on="play"
            data-active-pattern=".*#content_musik.html">Musik</div>


Code Auswählen Erweitern

File not found: ./www/tablet/play beim anzeigen der Seite.

Mikka