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

  • Default (No Skin)
  • No Skin
Collapse
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
    3
    1
    17

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

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

SONOFF NSPanel mit Lovelace UI (TypeScript Version)

Scheduled Pinned Locked Moved Hardware
lovelace uinspanelsonoff
8.0k Posts 277 Posters 7.1m Views 262 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • theknutT theknut

    @armilar Danke, dass du am Spotify Player arbeitest. Wenn du Muse hast, wäre es nett, wenn du eine Lautstärke-Normierung einbauen könntest. Bei mir ist es so, dass die Karte automatisch angezeigt wird, wenn was auf der Anlage abgespielt wird. Wenn man dann die Lautstärke am Regler ändern will (das funktioniert übrigens nur sporadisch). Dann passiert es gut und gerne mal, dass ein viel zu hoher Wert gesendet wird und dir die Ohren abfallen. Daher habe ich bei mir eine Normierung eingebaut, dass die 100% Regler auf max. 60% der Anlage gemappt werden.

    Sieht folgendermaßen aus:

    In HandleButtonEvent

    case 'volumeSlider':
    	pageCounter = -1;
    	(function () { if (timeoutSlider) { clearTimeout(timeoutSlider); timeoutSlider = null; } })();
    	timeoutSlider = setTimeout(async function () {
    		setIfExists(id + '.VOLUME', map(parseInt(words[4]), 0, 100, 0, 60) );
    		setTimeout(async function () {
    		   pageCounter = 1;
    			GeneratePage(activePage);
    		}, 3000);
    	}, 20);
    	break;
    

    In GenerateMediaPage

    let volume = map(getState(id + '.VOLUME').val, 0, 60, 0, 100);
    let iconplaypause = Icons.GetIcon('pause'); //pause
    let shuffle_icon = Icons.GetIcon('shuffle-variant'); //shuffle
    let onoffbutton = 1374;
    

    Hier noch die Funktion

    export function clamp(input: number, min: number, max: number): number {
        return input < min ? min : input > max ? max : input;
    }
    
    export function map(current: number, in_min: number, in_max: number, out_min: number, out_max: number): number {
        const mapped: number = ((current - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min;
        return clamp(mapped, out_min, out_max);
    }
    
    ArmilarA Offline
    ArmilarA Offline
    Armilar
    Most Active Forum Testing
    wrote on last edited by
    #5323

    @theknut

    Die Idee, den Player grundsätzlich in der Lautstärke zu bremsen finde ich gut... Würde es so aber auf keinen Fall einbinden...

    • Die Scale ist ja schon vorhanden und die map wäre ja nichts anderes als eine "gleiche" Scale.
    • Im pageItem lassen sich die könnte dafür die minValue und maxValue genutzt werden. Dann hätten Player die etwas mehr "wums" benötigen jetzt keinen Aggressiven Lautstärke Killer ;-)
    • Das eigentliche Problem entsteht im Senden jedes Slider-Wertes beim Verschieben aus der HMI. Es wird nicht der finale Wert gesendet, sondern auch alle dazwischen. Mit einer Latenz von 50ms statt 3000ms werden die jetzt abfangen. Dadurch wird es gefühlt besser...

    Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
    https://github.com/joBr99/nspanel-lovelace-ui/wiki

    Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

    theknutT 1 Reply Last reply
    0
    • ArmilarA Armilar

      @theknut

      Die Idee, den Player grundsätzlich in der Lautstärke zu bremsen finde ich gut... Würde es so aber auf keinen Fall einbinden...

      • Die Scale ist ja schon vorhanden und die map wäre ja nichts anderes als eine "gleiche" Scale.
      • Im pageItem lassen sich die könnte dafür die minValue und maxValue genutzt werden. Dann hätten Player die etwas mehr "wums" benötigen jetzt keinen Aggressiven Lautstärke Killer ;-)
      • Das eigentliche Problem entsteht im Senden jedes Slider-Wertes beim Verschieben aus der HMI. Es wird nicht der finale Wert gesendet, sondern auch alle dazwischen. Mit einer Latenz von 50ms statt 3000ms werden die jetzt abfangen. Dadurch wird es gefühlt besser...
      theknutT Offline
      theknutT Offline
      theknut
      wrote on last edited by
      #5324

      @armilar das sollte ja auch variabel einstellbar sein. Aber ja, min max wäre auch okay. Hauptsache das wird dann irgendwie auf den Slider gemappt, weil sonst kann ich den immer nur bis zur Hälfte schieben, wenn sich danach nichts mehr ändert. Das ist ja auch blöd.

      ☕ @ https://ko-fi.com/theknut

      T ArmilarA 2 Replies Last reply
      1
      • theknutT theknut

        @armilar das sollte ja auch variabel einstellbar sein. Aber ja, min max wäre auch okay. Hauptsache das wird dann irgendwie auf den Slider gemappt, weil sonst kann ich den immer nur bis zur Hälfte schieben, wenn sich danach nichts mehr ändert. Das ist ja auch blöd.

        T Do not disturb
        T Do not disturb
        ticaki
        wrote on last edited by
        #5325

        @theknut

        könntest im Alias die write funktion anpassen. Geht doch über Aliase oder?

        Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

        Spenden

        1 Reply Last reply
        0
        • theknutT theknut

          @armilar das sollte ja auch variabel einstellbar sein. Aber ja, min max wäre auch okay. Hauptsache das wird dann irgendwie auf den Slider gemappt, weil sonst kann ich den immer nur bis zur Hälfte schieben, wenn sich danach nichts mehr ändert. Das ist ja auch blöd.

          ArmilarA Offline
          ArmilarA Offline
          Armilar
          Most Active Forum Testing
          wrote on last edited by Armilar
          #5326

          @theknut

          Habe dich eben zum Tester auserkoren :grin:

          13416991-1994-4b3f-935e-5cb58bc86f79-Nextion_Editor_Flp8X3uvVi.gif

          Nimm mal das https://github.com/joBr99/nspanel-lovelace-ui/blob/main/ioBroker/DEV/NSPanelTs.ts

          Das ist die neue Variable:

          let SpotifyPremium: PageType =
          {
              'type': 'cardMedia',
              'heading': 'Spotify-Premium',
              'items': [{ 
                          id: AliasPath + 'Media.PlayerSpotifyPremium', 
                          adapterPlayerInstance: "spotify-premium.0.",
                          speakerList: [], 
                          playList: [],
                          equalizerList: ['Bassboost','Klassik','Dance', 'Deep', 'Electronic', 'Flat', 'Hip-Hop', 'Rock', 
                                          'Metal', 'Jazz', 'Latin', 'Tonstärke', 'Lounge', 'Piano'],
                          colorMediaIcon: colorSpotify,
                          colorMediaArtist: Yellow,
                          colorMediaTitle: Yellow,
                          minValue: 0,
                          maxValue: 60,
                          alwaysOnDisplay: true,
                          autoCreateALias: true
                       }]
          };
          

          Wenn die Arrays leer sind, läd der Player alle vollautomatisch

          Bin auch schon mit der Wiki-Page angefangen:
          https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-‐-cardMedia-‐-Der-Spotify‐Premium-Player

          Interessant sind dabei die beschriebenen Einstellungen für die Instanz (unterdrückt die vorhandenen Bugs im Spotify-Premium Adapter)

          maxValue habe ich für dich schon mal eingestellt ;-)

          VG
          Armilar :blush:

          P.S Feedback erwünscht

          Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
          https://github.com/joBr99/nspanel-lovelace-ui/wiki

          Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

          1 Reply Last reply
          0
          • theknutT Offline
            theknutT Offline
            theknut
            wrote on last edited by theknut
            #5327

            @armilar Funktioniert leider gar nicht bei mir... Es ist weiterhin nicht wirklich möglich die Lautstärke zuverlässig zu ändern. Außerdem hatte ich noch einen Compilefehler wegen Zeile 5795, da musst du noch einen String draus machen.
            Und hier ist noch ein Log ohne Debug.

            WhatsApp Video 2024-02-11 at 00.34.26.mp4 - siehe Video. Gleich ein Schreck bekommen, nicht, dass ich noch die Kinder wecke^^ Vaddi geht jetzt auch mal ins Bett

            ☕ @ https://ko-fi.com/theknut

            ArmilarA 1 Reply Last reply
            1
            • theknutT theknut

              @armilar Funktioniert leider gar nicht bei mir... Es ist weiterhin nicht wirklich möglich die Lautstärke zuverlässig zu ändern. Außerdem hatte ich noch einen Compilefehler wegen Zeile 5795, da musst du noch einen String draus machen.
              Und hier ist noch ein Log ohne Debug.

              WhatsApp Video 2024-02-11 at 00.34.26.mp4 - siehe Video. Gleich ein Schreck bekommen, nicht, dass ich noch die Kinder wecke^^ Vaddi geht jetzt auch mal ins Bett

              ArmilarA Offline
              ArmilarA Offline
              Armilar
              Most Active Forum Testing
              wrote on last edited by Armilar
              #5328

              @theknut

              Okay das ist interessant... Also ist es doch ein Latenzproblem...

              Bei mir wird das sauber 1:1 verarbeitet...:face_with_rolling_eyes: Was hast du für ne Hardware am Laufen... Meine Server sind schon sehr groß und schnell... Vielleicht kannst du versuchen, da mal ne Einstellung zu finden die bei dir akzeptabel arbeitet...:no_mouth:

              und gute Nacht...

              Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
              https://github.com/joBr99/nspanel-lovelace-ui/wiki

              Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

              theknutT 1 Reply Last reply
              0
              • T Do not disturb
                T Do not disturb
                ticaki
                wrote on last edited by
                #5329

                Eine kleine Verbesserung die ihr im Nspanel Tasmota - Console vornehmen könnt.

                Damit schaltet das Panel in den Startup wenn es länger als 90 Sekunden nichts vom Skript gehört hat. Da das Skript jede volle Minute die Zeit übermittelt ist das zuverlässig.

                Zielt ist es zu sehen das die Uhrzeit falsch ist und man erkennt, das das Panel nicht verbunden ist.

                Falls Rule3 noch frei ist natürlich.

                Rule3
                  ON CustomSend DO RuleTimer1 90 ENDON
                  ON Rules#Timer=1 DO CustomSend pageType~pageStartup ENDON
                

                und dann

                Rule3 on
                

                Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                Spenden

                1 Reply Last reply
                1
                • ArmilarA Armilar

                  @theknut

                  Okay das ist interessant... Also ist es doch ein Latenzproblem...

                  Bei mir wird das sauber 1:1 verarbeitet...:face_with_rolling_eyes: Was hast du für ne Hardware am Laufen... Meine Server sind schon sehr groß und schnell... Vielleicht kannst du versuchen, da mal ne Einstellung zu finden die bei dir akzeptabel arbeitet...:no_mouth:

                  und gute Nacht...

                  theknutT Offline
                  theknutT Offline
                  theknut
                  wrote on last edited by
                  #5330

                  @armilar läuft bei mir in einem Docker Container auf dem Synology. Wenn ich Zeit habe, kann ich mal schauen, ob ich was dran ändern kann.

                  ☕ @ https://ko-fi.com/theknut

                  ArmilarA 3 Replies Last reply
                  0
                  • theknutT theknut

                    @armilar läuft bei mir in einem Docker Container auf dem Synology. Wenn ich Zeit habe, kann ich mal schauen, ob ich was dran ändern kann.

                    ArmilarA Offline
                    ArmilarA Offline
                    Armilar
                    Most Active Forum Testing
                    wrote on last edited by
                    #5331

                    @theknut

                    Ich bin parallel auch an Tests dran

                    Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                    https://github.com/joBr99/nspanel-lovelace-ui/wiki

                    Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                    1 Reply Last reply
                    1
                    • theknutT theknut

                      @armilar läuft bei mir in einem Docker Container auf dem Synology. Wenn ich Zeit habe, kann ich mal schauen, ob ich was dran ändern kann.

                      ArmilarA Offline
                      ArmilarA Offline
                      Armilar
                      Most Active Forum Testing
                      wrote on last edited by
                      #5332

                      @theknut

                      Teste das mal bitte mit direkten Einstellungen

                      Die Volume-Werte werden in den jeweiligen Adapter geschrieben und irgendwann muss die Seite wieder initial gerendert werden

                                  case 'volumeSlider':
                                      pageCounter = -1;
                                      let vVolume = scale(parseInt(words[4]), 100, 0, activePage.items[0].minValue ?? 0, activePage.items[0].maxValue ?? 100);
                                      setIfExists(id + '.VOLUME', Math.floor(vVolume));
                                      setTimeout(async function () {
                                          pageCounter = 1;
                                          GeneratePage(activePage!);
                                      }, 1000);                    
                                      break;
                      

                      damit auch andere Panels oder Adapter (z.B.) Alexa eine Chance haben

                      function subscribeMediaSubscriptions(id: string): void {
                          on({id:   [id + '.STATE',
                                     id + '.VOLUME',
                                     id + '.ARTIST',
                                     id + '.ALBUM',
                                     id + '.TITLE',
                                     id + '.REPEAT',
                                     id + '.SHUFFLE'], change: "any", ack: true}, async function () {
                              if (useMediaEvents && pageCounter == 1) {
                                  GeneratePage(activePage!);
                              }
                          });
                      } 
                      

                      damit die Elapsed/Duration weiterlaufen

                      function subscribeMediaSubscriptionsSpotifyAdd(id: string): void {
                          on({id: [id + '.DURATION',
                                   id + '.ELAPSED'], change: "any", ack: true}, async function () {
                              if (useMediaEvents && pageCounter == 1) {
                                  GeneratePage(activePage!);
                              }
                          });
                      } 
                      

                      Das der Slider teilweise springt liegt daran, dass die Seite neu gerendert wird und der Adapter das ack: true noch nicht geliefert hat. Manchmal schnell, und manchmal dauert es halt. Ist ja auch noch ne Cloud dazwischen.

                      Es ist ja auch nicht undenkbar das du da einen Wert rein schreibst und der Adapter ihn nicht überträgt...

                      Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                      https://github.com/joBr99/nspanel-lovelace-ui/wiki

                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                      1 Reply Last reply
                      0
                      • E Offline
                        E Offline
                        Einstein2002
                        wrote on last edited by Einstein2002
                        #5333

                        Hallo zusammen,
                        ich benötige mal etwas Starthilfe.
                        Ich habe mir mal zwei NSPanel zugelegt, mit Tasmota geflasht und auch soweit einsatzbereit.
                        Mit Hilfe von Matthias "Hausautomation" habe ich das NSPanel auch schon am laufen und den Bildschirmschoner mit Wetterdaten versorgt.
                        Ich komme aber überhaupt nicht mit dem einrichten der Seiten zurecht.
                        Könnte mir BItte mal einer dies erklären oder ein Beispiel geben. Ich sitze nun schon mehrere Tage daran und komme nicht weiter.
                        Das Script von "Hausautomation" welches Matthias in seinem Video benutzt weicht stark von dem ab welches ich aktuell verwende:

                        script.js.NSPanels.Werkstatt1_NSPanel_TSV_4_3_3_39: -- web.0 - 8082
                        

                        Ich möchte nur gerne verstehen wo ich was einfügen muss damit ich mir eine Seite erstellen kann um ein paar Steckdosen an und auszuschalten.

                        Auch in den Beispielen wird Seitenlag erklärt aber ich komme nicht weiter, ich verstehe den Zusammenhang noch nicht.

                        Im wesentlichen müsste ich doch dies hier

                        
                        let Buero_Seite_1: PageType =
                        {
                            'type': 'cardEntities',
                            'heading': 'Büro',
                            'useColor': true,
                            'items': [
                                { id: 'alias.0.NSPanel_1.Schreibtischlampe', interpolateColor: true},
                                { id: 'alias.0.NSPanel_1.Deckenbeleuchtung', interpolateColor: true},
                                { id: 'alias.0.NSPanel_1.ShellyDuoTest', name: 'Shelly Duo GU10', minValueBrightness: 0, maxValueBrightness: 100, minValueColorTemp: 6465, maxValueColorTemp: 3000, interpolateColor: true, modeList: ['Color','White'], inSel_ChoiceState: true},
                                { id: 'alias.0.NSPanel_1.Luftreiniger', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen}
                            ]
                        };
                        

                        in das Script einfügen und die aliase abändern.
                        Aber wo????

                        Mag mir bitte einer mal ein kleinen Denkanstoß geben.

                        Vielen Dank jetzt schon mal.

                        Und falls ich etwas gefragt habe was irgendwo schon gefragt wurde, dann bitte Entschuldigung.
                        Oder sollte ich ein neues Thema eröffnen?

                        Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                        Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                        T 1 Reply Last reply
                        0
                        • E Einstein2002

                          Hallo zusammen,
                          ich benötige mal etwas Starthilfe.
                          Ich habe mir mal zwei NSPanel zugelegt, mit Tasmota geflasht und auch soweit einsatzbereit.
                          Mit Hilfe von Matthias "Hausautomation" habe ich das NSPanel auch schon am laufen und den Bildschirmschoner mit Wetterdaten versorgt.
                          Ich komme aber überhaupt nicht mit dem einrichten der Seiten zurecht.
                          Könnte mir BItte mal einer dies erklären oder ein Beispiel geben. Ich sitze nun schon mehrere Tage daran und komme nicht weiter.
                          Das Script von "Hausautomation" welches Matthias in seinem Video benutzt weicht stark von dem ab welches ich aktuell verwende:

                          script.js.NSPanels.Werkstatt1_NSPanel_TSV_4_3_3_39: -- web.0 - 8082
                          

                          Ich möchte nur gerne verstehen wo ich was einfügen muss damit ich mir eine Seite erstellen kann um ein paar Steckdosen an und auszuschalten.

                          Auch in den Beispielen wird Seitenlag erklärt aber ich komme nicht weiter, ich verstehe den Zusammenhang noch nicht.

                          Im wesentlichen müsste ich doch dies hier

                          
                          let Buero_Seite_1: PageType =
                          {
                              'type': 'cardEntities',
                              'heading': 'Büro',
                              'useColor': true,
                              'items': [
                                  { id: 'alias.0.NSPanel_1.Schreibtischlampe', interpolateColor: true},
                                  { id: 'alias.0.NSPanel_1.Deckenbeleuchtung', interpolateColor: true},
                                  { id: 'alias.0.NSPanel_1.ShellyDuoTest', name: 'Shelly Duo GU10', minValueBrightness: 0, maxValueBrightness: 100, minValueColorTemp: 6465, maxValueColorTemp: 3000, interpolateColor: true, modeList: ['Color','White'], inSel_ChoiceState: true},
                                  { id: 'alias.0.NSPanel_1.Luftreiniger', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen}
                              ]
                          };
                          

                          in das Script einfügen und die aliase abändern.
                          Aber wo????

                          Mag mir bitte einer mal ein kleinen Denkanstoß geben.

                          Vielen Dank jetzt schon mal.

                          Und falls ich etwas gefragt habe was irgendwo schon gefragt wurde, dann bitte Entschuldigung.
                          Oder sollte ich ein neues Thema eröffnen?

                          T Offline
                          T Offline
                          TT-Tom
                          wrote on last edited by
                          #5334

                          @einstein2002

                          Hallo erstmal und willkommen beim Sonoff Panel Thread.

                          Wenn dein Panel schon soweit läuft, hast du die größten Hürden schon geschafft.
                          Als nächstes brauchst du für jede Steckdose einen Alias. Eine Anleitung findest du hier
                          https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-ALIAS-Definitionen#steckdose-channel-socket
                          Wenn der Alias funktioniert, erstellst du dir deine Seite. Infos findest du hier https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-‐-Typen_How-2_Beispiele#basisseite

                          Hoffe das hilft dir erstmal weiter, ansonsten immer weiter fragen. Hier bleibt keiner auf der Strecke.

                          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

                          E 2 Replies Last reply
                          0
                          • E Offline
                            E Offline
                            Einstein2002
                            wrote on last edited by
                            #5335

                            Oder besser gefragt, gibt es irgendwo ein Script das ich an mein Script anpassen kann? In den älteren Versionen waren doch mal Beispiele vorhanden, das zeigt Matthias doch in seinem Video. Aber dies ist in den aktuellen Scripten ja nicht mehr vorhanden.
                            Könnte ich irgendwie mal an so ein Beispielscript kommen?
                            In den Anleitungen sind auch immer nur ausschnitte zu sehen, mir fehlt aber die Zuordnung wo was an welche Stelle gehört.

                            Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                            Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                            1 Reply Last reply
                            0
                            • T TT-Tom

                              @einstein2002

                              Hallo erstmal und willkommen beim Sonoff Panel Thread.

                              Wenn dein Panel schon soweit läuft, hast du die größten Hürden schon geschafft.
                              Als nächstes brauchst du für jede Steckdose einen Alias. Eine Anleitung findest du hier
                              https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-ALIAS-Definitionen#steckdose-channel-socket
                              Wenn der Alias funktioniert, erstellst du dir deine Seite. Infos findest du hier https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-‐-Typen_How-2_Beispiele#basisseite

                              Hoffe das hilft dir erstmal weiter, ansonsten immer weiter fragen. Hier bleibt keiner auf der Strecke.

                              E Offline
                              E Offline
                              Einstein2002
                              wrote on last edited by
                              #5336

                              @tt-tom sagte in SONOFF NSPanel mit Lovelace UI:

                              https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-‐-Typen_How-2_Beispiele#basisseite

                              Diese Seite habe ich schon mehrfach durchgelesen, aber ich check das einfach nicht.
                              Ich stehe da wie der Ochs vorm Berg, oder besser, ich sehe den Wald vor lauter Bäumen nicht.

                              Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                              Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                              T 1 Reply Last reply
                              0
                              • T TT-Tom

                                @einstein2002

                                Hallo erstmal und willkommen beim Sonoff Panel Thread.

                                Wenn dein Panel schon soweit läuft, hast du die größten Hürden schon geschafft.
                                Als nächstes brauchst du für jede Steckdose einen Alias. Eine Anleitung findest du hier
                                https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-ALIAS-Definitionen#steckdose-channel-socket
                                Wenn der Alias funktioniert, erstellst du dir deine Seite. Infos findest du hier https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-‐-Typen_How-2_Beispiele#basisseite

                                Hoffe das hilft dir erstmal weiter, ansonsten immer weiter fragen. Hier bleibt keiner auf der Strecke.

                                E Offline
                                E Offline
                                Einstein2002
                                wrote on last edited by
                                #5337

                                @tt-tom
                                Hallo Tom, habe ich vorhin vergessen, Sorry,

                                die oder momentan nur den Alias habe ich auch angelegt,
                                7fccafcb-619c-40c2-85ab-9b26b68902e8-image.png
                                das funktioniert auch soweit.

                                Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                                Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                                T 1 Reply Last reply
                                0
                                • E Einstein2002

                                  @tt-tom sagte in SONOFF NSPanel mit Lovelace UI:

                                  https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-‐-Typen_How-2_Beispiele#basisseite

                                  Diese Seite habe ich schon mehrfach durchgelesen, aber ich check das einfach nicht.
                                  Ich stehe da wie der Ochs vorm Berg, oder besser, ich sehe den Wald vor lauter Bäumen nicht.

                                  T Offline
                                  T Offline
                                  TT-Tom
                                  wrote on last edited by TT-Tom
                                  #5338

                                  @einstein2002

                                  Hast du denn für die Steckdosen schon ein Alias angelegt?
                                  Ohne diesen Schritt kommen wir nicht weiter.
                                  Ich kann dir auch nix anderes zeigen, da ich nicht vor dem Rechner sitze.

                                  Edit: das ist doch schon mal eine Grundlage, mit der wir weiter kommen.

                                  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

                                  E 2 Replies Last reply
                                  0
                                  • T TT-Tom

                                    @einstein2002

                                    Hast du denn für die Steckdosen schon ein Alias angelegt?
                                    Ohne diesen Schritt kommen wir nicht weiter.
                                    Ich kann dir auch nix anderes zeigen, da ich nicht vor dem Rechner sitze.

                                    Edit: das ist doch schon mal eine Grundlage, mit der wir weiter kommen.

                                    E Offline
                                    E Offline
                                    Einstein2002
                                    wrote on last edited by
                                    #5339

                                    @tt-tom ```
                                    alias.0.Haus.Dachgeschoß.UFO_Lampe.SET

                                    Das ist der alias, wenn ich das einmal habe ist alles andere ja nur noch eine weitere Kopie davon.

                                    Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                                    Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                                    1 Reply Last reply
                                    0
                                    • T TT-Tom

                                      @einstein2002

                                      Hast du denn für die Steckdosen schon ein Alias angelegt?
                                      Ohne diesen Schritt kommen wir nicht weiter.
                                      Ich kann dir auch nix anderes zeigen, da ich nicht vor dem Rechner sitze.

                                      Edit: das ist doch schon mal eine Grundlage, mit der wir weiter kommen.

                                      E Offline
                                      E Offline
                                      Einstein2002
                                      wrote on last edited by
                                      #5340

                                      @tt-tom
                                      da muss das doch irgendwo eingesetzt werden.
                                      Und da genau hänge ich fest.
                                      Wo muss ich den Alias einfügen und dazu würde ein Beispiel mir sehr helfen.

                                      Ich hoffe ich konnte mich halbwegs ausdrücken.

                                      // End of Service Pages
                                      
                                      /***********************************************************************
                                       **                                                                   **
                                       **                           Configuration                           **
                                       **                                                                   **
                                       ***********************************************************************/
                                      
                                      export const config: Config = {
                                          // Seiteneinteilung / Page division
                                          // Hauptseiten / Mainpages
                                          pages: [
                                              
                                              NSPanel_Service, //Auto-Alias Service Page
                                              //Unlock_Service            //Auto-Alias Service Page (Service Pages used with cardUnlock)
                                          ],
                                          // Unterseiten / Subpages
                                          subPages: [
                                              NSPanel_Service_SubPage, //Auto-Alias Service Page (only used with cardUnlock)
                                              NSPanel_Infos, //Auto-Alias Service Page
                                              NSPanel_Wifi_Info_1, //Auto-Alias Service Page
                                              NSPanel_Wifi_Info_2, //Auto-Alias Service Page
                                              NSPanel_Sensoren, //Auto-Alias Service Page
                                              NSPanel_Hardware, //Auto-Alias Service Page
                                              NSPanel_IoBroker, //Auot-Alias Service Page
                                              NSPanel_Einstellungen, //Auto-Alias Service Page
                                              NSPanel_Screensaver, //Auto-Alias Service Page
                                              NSPanel_ScreensaverDimmode, //Auto-Alias Service Page
                                              NSPanel_ScreensaverBrightness, //Auto-Alias Service Page
                                              NSPanel_ScreensaverLayout, //Auto-Alias Service Page
                                              NSPanel_ScreensaverWeather, //Auto-Alias Service Page
                                              NSPanel_ScreensaverDateformat, //Auto-Alias Service Page
                                              NSPanel_ScreensaverIndicators, //Auto-Alias Service Page
                                              NSPanel_Relays, //Auto-Alias Service Page
                                              NSPanel_Script, //Auto-Alias Service Page
                                              NSPanel_Firmware, //Auto-Alias Service Page
                                              NSPanel_FirmwareTasmota, //Auto-Alias Service Page
                                              NSPanel_FirmwareBerry, //Auto-Alias Service Page
                                              NSPanel_FirmwareNextion, //Auto-Alias Service Page
                                          ],
                                      
                                          /***********************************************************************
                                           **                                                                   **
                                           **                    Screensaver Configuration                      **
                                           **                                                                   **
                                           ***********************************************************************/
                                          leftScreensaverEntity: [
                                              // Examples for Advanced-Screensaver: https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Config-Screensaver#entity-status-icons-ab-v400 
                                          ],
                                          
                                          bottomScreensaverEntity: [
                                              // bottomScreensaverEntity 1
                                              {
                                                  ScreensaverEntity: 'accuweather.0.Daily.Day1.Sunrise',
                                                  ScreensaverEntityFactor: 1,
                                                  ScreensaverEntityDecimalPlaces: 0,
                                                  ScreensaverEntityDateFormat: {hour: '2-digit', minute: '2-digit'}, // Description at Wiki-Pages
                                                  ScreensaverEntityIconOn: 'weather-sunset-up',
                                                  ScreensaverEntityIconOff: null,
                                                  ScreensaverEntityText: 'Sonne',
                                                  ScreensaverEntityUnitText: '%',
                                                  ScreensaverEntityIconColor: MSYellow //{'val_min': 0, 'val_max': 100}
                                              },
                                              // bottomScreensaverEntity 2
                                              {
                                                  ScreensaverEntity: 'accuweather.0.Current.WindSpeed',
                                                  ScreensaverEntityFactor: (1000 / 3600),
                                                  ScreensaverEntityDecimalPlaces: 1,
                                                  ScreensaverEntityIconOn: 'weather-windy',
                                                  ScreensaverEntityIconOff: null,
                                                  ScreensaverEntityText: "Wind",
                                                  ScreensaverEntityUnitText: 'm/s',
                                                  ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
                                              },
                                              // bottomScreensaverEntity 3
                                              {
                                                  ScreensaverEntity: 'accuweather.0.Current.WindGust',
                                                  ScreensaverEntityFactor: (1000 / 3600),
                                                  ScreensaverEntityDecimalPlaces: 1,
                                                  ScreensaverEntityIconOn: 'weather-tornado',
                                                  ScreensaverEntityIconOff: null,
                                                  ScreensaverEntityText: 'Böen',
                                                  ScreensaverEntityUnitText: 'm/s',
                                                  ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
                                              },
                                              // bottomScreensaverEntity 4
                                              {
                                                  ScreensaverEntity: 'accuweather.0.Current.WindDirectionText',
                                                  ScreensaverEntityFactor: 1,
                                                  ScreensaverEntityDecimalPlaces: 0,
                                                  ScreensaverEntityIconOn: 'windsock',
                                                  ScreensaverEntityIconOff: null,
                                                  ScreensaverEntityText: 'Windr.',
                                                  ScreensaverEntityUnitText: '°',
                                                  ScreensaverEntityIconColor: White
                                              },
                                              // bottomScreensaverEntity 5 (for Alternative and Advanced Screensaver)
                                              {
                                                  ScreensaverEntity: 'accuweather.0.Current.RelativeHumidity',
                                                  ScreensaverEntityFactor: 1,
                                                  ScreensaverEntityDecimalPlaces: 1,
                                                  ScreensaverEntityIconOn: 'water-percent',
                                                  ScreensaverEntityIconOff: null,
                                                  ScreensaverEntityText: 'Feuchte',
                                                  ScreensaverEntityUnitText: '%',
                                                  ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 100, 'val_best': 65}
                                              },
                                              // bottomScreensaverEntity 6 (for Advanced Screensaver)
                                              {
                                                  ScreensaverEntity: NSPanel_Path + 'Relay.1',
                                                  ScreensaverEntityIconOn: 'coach-lamp-variant',
                                                  ScreensaverEntityText: 'Licht',
                                                  ScreensaverEntityOnColor: Yellow,
                                                  ScreensaverEntityOffColor: White,
                                                  ScreensaverEntityOnText: 'Is ON',
                                                  ScreensaverEntityOffText: 'Not ON'
                                              },
                                              // Examples for Advanced-Screensaver: https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Config-Screensaver#entity-status-icons-ab-v400 
                                          ],
                                      
                                          indicatorScreensaverEntity: [
                                              // Examples for Advanced-Screensaver: https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Config-Screensaver#entity-status-icons-ab-v400 
                                          ],
                                      
                                          // Status Icon 
                                          mrIcon1ScreensaverEntity: {
                                              ScreensaverEntity: NSPanel_Path + 'Relay.1',
                                              ScreensaverEntityIconOn: 'lightbulb',
                                              ScreensaverEntityIconOff: null,
                                              ScreensaverEntityValue: null,
                                              ScreensaverEntityValueDecimalPlace: 0,
                                              ScreensaverEntityValueUnit: null,
                                              ScreensaverEntityOnColor: On,
                                              ScreensaverEntityOffColor: HMIOff
                                          },
                                          mrIcon2ScreensaverEntity: {
                                              ScreensaverEntity: NSPanel_Path + 'Relay.2',
                                              ScreensaverEntityIconOn: 'lightbulb',
                                              ScreensaverEntityIconOff: null,
                                              ScreensaverEntityValue: null,
                                              ScreensaverEntityValueDecimalPlace: 0,
                                              ScreensaverEntityValueUnit: null,
                                              ScreensaverEntityOnColor: On,
                                              ScreensaverEntityOffColor: HMIOff
                                          },
                                      // ------ DE: Ende der Screensaver Einstellungen --------------------
                                      // ------ EN: End of screensaver settings ---------------------------
                                      
                                      //-------DE: Anfang Einstellungen für Hardware Button, wenn Sie softwareseitig genutzt werden (Rule2) -------------
                                      //-------EN: Start Settings for Hardware Button, if used in software (Rule2) --------------------------------------
                                          // DE: Konfiguration des linken Schalters des NSPanels
                                          // EN: Configuration of the left switch of the NSPanel
                                          button1: {
                                              // DE: Mögliche Werte wenn Rule2 definiert: 'page', 'toggle', 'set' - Wenn nicht definiert --> mode: null
                                              // EN: Possible values if Rule2 defined: 'page', 'toggle', 'set' - If not defined --> mode: null
                                              mode: null,
                                              // DE: Zielpage - Verwendet wenn mode = page
                                              // EN: Target page - Used if mode = page
                                              page: null,
                                              // DE: Zielentity - Verwendet wenn mode = set oder toggle
                                              // EN: Target entity - Used if mode = set or toggle
                                              entity: null,
                                              // DE: Zielwert - Verwendet wenn mode = set
                                              // EN: Target value - Used if mode = set
                                              setValue: null
                                          },
                                      
                                          // DE: Konfiguration des rechten Schalters des NSPanels
                                          // EN: Configuration of the right switch of the NSPanel
                                          button2: {
                                              mode: null,
                                              page: null,
                                              entity: null,
                                              setValue: null
                                          },
                                      
                                      //--------- DE: Ende - Einstellungen für Hardware Button, wenn Sie softwareseitig genutzt werden (Rule2) -------------
                                      //--------- EN: End - settings for hardware button if they are used in software (Rule2) ------------------------------
                                      
                                      

                                      Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                                      Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                                      1 Reply Last reply
                                      0
                                      • E Einstein2002

                                        @tt-tom
                                        Hallo Tom, habe ich vorhin vergessen, Sorry,

                                        die oder momentan nur den Alias habe ich auch angelegt,
                                        7fccafcb-619c-40c2-85ab-9b26b68902e8-image.png
                                        das funktioniert auch soweit.

                                        T Offline
                                        T Offline
                                        TT-Tom
                                        wrote on last edited by TT-Tom
                                        #5341

                                        @einstein2002
                                        Ich schreibe hier an Handy, bitte etwas Geduld. 😉

                                        darunter kommen deine Seiten.

                                        //-- Anfang für eigene Seiten -- z.T. selbstdefinierte Aliase erforderlich --------------
                                        

                                        Hier mal ein Beispiel wie sie aussehen könnte.

                                        let Dach: PageType =
                                        {
                                            'type': 'cardGrid',
                                            'heading': 'Dach',
                                            'useColor': true,
                                            'items': [
                                                { id: 'alias.0.Haus.Dachgeschoß.UFO_Lampe', name:'Steckdose' , icon: 'power', offColor: MSRed, onColor: MSGreen},
                                            ]
                                        };
                                        

                                        Dann musst du die Seite noch bei den Pages eintrage.

                                        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

                                        E 2 Replies Last reply
                                        0
                                        • T TT-Tom

                                          @einstein2002
                                          Ich schreibe hier an Handy, bitte etwas Geduld. 😉

                                          darunter kommen deine Seiten.

                                          //-- Anfang für eigene Seiten -- z.T. selbstdefinierte Aliase erforderlich --------------
                                          

                                          Hier mal ein Beispiel wie sie aussehen könnte.

                                          let Dach: PageType =
                                          {
                                              'type': 'cardGrid',
                                              'heading': 'Dach',
                                              'useColor': true,
                                              'items': [
                                                  { id: 'alias.0.Haus.Dachgeschoß.UFO_Lampe', name:'Steckdose' , icon: 'power', offColor: MSRed, onColor: MSGreen},
                                              ]
                                          };
                                          

                                          Dann musst du die Seite noch bei den Pages eintrage.

                                          E Offline
                                          E Offline
                                          Einstein2002
                                          wrote on last edited by
                                          #5342

                                          @tt-tom
                                          Alles fein, ich danke Dir für die Hilfe!

                                          Proxmox, VM`s Windows, IoBroker im unprivilegiert LXC, Openmediavault; LXC `s Tasmota, PiHole, , InfluxDB, Motioneye, WireguardVPN, UniFi:
                                          Smarthome...Sonoff, Alexa, Wled, raspberrymatic,...

                                          T 1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          590

                                          Online

                                          32.7k

                                          Users

                                          82.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Home
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe