set-Befehl aus Comboboxen zusammensetzen.

Begonnen von zYloriC, 02 Februar 2016, 10:25:10

Vorheriges Thema - Nächstes Thema

zYloriC

Hallo Leute,

ich würde gerne auf meinem FTUI Tablett zwei Comboboxen und einen OK-Button anzeigen. In der ersten Box würde man zB. den Rollladen, ein Licht oder einen Dummy auswählen und in der Zweiten dann an/aus oder 50%. Mit tap auf OK soll dann ein "set <Combobox1> <Combobox2>" an fhem gesendet werden.

Leider fehlt mir die Idee, wie ich die beiden Boxen verbinde. Außerdem wäre es toll, wenn Combobox1 die verfügbaren Werte von fhem abrufen würde und ich nicht alles in ein array hard-coden müsste. Da geht doch bestimmt irgendwie...

Bin für Tipps, die zur Ergreifung der Lösung führen, sehr dankbar!!
Gruß, zYloriC

setstate

Beim Select-Widget kann man mit data-list ein Reading angeben, was die Liste dynamisch liefert.
Die Items werden dann mit : (Doppelpunkt) getrennt erwartet.

Eine Zweierkombi ist meiner Meinung nach aktuell noch nicht realisierbar. Das müsste man in ein neues Widget packen: Zwei Comboboxen+Button.

Es gibt bestimmt auch Tricks mit DOM-Selektoren optional innerhalb eines Select-Widgets auf andere HTML Elemente zu referenzieren. Das macht aber die Konfiguration unnötig kompliziert und verwirrend. Ich wäre ein Freund von einem neuem Widget dafür.

kvo1

Hmm, mir fehlt hier gerade der Anwendungsfall ! man müsste dann 3 oder mehr gleiche Devices haben die dann auf an oder aus reagieren.  Oder ?
RPi1: mit CUL: HM-CC-RT-DN,HM-ES-PMSw1-Pl,HM-LC-BL1-FM,HM-LC-Bl1PBU-FM,HM-LC-SW1-PL2,HM-SCI-3-FM,HM-SEC-SC-2,KFM-Sensor
RPi2: Viessmann(optolink) mit 99_VCONTROL.pm,
Cubietruck: Wheezy / Apache / Owncloud
Cubietruck: Armbian(Jessie) / fhem 5.7 / LMS 7.9
RPi3: (Test) mit 7" Touch  &  HM-MOD-RPI-PCB

zYloriC

Danke setstate für deine Einschätzung. Klingt ja noch nicht so einfach. Schade.

@kvo1: ich habe ganz konkrete Anwendungsfälle. Ich will flexibel sein mit meinen etwa 20 Jalousien, 5 Lichtschaltern und den dummy-JAL-Schaltern für alle Ebenen.
Ich hatte früher switchs für alle Möglichkeiten, aber oft ist es so, dass ich ganz individuell z.B. eine Jalousie auf 40% schalten will, dafür hat man dann gerade keinen switch zur Hand ;)

Da wäre man mit den 2 Comboboxen schon sehr flexibel.
Gruß, zYloriC

setstate

Ein entsprechendes Widget wäre schnell zusammengebaut, aber bei der Anordnung der Elemente ist etwas Überlegung nötig: nebeneinander, untereinander, immer nur zwei oder multiple Comboboxen, sind Comboboxen die geeigneten Controls oder gibt es etwas schöneres ...?

zYloriC

Hi setstate,

also bei der Anordnung wäre ich flexibel bzw. würde mein aktuelles FTUI dafür anpassen. Am Besten fände ich 2 Comboboxen untereinander und dann den Button drunter.

Zur Frage ob Comboboxen ideal sind: Ich denke sie sind am flexibelsten was die Anzahl der Einträge angeht. Bei circlemenus kann es da schon unübersichtlich werden, oder?!
Was für Bedienelemente könnten noch in Frage kommen?

roman1528

Zitat von: zYloriC am 03 Februar 2016, 09:58:22
Was für Bedienelemente könnten noch in Frage kommen?

Moin.

Leider hab ich keinen Schimmer was JavaScript alles kann. Aber Elemtübergreifende manipulation müsste doch gehen  ::)

Meine Idee wäre:

Ein klickbares readonly-Textfeld (oder ähnlich, kann ja auch Label mit einem Platzhalter sein) mit dem sich ein PopUp öffnen lässt.
In diesem PopUp kann man dann nach belieben z.B. Link- oder Push-Widgets anlegen mit dem gewünschten Befehlsinhalt (data-surr-cmd="" ... surrender: Auslieferung).
Bei klick auf das im PopUp befindliche Widget wird das PopUp geschlossen und der Inhalt des geklickten Widget an das Textfeld/Label übergeben.
So ist nun der 1. Befehlsteil im Textfeld sichtbar und man kann ihn nochmal ändern falls man sich verdrückt hat.
Genau so mit dem 2. Befehlsteil / Textfeld

Hätte da nämlich auch riesiges interesse dran  ;D

