Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. View Adapter Status

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    View Adapter Status

    This topic has been deleted. Only users with topic management privileges can see it.
    • K
      Kuddel last edited by

      Wo genau finde ich die aktuelle Version vom Skript ?

      sigi234 1 Reply Last reply Reply Quote 0
      • sigi234
        sigi234 Forum Testing Most Active @Kuddel last edited by sigi234

        @Kuddel sagte in View Adapter Status:

        Wo genau finde ich die aktuelle Version vom Skript ?

        post 383428
        https://forum.iobroker.net/topic/26533/view-adapter-status/109

        1 Reply Last reply Reply Quote 0
        • Scrounger
          Scrounger Developer last edited by Scrounger

          Sodele nochmal eine neue Version des Skriptes

          Voraussetzung Material Design Widgets v0.2.62 (demnächst im latest) !!!

          • mehr Farbeinstellung
          • Sortier Funktion
          • Filter Funktion - wäre sicher als nächster Wunsch gekommen, deshalb hab ich es schon mal eingebaut 😉
            (Benötigt ihr weitere schaut ins skript und passt es auf eure Bedürfnisse an)
          • Adapter Modus wird angezeigt
          • Fehler behoben

          AdapterStatus.gif

          Ist auch im Online Beispiel enthalten

          View:

          {
            "settings": {
              "style": {
                "background_class": ""
              },
              "theme": "redmond",
              "sizex": "",
              "sizey": "",
              "gridSize": "",
              "snapType": null
            },
            "widgets": {
              "e00001": {
                "tpl": "tplVis-materialdesign-Icon-List",
                "data": {
                  "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",
                  "wrapItems": true,
                  "listItemDataMethod": "jsonStringObject",
                  "countListItems": "1",
                  "vibrateOnMobilDevices": "50",
                  "listLayout": "card",
                  "itemLayout": "horizontal",
                  "listType0": "text",
                  "showValueLabel0": "true",
                  "listType1": "text",
                  "showValueLabel1": "true",
                  "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,
                  "json_string_oid": "0_userdata.0.vis.AdapterStatus.jsonList",
                  "maxItemsperRow": "6",
                  "iconItemMinWidth": "300",
                  "iconHeight": "60",
                  "buttonHeight": "100",
                  "labelFontSize": "22",
                  "subLabelFontSize": "14",
                  "subLabelFontColor": "#000000",
                  "labelFontFamily": "RobotoCondensed-Regular",
                  "subLabelFontFamily": "RobotoCondensed-Light",
                  "horizontalIconContainerWidth": "120"
                },
                "style": {
                  "left": "0px",
                  "top": "50px",
                  "width": "100%",
                  "height": "calc(100% - 50px)",
                  "overflow-x": "",
                  "overflow-y": "auto",
                  "z-index": "1"
                },
                "widgetSet": "materialdesign"
              },
              "e00002": {
                "tpl": "tplHtml",
                "data": {
                  "g_fixed": false,
                  "g_visibility": false,
                  "g_css_font_text": false,
                  "g_css_background": true,
                  "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",
                  "refreshInterval": "0",
                  "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
                },
                "style": {
                  "left": "0",
                  "top": "0",
                  "width": "100%",
                  "height": "50px",
                  "background-color": "#44739e"
                },
                "widgetSet": "basic"
              },
              "e00003": {
                "tpl": "tplVis-materialdesign-Select",
                "data": {
                  "oid": "0_userdata.0.vis.AdapterStatus.sortMode",
                  "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",
                  "inputType": "text",
                  "inputLayout": "regular",
                  "showInputMessageAlways": "true",
                  "showInputCounter": false,
                  "clearIconShow": false,
                  "listDataMethod": "jsonStringObject",
                  "countSelectItems": "1",
                  "listPosition": "bottom",
                  "showSelectedIcon": "prepend-inner",
                  "showValue": false,
                  "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,
                  "inputLabelText": "Sortieren nach",
                  "inputLabelColor": "#ffffff",
                  "inputLabelFontFamily": "RobotoCondensed-LightItalic",
                  "collapseIconColor": "#ffffff",
                  "collapseIconSize": "",
                  "jsonStringObject": "[\n\t{\n\t\t\"text\": \"Adaptername\",\n\t\t\"value\": \"name\",\n\t\t\"icon\": \"sort-alphabetical\"\n\t},\n\t{\n\t\t\"text\": \"Status\",\n\t\t\"value\": \"status\",\n\t\t\"icon\": \"information-variant\"\n\t},\t\n\t{\n\t\t\"text\": \"Modus\",\n\t\t\"value\": \"mode\",\n\t\t\"icon\": \"view-dashboard\"\n\t},\n\t{\n\t\t\"text\": \"Updates verfügbar\",\n\t\t\"value\": \"hasUpdates\",\n\t\t\"icon\": \"package-down\"\n\t},\n\t{\n\t\t\"text\": \"CPU\",\n\t\t\"value\": \"cpu\",\n\t\t\"icon\": \"cpu-64-bit\"\n\t},\n\t{\n\t\t\"text\": \"RAM total\",\n\t\t\"value\": \"memHeapTotal\",\n\t\t\"icon\": \"memory\"\n\t},\n\t{\n\t\t\"text\": \"RAM verwendet\",\n\t\t\"value\": \"memHeapUsed\",\n\t\t\"icon\": \"memory\"\n\t},\n\t{\n\t\t\"text\": \"RAM reserviert\",\n\t\t\"value\": \"memRss\",\n\t\t\"icon\": \"memory\"\n\t},\n\t{\n\t\t\"text\": \"Betriebszeit\",\n\t\t\"value\": \"uptime\",\n\t\t\"icon\": \"clock-check-outline\"\n\t}\n]",
                  "listPositionOffset": true,
                  "inputLayoutBackgroundColor": "transparent",
                  "inputLabelColorSelected": "#ffffff",
                  "inputTranslateX": "-15",
                  "clearIcon": "",
                  "inputLayoutBorderColorHover": "#ffffff",
                  "inputLayoutBorderColorSelected": "#ffffff",
                  "inputLayoutBorderColor": "#a1a1a1",
                  "listItemFontColor": "",
                  "inputTextColor": "#ffffff",
                  "inputTextFontFamily": "RobotoCondensed-LightItalic",
                  "prepandIcon": "",
                  "prepandIconColor": "",
                  "prepandIconSize": "",
                  "prepandInnerIcon": "",
                  "prepandInnerIconColor": "#ffffff",
                  "prepandInnerIconSize": "18",
                  "collapseIcon": "",
                  "inputTranslateY": "-12",
                  "listIconSelectedColor": "#44739e",
                  "listIconColor": "",
                  "appendOuterIcon": "",
                  "appendOuterIconSize": "2",
                  "listItemFont": "RobotoCondensed-Regular",
                  "listItemRippleEffectColor": "",
                  "inputLayoutBackgroundColorSelected": "",
                  "inputLayoutBackgroundColorHover": ""
                },
                "style": {
                  "left": "10px",
                  "top": "0px",
                  "z-index": "1",
                  "width": "calc(50% - 20px)",
                  "height": "40px"
                },
                "widgetSet": "materialdesign"
              },
              "e00004": {
                "tpl": "tplVis-materialdesign-Select",
                "data": {
                  "oid": "0_userdata.0.vis.AdapterStatus.filterMode",
                  "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",
                  "inputType": "text",
                  "inputLayout": "regular",
                  "showInputMessageAlways": "true",
                  "showInputCounter": false,
                  "clearIconShow": true,
                  "listDataMethod": "jsonStringObject",
                  "countSelectItems": "1",
                  "listPosition": "bottom",
                  "showSelectedIcon": "prepend-inner",
                  "showValue": false,
                  "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,
                  "inputLabelText": "Filtern nach",
                  "inputLabelColor": "#ffffff",
                  "inputLabelFontFamily": "RobotoCondensed-LightItalic",
                  "collapseIconColor": "#ffffff",
                  "collapseIconSize": "",
                  "jsonStringObject": "[\n\t{\n\t\t\"text\": \"nicht verbunden\",\n\t\t\"value\": \"notConnected\",\n\t\t\"icon\": \"network-off\"\n\t},\n\t{\n\t\t\"text\": \"deaktiviert\",\n\t\t\"value\": \"deactivated\",\n\t\t\"icon\": \"checkbox-blank-outline\"\n\t},\t\n\t{\n\t\t\"text\": \"aktiviert\",\n\t\t\"value\": \"activated\",\n\t\t\"icon\": \"checkbox-intermediate\"\n\t},\n\t{\n\t\t\"text\": \"Updates verfügbar\",\n\t\t\"value\": \"hasUpdates\",\n\t\t\"icon\": \"package-down\"\n\t}\n]",
                  "listPositionOffset": true,
                  "inputLayoutBackgroundColor": "transparent",
                  "inputLabelColorSelected": "#ffffff",
                  "inputTranslateX": "-15",
                  "clearIcon": "",
                  "inputLayoutBorderColorHover": "#ffffff",
                  "inputLayoutBorderColorSelected": "#ffffff",
                  "inputLayoutBorderColor": "#a1a1a1",
                  "listItemFontColor": "",
                  "inputTextColor": "#ffffff",
                  "inputTextFontFamily": "RobotoCondensed-LightItalic",
                  "prepandIcon": "",
                  "prepandIconColor": "",
                  "prepandIconSize": "",
                  "prepandInnerIcon": "",
                  "prepandInnerIconColor": "#ffffff",
                  "prepandInnerIconSize": "18",
                  "collapseIcon": "",
                  "inputTranslateY": "-12",
                  "listIconSelectedColor": "#44739e",
                  "listIconColor": "",
                  "appendOuterIcon": "",
                  "appendOuterIconSize": "2",
                  "listItemFont": "RobotoCondensed-Regular",
                  "listItemRippleEffectColor": "",
                  "inputLayoutBackgroundColorSelected": "",
                  "inputLayoutBackgroundColorHover": "",
                  "clearIconColor": "#ffffff"
                },
                "style": {
                  "left": "calc(50% + 10px)",
                  "top": "0px",
                  "z-index": "1",
                  "width": "calc(50% - 20px)",
                  "height": "40px"
                },
                "widgetSet": "materialdesign"
              }
            },
            "name": "AdapterStatus",
            "filterList": []
          }
          

          Skript

          // Imports -> müssen im Javascript Adapter unter 'Zusätzliche NPM-Module' eingetragen sein
          const moment = require("moment");
          const momentDurationFormatSetup = require("moment-duration-format");
          
          
          // Skript Einstellungen *************************************************************************************************************************************************
          
          let dpList = '0_userdata.0.vis.AdapterStatus.jsonList';                     // Datenpunkt für IconList Widget (Typ: Zeichenkette (String))
          let dpAdapterRestart = '0_userdata.0.vis.AdapterStatus.restartTrigger';     // Datenpunkt für Adapter restart (Typ: Zeichenkette (String))
          
          let dpSortMode = '0_userdata.0.vis.AdapterStatus.sortMode';                 // Datenpunkt für Sortieren (Typ: Zeichenkette (String))
          let dpFilterMode = '0_userdata.0.vis.AdapterStatus.filterMode';             // Datenpunkt für Filter (Typ: Zeichenkette (String))
          
          let adminUpdatesList = 'admin.0.info.updatesList';                          // Datenpunkt Admin Adapter für verfübare Updates der Adapter
          
          const checkInterval = 30;                                                   // Interval wie oft Status der Adapter aktualisiert werden soll (in Sekunden)
          
          let sprache = 'de';                                                         // Sprache für formatierung Dauer 
          let formatierungDauer = "dd[T] hh[h] mm[m]";                                // Formatierung der Dauer -> siehe momentjs library
          
          let neustarten = true;                                                      // true: Adapter wird neugestartet, false: Adapter wird gestoppt oder gestartet
          
          let farbeAdapterAktiv = 'green';                                            // Status Bar Farbe wenn Adapter aktiv ist
          let farbeAdapterNichtAktiv = 'FireBrick';                                   // Status Bar Farbe wenn Adapter nicht aktiv ist oder Fehler vorliegt
          let farbeAdapterDeaktiviert = 'darkgrey';                                   // Status Bar Farbe wenn Adapter deaktiviert ist
          let farbeAdapterNichtVerbunden = 'yellow';                                  // Status Bar Farbe wenn Adapter nicht verbunden ist
          let farbeAdapterZeitgesteuert = 'lightgreen';                               // Status Bar Farbe wenn Adapter zeitgesteuert ist
          let farbeAdapterErweiterung = '#44739e';                                    // Status Bar Farbe wenn Adapter Erweiterung ist
          let farbeAdapterSystem = '#44739e';                                         // Status Bar Farbe wenn Adapter mit System gestartet wird
          
          let sortResetAfter = 120;                                                   // Sortierung nach X Sekunden auf sortReset zurücksetzen (0=deaktiviert)
          let sortReset = 'memHeapUsed'                                               // Sortierung auf die zurückgesetzt werden soll
          
          let filterResetAfter = 120;                                                 // Filter nach X Sekunden zurücksetzen (0=deaktiviert)
          
          // **********************************************************************************************************************************************************************
          
          
          // Fomate für moment Lib
          moment.locale(sprache);
          
          // auf .alive Änderungen hören
          let aliveSelector = `[id=system.adapter.*.alive]`;
          let adapterAliveList = $(aliveSelector);
          if (adapterAliveList.length === 0) {
              // Fehlermeldung ausgeben, wenn selector kein result liefert
              console.error(`no result for selector '${aliveSelector}'`)
          } else {
              // listener nur für Änderung bei alive
              adapterAliveList.on(adapterStatus);
          }
          
          // auf .connection Änderungen hören
          let connectionSelector = `[id=*.info.connection]`;
          let adapterConnectionList = $(connectionSelector);
          if (adapterConnectionList.length === 0) {
              // Fehlermeldung ausgeben, wenn selector kein result liefert
              console.error(`no result for selector '${connectionSelector}'`)
          } else {
              // listener nur für Änderung bei alive
              adapterConnectionList.on(adapterStatus);
          }
          
          // auf .connected Änderungen hören
          let connectedSelector = `[id=system.adapter.*.connected]`;
          let adapterConnectedList = $(connectedSelector);
          if (adapterConnectedList.length === 0) {
              // Fehlermeldung ausgeben, wenn selector kein result liefert
              console.error(`no result for selector '${connectedSelector}'`)
          } else {
              // listener nur für Änderung bei alive
              adapterConnectedList.on(adapterStatus);
          }
          
          // auf Änderungen der Sortieung hören
          on({ id: dpSortMode, change: 'any' }, adapterStatus);
          on({ id: dpSortMode, change: 'any' }, resetSort);
          
          // auf Änderungen der Filter hören
          on({ id: dpFilterMode, change: 'any' }, adapterStatus);
          on({ id: dpFilterMode, change: 'any' }, resetFilter);
          
          // Funktion adapterStatus alle x Sekunden ausführen
          schedule('*/' + checkInterval + ' * * * * *', adapterStatus);
          
          function adapterStatus() {
              // Funktion um Status der Adapter abzurufen und als JSON String für das Material Design Widget IconList aufbereiten
              let adapterList = [];
              let updateList = myHelper().getStateValueIfExist(adminUpdatesList);
          
              try {
                  for (var i = 0; i <= adapterAliveList.length - 1; i++) {
                      let id = adapterAliveList[i].replace('.alive', '');
                      let obj = getObject(adapterAliveList[i].replace('.alive', ''));
          
                      let nameArray = id.replace('system.adapter.', '').split(".");
          
                      let name = nameArray[0];
                      name = name.charAt(0).toUpperCase() + name.slice(1);
          
                      let nameWithInstance = name;
                      let adapterInstance = nameArray[1];
                      if (parseInt(adapterInstance) > 0) {
                          nameWithInstance = name + '.' + adapterInstance;
                      }
          
                      let uptime = (existsState(id + '.uptime')) ? moment.duration(getState(id + '.uptime').val, 'seconds').format(formatierungDauer, 0) : '-';
                      let image = (myHelper().checkCommonPropertyExist(obj, 'icon')) ? `/${nameArray[0]}.admin/${obj.common.icon}` : 'image-off-outline';
          
                      let hasUpdates = updateList && updateList.includes(nameArray[0]);
                      let newVersion = (hasUpdates) ? '<span class="mdi mdi-update" style="color: #ec0909;"></span>' : '';
          
                      let text = `<div style="display: flex; flex-direction: row; line-height: 1.5; padding-right: 8px; align-items: center;">
                                      <div style="flex: 1">${newVersion} ${nameWithInstance}</div>
                                      <div style="color: grey; font-size: 12px; font-family: RobotoCondensed-LightItalic;">${myHelper().getCommonPropertyIfExist(obj, 'version', '-', 'v', '')}</div>
                                  </div>`
          
                      let subText = `<div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">CPU</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${myHelper().getStateValueIfExist(id + '.cpu', '-', '', ' %')}</div>
                                      </div>
                                      <div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">RAM total</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${myHelper().getStateValueIfExist(id + '.memHeapTotal', '-', '', ' MB')}</div>
                                      </div>
                                      <div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">RAM verwendet</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${myHelper().getStateValueIfExist(id + '.memHeapUsed', '-', '', ' MB')}</div>
                                      </div>
                                      <div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">RAM reserviert</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${myHelper().getStateValueIfExist(id + '.memRss', '-', '', ' MB')}</div>
                                      </div>
                                      <div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">Betriebszeit</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${uptime}</div>
                                      </div>
                                      <div style="display: flex; flex-direction: row; line-height: 1.3; padding-left: 1px; padding-right: 8px; align-items: center;">
                                          <div style="flex: 1;">Modus</div>
                                          <div style="color: grey; font-size: 14px; font-family: RobotoCondensed-LightItalic;">${myHelper().getCommonPropertyIfExist(obj, 'mode', '-')}</div>
                                      </div>`
          
                      let statusBarColor = farbeAdapterNichtAktiv;
                      let status = 3;
          
                      if (myHelper().getStateValueIfExist(adapterAliveList[i]) === 'true') {
                          statusBarColor = farbeAdapterAktiv;
                          status = 0;
          
                          if (existsState(id.replace('system.adapter.', '') + '.info.connection')) {
                              if (!getState(id.replace('system.adapter.', '') + '.info.connection').val) {
                                  statusBarColor = farbeAdapterNichtVerbunden;
                                  status = 4;
                              }
                          } else {
                              if (myHelper().getStateValueIfExist(adapterAliveList[i].replace('.alive', '.connected')) === 'false') {
                                  statusBarColor = farbeAdapterNichtVerbunden;
                                  status = 4;
                              }
                          }
                      }
          
                      if (myHelper().getCommonPropertyIfExist(obj, 'mode') === 'schedule') {
                          // Adapter ist zeitgesteuert
                          statusBarColor = farbeAdapterZeitgesteuert;
                          status = 1;
                      }
          
                      if (myHelper().getCommonPropertyIfExist(obj, 'mode') === 'extension') {
                          // Adapter ist Extension
                          statusBarColor = farbeAdapterErweiterung;
                          status = 1;
                      }
          
                      if (myHelper().getCommonPropertyIfExist(obj, 'mode') === 'once') {
                          // Adapter wird mit System gestartet
                          statusBarColor = farbeAdapterSystem;
                          status = 1;
                      }
          
                      if (myHelper().getCommonPropertyIfExist(obj, 'enabled', false).toString() === 'false') {
                          // Adapter ist deaktiviert
                          statusBarColor = farbeAdapterDeaktiviert;
                          status = 2;
                      }
          
                      adapterList.push({
                          text: text,
                          subText: subText,
                          image: image,
                          listType: "buttonState",
                          objectId: dpAdapterRestart,
                          buttonStateValue: id,
                          statusBarColor: statusBarColor,
                          showValueLabel: false,
                          name: name,
                          mode: myHelper().getCommonPropertyIfExist(obj, 'mode'),
                          hasUpdates: hasUpdates,
                          cpu: parseFloat(myHelper().getStateValueIfExist(id + '.cpu', '0')),
                          memHeapTotal: parseFloat(myHelper().getStateValueIfExist(id + '.memHeapTotal', '0')),
                          memHeapUsed: parseFloat(myHelper().getStateValueIfExist(id + '.memHeapUsed', '0')),
                          memRss: parseFloat(myHelper().getStateValueIfExist(id + '.memRss', '0')),
                          uptime: parseFloat(myHelper().getStateValueIfExist(id + '.uptime', 0)),
                          status: status
                      })
                  }
          
              } catch (err) {
                  console.error(`[adapterStatus] error: ${err.message}, stack: ${err.stack}`);
              }
          
              let sortMode = myHelper().getStateValueIfExist(dpSortMode, 'name');
          
              if (sortMode === 'name' || sortMode === 'mode') {
                  adapterList.sort(function (a, b) {
                      return a[sortMode] == b[sortMode] ? 0 : +(a[sortMode] > b[sortMode]) || -1;
                  });
              } else if (sortMode === 'hasUpdates' || sortMode === 'cpu' || sortMode === 'memHeapTotal' || sortMode === 'memHeapUsed' || sortMode === 'memRss' || sortMode === 'uptime' || sortMode === 'status') {
                  adapterList.sort(function (a, b) {
                      return a[sortMode] == b[sortMode] ? 0 : +(a[sortMode] < b[sortMode]) || -1;
                  });
              } else {
                  // default: nach name sortieren
                  sortMode = 'name'
                  adapterList.sort(function (a, b) {
                      return a[sortMode] == b[sortMode] ? 0 : +(a[sortMode] > b[sortMode]) || -1;
                  });
              }
          
              // Filter: not connected, updates, deaktiviert, aktiviert
          
              let filterMode = myHelper().getStateValueIfExist(dpFilterMode, null);
          
              if (filterMode && filterMode !== null && filterMode !== '') {
                  if (filterMode === 'hasUpdates') {
                      adapterList = adapterList.filter(function (item) {
                          return item.hasUpdates === true;
                      });
                  } else if (filterMode === 'notConnected') {
                      adapterList = adapterList.filter(function (item) {
                          return item.status === 4;
                      });
                  } else if (filterMode === 'deactivated') {
                      adapterList = adapterList.filter(function (item) {
                          return item.status === 2;
                      });
                  } else if (filterMode === 'activated') {
                      adapterList = adapterList.filter(function (item) {
                          return item.status <= 1;
                      });
                  }
              }
          
              // adapterList = adapterList.filter(function(item){
              //     return item.status === 4;
              // })
          
              let result = JSON.stringify(adapterList);
              if (getState(dpList) !== result) {
                  setState(dpList, result, true);
              }
          
          
          }
          
          // Beim Staren des Skriptes Adapter Status abrufen
          adapterStatus();
          
          // Funktion um Adapter zu starten / neu starten
          on({ id: dpAdapterRestart }, function (obj) {
              var adapter = getObject(obj.state.val.toString());
          
              if (neustarten) {
                  if (adapter.common && adapter.common.enabled === false) {
                      // Adapter deaktiviert -> starten
                      adapter.common.enabled = true;
                  }
              } else {
                  if (adapter.common && adapter.common.enabled) {
                      adapter.common.enabled = !adapter.common.enabled;
                  } else {
                      adapter.common.enabled = true;
                  }
              }
          
              setObject(obj.state.val, adapter);
              console.log(`${obj.state.val.replace('system.adapter.', '')} neugestartet`);
          });
          
          
          function resetSort() {
              let sortMode = myHelper().getStateValueIfExist(dpSortMode, null);
          
              if (sortResetAfter > 0) {
                  setTimeout(function () {
                      if (sortMode !== null && sortMode === myHelper().getStateValueIfExist(dpSortMode, null)) {
                          setState(dpSortMode, sortReset);
                      }
                  }, sortResetAfter * 1000);
              }
          }
          
          function resetFilter() {
              let filterMode = myHelper().getStateValueIfExist(dpFilterMode, null);
          
              if (filterResetAfter > 0) {
                  setTimeout(function () {
                      if (filterMode !== null && filterMode === myHelper().getStateValueIfExist(dpFilterMode, null)) {
                          setState(dpFilterMode, '');
                      }
                  }, filterResetAfter * 1000);
              }
          }
          
          function myHelper() {
              return {
                  getStateValueIfExist: function (id, nullValue = undefined, prepand = '', append = '') {
                      if (existsState(id)) {
                          return prepand + getState(id).val + append;
                      } else {
                          return nullValue;
                      }
                  },
                  getCommonPropertyIfExist: function (object, prop, nullValue = undefined, prepand = '', append = '') {
                      if (myHelper().checkCommonPropertyExist(object, prop)) {
                          return prepand + object.common[prop] + append;
                      } else {
                          return nullValue;
                      }
                  },
                  checkCommonPropertyExist: function (object, prop) {
                      if (object && object.common && object.common[prop]) {
                          return true;
                      } else {
                          return false;
                      }
                  }
              }
          }
          
          sigi234 ub.privat S 4 Replies Last reply Reply Quote 6
          • sigi234
            sigi234 Forum Testing Most Active @Scrounger last edited by

            @Scrounger

            Das ist MEGA Geil!👍

            C 1 Reply Last reply Reply Quote 0
            • C
              Conquest @sigi234 last edited by

              @sigi234 sagte in View Adapter Status:

              @Scrounger

              Das ist MEGA Geil!👍

              Das ist aber weit untertrieben 😂
              Ich fang wieder bei null an wenn ich die ganzen neuen Sachen hier sehe.

              1 Reply Last reply Reply Quote 0
              • sigi234
                sigi234 Forum Testing Most Active @Scrounger last edited by

                @Scrounger

                Screenshot (1837).png

                Scrounger 1 Reply Last reply Reply Quote 0
                • Scrounger
                  Scrounger Developer @sigi234 last edited by Scrounger

                  @sigi234
                  Du brauchst Version 0.2.62!
                  Und die scheinst du nicht zu haben, da der JSON-String noch als html input im Editor ist, man aber ab der Version 0.2.62 eine Objekt Id angeben muss.

                  siehe Online Beispiel

                  1 Reply Last reply Reply Quote 0
                  • Negalein
                    Negalein Global Moderator last edited by

                    @Scrounger

                    läuft 🙂
                    vis (34).png

                    Glasfaser 1 Reply Last reply Reply Quote 0
                    • Glasfaser
                      Glasfaser @Negalein last edited by Glasfaser

                      @Scrounger

                      Mein View geht im Popup Widget auf ... kann aber nichts anwählen über die Select , dort geht nichts auf.

                      1.JPG

                      Normaler View geht :

                      2.JPG

                      Geht das nicht über ein Popup !?

                      Scrounger 1 Reply Last reply Reply Quote 0
                      • Scrounger
                        Scrounger Developer @Glasfaser last edited by

                        @Glasfaser sagte in View Adapter Status:

                        Mein View geht im Popup Widget auf ... kann aber nichts anwählen über die Select , dort geht nichts auf.

                        Was meinst du mit Popup? Welches Widget?
                        Mach am besten mal nen export.

                        Glasfaser 1 Reply Last reply Reply Quote 0
                        • Glasfaser
                          Glasfaser @Scrounger last edited by

                          @Scrounger

                          Sorry habe ich vergessen .. Container Dialog

                          [{"tpl":"tplContainerDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","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,"contains_view":"AdapterStatus","dialog_width":"1400","dialog_height":"782","title":"Adapter Status","dialog_top":"0","dialog_left":"0","modal":false,"noHeader":false,"class":"","name":"Adapterstatus Popup","comment":"transparent Layout"},"style":{"left":"881px","top":"378px","background":"transparent","width":"197px","height":"90px","z-index":"20","border-color":"transparent","font-family":"Jura-DemiBold","font-size":"14px"},"widgetSet":"jqui"}]
                          

                          1 Reply Last reply Reply Quote 0
                          • Scrounger
                            Scrounger Developer last edited by Scrounger

                            Hab das skript oben nochmal geupdated
                            https://forum.iobroker.net/topic/26533/view-adapter-status/142

                            und folgende Funktionen hinzugefügt:

                            • Sortierung nach x Sekunden zurücksetzen
                            • Filter nach x Sekunden zurücksetzen

                            Timer startet jedesmal, wenn man die Auswahl für Sortierung oder Filter ändert. Konfigurierbar / Deaktivierbar über

                            let sortResetAfter = 120;                                                   // Sortierung nach X Sekunden auf sortReset zurücksetzen (0=deaktiviert)
                            let sortReset = 'memHeapUsed'                                               // Sortierung auf die zurückgesetzt werden soll
                            
                            let filterResetAfter = 120;                                                 // Filter nach X Sekunden zurücksetzen (0=deaktiviert)
                            

                            @Glasfaser sagte in View Adapter Status:

                            @Scrounger

                            Sorry habe ich vergessen .. Container Dialog

                            Muss ich mir in Ruhe anschauen, tippe auf einen Bug im Select Widget. Bitte erstellt dazu einen issue auf git, dann vergesse ich es nicht.

                            Scrounger Negalein 2 Replies Last reply Reply Quote 0
                            • Scrounger
                              Scrounger Developer @Scrounger last edited by

                              @Glasfaser sagte in View Adapter Status:

                              @Scrounger

                              Sorry habe ich vergessen .. Container Dialog

                              Muss ich mir in Ruhe anschauen, tippe auf einen Bug im Select Widget. Bitte erstellt dazu einen issue auf git, dann vergesse ich es nicht.

                              Ok ist nur ein z-index problem. Musst für die beiden Select Widgets nur den z-index erhöhen, hab ihn einfach mal auf 1000 gesetzt, dann wirds angezeigt.

                              Glasfaser 1 Reply Last reply Reply Quote 0
                              • Negalein
                                Negalein Global Moderator @Scrounger last edited by

                                @Scrounger sagte in View Adapter Status:

                                und folgende Funktionen hinzugefügt:

                                Muss das ganze Script ausgetauscht werden, oder reicht es die besagten Zeilen einzufügen?

                                Scrounger 1 Reply Last reply Reply Quote 0
                                • Scrounger
                                  Scrounger Developer @Negalein last edited by

                                  @Negalein sagte in View Adapter Status:

                                  @Scrounger sagte in View Adapter Status:

                                  und folgende Funktionen hinzugefügt:

                                  Muss das ganze Script ausgetauscht werden, oder reicht es die besagten Zeilen einzufügen?

                                  Das ganze Skript

                                  1 Reply Last reply Reply Quote 0
                                  • Glasfaser
                                    Glasfaser @Scrounger last edited by Glasfaser

                                    @Scrounger

                                    Sorry ... habe alles gemacht auch mal auf 9999 Z-Index gesetzt ....immer das gleiche

                                    Habe auch ein ContainerIconDialog genommen , dort auch das gleiche ,

                                    [{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"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,"signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis.0/negalein/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.0/negalein/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.0/negalein/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,"src":"/vis.0/negalein/Akkuleer.png","class":"","contains_view":"AdapterStatus","modal":true,"dialog_width":"1400","dialog_height":"782","dialog_top":"0","dialog_left":"0","overflowX":"hidden","overflowY":"hidden","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"791px","top":"403px","width":"36px","height":"23px","z-index":"2"},"widgetSet":"jqui"}]
                                    

                                    das merkwürdige ist , wenn man den Select-Widget im Popup aufklappt sieht man den weißen Rand der runtergeht und schließt man den Popup ist die Auflistung im Hintergrund noch auf .

                                    5.JPG

                                    Scrounger 1 Reply Last reply Reply Quote 0
                                    • Scrounger
                                      Scrounger Developer @Glasfaser last edited by

                                      @Glasfaser
                                      Das dropdown wird hinter dem popup nach dem öffnen angezeigt.
                                      Bin mir sicher das des ein z-index thema ist.

                                      Bei mir gehts, auch mit ContainerIconDialog

                                      AdapterStatus_popup.gif

                                      Glasfaser 1 Reply Last reply Reply Quote 1
                                      • Glasfaser
                                        Glasfaser @Scrounger last edited by

                                        @Scrounger

                                        Danke ... dein Popup Video hat mich gerade darauf gebracht ...

                                        Ich habe ein anderes Design von Material Design CSS V1 ,
                                        dort ist mir gerade aufgefallen , das im Skript der Fehler liegt , da wenn ich es entferne dann wird der Select-Widget richtig geöffnet .

                                        1.JPG

                                        Habe mal zum Test das neue Material Design CSS V2 Skript eingefügt , dort ist der Fehler auch

                                        Hast du eine Idee wo der Fehler sein könnte ??
                                        .
                                        SKRIPT :

                                        /* -----
                                          Material Design JS for ioBroker.vis
                                          (c) 2017 Uhula, MIT License
                                          https://github.com/Uhula/ioBroker-Material-Design-Style
                                          V1.7 28.12.2017
                                          o Korrektur mdui-lnav/rnav. Funktionierte mit mdui-toggle nicht korrekt  
                                          V1.6 16.10.2017 
                                          O _toggleFullscreen geändert, damit die function auch im ioBroker
                                                          fullscreen Mode funktioniert
                                          o Delegator-Eventhandler für body gesetzt (bisher #vis_container, wirkten dann aber in Dialogen nicht)
                                          V1.5 11.10.2017 
                                          o MDUI.handleTables fertig
                                          V1.3 24.09.2017 
                                          + MDUI.handleTables hinzu (in Entwicklung)
                                          V1.0 01.09.2017
                                          ----- */
                                        
                                        // Zur sicheren CSS-Erkennung der Runtime eine CSS-Klasse anlegen
                                        document.documentElement.className +=  " mdui-runtime";
                                        
                                        // Überprüfen ob touch zur Verfügung steht und entsprechend eine 
                                        // CSS Klasse touch bzw no-touch erzeugen 
                                        document.documentElement.className += 
                                           (("ontouchstart" in document.documentElement) ? " mdui-touch" : " mdui-notouch");
                                        
                                        
                                        /* -----
                                          MDUI
                                          ----- 
                                          Sammlung von JS-Funktionen für das Material Design
                                          (c) 2017 Uhula, MIT License
                                        */
                                        
                                        var MDUI = (function () {
                                        
                                        
                                        var isSubtreeModified = false;
                                        
                                        // liefert den suffix einer gegeben class zurück-Navigieren
                                        // Bsp: mdui-target-w00002 -> w00002
                                        //      mdui-zoom-to-200 -> 200
                                        function _getClassSuffix( $ele, classname ) {
                                           var suf = "";
                                           if ($ele) {
                                               var c = $ele.attr( "class" );
                                               suf = c.substr(c.indexOf(classname)+classname.length,1000)+" ";
                                               suf = suf.substr(0,suf.indexOf(" "));
                                           }
                                           return suf;    
                                        }
                                        
                                        //
                                        function _getGroupID( ele ) { return _getClassSuffix(ele, "mdui-group-" ); }
                                        //
                                        function _getTargetID( ele ) { return _getClassSuffix(ele, "mdui-target-" ); }
                                        
                                        //
                                        function _getScrollbarWidth() {
                                           var $outer = $('<div>').css({visibility: 'hidden', width: 100, overflow: 'scroll'}).appendTo('body'),
                                               widthWithScroll = $('<div>').css({width: '100%'}).appendTo($outer).outerWidth();
                                           $outer.remove();
                                           return 100 - widthWithScroll;
                                        }
                                        //
                                        function _getScrollbarHeight() {
                                           var $outer = $('<div>').css({visibility: 'hidden', height: 100, overflow: 'scroll'}).appendTo('body'),
                                               heightWithScroll = $('<div>').css({height: '100%'}).appendTo($outer).outerHeight();
                                           $outer.remove();
                                           return 100 - heightWithScroll;
                                        }
                                        
                                        function _formatDatetime(date, format) {
                                           function fill(comp) {
                                               return ((parseInt(comp) < 10) ? ('0' + comp) : comp)
                                           }
                                               
                                           var months = ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'];
                                           var d = format;
                                           var o = {
                                                   "y+": date.getFullYear(), // year
                                                   "m+": fill(date.getMonth()+1), //month
                                                   "M+": months[date.getMonth()], //month
                                                   "d+": fill(date.getDate()), //day
                                                   "H+": fill((date.getHours() > 12) ? date.getHours() % 12 : date.getHours()), //hour
                                                   "h+": fill(date.getHours()), //hour
                                                   "n+": fill(date.getMinutes()), //minute
                                                   "s+": fill(date.getSeconds()), //second
                                                   "S+": fill(date.getMilliseconds()), //millisecond,
                                                   "b+": (date.getHours() >= 12) ? 'PM' : 'AM'
                                               };
                                           for (var k in o) {
                                               if (new RegExp("(" + k + ")").test(format)) {
                                                   d = d.replace(RegExp.$1, o[k]);
                                               }
                                           }
                                           return d;
                                        }
                                        
                                        
                                        
                                        // alle Elemente mit class "mdui-group-XXX" togglen, in denen 
                                        // XXX aus class "mdui-group-XXX" des ele ist UND
                                        // alle Elemente mit class "mdui-target-XXX" togglen, in denen 
                                        // XXX aus class "mdui-target-XXX" des ele ist
                                        function _toggleVisibility( $ele ) {
                                           $ele.toggleClass("ui-state-active");
                                           var id = _getGroupID( $ele );
                                           if (id!=="") 
                                               $("[class*='mdui-group-"+id+"']").not("[class*='mdui-toggle']").each( function (index) {
                                                   $(this).toggleClass("mdui-hide");
                                               });    
                                           id = _getTargetID( $ele );
                                           if (id!=="") 
                                               $( "[class*='mdui-target-"+id+"']").not("[class*='mdui-toggle']").each( function (index) {
                                                   $(this).toggleClass("mdui-hide");
                                               });
                                        }
                                        
                                        // das in ele class \"mdui-target-XXX\" angegeben Element mit der id \"XXX\"  wird 
                                        // - fullscreen angezeigt, wenn es noch nicht fullscreen ist
                                        // - wieder normal angezeigt, wenn es fullscreen ist
                                        function _toggleFullscreen( $ele ){
                                           if (!$ele) return;
                                           var $target = $ele.closest(".vis-view");
                                           if (!$target) return;
                                           var styleold = $target.attr("styleold");
                                           if (styleold) {
                                               $target.attr("style",styleold);
                                               $target.removeAttr("styleold");
                                               $target.appendTo(".mdui-id-"+$target.attr("id"));
                                               } else {
                                                   $target.parent().addClass("mdui-id-"+$target.attr("id"));
                                                   $target.attr("styleold",$target.attr("style"));
                                                   $target.attr("style","position:fixed; left:0; top:0; width:100%; height:100%; z-index: 2147483647 !important;background:#212121 !important; ");
                                                   $target.appendTo( "body" );
                                                   //$target.appendTo( "body #vis_container" );
                                                   }
                                        }
                                        
                                        
                                        // ele muss class Einträge für das Target und den Skalierungsmodus haben
                                        // "mdui-target-(id) mdui-scale-(scalemode)" 
                                        // id: Ziel-Element mit id=id, welches ein zu skalierendes img enthält
                                        // scalemode: fit / hfit / vfit / in / out / (number)
                                        // number: Zahl in %
                                        function _scale( ele ) {
                                           var id = _getTargetID( ele );
                                           var $img = $( "#"+id+" img" );
                                           if ($img) {
                                               var scale = _getClassSuffix(ele, "mdui-scale-" );
                                               $img.width("1px"); // Scrollbars entfernen um die echte Höhe zu bekommen
                                               $img.height("1px");
                                               var dim = {
                                                   pw : $img.parent().width(), 
                                                   ph : $img.parent().height(), 
                                                   w  : $img[0].naturalWidth, 
                                                   h  : $img[0].naturalHeight
                                               };
                                               switch(scale) {
                                                   case "fit":
                                                       if (dim.pw / dim.w < dim.ph / dim.h ) scale = dim.pw / dim.w;  
                                                       else scale = dim.ph / dim.h;
                                                       break;
                                                   case "hfit":
                                                       if (dim.pw / dim.w < dim.ph / dim.h ) scale = dim.pw / dim.w;
                                                       else scale = (dim.pw - _getScrollbarWidth() - 4  ) / dim.w;
                                                       break;
                                                   case "vfit":
                                                       if ( dim.pw / dim.w > dim.ph / dim.h ) scale = dim.ph / dim.h;
                                                       else scale = (dim.ph - _getScrollbarHeight() - 4  ) / dim.h;
                                                       break;
                                                   case "in":
                                                   case "out":
                                                       var old = $img.attr( "style" );
                                                       old = old.substr(old.indexOf("scale(")+6,20);  
                                                       old = old.substr(0,old.indexOf(")"));  
                                                       if (old * 1==0) scale = 1;
                                                       else if (scale=="in") scale = old * 1.41;
                                                            else scale = old / 1.41;
                                                       break;
                                                   default:
                                                       if (scale<=0 || scale>10000)
                                                           scale = 100;
                                                       scale = scale/100;
                                               }
                                               scale = Math.round(scale*100)/100;
                                               $img.attr( "style", "position:absolute;top:0;left:0;transform-origin:0 0;transition: transform 0.3s ease-out; transform:scale("+scale+");" );
                                               }
                                        }
                                        
                                        // ersetzt im src-Attribute des Unter-Elements von (id) den "&range=& 
                                        // durch den Wert des in ele angegebenen (span). Für flot-Diagramme
                                        // "mdui-target-(id) mdui-timespan-(span)" 
                                        // id: Ziel-Element mit id=id, welches das flot (src) enthält
                                        // span: inc / dec / (number)
                                        // number: Zahl in Minuten
                                        function _timespan( ele ) {
                                           var id = _getTargetID( ele );
                                           var target = $( "#"+id+" [src]" );
                                           if (target) {
                                               var timespan = _getClassSuffix(ele, "mdui-timespan-" );
                                               var src = target.attr( "src" );
                                               var min = src.substr(src.indexOf("&range=")+7,20);  
                                               min = min.substr(0,min.indexOf("&"));  
                                               switch(timespan) {
                                                   case "inc":
                                                       min = min * 2;
                                                       break;
                                                   case "dec":
                                                       min = min / 2;
                                                       break;
                                                   default:
                                                       if ( timespan<=0 )
                                                           timespan = 1440;
                                                       min = timespan;
                                               }
                                               src = src.replace(/&range=[0-9]*&/g, "&range="+min+"&");
                                               target.attr("src",src);
                                           }
                                        }
                                        
                                        /*  */
                                        function _resetTable( $ele, $table ) {
                                           $ele.removeClass("mdui-table-tile");
                                           $ele.removeClass("mdui-table-card");
                                           $ele.removeClass("mdui-table-list");
                                           $table.find("tbody>tr").each( function(index) {
                                               $(this).width("auto");
                                               $(this).height("auto");
                                               $(this).find("td").each( function(index) {
                                                   $(this).attr("labelth","");
                                               });  
                                           });
                                        }
                                        
                                        /*  */
                                        function _handleTable( $ele, $table, opt ) {
                                        
                                           function setColWidth( colwidth ) {
                                               $table.find("tbody>tr").each( function(index) {
                                                   $(this).outerWidth(colwidth);
                                               });
                                           }
                                           function setColHeight() {
                                               var height = 0;
                                               $table.find("tbody>tr").each( function(index) {
                                                   if ($(this).height() > height ) height = $(this).height();
                                               });
                                               if ( height > 0 )
                                                   $table.find("tbody>tr").each( function(index) {
                                                       $(this).height( height );
                                                   });
                                           }
                                           
                                           var innerWidth = $ele.innerWidth();
                                        
                                           _resetTable($ele, $table);
                                           $ele.addClass("mdui-table-"+opt.type);
                                           if (opt.label) {
                                               // Zellen mit Labels aus <th> ergänzen ?    
                                               var labels = [];
                                               $table.find("thead>tr>th").each( function(index) {
                                                   labels[index] = $(this).text();
                                               });
                                               $table.find("tbody>tr").each( function(index) {
                                                   $(this).find("td").each( function(index) {
                                                       if (index < labels.length) 
                                                           $(this).attr("labelth",labels[index]);
                                                   });  
                                               });
                                           }
                                        
                                           if (opt.colwidth>1) setColWidth(opt.colwidth);
                                           if (opt.colwidth>2) setColHeight();
                                        
                                           return true;    
                                        }
                                        
                                        
                                        /* Alle mdui-table durchlaufen und überprüfen, ob die minimale Width erreicht
                                        wurde um sie in den responsive State zu überführen 
                                        mdui-table-(mode)(-opt1)(-opt2)...(-optn)
                                        mdui-table-ascard-r600-w200-l */
                                        function _handleTables( ) {
                                           $("[class*='mdui-table ']").each( function (index) {
                                               var $ele = $(this);
                                               var $table;
                                               $table = $ele;
                                               if (!$table.is("table")) $table=$table.find("table");
                                               if (!$table.is("table")) return true; // next each 
                                               
                                               var innerWidth = $ele.innerWidth();
                                               var classes = $ele.attr("class")
                                                   .split(" ")
                                                   .filter( function ( ele ) { 
                                                           return  (ele.indexOf("mdui-table-ascard") > -1)
                                                                || (ele.indexOf("mdui-table-astile") > -1)
                                                                || (ele.indexOf("mdui-table-aslist") > -1); });
                                               var opts = [];
                                               var opt;
                                               for (var i = 0; i < classes.length; i++) {
                                                   opts[i] = [];
                                                   opts[i].reswidth = 9999;
                                                   opts[i].colwidth = 0;
                                                   opts[i].label = false;
                                                   opts[i].type = classes[i].substr(13,4); 
                                                   opt = classes[i].substr(18,200).split("-"); 
                                                   for (var j = 0; j < opt.length; j++) {
                                                       switch(opt[j][0]) {
                                                       case "r":
                                                           opts[i].reswidth = parseInt(opt[j].substr(1,5));
                                                           break;
                                                       case "w":
                                                           opts[i].colwidth = parseInt(opt[j].substr(1,5));
                                                           break;
                                                       case "c":
                                                           opts[i].colwidth = parseInt(opt[j].substr(1,5));
                                                           if (opts[i].colwidth>0) opts[i].colwidth = (innerWidth-_getScrollbarWidth()-8) / opts[i].colwidth;
                                                           break;
                                                       case "l":
                                                           opts[i].label = true;
                                                           break;
                                                       default:    
                                                       }                       
                                                   }
                                               }
                                               opts.sort(function(a, b){return a.reswidth-b.reswidth});
                                        //console.log(opts);
                                               if (opts.length === 0) return true; // next each 
                                               var handled = false;
                                               for (i = 0; i < opts.length; i++) {
                                                   if ( innerWidth < opts[i].reswidth )
                                                      handled = _handleTable( $ele, $table, opts[i]);
                                                   if (handled) break;   
                                               }
                                               if (!handled) _resetTable($ele, $table);
                                           }); 
                                        
                                        }
                                        
                                        
                                        
                                        
                                        // DOM SubTree-Änderungen einmalig alle 500ms auswerten (diese Events werden 
                                        // u.U. 1000-fach gefeuert und müssen deswegen verzögert ausgeführt werden)
                                        function _onSubTreeModified( $ele ) {
                                           if (!isSubtreeModified) {
                                               isSubtreeModified = true;
                                               setTimeout(function () {
                                                   _handleTables();
                                                   isSubtreeModified=false;
                                               }, 500);
                                           }
                                        }
                                        
                                        return {
                                           toggleVisibility: _toggleVisibility,
                                           toggleFullscreen: _toggleFullscreen,
                                           scale: _scale,
                                           timespan: _timespan,
                                           handleTables: _handleTables,
                                           onSubTreeModified : _onSubTreeModified
                                        };
                                        
                                        })();
                                        
                                        
                                        // Eventhandler für body-Delegators setzen (früher:#vis_container) 
                                        setTimeout(function () {
                                           // click-Event für das left-nav Element zum Öffnen
                                           $("body").on( "click", ".mdui-lnavbutton", function() { 
                                               $( ".mdui-lnav" ).addClass( "mdui-lnav-open" );
                                           } );
                                           // click-Event für die left-nav zum Schließen
                                           $("body").on( "click", ".mdui-lnav", function() { 
                                               $( ".mdui-lnav" ).removeClass( "mdui-lnav-open" ); 
                                           } );
                                           // click-Event für das right-nav Element zum Öffnen
                                           $("body").on( "click", ".mdui-rnavbutton", function() { 
                                               $( ".mdui-rnav" ).addClass( "mdui-rnav-open" );
                                           } );
                                           // click-Event für die right-nav zum Schließen
                                           $("body").on( "click", ".mdui-rnav", function() { 
                                               $( ".mdui-rnav" ).removeClass( "mdui-rnav-open" ); 
                                           } );
                                        
                                           // click-Eventhandler für "mdui-scale-" setzen
                                           $("body").on( "click", "[class*='mdui-scale-']", function(event) { 
                                               MDUI.scale( $(this) );
                                           } );
                                        
                                           // click-Handler für "mdui-toggle"  
                                           $("body").on( "click", ".mdui-toggle", function(event) { 
                                               event.preventDefault();
                                               event.stopImmediatePropagation();
                                               MDUI.toggleVisibility( $(this) );
                                           } );
                                        
                                           // click-Handler für "mdui-fullscreen" 
                                           $("body").on( "click", ".mdui-fullscreen", function(event) { 
                                               MDUI.toggleFullscreen( $(this) );
                                           } );
                                        
                                           // click-Handler für "mdui-timepsan-" 
                                           $("body").on( "click", "[class*='mdui-timespan-']", function(event) { 
                                               MDUI.timespan( $(this) );
                                           } );
                                        
                                           $( window ).on("resize", function() {
                                             MDUI.handleTables();
                                           });
                                        
                                           // Überwachen des #vis_containers auf Änderungen (z.B. wenn views nachgeladen
                                           // werden)
                                           $( "#vis_container" ).on( "DOMSubtreeModified", function(event) { 
                                               MDUI.onSubTreeModified( $(this) );
                                           } );
                                           // für den ersten load einmal aufrufen
                                           MDUI.onSubTreeModified( );
                                        
                                        }, 1000); 
                                        
                                        
                                        
                                        

                                        Scrounger 1 Reply Last reply Reply Quote 0
                                        • Scrounger
                                          Scrounger Developer @Glasfaser last edited by

                                          @Glasfaser
                                          Nee sorry, hab mich mit Material Design CSS noch nie beschäftigt.

                                          Glasfaser 1 Reply Last reply Reply Quote 1
                                          • Glasfaser
                                            Glasfaser @Scrounger last edited by Glasfaser

                                            @Scrounger

                                            Kein Problem , aber trotzdem wurde der Fehler dadurch eingekreißt .

                                            Danke ....für deine Mühe 🙂

                                            1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            866
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            view view adapter
                                            31
                                            212
                                            26818
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo