Item mit (nested) Liste darstellen

[Sisamiwe]

Andre

Test erfolgreich durchgeführt!

Anmerkung 2020-05-18 111236.png

Ich habe noch eine Bitte bzw. einen Vorschlag: Kannst Du dem Widget noch einen Parameter mitgeben, der die Granularität der Teilachse festlegt?
Aktuell gibt es das Stundenraster. Das ist als Kopfzeile auch in Ordnung. Es wäre schön, wenn das Raster in der eigentlichen Zelle kleiner wäre. Meine Schaltzeiten bei der Heizung kann ich 10min genau einstellen. d.h. die Stundenzelle müsste dann noch in 6 Teile geteilt werden.

Glaubst Du das geht?

[wvhn]

AndreK , klasse Sache. Wenn Du das widget für die Nachrüstung laufender Versionen in newstuff pushst, nehme ich es in die nächste SV-Version auf. Das wird sich dann "device.uzsutable" nennen.

Zwei Fragen habe ich noch:
- was macht das Attribut "_backend"? Kannst Du das noch in den Docstring aufnehmen?
- gibt es eine css-Klasse "timetable" und könntest Du die in eine separate css-Datei stellen?

Eine Unterteilung in 10min-Schritte finde ich aus Gründen der Übersichtlichkeit ungünstig (Spaltenbreiten von 0,66%). Denkbar wäre vielleicht noch, dass man die Zeiten in Klartext in die Felder schreibt (optional).

Gruß Wolfram

[Onkelandy]

Sehr coole Sache. Wenn's mal zu nem ausgereiften Widget werden sollte, würden mir noch ein paar Sachen einfallen:
- Einbeziehen der Sonnenstandsoptionen. Das Plugin schreibt ins dict den errechneten Sonnenstand als Uhrzeit, wäre also einfach abzugreifen.
- Anzeigen, ob ein Eintrag aktiv ist oder nicht -> weniger satte Farbe für inaktive Einträge.
- Anzeigen, ob die ganze Uzsu ausgeschaltet oder aktiv ist, zB durch ausgrauen der Zahlen und Tage?
- Definieren der Unterteilung. Die Tabelle sollte imho immer im Stundentakt bleiben, aber die Felder könnten ohne Zwischenstriche durchaus weniger breit ausgefüllt sein. Ob man das dann in 10 Minuten Abschnitten unterscheiden kann, ist wohl ne Frage der Größe der Darstellung

In weiterer Folge könnte man sogar andenken:
- Erstellen oder Ändern eines Eintrags durch Klicken auf ein Feld. Äquivalent zum uzsugraph.

Wenn ich einen Eintrag für alle Tage (kein Tag selektiert) zB um 0:00 auf Aus stelle und auf OK klicke, kommt bei mir diese Fehlermeldung:

uzsu.js:49 Uncaught TypeError: Cannot read property 'split' of undefined
    at DrawTimeTable (uzsu.js:49)
    at a.<computed>.<computed>._update (uzsu.js:139)
    at a.<computed>.<computed>._update (jquery.mobile-1.4.5.js:835)
    at a.<computed>.<computed>.update (base.js:2032)
    at a.<computed>.<computed>.update (jquery.mobile-1.4.5.js:835)
    at HTMLDivElement.<anonymous> (jquery.mobile-1.4.5.js:933)
    at Function.each (jquery-2.1.4.min.js:2)
    at n.fn.init.each (jquery-2.1.4.min.js:2)
    at n.fn.init.a.fn.<computed> [as widget] (jquery.mobile-1.4.5.js:919)
    at Object.update (base.js:1477)

[AndreK]

Hallo Sisamiwe , hallo Onkelandy ,

ihr habt natürlich recht

Wenn's mal zu nem ausgereiften Widget werden sollte....

Ein "ausgereiftes Widget sollte schon mindestens zehn, besser mehr, Parameter haben.
Ich habs mal aufgebohrt auf "14" Parameter.

Ich denke die Parameter sind selbst erklärend.

* @param {id=} unique id for this widget (optional)
* @param {item(dict)} the item of the UZSU (NOT the item which is switched by UZSU)
* @param {headline=''} headline of Table (optional, default: empty)
* @param {value_on='1'} value for 'on' state (optional)
* @param {value_off='0'} value for 'off' state (optional)
* @param {color_on='green'} the color for the 'on' state, e.g. '#f00' for red (default 'green' of the design)
* @param {color_off='red'} the color for the 'off' state, e.g. '#f00' for red (default 'red' of the design)
* @param {color_on_disabled='lightgrey'} the color for the 'off' state for disabled entries, e.g. '#f00' for red (default 'lightgrey' of the design)
* @param {color_off_disabled='grey'} the color for the 'off' state for disabled entries, e.g. '#f00' for red (default 'grey' of the design)
* @param {fill(bool)='true'} fill the times from ON to OFF with ON-color (default 'true' )
* @param {granularity(str)='30m'} granularity of the timetable, valid values '10m','15m','30m','1h' (default '1h' )
* @param {borderstyle(str)='solid,bottom,none'} style of the cell border, valid valus solid, bottom, none (default 'solid' )
* @param {showzoombutton(bool)='true'} show the zoom button for different granularity (default 'true' )
* @param {showtooltip(bool)='true'} show the switching times in a tooltip (default 'true' )

