Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test Adapter Material Design Widgets v0.2.x

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.2k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.9k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.2k

Test Adapter Material Design Widgets v0.2.x

Geplant Angeheftet Gesperrt Verschoben Tester
visadapatervisualizationmaterialwidget
902 Beiträge 77 Kommentatoren 233.5k Aufrufe 79 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • I intruder7

    ich wollte es nochmal hochbringen.

    Bzw. @all ,hat dieses Problem auch jemand anders oder stimmt bei mir etwas nicht?
    @Scrounger 👍
    gut zu wissen. Habs jetzt auch am laufen.
    Das Table Widget bereitet mir noch Schwierigkeiten. Habe eine Object ID mit Daten im JSON Format eingebunden. Er zeigt auch alles super an. Nur bei Änderung der Daten im JSON werden sie in der Anzeige nicht aktualisiert.😞

    ScroungerS Offline
    ScroungerS Offline
    Scrounger
    Developer
    schrieb am zuletzt editiert von Scrounger
    #583

    @intruder7 sagte in Test Adapter Material Design Widgets v0.2.x:

    Nur bei Änderung der Daten im JSON werden sie in der Anzeige nicht aktualisiert.😞

    Das funktioniert auch nicht beim tabl - basic Widget. Schätze das das Problem im vis Adapter liegt bei aktualiserung von Datenpunkten des typ objekts. Hab ich mich aber noch nicht beschäftigt und werde ich sicher in naher Zukunft auch nicht, weil ich mir meine Daten für Tabellen immer per skript aufbereitet und dann als json string speichere.
    Kannst dazu aber gerne ein git issue erstellen, dann gerät es nicht in vergessenheit.

    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

    1 Antwort Letzte Antwort
    0
    • ScroungerS Scrounger

      @Buddinski88 sagte in Test Adapter Material Design Widgets v0.2.x:

      Ich vermute das dir viele sehr dankbar wären, wenn es zu den zwei Themen eine Lösung geben würde.

      Hier das Beispielskript:

      on({ id: 'ical.0.data.table', change: 'any' }, function (obj) {
          let icalObj = obj.state.val;
          let calList = [];
      
          for (var i = 0; i <= icalObj.length - 1; i++) {
              let item = icalObj[i];
      
              // Kalendername extrahieren
              let kalenderName = item._class.split(' ')[0].replace('ical_', '');
      
              // Objekt für Tabelle erzeugen
              calList.push({
                  farbe: `<div style="background: ${getMyKalenderFarbe(kalenderName)}; width: 3px; height: 20px"></div>`,
                  zeit: item.date,
                  termin: item.event,
                  kalender: kalenderName,
                  timestamp: Date.parse(item._date) 
              })
          }
      
          function getMyKalenderFarbe(kalenderName) {
              // Farben über die Kalendernamen zuordnen, Kalendername wie in ical eingestellt verwenden
              if (kalenderName === 'calendar1') {
                  return 'red';
              } else if (kalenderName === 'calendar2') {
                  return '#44739e'
              }
          }
      
          // Hier den Ziel Datenpunkt eingeben, der als Objekt ID im Widget verwendet werden soll
          setState('0_userdata.0.ical', JSON.stringify(calList), true);
      });
      

      Widget dazu:


      [{"tpl":"tplVis-materialdesign-Table","data":{"oid":"0_userdata.0.ical","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","countCols":"3","tableLayout":"standard","showHeader":"true","headerTextSize":"headline6","showColumn0":"true","colType0":"text","textAlign0":"left","showColumn1":"true","colType1":"text","textAlign1":"left","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"showColumn2":"true","colType2":"text","textAlign2":"left","showColumn3":"true","colType3":"text","textAlign3":"left","label0":" ","label1":"Zeit","label2":"Termin","label3":"Kalender","columnWidth0":"0","sortKey1":"timestamp"},"style":{"left":"163px","top":"67px","width":"692px","height":"341px"},"widgetSet":"materialdesign"}]

      Und so sieht das dann aus:
      4a54252c-a3b1-4c0f-b01d-f209222540ad-grafik.png

      I Offline
      I Offline
      intruder7
      schrieb am zuletzt editiert von
      #584

      @Scrounger sagte in Test Adapter Material Design Widgets v0.2.x:

      @Buddinski88 sagte in Test Adapter Material Design Widgets v0.2.x:

      Ich vermute das dir viele sehr dankbar wären, wenn es zu den zwei Themen eine Lösung geben würde.

      Hier das Beispielskript:

      on({ id: 'ical.0.data.table', change: 'any' }, function (obj) {
          let icalObj = obj.state.val;
          let calList = [];
      
          for (var i = 0; i <= icalObj.length - 1; i++) {
              let item = icalObj[i];
      
              // Kalendername extrahieren
              let kalenderName = item._class.split(' ')[0].replace('ical_', '');
      
              // Objekt für Tabelle erzeugen
              calList.push({
                  farbe: `<div style="background: ${getMyKalenderFarbe(kalenderName)}; width: 3px; height: 20px"></div>`,
                  zeit: item.date,
                  termin: item.event,
                  kalender: kalenderName,
                  timestamp: Date.parse(item._date) 
              })
          }
      
          function getMyKalenderFarbe(kalenderName) {
              // Farben über die Kalendernamen zuordnen, Kalendername wie in ical eingestellt verwenden
              if (kalenderName === 'calendar1') {
                  return 'red';
              } else if (kalenderName === 'calendar2') {
                  return '#44739e'
              }
          }
      
          // Hier den Ziel Datenpunkt eingeben, der als Objekt ID im Widget verwendet werden soll
          setState('0_userdata.0.ical', JSON.stringify(calList), true);
      });
      

      Du bist der Beste. genau da lag der Fehler. Ich habe das reine JSON als Objekt genutzt. Habe in deinem Skript gesehen dass du

      stringify
      

      nutzt. Habs damit probiert. Jetzt aktualisiert er auch.👏 😁

      1 Antwort Letzte Antwort
      0
      • ScroungerS Scrounger

        @Buddinski88 sagte in Test Adapter Material Design Widgets v0.2.x:

        Ich vermute das dir viele sehr dankbar wären, wenn es zu den zwei Themen eine Lösung geben würde.

        Hier das Beispielskript:

        on({ id: 'ical.0.data.table', change: 'any' }, function (obj) {
            let icalObj = obj.state.val;
            let calList = [];
        
            for (var i = 0; i <= icalObj.length - 1; i++) {
                let item = icalObj[i];
        
                // Kalendername extrahieren
                let kalenderName = item._class.split(' ')[0].replace('ical_', '');
        
                // Objekt für Tabelle erzeugen
                calList.push({
                    farbe: `<div style="background: ${getMyKalenderFarbe(kalenderName)}; width: 3px; height: 20px"></div>`,
                    zeit: item.date,
                    termin: item.event,
                    kalender: kalenderName,
                    timestamp: Date.parse(item._date) 
                })
            }
        
            function getMyKalenderFarbe(kalenderName) {
                // Farben über die Kalendernamen zuordnen, Kalendername wie in ical eingestellt verwenden
                if (kalenderName === 'calendar1') {
                    return 'red';
                } else if (kalenderName === 'calendar2') {
                    return '#44739e'
                }
            }
        
            // Hier den Ziel Datenpunkt eingeben, der als Objekt ID im Widget verwendet werden soll
            setState('0_userdata.0.ical', JSON.stringify(calList), true);
        });
        

        Widget dazu:


        [{"tpl":"tplVis-materialdesign-Table","data":{"oid":"0_userdata.0.ical","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","countCols":"3","tableLayout":"standard","showHeader":"true","headerTextSize":"headline6","showColumn0":"true","colType0":"text","textAlign0":"left","showColumn1":"true","colType1":"text","textAlign1":"left","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"showColumn2":"true","colType2":"text","textAlign2":"left","showColumn3":"true","colType3":"text","textAlign3":"left","label0":" ","label1":"Zeit","label2":"Termin","label3":"Kalender","columnWidth0":"0","sortKey1":"timestamp"},"style":{"left":"163px","top":"67px","width":"692px","height":"341px"},"widgetSet":"materialdesign"}]

        Und so sieht das dann aus:
        4a54252c-a3b1-4c0f-b01d-f209222540ad-grafik.png

        B Offline
        B Offline
        Buddinski88
        schrieb am zuletzt editiert von Buddinski88
        #585

        @Scrounger, auch hier noch mal einen großen Dank an dich! (Spende ging raus) 🙂
        Ich habe die Abfrage des Kalenders für dessen Farbe noch etwas erweitert, damit mehrere/beliebig viele Kalender abgefragt werden können.

        Hier mein Code:

        on({ id: 'ical.0.data.table', change: 'any' }, function (obj) {
            let icalObj = obj.state.val;
            let calList = [];
         
            for (var i = 0; i <= icalObj.length - 1; i++) {
                let item = icalObj[i];
         
                // Kalendername extrahieren
                let kalenderName = item._class.split(' ')[0].replace('ical_', '');
         
                // Objekt für Tabelle erzeugen
                calList.push({
                    farbe: `<div style="background: ${getMyKalenderFarbe(kalenderName)}; width: 3px; height: 20px"></div>`,
                    zeit: item.date,
                    termin: item.event,
                    kalender: kalenderName,
                    timestamp: Date.parse(item._date) 
                })
            }
         
            function getMyKalenderFarbe(kalenderName) {
                // Farben über die Kalendernamen zuordnen, Kalendername wie in ical eingestellt verwenden
                switch (kalenderName){
                    case 'Abfall':
                        return '795548';
                        break;
                    case 'Familie':
                        return '#0b8044';
                        break;
                    case 'Familie Arbeit':
                        return '#f6c226';
                        break;
                    case 'Geburtstage':
                        return '#d50000';
                        break;
                    case 'Aquascape':
                        return '#1baade';
                        break;
                    default:
                        return '#000000'
                        break;
                }
            }
         
            // Hier den Ziel Datenpunkt eingeben, der als Objekt ID im Widget verwendet werden soll
            setState('javascript.0.variables.vis.ical.convertedData', JSON.stringify(calList), true);
        });
        
        
        1 Antwort Letzte Antwort
        0
        • D Offline
          D Offline
          darkbrain85
          schrieb am zuletzt editiert von
          #586

          Hi zusammen!

          Ich würde gerne meine Flot Diagramme alle auf Line History Chart umstellen.
          Für meine PV Anlage habe ich ein Diagramm in dem mehrere Datensätze übereinander liegen.
          Dort benötige ich zwar eine Farbige Füllung, aber keine Linie . Wenn die Liniendicke auf 0 ist wird immer noch eine ganz dünne Linie angezeigt. Diese ist dann leider auch auf den darüber liegenden Flächen zu sehen.

          Hier mal ein vergrößerter Screenshot davon:

          e060b68d-212b-48db-b828-c6f9ca6431c1-image.png

          Wie kann ich diese rote Linie in diesem Fall ausblenden? Schon wäre, wenn bei Liniendicke "0" einfach die Linie ganz verschwinden würde.

          Anke für Eure Hilfe!

          ScroungerS 1 Antwort Letzte Antwort
          0
          • D darkbrain85

            Hi zusammen!

            Ich würde gerne meine Flot Diagramme alle auf Line History Chart umstellen.
            Für meine PV Anlage habe ich ein Diagramm in dem mehrere Datensätze übereinander liegen.
            Dort benötige ich zwar eine Farbige Füllung, aber keine Linie . Wenn die Liniendicke auf 0 ist wird immer noch eine ganz dünne Linie angezeigt. Diese ist dann leider auch auf den darüber liegenden Flächen zu sehen.

            Hier mal ein vergrößerter Screenshot davon:

            e060b68d-212b-48db-b828-c6f9ca6431c1-image.png

            Wie kann ich diese rote Linie in diesem Fall ausblenden? Schon wäre, wenn bei Liniendicke "0" einfach die Linie ganz verschwinden würde.

            Anke für Eure Hilfe!

            ScroungerS Offline
            ScroungerS Offline
            Scrounger
            Developer
            schrieb am zuletzt editiert von
            #587

            @darkbrain85
            Versuch mal die Linienfarbe / Datenfarbe auf transparentzu setzen.

            <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

            <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

            D 1 Antwort Letzte Antwort
            0
            • ScroungerS Scrounger

              @darkbrain85
              Versuch mal die Linienfarbe / Datenfarbe auf transparentzu setzen.

              D Offline
              D Offline
              darkbrain85
              schrieb am zuletzt editiert von
              #588

              @Scrounger

              Ja klar, das ich da nicht selber drauf gekommen bin... Danke für den Tip!

              Eine Sache noch:
              Lässt sich der Abstand von einer unten angeordneten Legende zur X-Achse verkleinern? Da geht IMHO viel Platz verloren...

              ScroungerS 1 Antwort Letzte Antwort
              0
              • D darkbrain85

                @Scrounger

                Ja klar, das ich da nicht selber drauf gekommen bin... Danke für den Tip!

                Eine Sache noch:
                Lässt sich der Abstand von einer unten angeordneten Legende zur X-Achse verkleinern? Da geht IMHO viel Platz verloren...

                ScroungerS Offline
                ScroungerS Offline
                Scrounger
                Developer
                schrieb am zuletzt editiert von
                #589

                @darkbrain85 sagte in Test Adapter Material Design Widgets v0.2.x:

                Lässt sich der Abstand von einer unten angeordneten Legende zur X-Achse verkleinern? Da geht IMHO viel Platz verloren...

                Habs eingebaut, aktullen master testen

                <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                D 1 Antwort Letzte Antwort
                0
                • ScroungerS Scrounger

                  @darkbrain85 sagte in Test Adapter Material Design Widgets v0.2.x:

                  Lässt sich der Abstand von einer unten angeordneten Legende zur X-Achse verkleinern? Da geht IMHO viel Platz verloren...

                  Habs eingebaut, aktullen master testen

                  D Offline
                  D Offline
                  darkbrain85
                  schrieb am zuletzt editiert von darkbrain85
                  #590

                  @Scrounger
                  Danke!

                  Das funktioniert für mich erstmal ganz gut. Je kleiner der padding Wert ist, desto mehr rutschen die Legendeneinträge aneinander. Das kann man aber mit Leerzeichen korrigieren. In so fern erstmal funktional, wenn auch noch nicht 100% sauber.

                  6d2804be-8288-4f49-8c36-6fd887ff54d9-image.png

                  Edit:
                  Da fällt mir noch was auf: Mache ich drei Leerzeichen am Ende des Legendentextes, wird direkt hinter dem letzten Buchstaben ein Punkt (.) eingefügt.

                  Edit2: Kann man die Angabe der Uhrzeit auf der X-Achse noch schöner bekommen?

                  Edit3: Es wäre gut, wenn für den Tooltip dann auch die Füllfarbe genommen wird, wenn die Linienfarbe "transparent" ist.
                  c7de8a3c-b18f-4b90-974b-b0922a16f50b-image.png

                  ScroungerS 1 Antwort Letzte Antwort
                  0
                  • D darkbrain85

                    @Scrounger
                    Danke!

                    Das funktioniert für mich erstmal ganz gut. Je kleiner der padding Wert ist, desto mehr rutschen die Legendeneinträge aneinander. Das kann man aber mit Leerzeichen korrigieren. In so fern erstmal funktional, wenn auch noch nicht 100% sauber.

                    6d2804be-8288-4f49-8c36-6fd887ff54d9-image.png

                    Edit:
                    Da fällt mir noch was auf: Mache ich drei Leerzeichen am Ende des Legendentextes, wird direkt hinter dem letzten Buchstaben ein Punkt (.) eingefügt.

                    Edit2: Kann man die Angabe der Uhrzeit auf der X-Achse noch schöner bekommen?

                    Edit3: Es wäre gut, wenn für den Tooltip dann auch die Füllfarbe genommen wird, wenn die Linienfarbe "transparent" ist.
                    c7de8a3c-b18f-4b90-974b-b0922a16f50b-image.png

                    ScroungerS Offline
                    ScroungerS Offline
                    Scrounger
                    Developer
                    schrieb am zuletzt editiert von
                    #591

                    @darkbrain85 sagte in Test Adapter Material Design Widgets v0.2.x:

                    Das funktioniert für mich erstmal ganz gut. Je kleiner der padding Wert ist, desto mehr rutschen die Legendeneinträge aneinander. Das kann man aber mit Leerzeichen korrigieren. In so fern erstmal funktional, wenn auch noch nicht 100% sauber.

                    Besser geht es leider nicht, da die chartjs api nur padding zur verfügung stellt und nicht explizit padding-left, padding-right, etc. Da die charts gerendert werden, kann ich hier nix machen.

                    Da fällt mir noch was auf: Mache ich drei Leerzeichen am Ende des Legendentextes, wird direkt hinter dem letzten Buchstaben ein Punkt (.) eingefügt.

                    Ich sehe weder in dem Screenshot einen . noch kann ich das bei mir reproduzieren. Leerzeichen wird als leerzeichen ausgegeben.

                    Edit2: Kann man die Angabe der Uhrzeit auf der X-Achse noch schöner bekommen?

                    Ja steht in der doku!

                    Edit3: Es wäre gut, wenn für den Tooltip dann auch die Füllfarbe genommen wird, wenn die Linienfarbe "transparent" ist.

                    Geht nicht, api nimmt immer die Farbe von der Linie.
                    Dann würde ich dir empfehlen, für Linien und Füllfarbe die gleiche zu nehmen und Liniendicke auf 0 zu setzen.
                    Oder blende in im Tooltip das farbfeld aus.

                    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                    1 Antwort Letzte Antwort
                    0
                    • ScroungerS Offline
                      ScroungerS Offline
                      Scrounger
                      Developer
                      schrieb am zuletzt editiert von
                      #592

                      Alerts Widget ist fertig:

                      alerts.gif

                      Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

                      Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

                      Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                      Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                      <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                      <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                      Archimedeus AA I S D 4 Antworten Letzte Antwort
                      0
                      • D Offline
                        D Offline
                        dos1973
                        schrieb am zuletzt editiert von
                        #593

                        Wirklich Coole Sache! Top

                        Scheitert bei mir allerdings am Java.
                        Hoffe auf Beispiele

                        1 Antwort Letzte Antwort
                        0
                        • ScroungerS Scrounger

                          Alerts Widget ist fertig:

                          alerts.gif

                          Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

                          Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

                          Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                          Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                          Archimedeus AA Offline
                          Archimedeus AA Offline
                          Archimedeus A
                          schrieb am zuletzt editiert von
                          #594

                          @Scrounger
                          Hallo, was du machst ist saucool, aber murkse noch mit den Anfängen herum.

                          Fragen:

                          • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht
                          • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?
                          • Kann man eine View in Masonry views als Navi-Button definieren?

                          Warum will ich das? Ich möchte eine Statusübersicht bauen, wo auf den Karten drauf steht wieviel Lampen an sind (oder Heizkörper etc). Wenn man drauftappt soll man die Liste der Lampen bekommen mit Schaltern, die an sind.
                          Eine Karte mit Navi bekomme ich hin, indem ich in der View einen unsichtbaren Button drüberlege. Ist aber unpraktisch beim Bauen.
                          Fernziel: Maximale Nutzervereinfachung.

                          Danke im Voraus. Ich nehme auch kommentarlose Links 🙂
                          Archi

                          ScroungerS 1 Antwort Letzte Antwort
                          0
                          • Archimedeus AA Archimedeus A

                            @Scrounger
                            Hallo, was du machst ist saucool, aber murkse noch mit den Anfängen herum.

                            Fragen:

                            • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht
                            • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?
                            • Kann man eine View in Masonry views als Navi-Button definieren?

                            Warum will ich das? Ich möchte eine Statusübersicht bauen, wo auf den Karten drauf steht wieviel Lampen an sind (oder Heizkörper etc). Wenn man drauftappt soll man die Liste der Lampen bekommen mit Schaltern, die an sind.
                            Eine Karte mit Navi bekomme ich hin, indem ich in der View einen unsichtbaren Button drüberlege. Ist aber unpraktisch beim Bauen.
                            Fernziel: Maximale Nutzervereinfachung.

                            Danke im Voraus. Ich nehme auch kommentarlose Links 🙂
                            Archi

                            ScroungerS Offline
                            ScroungerS Offline
                            Scrounger
                            Developer
                            schrieb am zuletzt editiert von Scrounger
                            #595

                            @Archimedeus-A sagte in Test Adapter Material Design Widgets v0.2.x:

                            • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht

                            Ja ist noch nicht alles in der Lifeview abgebildet.
                            Wie die List funktioniert sieht man in der Doku - Screenshot. Am besten mal damit rumspielen, dann bekommst den dreh sicher raus.
                            In den Threads hier gibt es auch das ein oder andere Beispiel zum List Widget.

                            • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?

                            Ja das kannst damit machen. Für Lichter nimmst am besten type switch.

                            • Kann man eine View in Masonry views als Navi-Button definieren?

                            Klar, leg über die gesamte Card z.B. einen Navbutton mit Layout text. Dem weißt dann die View zu, wo du die lichter mit steuerst.

                            Sorry aber im Detail antworten fehlt mir echt die Zeit.
                            Ließ dich hier im Forum ein, probier ein bissle rum und wenn du an nem speziellen Fall hängst, dann frag im Forum nach.

                            <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                            <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                            Archimedeus AA 1 Antwort Letzte Antwort
                            0
                            • ScroungerS Scrounger

                              Alerts Widget ist fertig:

                              alerts.gif

                              Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

                              Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

                              Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                              Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                              I Offline
                              I Offline
                              intruder7
                              schrieb am zuletzt editiert von intruder7
                              #596

                              @Scrounger Auf die Schnelle getestet:

                              Fehler bisher... Sollte der Text länger als die Breite sein, schreibt er ihn über das Widget hinaus und der Bestätigungsbutton ist auch weg
                              c1a61c35-ec37-4eef-be54-716a27909a8a-image.png

                              Alles was an Buttons hinter dem Widget liegt ist nicht mehr bedienbar. Auch wenn keine Alerts angezeigt werden.

                              1 Antwort Letzte Antwort
                              0
                              • ScroungerS Scrounger

                                @Archimedeus-A sagte in Test Adapter Material Design Widgets v0.2.x:

                                • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht

                                Ja ist noch nicht alles in der Lifeview abgebildet.
                                Wie die List funktioniert sieht man in der Doku - Screenshot. Am besten mal damit rumspielen, dann bekommst den dreh sicher raus.
                                In den Threads hier gibt es auch das ein oder andere Beispiel zum List Widget.

                                • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?

                                Ja das kannst damit machen. Für Lichter nimmst am besten type switch.

                                • Kann man eine View in Masonry views als Navi-Button definieren?

                                Klar, leg über die gesamte Card z.B. einen Navbutton mit Layout text. Dem weißt dann die View zu, wo du die lichter mit steuerst.

                                Sorry aber im Detail antworten fehlt mir echt die Zeit.
                                Ließ dich hier im Forum ein, probier ein bissle rum und wenn du an nem speziellen Fall hängst, dann frag im Forum nach.

                                Archimedeus AA Offline
                                Archimedeus AA Offline
                                Archimedeus A
                                schrieb am zuletzt editiert von
                                #597

                                @Scrounger Danke, ich fummel mich durch!

                                1 Antwort Letzte Antwort
                                0
                                • ScroungerS Scrounger

                                  Alerts Widget ist fertig:

                                  alerts.gif

                                  Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

                                  Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

                                  Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                                  Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                                  S Offline
                                  S Offline
                                  skokarl
                                  schrieb am zuletzt editiert von
                                  #598

                                  @Scrounger sagte in Test Adapter Material Design Widgets v0.2.x:

                                  Alerts Widget ist fertig:

                                  Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                                  Das finde ich ja mal richtig spannend.

                                  Falls jemand hier mal ein Javascript Beispiel veröffentlichen möchte.... 👏

                                  IOBroker mit Proxmox auf Celeron Nuc mit 16 GB und Debian11, Sonos API, Echo Show 15 als Wandtablet, Homematic IP, HUE, Sonos, Echos, DS718+ als Backup

                                  I 1 Antwort Letzte Antwort
                                  0
                                  • ScroungerS Scrounger

                                    Alerts Widget ist fertig:

                                    alerts.gif

                                    Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

                                    Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

                                    Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                                    Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                                    D Offline
                                    D Offline
                                    darkiop
                                    Most Active
                                    schrieb am zuletzt editiert von darkiop
                                    #599

                                    @Scrounger sagte in Test Adapter Material Design Widgets v0.2.x:

                                    Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                                    Hab das ganze mal versucht über Blockly zu erstellen (so baue ich mir auch die json fürs Tabellen-Widget zusammen).

                                    Allerdings ist das Ergebnis hier ein Array, kein json - Fehler in Blockly?

                                    b8d2af0d-bf95-4e9f-8f4c-46a3086d53be-grafik.png

                                    5b422b32-c493-42df-b9aa-88d76ddbd1b9-grafik.png

                                    9e5105a4-8103-4e51-9774-d8eade4cabd1-grafik.png

                                    [["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"]]
                                    

                                    Edit: Dein Beispiel für den ical Adapter hilft hier weiter:
                                    https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x/582

                                    Kann es sein, das es für Blockly push() nicht gibt?

                                    Proxmox-ioBroker-Redis-HA Doku: https://forum.iobroker.net/topic/47478/dokumentation-einer-proxmox-iobroker-redis-ha-umgebung

                                    1 Antwort Letzte Antwort
                                    0
                                    • S skokarl

                                      @Scrounger sagte in Test Adapter Material Design Widgets v0.2.x:

                                      Alerts Widget ist fertig:

                                      Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                                      Das finde ich ja mal richtig spannend.

                                      Falls jemand hier mal ein Javascript Beispiel veröffentlichen möchte.... 👏

                                      I Offline
                                      I Offline
                                      intruder7
                                      schrieb am zuletzt editiert von
                                      #600

                                      @skokarl

                                      Hier mal ganz schnell mit dem Telegram Adapter getestet. Alles was ich an mein zuhause schicke wird dann angezeigt.

                                      var instanz = 'javascript.0'; instanz = instanz + '.';     // Instanz fuer die Datenpunkte definieren
                                      var pfad = 'VIS.';
                                      
                                      var AlertText = instanz + pfad + "Alerts.AlertText";
                                      
                                      createState(AlertText, "", { type: 'string', name: '', read: true, write: true });
                                      
                                      let Alert = [];
                                      on({id: 'telegram.0.communicate.request', change: 'any'}, function (obj) {
                                          var stateval = getState('telegram.0.communicate.request').val;              // Statevalue in Variable schreiben
                                          var benutzer = stateval.substring(1,stateval.indexOf("]"));                 // Benutzer aus Statevalue extrahieren
                                          var befehl = stateval.substring(stateval.indexOf("]")+1,stateval.length);   // Befehl/Text aus Statevalue extrahieren
                                      
                                              Alert.push({
                                                  text: befehl,
                                                  backgroundColor: '',
                                                  borderColor: 'darkred',
                                                  icon: 'message-alert-outline',
                                                  iconColor: 'darkred',
                                                  fontColor: 'blue' 
                                              })
                                       setState(AlertText, JSON.stringify(Alert), true);
                                       Alert = []
                                      });     
                                      
                                      S 1 Antwort Letzte Antwort
                                      1
                                      • I intruder7

                                        @skokarl

                                        Hier mal ganz schnell mit dem Telegram Adapter getestet. Alles was ich an mein zuhause schicke wird dann angezeigt.

                                        var instanz = 'javascript.0'; instanz = instanz + '.';     // Instanz fuer die Datenpunkte definieren
                                        var pfad = 'VIS.';
                                        
                                        var AlertText = instanz + pfad + "Alerts.AlertText";
                                        
                                        createState(AlertText, "", { type: 'string', name: '', read: true, write: true });
                                        
                                        let Alert = [];
                                        on({id: 'telegram.0.communicate.request', change: 'any'}, function (obj) {
                                            var stateval = getState('telegram.0.communicate.request').val;              // Statevalue in Variable schreiben
                                            var benutzer = stateval.substring(1,stateval.indexOf("]"));                 // Benutzer aus Statevalue extrahieren
                                            var befehl = stateval.substring(stateval.indexOf("]")+1,stateval.length);   // Befehl/Text aus Statevalue extrahieren
                                        
                                                Alert.push({
                                                    text: befehl,
                                                    backgroundColor: '',
                                                    borderColor: 'darkred',
                                                    icon: 'message-alert-outline',
                                                    iconColor: 'darkred',
                                                    fontColor: 'blue' 
                                                })
                                         setState(AlertText, JSON.stringify(Alert), true);
                                         Alert = []
                                        });     
                                        
                                        S Offline
                                        S Offline
                                        skokarl
                                        schrieb am zuletzt editiert von
                                        #601

                                        @intruder7

                                        super, besten Dank.
                                        Hab ich mal etwas damit ich es verstehen kann.

                                        IOBroker mit Proxmox auf Celeron Nuc mit 16 GB und Debian11, Sonos API, Echo Show 15 als Wandtablet, Homematic IP, HUE, Sonos, Echos, DS718+ als Backup

                                        1 Antwort Letzte Antwort
                                        0
                                        • M Offline
                                          M Offline
                                          Mr.Oz
                                          schrieb am zuletzt editiert von
                                          #602

                                          Hallo zusammen,

                                          seit der Version 0.2.32 / 0.2.40 funktioniert das vibrieren auf Mobilgeräten nicht mehr. Muss man da noch was beachten/umstellen?

                                          Gruß

                                          1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          637

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe