Weiter zum Inhalt
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Hell
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dunkel
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

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

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Hardware
  4. SONOFF NSPanel mit Lovelace UI (TypeScript Version)

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    18
    1
    726

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    18
    1
    5.9k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.5k

SONOFF NSPanel mit Lovelace UI (TypeScript Version)

Geplant Angeheftet Gesperrt Verschoben Hardware
lovelace uinspanelsonoff
8.0k Beiträge 277 Kommentatoren 7.3m Aufrufe 260 Beobachtet
  • Ä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.
  • MichaelFM MichaelF

    @TT-Tom sagte:

    @MichaelF sagte:

    Ein Button wo ein Popup aufgeht für die Lautstärke.

    so sieht es bei mir aus in der Test-Umgebung

    const bad: ScriptConfig.PageThermo2 = {
            type: 'cardThermo2',
            uniqueName: 'thermo1',
            heading: 'Bad',
            next: 'heizkreise',
            thermoItems: [
                {
                    id: 'alias.0.Thermostat',
                    minValue: 10,
                    maxValue: 30,
                    stepValue: 0.5,
                    name: 'Bad',
                },
            ],
            items:[
                { id: 'alias.0.Volume'},
            ],
        };
    

    Bildschirmfoto 2026-04-04 um 20.43.16.png

    Einfacher Klick setzt Mute, Longclick öffnet popup

    Bildschirmfoto 2026-04-04 um 20.46.38.png

    Sei dem ich das habe:

    { id: 'alias.0.NSPanel.AlexaBadLautstärke'},
    

    geht die Seite auf aber leider kein Slider.

    Ist das vielleicht der falsche datenpunkt von Alexa ?
    d4fcc525-f6eb-4262-9495-13c00b49504b-image.jpeg

    T Offline
    T Offline
    TT-Tom
    schrieb am zuletzt editiert von TT-Tom
    #8013

    @michaelf
    zeige mal den alias den du für Volume angelegt hast

    Edit: sehe grade das dein muted readonly ist, dann kannst du in nicht von aussen setzen

    Gruß Tom
    https://github.com/tt-tom17
    Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

    NSPanel Script Wiki
    https://github.com/joBr99/nspanel-lovelace-ui/wiki

    NSPanel Adapter Wiki
    https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

    MichaelFM 1 Antwort Letzte Antwort
    0
    • T TT-Tom

      @michaelf
      zeige mal den alias den du für Volume angelegt hast

      Edit: sehe grade das dein muted readonly ist, dann kannst du in nicht von aussen setzen

      MichaelFM Online
      MichaelFM Online
      MichaelF
      schrieb am zuletzt editiert von MichaelF
      #8014

      @TT-Tom sagte:

      @michaelf
      zeige mal den alias den du für Volume angelegt hast

      Edit: sehe grade das dein muted readonly ist, dann kannst du in nicht von aussen setzen

      Glaube da ist irgendwo der Fehler.

      Bekomme jetzt auch diese Meldung im Log wenn ich die Seite aufmache:

      javascript.0
      2026-04-04 21:40:16.280	warn	script.js.common.NsPanelWz: error at function HandleButtonEvent: Cannot read properties of undefined (reading 'id')
      

      99cca517-a977-4a31-bb26-ba5eba13cd76-image.jpeg

      Hab grade mal den Datenpunkt geändert, jetzt ändert sich im Display das Symbole wenn ich ihn in den Objekten Schalte. Aber vom Display zu Objekten geht nicht.
      6b125374-9f49-4607-adec-6c9f4229971a-image.jpeg

      Ist hier was Falsch:

      5cef6793-dc34-4ac6-9d2c-6b3abf08eabb-image.jpeg

      T 1 Antwort Letzte Antwort
      0
      • MichaelFM MichaelF

        @TT-Tom sagte:

        @michaelf
        zeige mal den alias den du für Volume angelegt hast

        Edit: sehe grade das dein muted readonly ist, dann kannst du in nicht von aussen setzen

        Glaube da ist irgendwo der Fehler.

        Bekomme jetzt auch diese Meldung im Log wenn ich die Seite aufmache:

        javascript.0
        2026-04-04 21:40:16.280	warn	script.js.common.NsPanelWz: error at function HandleButtonEvent: Cannot read properties of undefined (reading 'id')
        

        99cca517-a977-4a31-bb26-ba5eba13cd76-image.jpeg

        Hab grade mal den Datenpunkt geändert, jetzt ändert sich im Display das Symbole wenn ich ihn in den Objekten Schalte. Aber vom Display zu Objekten geht nicht.
        6b125374-9f49-4607-adec-6c9f4229971a-image.jpeg

        Ist hier was Falsch:

        5cef6793-dc34-4ac6-9d2c-6b3abf08eabb-image.jpeg

        T Offline
        T Offline
        TT-Tom
        schrieb am zuletzt editiert von
        #8015

        @michaelf

        welche Adapterversion hast du? kannst du den Alias mal so anzeigen, wie ich es gemacht habe. Sprich die Rollen von den Datenpunkten und dem Channel.

        Gruß Tom
        https://github.com/tt-tom17
        Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

        NSPanel Script Wiki
        https://github.com/joBr99/nspanel-lovelace-ui/wiki

        NSPanel Adapter Wiki
        https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

        MichaelFM 1 Antwort Letzte Antwort
        0
        • T TT-Tom

          @michaelf

          welche Adapterversion hast du? kannst du den Alias mal so anzeigen, wie ich es gemacht habe. Sprich die Rollen von den Datenpunkten und dem Channel.

          MichaelFM Online
          MichaelFM Online
          MichaelF
          schrieb am zuletzt editiert von
          #8016

          @TT-Tom sagte:

          @michaelf

          welche Adapterversion hast du? kannst du den Alias mal so anzeigen, wie ich es gemacht habe. Sprich die Rollen von den Datenpunkten und dem Channel.

          Müsste die Version v5.0.0

          let CardThermo2Test: PageType =
          {
              type: 'cardThermo2',
              heading: 'Bad',
              thermoItems: [
                  /* Center-Area of cardThermo2 */
                  /* SET-Temp        */ { id: 'alias.0.NSPanel.Thermostat_Bad', minValue: 10.0, maxValue:30.0, stepValue: 0.5, unit: "°C" },
                  /* Actual Temp     */ { id: 'alias.0.NSPanel.Thermostat_Bad.ACTUAL', icon: 'thermometer', onColor: Orange, unit: "°C" },
                  /* Actual Humidity */ { id: 'alias.0.NSPanel.Thermostat_Bad.HUMIDITY', icon: 'water-percent', onColor: HMIOn, unit: "%" },
                  /* Text State      */ { id: 'alias.0.NSPanel.Thermostat_Bad.MODE', onColor: Orange }
              ],
              items: [
                  /* Max 9 Entities in cardThermo2 */
                  { id: 'alias.0.NSPanel.AlexaBadLautstärke'},
                  { id: 'alias.0.NSPanel.Dachfenster', name: 'Dachfenster', icon: 'window-open-variant', icon2: 'window-closed-variant', onColor: MSRed, offColor: MSGreen},
                  { id: 'alias.0.NSPanel.Heizung', icon: 'heat-wave', offColor: MSRed, onColor: MSGreen, name: 'Heizung'},
                  //{ navigate: true, id: null, targetPage: 'Abfall', onColor: White, name: 'Abfallkalender', icon: 'trash-can'},
                  { id: 'alias.0.NSPanel.Heizung_Spiegel', icon: 'heat-pump-outline', offColor: MSRed, onColor: MSGreen, name: 'Speigelheizung'},
                  { id: 'alias.0.NSPanel.Endstufe', icon: 'soundbar', offColor: MSRed, onColor: MSGreen, name: 'Endstufe'},
                  { id: 'alias.0.NSPanel.Lüfter',name: 'Ventilator', icon: 'fan', onColor: On, offColor: HMIOff},
                  //{ id: 'alias.0.NSPanel_1.TestTemperatur', name: 'Außentemperatur', offColor: White , onColor: White, useValue: true, suffixName: ' °C', fontSize: 1, colorScale: { 'val_min': -20, 'val_max': 40, 'val_best': 20 } },
                  { id: 'alias.0.NSPanel.Fussbodenheizung', icon: 'heating-coil', offColor: MSRed, onColor: MSGreen, name: 'Fussbodenheizung'},
                  { id: 'alias.0.NSPanel.Deckenbeleuchtung_Klein', icon: 'lightbulb', offColor: MSRed, onColor: MSGreen, name: 'Licht'},
                  //{ id: 'delete'},
                  //{ id: 'alias.0.NSPanel_EMU.TestKlimaVirtualModeList', icon: 'dots-horizontal-circle-outline', onColor: White, offColor: White, name: 'Betriebsmodus', modeList: ['Aus','Kühlen auf', 'Heizen auf']}
              ],
              alwaysOnDisplay: false
          };
          
          T 2 Antworten Letzte Antwort
          0
          • MichaelFM MichaelF

            @TT-Tom sagte:

            @michaelf

            welche Adapterversion hast du? kannst du den Alias mal so anzeigen, wie ich es gemacht habe. Sprich die Rollen von den Datenpunkten und dem Channel.

            Müsste die Version v5.0.0

            let CardThermo2Test: PageType =
            {
                type: 'cardThermo2',
                heading: 'Bad',
                thermoItems: [
                    /* Center-Area of cardThermo2 */
                    /* SET-Temp        */ { id: 'alias.0.NSPanel.Thermostat_Bad', minValue: 10.0, maxValue:30.0, stepValue: 0.5, unit: "°C" },
                    /* Actual Temp     */ { id: 'alias.0.NSPanel.Thermostat_Bad.ACTUAL', icon: 'thermometer', onColor: Orange, unit: "°C" },
                    /* Actual Humidity */ { id: 'alias.0.NSPanel.Thermostat_Bad.HUMIDITY', icon: 'water-percent', onColor: HMIOn, unit: "%" },
                    /* Text State      */ { id: 'alias.0.NSPanel.Thermostat_Bad.MODE', onColor: Orange }
                ],
                items: [
                    /* Max 9 Entities in cardThermo2 */
                    { id: 'alias.0.NSPanel.AlexaBadLautstärke'},
                    { id: 'alias.0.NSPanel.Dachfenster', name: 'Dachfenster', icon: 'window-open-variant', icon2: 'window-closed-variant', onColor: MSRed, offColor: MSGreen},
                    { id: 'alias.0.NSPanel.Heizung', icon: 'heat-wave', offColor: MSRed, onColor: MSGreen, name: 'Heizung'},
                    //{ navigate: true, id: null, targetPage: 'Abfall', onColor: White, name: 'Abfallkalender', icon: 'trash-can'},
                    { id: 'alias.0.NSPanel.Heizung_Spiegel', icon: 'heat-pump-outline', offColor: MSRed, onColor: MSGreen, name: 'Speigelheizung'},
                    { id: 'alias.0.NSPanel.Endstufe', icon: 'soundbar', offColor: MSRed, onColor: MSGreen, name: 'Endstufe'},
                    { id: 'alias.0.NSPanel.Lüfter',name: 'Ventilator', icon: 'fan', onColor: On, offColor: HMIOff},
                    //{ id: 'alias.0.NSPanel_1.TestTemperatur', name: 'Außentemperatur', offColor: White , onColor: White, useValue: true, suffixName: ' °C', fontSize: 1, colorScale: { 'val_min': -20, 'val_max': 40, 'val_best': 20 } },
                    { id: 'alias.0.NSPanel.Fussbodenheizung', icon: 'heating-coil', offColor: MSRed, onColor: MSGreen, name: 'Fussbodenheizung'},
                    { id: 'alias.0.NSPanel.Deckenbeleuchtung_Klein', icon: 'lightbulb', offColor: MSRed, onColor: MSGreen, name: 'Licht'},
                    //{ id: 'delete'},
                    //{ id: 'alias.0.NSPanel_EMU.TestKlimaVirtualModeList', icon: 'dots-horizontal-circle-outline', onColor: White, offColor: White, name: 'Betriebsmodus', modeList: ['Aus','Kühlen auf', 'Heizen auf']}
                ],
                alwaysOnDisplay: false
            };
            
            T Offline
            T Offline
            TT-Tom
            schrieb am zuletzt editiert von
            #8017

            @MichaelF
            ach sorry das ist ja das Script, ich muss mal die umstellen. war beim Adapter und da gehts 😊

            Gruß Tom
            https://github.com/tt-tom17
            Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

            NSPanel Script Wiki
            https://github.com/joBr99/nspanel-lovelace-ui/wiki

            NSPanel Adapter Wiki
            https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

            1 Antwort Letzte Antwort
            0
            • MichaelFM MichaelF

              @TT-Tom sagte:

              @michaelf

              welche Adapterversion hast du? kannst du den Alias mal so anzeigen, wie ich es gemacht habe. Sprich die Rollen von den Datenpunkten und dem Channel.

              Müsste die Version v5.0.0

              let CardThermo2Test: PageType =
              {
                  type: 'cardThermo2',
                  heading: 'Bad',
                  thermoItems: [
                      /* Center-Area of cardThermo2 */
                      /* SET-Temp        */ { id: 'alias.0.NSPanel.Thermostat_Bad', minValue: 10.0, maxValue:30.0, stepValue: 0.5, unit: "°C" },
                      /* Actual Temp     */ { id: 'alias.0.NSPanel.Thermostat_Bad.ACTUAL', icon: 'thermometer', onColor: Orange, unit: "°C" },
                      /* Actual Humidity */ { id: 'alias.0.NSPanel.Thermostat_Bad.HUMIDITY', icon: 'water-percent', onColor: HMIOn, unit: "%" },
                      /* Text State      */ { id: 'alias.0.NSPanel.Thermostat_Bad.MODE', onColor: Orange }
                  ],
                  items: [
                      /* Max 9 Entities in cardThermo2 */
                      { id: 'alias.0.NSPanel.AlexaBadLautstärke'},
                      { id: 'alias.0.NSPanel.Dachfenster', name: 'Dachfenster', icon: 'window-open-variant', icon2: 'window-closed-variant', onColor: MSRed, offColor: MSGreen},
                      { id: 'alias.0.NSPanel.Heizung', icon: 'heat-wave', offColor: MSRed, onColor: MSGreen, name: 'Heizung'},
                      //{ navigate: true, id: null, targetPage: 'Abfall', onColor: White, name: 'Abfallkalender', icon: 'trash-can'},
                      { id: 'alias.0.NSPanel.Heizung_Spiegel', icon: 'heat-pump-outline', offColor: MSRed, onColor: MSGreen, name: 'Speigelheizung'},
                      { id: 'alias.0.NSPanel.Endstufe', icon: 'soundbar', offColor: MSRed, onColor: MSGreen, name: 'Endstufe'},
                      { id: 'alias.0.NSPanel.Lüfter',name: 'Ventilator', icon: 'fan', onColor: On, offColor: HMIOff},
                      //{ id: 'alias.0.NSPanel_1.TestTemperatur', name: 'Außentemperatur', offColor: White , onColor: White, useValue: true, suffixName: ' °C', fontSize: 1, colorScale: { 'val_min': -20, 'val_max': 40, 'val_best': 20 } },
                      { id: 'alias.0.NSPanel.Fussbodenheizung', icon: 'heating-coil', offColor: MSRed, onColor: MSGreen, name: 'Fussbodenheizung'},
                      { id: 'alias.0.NSPanel.Deckenbeleuchtung_Klein', icon: 'lightbulb', offColor: MSRed, onColor: MSGreen, name: 'Licht'},
                      //{ id: 'delete'},
                      //{ id: 'alias.0.NSPanel_EMU.TestKlimaVirtualModeList', icon: 'dots-horizontal-circle-outline', onColor: White, offColor: White, name: 'Betriebsmodus', modeList: ['Aus','Kühlen auf', 'Heizen auf']}
                  ],
                  alwaysOnDisplay: false
              };
              
              T Offline
              T Offline
              TT-Tom
              schrieb am zuletzt editiert von
              #8018

              @MichaelF sagte:

              so habe jetzt das Script am laufen, Version 5.1.1.3 und TFT 61. Es funktioniert fast wie gewünscht. Der Datenpunkt Mute wird nicht genutzt, dafür wird der Volume auf "0" gesetzt. Die Icon ändern sich je nach Lautstarke.

              Gruß Tom
              https://github.com/tt-tom17
              Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

              NSPanel Script Wiki
              https://github.com/joBr99/nspanel-lovelace-ui/wiki

              NSPanel Adapter Wiki
              https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

              MichaelFM 1 Antwort Letzte Antwort
              0
              • T TT-Tom

                @MichaelF sagte:

                so habe jetzt das Script am laufen, Version 5.1.1.3 und TFT 61. Es funktioniert fast wie gewünscht. Der Datenpunkt Mute wird nicht genutzt, dafür wird der Volume auf "0" gesetzt. Die Icon ändern sich je nach Lautstarke.

                MichaelFM Online
                MichaelFM Online
                MichaelF
                schrieb zuletzt editiert von
                #8019

                @TT-Tom sagte:

                @MichaelF sagte:

                so habe jetzt das Script am laufen, Version 5.1.1.3 und TFT 61. Es funktioniert fast wie gewünscht. Der Datenpunkt Mute wird nicht genutzt, dafür wird der Volume auf "0" gesetzt. Die Icon ändern sich je nach Lautstarke.

                Danke für´s testen, reicht es wenn ich den unteren Teil vom Scrip aktualisiere. Oder vielleicht gleich doch auf den Adapter wechseln ?

                Grüße und Frohe Ostern.

                T T 2 Antworten Letzte Antwort
                0
                • MichaelFM MichaelF

                  @TT-Tom sagte:

                  @MichaelF sagte:

                  so habe jetzt das Script am laufen, Version 5.1.1.3 und TFT 61. Es funktioniert fast wie gewünscht. Der Datenpunkt Mute wird nicht genutzt, dafür wird der Volume auf "0" gesetzt. Die Icon ändern sich je nach Lautstarke.

                  Danke für´s testen, reicht es wenn ich den unteren Teil vom Scrip aktualisiere. Oder vielleicht gleich doch auf den Adapter wechseln ?

                  Grüße und Frohe Ostern.

                  T Offline
                  T Offline
                  TT-Tom
                  schrieb zuletzt editiert von
                  #8020

                  @MichaelF

                  du kannst den Adapter installieren und deine Seitenconfig nach und nach übernehmen. Es darf aber nur eins von beiden laufen. Beim Start musst du die MQTT und Paneleinstellungen vom Script übernehmen, damit das Script weiter funktioniert. Ich würde dir den Umstieg zum Adapter empfehlen. Wenn du Hilfe benötigst, kannst du im Wiki schon vieles nachlesen, ansonsten frage im Adapter Post nach.

                  Gruß Tom
                  https://github.com/tt-tom17
                  Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                  NSPanel Script Wiki
                  https://github.com/joBr99/nspanel-lovelace-ui/wiki

                  NSPanel Adapter Wiki
                  https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                  1 Antwort Letzte Antwort
                  0
                  • MichaelFM MichaelF

                    @TT-Tom sagte:

                    @MichaelF sagte:

                    so habe jetzt das Script am laufen, Version 5.1.1.3 und TFT 61. Es funktioniert fast wie gewünscht. Der Datenpunkt Mute wird nicht genutzt, dafür wird der Volume auf "0" gesetzt. Die Icon ändern sich je nach Lautstarke.

                    Danke für´s testen, reicht es wenn ich den unteren Teil vom Scrip aktualisiere. Oder vielleicht gleich doch auf den Adapter wechseln ?

                    Grüße und Frohe Ostern.

                    T Nicht stören
                    T Nicht stören
                    ticaki
                    schrieb zuletzt editiert von
                    #8021

                    @MichaelF
                    Adapter ist etwas anders - der Umzug braucht doch ein paar Anpassungen. Aber dann gehts imho einfacher - ich würde den adapter schon alleine wegen der symbolübersicht installieren :D

                    Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                    Spenden

                    T 1 Antwort Letzte Antwort
                    0
                    • T ticaki

                      @MichaelF
                      Adapter ist etwas anders - der Umzug braucht doch ein paar Anpassungen. Aber dann gehts imho einfacher - ich würde den adapter schon alleine wegen der symbolübersicht installieren :D

                      T Offline
                      T Offline
                      TT-Tom
                      schrieb zuletzt editiert von
                      #8022

                      @ticaki @michaelf

                      Dafür sind wir doch da, um bei der Migration zu helfen.

                      Gruß Tom
                      https://github.com/tt-tom17
                      Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                      NSPanel Script Wiki
                      https://github.com/joBr99/nspanel-lovelace-ui/wiki

                      NSPanel Adapter Wiki
                      https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                      1 Antwort Letzte Antwort
                      0

                      Hey! Du scheinst an dieser Unterhaltung interessiert zu sein, hast aber noch kein Konto.

                      Hast du es satt, bei jedem Besuch durch die gleichen Beiträge zu scrollen? Wenn du dich für ein Konto anmeldest, kommst du immer genau dorthin zurück, wo du zuvor warst, und kannst dich über neue Antworten benachrichtigen lassen (entweder per E-Mail oder Push-Benachrichtigung). Du kannst auch Lesezeichen speichern und Beiträge positiv bewerten, um anderen Community-Mitgliedern deine Wertschätzung zu zeigen.

                      Mit deinem Input könnte dieser Beitrag noch besser werden 💗

                      Registrieren Anmelden
                      Antworten
                      • In einem neuen Thema antworten
                      Anmelden zum Antworten
                      • Älteste zuerst
                      • Neuste zuerst
                      • Meiste Stimmen


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      471

                      Online

                      32.8k

                      Benutzer

                      82.6k

                      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