Neue Version anbei, das öffnen des UZSU-Popups fehlt noch, dazu muss das ganze am Besten direkt in die device.html/js
wvhn Willst Du das machen ?

Testergebnisse willkommen.

Gruss Andre

P.S. berechnete Zeiten (Sunrise/Sunset) werden nun auch berücksichtigt. Der Fehler bei keinem gewählten Tag wird auch abgefangen

Screenshot folgt, muss erst an den anderen Rechner :-)

[Onkelandy]

Vielen Dank für das rasche Update, auf dich ist Verlass Bei der inline Docu bist ein bisschen auf dem falschen Pfad statt headline sollte dort text stehen, etc.
Bei color_on_disabled gibt's noch einen Copy Paste Fehler, bei borderstyle einen Typo und das fehlende "bottom" in der Beschreibung, außerdem müsste der Eintrag in der inline Docu heißen "text(solid,bottom,none)=solid", oder nicht? Granularity: =30m, laut Beschreibung ist default aber 1h. tooltip und buttons scheinen by default off zu sein?

Ich hab in Chrome jetzt so kleine "punkte" in den Feldern, wo Schaltzeiten hinterlegt sind. Sie scheinen für den Tooltop wichtig zu sein. Sehen aber komisch aus und sind extrem klein, sodass der Tooltip nur angezeigt wird, wenn man ganz genau ist. Die Felder mit Werten sind bei mir dadurch auch breiter als die leeren. Eventuell Zufall, aber bei den "sonnenabhängigen" Einträgen sind die Felder NOCH breiter (siehe Anhang)

Die Zoom Buttons funktioieren bei mir nicht. Fehler: TypeError: Cannot read property 'attributes' of undefined

Bei den Borders fände ich es schön, wenn man bei den vertikalen Linien auch definieren kann, ob sie im 1h oder "Zoom" Abstand angezeigt werden. Noch ein Parameter? Dann wirds ja noch ausgereifter Statt "bottom" wäre "horizontal" passender?

orientieren sich die Zoombuttons an der Widgetbreite? Die sind bei mir riesig (Table ist halber Bildschirm breit). Siehe Anhang.

Vielleicht könnte noch irgendwie visualisiert werden, falls die gesamte Uzus deaktiviert ist (Table Linien grau oder so?) und/oder im oberen linken leeren Feld ein Häkchen für aktiv/inaktiv, sodass man's eben auch gleich ändern kann?

Hab's mal in device integriert. Aber Popup bei Klick in die Tabelle funzt nicht, muss ich da noch was anpassen?

Vielen Dank und schöne Grüße!
Andy


2020-05-22 17_13_23-Settings.png

[Sisamiwe]

AndreK

Auch von mir ein GROSSES DANKE.

Habe eben auch getestet und kann den Anmerkungen von Onkelandy nichts hinzufügen.

[AndreK]

Hallo,

danke für die schnelle Rückmeldung.
Ich habs (glaube ich) alles verstanden . Werde nachbessern und nochmal informieren.

Gruss Andre

[AndreK]

Hallo,

hier bin ich wieder. Es hat etwas länger gedauert da ich das komplette Konzept nochmal umgeschmissen habe.
Die Tabelle wird nicht mehr als HTML-Tabelle gezeichnet sondern als SVG.


Das Widget bringts nun auf 20 Paramter

Anbei die "device.js" , "device.html". Diese müssen in den Order "/widgets"
Die Datei "widget_device.uzsutable.html" muss in den Ordner "/pages/docu/device" - Das ist die Hilfedatei für die Dokumentation.

Der Stand der device.js/device.html ist der Stand aus dem aktuellen Master/Develop Stand. Sollte also mit 2.91 bei allen funktionieren.

Beim Anklicken des Widget öffnet sich nun das Popup zum editieren der Zeiten. Beim Anklicken des Buttons oben links wird die UZSU aktiviert / deaktiviert.

Viel Spass beim Testen

Gruss Andre

Beispiel Screenshot

uzsutable.jpg

[wvhn]

Die Dateien können hier herunter geladen werden. Zur Installation einfach die Dateien entsprechend der Ordnerstruktur in die SV kopieren. Die Dateien sind kompatibel zu allen Versionen v2.9.x.

Gruß Wolfram

EDIT 15.7.20: wegen einer Änderung im Code habe ich das ZIP im oberen Post gelöscht und die Version auf smartvisu-newstuff aktualisiert.

[Onkelandy]

Vielen Dank AndreK - sehr cooles Ding. Darf ich ein Anlehnen des Designs an den uzsugraph empfehlen? Also Größe und Look von active/inactive und va. von der Überschrift? Also am besten gleich die CSS Einträge entsprechend befüllen, dass es zusammenpasst?

Ich fände es noch schön, wenn man über borderstyle die Granularität einstellen könnte. Vielleicht optional als Array mit Angaben zu den versch. Zeitslots 5m, 10m, 15m, 30m, 60m? Oder einfacher vielleicht eine Angabe wie "30m" könnte bedeuten, dass die Unterteilung der Tabelle bis maximal 30 Minuten zu sehen ist, alles drunter wird optisch zwar erkannt durch kleinere Felder, aber nicht durch die Rahmen?