Ankündigung

Einklappen
Keine Ankündigung bisher.

Item mit (nested) Liste darstellen

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    #16
    Hallo Sisamiwe ,

    Das List item kommt tatsächlich von shNG direkt als Array von Objekten im js an. Ich habe jetzt mal eine einfache Darstellung gebaut: es wird jeweils die gesamte Tabellenzeile als html aufgebaut und zurückgegeben. Dazu muss zusätzlich zum item der Wochentag als Option übergeben werden.
    Code:
    {% macro timer_display(id, txt, gad_timer) %}
        {% import "basic.html" as basic %}
        {% set uid = uid(page, id) %}
        {% if txt %}<b>{{ txt|e }}</b><br/>{% endif %}
        <div id="{{ uid }}">        
            {% set days = ['montag','dienstag','mittwoch','donnerstag','freitag','samstag','sonntag'] %}
            {% set times = ['an1','aus1','an2','aus2','an3','aus3','an4','aus4'] %}
            <table>
                <th width=12%>
                {% for t in times %}
                    <th>{{ t }}</th>
                {% endfor %}
                </th>
    
                {% for day in days %}
                    {% set item = gad_timer~'.'~day %}
                    <tr data-widget="mywidget.timer_display" data-item="{{ item }}" data-day="{{ day }}" ></tr>
                {% endfor %}
            </table>
        </div>
    {% endmacro %}
    Code:
    $.widget("sv.mywidget_timerdisplay", $.sv.widget, {
    
        initSelector: '[data-widget="mywidget.timer_display"]',
    
        options: {
            day: '',
        },
    
        _update: function(response) {
            var obj = response[0];
            var day = this.options.day;
            var line = '<th align="left">' + day + '</th>';
            // ab hier die Ausgabe der Werte obj[i].An und obj[i].Aus ins html Gerüst
            for (var i = 0; i < obj.length; i++){
               line += '<td>' +  obj[i].An + '</td>'+ '<td>' +  obj[i].Aus + '</td>';
            }
            this.element.html(line);
        }
    })
    ergibt dann mit dem item aus Deinem Beispiel (deshalb sind alle Zeilen gleich)
    Tabelle_Schaltzeiten.png

    Das kann (sollte) man natürlich noch deutlich schöner machen. Aber es funzt immerhin

    Viel Spaß. Gruß
    Wolfram
    Zuletzt geändert von wvhn; 01.05.2020, 00:01.

    Kommentar


      #17
      So ein Table Widget wär schon ne feine Sache, denk ich. Müsste aber bei der Entgegennahme der Werte entsprechend flexibel sein. Also nicht nur Liste mit Arrays. Die Lösung von AndreK sieht auch sehr cool aus!

      Kommentar


        #18
        Hallo wvhn

        super, vielen Dank. Es funktioniert.
        Ich wollte gestern abend selbst noch weitermachen, aber eh ich mit allen anderen fertig war, hatte ich ehrlich gesagt keinen Bock mehr.
        Ich mach das noch schön und stelle es dann auf github (newstuff).

        Die Krönung wäre, wenn man die Zeiten nicht einfach ausgeben würde, sondern mit dem widget basic.input mit der Option time auch ändern könnte.
        Mal sehen, ob ich das hin bekomme.

        Beste Dank und schönen Feiertag!

        Kommentar


          #19
          Zitat von Onkelandy Beitrag anzeigen
          So ein Table Widget wär schon ne feine Sache, denk ich. Müsste aber bei der Entgegennahme der Werte entsprechend flexibel sein. Also nicht nur Liste mit Arrays. Die Lösung von AndreK sieht auch sehr cool aus!
          Ja, da stimme ich dir zu. Sehr coole Sache. Für meine ersten Schritte mti js aber viel zu mächtig, leider.

          Kommentar


            #20
            Oh. Ich dachte, die Sache mit den basic.inputs hätten wir schon gelöst gehabt...

            Mit den Widgets basic.input wirst Du nur arbeiten können, wenn Du für jede Schaltzeit ein eigenes Item hast. Dann klappt die Ausgabe in der Tabelle auch mit basic.print. Dazu müsstest Du die Übersetzung ins List-Format allerdings innerhalb des shNG-Plugins machen.

            Alternative ist ist ein spezielles Widget, das die Objekte in der Liste einzeln zugänglich macht. Das geht von der Komplexität her dann in Richtung des UZSU-Widgets oder des Indego-Widgets.

            Kommentar


              #21
              ich finde auch die lösung von AndreK ist sehr gelungen, wenn man dann für jede Stunde von grau auf grün switchen kann , und das dann grünes Feld bedeutet einschalten , wäre das doch auch ganz gut zu machen? wäre ja fast rein jquery/javascript ?
              allerdings ist es so, das der Threadersteller ja nur 4/8Schaltzeiten pro Tag verarbeiten kann und dann müsste das auch berücksichtigt werden ..
              AndreK hat halt nen grafischen Mode und der Threadersteller nen Text Mode als vorschlag gemacht...
              aber mal davon abgesehn, wer brauch schon ne Minutengenaue einschaltung von ner Heizung o.ä.?

              Kommentar


                #22
                Hier nochmal ein Screenshot vom Ein/Ausschalten - geht wieder :-)

                Beim Indego ist es auch so, dass nur 2 Schaltenzeiten pro Tag möglich sind, das wird dann abgeprüft. Die Zeiten können minutengenau eingegeben und verarbeitet werden.
                Lediglich die Anzeige in der Tabelle geht auf die Stunden.
                Als neue "Time-Table"-Wiget könnte man das vielleicht so umbauen, dass in einem Item die Struktur für die Zeiten und weitere Parameter (wie die Anzahl der möglichen Schaltzeiten pro Tag) übertragen werden.
                Diese Struktur könnte man mittels eval oder Logik in einem separaten Item in shNG bereitstellen.
                Strukutur wäre dann ein JSON mit definierenten Einträgen :

                Code:
                {
                   "Params":{
                      "Anzahl_Zeiten": 2
                
                },
                   "2-10:00-12:00":{
                      "Key":"3-10:00-12:00",
                      "Start":"10:00",
                      "End":"12:00",
                      "Days":"0"
                  
                },
                   "2-11:00-21:30":{
                      "Key":"2-11:00-21:30",
                      "Start":"11:00",
                      "End":"21:30",
                      "Days":"0"
                  
                },
                   "2-09:00-11:00":{
                      "Key":"2-09:00-11:00",
                      "Start":"09:00",
                      "End":"11:00",
                      "Days":"2"
                  
                }
                }
                Indego_Kalender.jpg
                Oh, noch ein Gedanke - ich kann mich wieder erinnern.

                Ich habe das ganze ja auch für die USZU in der Form gemacht - lediglich Darstellung als Tabelle.
                Dann muss man sich um das Ganze Handling nicht mehr kümmern, ist dann nur Darstellung.

                Für diese Anzeige ist die Basis die Daten der UZSU

                Indego_nur_Anzeige.jpg

                Kommentar


                  #23
                  Dachte mir auch grad, ob wir das nicht direkt mit der uzsu vermählen könnten/sollten. Dort gibt es ja uzsuicon und uzsugraph. Würde sich uzsutable o.ä. ja super anbieten. Denke dabei an eine Möglichkeit, die Zeiten direkt im Kalender anzuklicken, um entsprechende Schaltzeiten zu definieren. Ähnlich wie uzsugraph das macht..?

                  Kommentar


                    #24
                    Zitat von Onkelandy Beitrag anzeigen
                    Dachte mir auch grad, ob wir das nicht direkt mit der uzsu vermählen könnten/sollten. Dort gibt es ja uzsuicon und uzsugraph. Würde sich uzsutable o.ä. ja super anbieten. Denke dabei an eine Möglichkeit, die Zeiten direkt im Kalender anzuklicken, um entsprechende Schaltzeiten zu definieren. Ähnlich wie uzsugraph das macht..?
                    Das wäre sicher cool.

                    Meine Schaltzeiten lese ich aus der Heizung und decodiere/formatiere sie in einem shNG Plugin. Die Form der Liste oder eines Dict kann ich somit selbst direkt im Plugin festlegen.

                    Ich beschreibe hier kurz mal meine Rahmenbedingungen.
                    • Die Heizung hat pro Wochentag und Anwendung (2 Heizkreise und 1 Warmwasser = 3 Anwendungen) eine Codieradresse, auf der man die 4 Schaltzeitpaare (AN/AUS) lesen und schreiben kann.
                    • Die Schaltzeiten kann man auf 10min genau angehen (04:00 04:10 usw).
                    • Das Schreiben auf einer Codieradresse sollte erst erfolgen, wenn alle Änderungen für Tag und Anwendung fertig sind (sonst wird die Codieradresse bis zu 8x beschrieben)
                    • Die Anbindung der Heizung an shNG erfolgt mit einem Plugin (das ich verfasst habe und Morg optimiert hat).
                    • Bislang schreibt das Plugin die Schaltzeiten pro Tag und Anwendung in ein Item bspw. "heizung.warmwasser.schaltzeiten.montag"
                    Mein Ziel ist es, die Schaltzeiten zu visualisieren (Texttabelle, oder Tabellengrafik) und komfortabel bearbeiten zu können. Die UZSU wäre dafür optimal, da sie alle Eingabemöglichkeiten (an Tagen gleich etc.) bereits mitbringt.

                    Um sich dem zu nähern, müsste ich alle Schaltzeiten einer Anwendung in ein Item schreiben, anstatt pro Tag und Anwendung ein Item zu verwenden.
                    Wie müsste denn die Liste (list) aussehen?

                    Kommentar


                      #25
                      Hallo Sisamiwe,

                      die Strukur der UZSU-Einträge ist wie folgt, diese kannst du auch durch ändern Deiner Einträge einer UZSU in den Items nachverfolgen.
                      Du müsstest die Strukutur dann nur mit Deinen Daten korrekt füllen. Die Schaltzeiten sind im "list"-Array.
                      Code:
                      {
                         "sunset":"20:36",
                         "active":false,
                         "interpolation":{
                            "interval":"",
                            "initage":"",
                            "itemtype":"bool",
                            "initialized":false,
                            "type":"none"
                        
                      },
                         "sunrise":"05:32",
                         "list":[
                            {
                               "rrule":"FREQ=WEEKLY;BYDAY=FR,SA,SU",
                               "timeOffsetType":"m",
                               "value":"1",
                               "timeCron":"00:00",
                               "timeOffset":"",
                               "timeMax":"",
                               "event":"time",
                               "timeMin":"",
                               "active":true,
                               "time":"00:00"
                            
                      },
                            {
                               "rrule":"FREQ=WEEKLY;BYDAY=MO,TU,WE,TH,FR,SA,SU",
                               "timeOffsetType":"m",
                               "value":"1",
                               "timeCron":"13:00",
                               "timeOffset":"",
                               "timeMax":"",
                               "event":"time",
                               "timeMin":"",
                               "active":true,
                               "time":"13:00"
                            
                      }
                        
                      ],
                         "lastvalue":"None"
                      }
                      Für meine Kalenderdarstellung in der Indego-Visu verwende ich folgenden Code um die Daten der UZSU in "mein" Format zu bekommen. Du müsstest das dann
                      zunächst anders herum machen, einen Button für Speichern in die Visu bringen und beim Speichern die Daten der UZSU wieder in Dein Format wandeln und an die Heizung übertragen.

                      Code:
                          def _parse_uzsu_2_list(self, uzsu_dict=None):
                              weekDays = {'MO' : "0" ,'TU' : "1" ,'WE' : "2" ,'TH' : "3",'FR' : "4",'SA' : "5" ,'SU' : "6" }
                              myCal = {}
                              
                              for myItem in uzsu_dict['list']:
                                  # First run get all the start times
                                  myDays = myItem['rrule'].split(';')[1].split("=")[1].split(",")
                                  if myItem['value'] == '10' and myItem['active'] == True:
                                      if "sun" in myItem['time']:
                                          if not 'calculated' in myItem:
                                              continue
                                          else:
                                              myItem['time']=myItem['calculated']
                                      myKey = "8-"+myItem['time']
                                      if not myKey in myCal:
                                          myCal[myKey] = {'Days':'', 'Start':'','End':'','Key':'','Color' : '#0AFF0A'}
                                          start_hour = float(myItem['time'].split(':')[0])
                                          myCal[myKey]['Start']=str("%02d" % start_hour)+':'+myItem['time'].split(':')[1]
                                          calDays =""
                                      else:
                                          calDays = myCal[myKey]['Days']
                          
                                      for day in myDays:
                                          calDays += ","+ weekDays[day]
                                      if calDays[0:1] == ",":
                                          calDays = calDays[1:]
                                      myCal[myKey]['Days'] = calDays
                      Gruss Andre

                      Kommentar


                        #26
                        AndreK

                        Vielen Dank. Ich versuche es mal.

                        Nutzt die Wandlung in beide Richtungen? Ich meine, wenn Du den Roboter nach den eingestellten Schaltzeiten fragtst, werden dann die UZSU-Einträge entsprechend "erstellt"?

                        Ich haben noch eine Verständisfrage: Die UZSU soll das meine Heizung nicht schalten (so wie deinen Mährroboter auch nicht) sondern soll nur bei der Erstellung der Schaltzeiten helfen. Damit braucht es ja eigentlich auch kein Parent-Item, oder?

                        Kommentar


                          #27
                          Hallo Sisamiwe,

                          wahrscheinlich brauchst Du ein Parent-Item damit die UZSU keinen Fehler schmeisst. Damit schalten willst Du natürlich nichts.
                          Beim Mähroboter ist es tatsächlich so, dass ich ihn via UZSU "rausschicken" oder "reinschicken" kann. Die Standard-Zeiten im Mäher selbst sind dann deaktiviert.
                          Mäher-Modus = AUS. Beim Mäher sind das komplett unterschiedlichen Items.

                          Ich habe eines für die UZSU-Daten.
                          Eines für Mähen nach Kalender.
                          Eines für intelligentes Mähen unter Berücksichtigung von Wetter, Rasenwachstum, Niederschlag, Mittagspause (das macht der Mäher bzw. der Bosch-Server alles selbst)

                          Es wird dann immer nur der Modus umgeschalten bzw. die einzelnen Items bearbeitet. Das aber auf unterschiedliche Art und Weise.

                          Der Beispiel-Code wandelt die Daten der UZSU in "mein" Format für die Kalenderanzeige. Anders herum benötige ich nicht.
                          Funktioniert aber sicherlich genauso.

                          Gruss Andre

                          Kommentar


                            #28
                            Hallo,
                            ich habe mir nun basierend auf den Diskussionsbeiträgen hier 2 shNG Logiken gebaut, die meinen Timer in das Format das UZSU bringen und wieder zurück.
                            Das baue ich dann noch in das Plugin ein.

                            Nichtsdestotrotz möche ich die Idee mit uzsu.table hier noch einmal aufgreifen und für eine Impementierung werben. Ich denke, dass es eine sinnvolle Erweiterung des Widgets wäre, soche Timer auch in Tabellenform, wie von AndreK realisiert, darzustellen.

                            Danke nochmal und beste Grüße
                            Michael

                            Kommentar


                              #29
                              Hi Sisamiwe ,

                              ich habe mal aus meine "Indego-Timetable" ein allgemeines für die UZSU gemacht. (im Anhang als ZIP)
                              Widget im Anhang. Die Dateien in den /dropins - Ordner und auf der Seite das Widget einbinden
                              Das Widget auf Deiner Seite importieren
                              Code:
                              {% import "uzsu.html" as uzsu %}
                              und das Widget selbst aufrufen

                              Code:
                              {{ uzsu.timetable('','EG.Flur.Spots.Schaltuhr','Schaltuhr Flur EG','1','0','limegreen','red','true') }}
                              Erklärung zu den Parameter :
                              Code:
                              * @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 {fill(bool)='true'} fill the times from ON to OFF with ON-color (default 'true' )
                              Bitte mal testen, dann würde ich das Richtung "New-Stuff" pullen.
                              Sieht dann so aus :
                              Timetable.jpg
                              hier mal noch die Zeiten der UZSU

                              TiemTable_1.jpg
                              Man kann die Auschaltzeiten auch in der gleichen Farbe wie die Einschaltzeiten über das Widget vorgeben. "Mit Farbe Füllen" im
                              Zeitraum von ON bis OFF kann über einen Parameter ebenfalls eingestellt werden

                              Viele Grüsse
                              Andre
                              Angehängte Dateien
                              Zuletzt geändert von AndreK; 17.05.2020, 18:57.

                              Kommentar


                                #30
                                AndreK


                                Danke. Das tsste ich gern. Denke das ich heute Abend dazu komme.

                                Kommentar

                                Lädt...
                                X