Grüße^^
i3-10305T 4x3GHz;8GB RAM;250GB & 1TB NVMe:
FHEM 6.2;FTUI;8" Tablet's+Fully;NsPanelPro;HUE;ESPRGBWW;HM(CCU3);Duofern; ASC;MQTT(Tasmota);netatmo;SONOS;eBus;DbLog;XiaomiDevice;NUT;ModbusAttr

RPi3+: FHEM 6.2;I²C;GPIO;RFID;G-Tag;XiaomiBTLESens
RPi3: FHEM 6.2;DIY Relais-Board;I²C;GPIO;RFID;Photovoltaik

zYloriC

Hallo Roman,

leider blicke ich nicht ganz durch, was du mit Textfeld und Popup anstellen willst ;) ist das Textfeld zu Eingabe gedacht? Mit onscreen-keyboard?

Meine Idee hinter den 2 Comboboxen ist, dass man befehle aus einer 2-Dimensionalen Matrix (also einer "Tabelle") ausführen kann. Prinzipiell wäre es auch über circlemenus machbar.
Der wichtige Punkt ist jedoch, dass der Wert der ersten Auswahl nicht direkt an Fhem geschickt wird, sondern zurückgehalten wird, bis die Eingabe der zweiten Combobox gemacht ist (oder bis der OK-Button gedrückt wird...)

Gruß, zYloriC

PS @Roman: Deine FTUI-Lösung und die Grafiken in deinem Sig-Link gefallen mir echt gut!! Cool.

roman1528

Zitat von: zYloriC am 05 Februar 2016, 10:42:58
Meine Idee hinter den 2 Comboboxen ist, dass man befehle aus einer 2-Dimensionalen Matrix (also einer "Tabelle") ausführen kann. Prinzipiell wäre es auch über circlemenus machbar.
Der wichtige Punkt ist jedoch, dass der Wert der ersten Auswahl nicht direkt an Fhem geschickt wird, sondern zurückgehalten wird, bis die Eingabe der zweiten Combobox gemacht ist (oder bis der OK-Button gedrückt wird...)

Ja das ist mir klar!
Textfeld (oder ähnlich) deswegen, weil Comboboxen, egal ob Drop-Down oder Select-Box auf einem Tablet zum "touchen" zu frickelich sein könnten!
Bei "touch" auf das Textfeld geht ein PopUp auf in welchem man dann seinen Befehlsteil auswählen kann. Wie du das PopUp gestaltest (ob mit Link-Widget oder Label-Widget) sei dir überlassen.
Bei "touch" auf eines der im PopUp befindlichen Elemente wird das PopUp geschlossen und der (im Link oder Label) hinterlegte Befehlsteil wird ins Textfeld übernommen.

Das gleiche mit einem 2. Textfeld für den 2. Befehlsteil.... Vielleicht ja auch 3?

In den Textfeldern kannst du jetzt deine Befehlsteile kontrolllieren ob sie richtig sind. Wenn nicht, "touch" auf's Textfeld und einen anderen Befehlsteil aus dem PopUp wählen.
Ist alles richtig... "touch" auf ein neben oder unter den Textfeldern befindliches Push-Widget. Jetzt wird der Befehl aus den Textfeldern zusammengesetzt (feld1 feld2 feld3) und an FHEM gesendet.
Jetzt könnte man noch die Textfelder wieder leeren.... Ist aber spielerei.

Hoffe es ist so etwas verständlicher.

Zitat von: zYloriC am 05 Februar 2016, 10:42:58
PS @Roman: Deine FTUI-Lösung und die Grafiken in deinem Sig-Link gefallen mir echt gut!! Cool.

Danke  ::)
i3-10305T 4x3GHz;8GB RAM;250GB & 1TB NVMe:
FHEM 6.2;FTUI;8" Tablet's+Fully;NsPanelPro;HUE;ESPRGBWW;HM(CCU3);Duofern; ASC;MQTT(Tasmota);netatmo;SONOS;eBus;DbLog;XiaomiDevice;NUT;ModbusAttr

RPi3+: FHEM 6.2;I²C;GPIO;RFID;G-Tag;XiaomiBTLESens
RPi3: FHEM 6.2;DIY Relais-Board;I²C;GPIO;RFID;Photovoltaik

setstate

Zitat von: zYloriC am 02 Februar 2016, 10:25:10
Hallo Leute,

ich würde gerne auf meinem FTUI Tablett zwei Comboboxen und einen OK-Button anzeigen. In der ersten Box würde man zB. den Rollladen, ein Licht oder einen Dummy auswählen und in der Zweiten dann an/aus oder 50%. Mit tap auf OK soll dann ein "set <Combobox1> <Combobox2>" an fhem gesendet werden.

Leider fehlt mir die Idee, wie ich die beiden Boxen verbinde. Außerdem wäre es toll, wenn Combobox1 die verfügbaren Werte von fhem abrufen würde und ich nicht alles in ein array hard-coden müsste. ...

Und die zweite Combobox dürfte  "dumm" bleiben, also unabhängig von der Selektion von Combobox1 bleiben? Aktuelle Werte und Werteliste? Oder müssen das s.g. chained/depending Comboboxen sein?

setstate

#10
ich habe die Sache für Comboboxen + Link-Button jetzt realisiert. Wäre auch noch für andere Widgets denkbar. Als Referenz auf die entsprechenden Elemente habe ich mich nun doch für einen CSS Selector entschieden.

data-value="#sendValue"
bedeutet - nimm als Wert zum Senden den data-value Wert vom DOM Element mit der ID 'sendValue'

data-value="toggle"
bedeutet - nimm als Wert zum Senden 'toggle', also ein Festwert

Beispiel

<li data-row="1" data-col="4" data-sizex="2" data-sizey="2">
    <header>SELECT</header>
    <div data-type="select" data-items='["dummy1","dummy2","dummy3","dummy4"]' id="sendDev" class="notransmit w3x"></div>
    <div data-type="select" data-items='["param1","param2","param3","param4"]' id="sendParam" class="notransmit w3x"></div>
    <div data-type="select" data-items='["on","off"]' id="sendValue" class="notransmit w2x"></div>
    <div data-type="link" class="round centered"
         data-width="80" data-height="40"
         data-color="white"
         data-background-color="green"
         data-icon="fa-feed"
         data-device="#sendDev"
         data-set="#sendParam"
         data-value="#sendValue">
        OK
    </div>
</li>



roman1528

Zitat von: setstate am 09 Februar 2016, 01:07:57
ich habe die Sache für Comboboxen + Link-Button jetzt realisiert. Wäre auch noch für andere Widgets denkbar. Als Referenz auf die entsprechenden Elemente habe ich mich nun doch für einen CSS Selector entschieden.

data-value="#sendValue"
bedeutet - nimm als Wert zum Senden den data-value Wert vom DOM Element mit der ID 'sendValue'

data-value="toggle"
bedeutet - nimm als Wert zum Senden 'toggle', also ein Festwert

Beispiel

<li data-row="1" data-col="4" data-sizex="2" data-sizey="2">
    <header>SELECT</header>
    <div data-type="select" data-items='["dummy1","dummy2","dummy3","dummy4"]' id="sendDev" class="notransmit w3x"></div>
    <div data-type="select" data-items='["param1","param2","param3","param4"]' id="sendParam" class="notransmit w3x"></div>
    <div data-type="select" data-items='["on","off"]' id="sendValue" class="notransmit w2x"></div>
    <div data-type="link" class="round centered"
         data-width="80" data-height="40"
         data-color="white"
         data-background-color="green"
         data-icon="fa-feed"
         data-device="#sendDev"
         data-set="#sendParam"
         data-value="#sendValue">
        OK
    </div>
</li>


Das sieht sehr nice aus! und ist super anpassbar!

Coole Sache. Auch von mir ein riesen Danke.
i3-10305T 4x3GHz;8GB RAM;250GB & 1TB NVMe:
FHEM 6.2;FTUI;8" Tablet's+Fully;NsPanelPro;HUE;ESPRGBWW;HM(CCU3);Duofern; ASC;MQTT(Tasmota);netatmo;SONOS;eBus;DbLog;XiaomiDevice;NUT;ModbusAttr

RPi3+: FHEM 6.2;I²C;GPIO;RFID;G-Tag;XiaomiBTLESens
RPi3: FHEM 6.2;DIY Relais-Board;I²C;GPIO;RFID;Photovoltaik

dieda

Ich habe gerade mit dem Select rumgespielt und eine Listbox meiner Favoriten für die Squeezebox zusammengestellt. Was mich allerdings nun stört ist, dass der Inhalt der Listbox schaurig aussieht.

<div data-device="SB_Kueche"
data-type="select"
data-items='["favorites RPR1_Web_Radio_Comedy","favorites RPR1_Rock_Modern_Rock" ....]'
id="sendValue" class="notransmit w2x"></div>


Da war doch noch was, ... weiß gerade nicht weiter. Wie bekomme ich es hin, dass da nur der Name steht
Komponenten:
Sensoren und Aktoren: FS20, Max!, Zigbee, Zwave
IODev:  Cul1101, MaxLan, ZWAVE, Deconz
Router: KD-Fritte (6360)
Sonstiges: Raspberries,  1x LMS,1 FHEM, 1 x zum Testen,  Logitech-Clients,  Onkyo, SamsungTV, Squeezebox, TabletUIs

setstate


dieda

#14
Danke, werde es gleich testen.

Funktioniert. :D
Komponenten:
Sensoren und Aktoren: FS20, Max!, Zigbee, Zwave
IODev:  Cul1101, MaxLan, ZWAVE, Deconz
Router: KD-Fritte (6360)
Sonstiges: Raspberries,  1x LMS,1 FHEM, 1 x zum Testen,  Logitech-Clients,  Onkyo, SamsungTV, Squeezebox, TabletUIs