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

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Hardware
  4. SONOFF NSPanel mit Lovelace UI

NEWS

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

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

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

SONOFF NSPanel mit Lovelace UI

Geplant Angeheftet Gesperrt Verschoben Hardware
lovelace uinspanelsonoff
7.8k Beiträge 272 Kommentatoren 6.7m Aufrufe 254 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • T TT-Tom

    @marko1974 zeige mal die Einstellungen im Script sprich den oberen Teil.

    Marko1974M Offline
    Marko1974M Offline
    Marko1974
    schrieb am zuletzt editiert von
    #4878

    @tt-tom

    /*
     * @author 2023 @tt-tom
     * 
     * Version 5.1.0
     * 
     * Das Script erstellt die Datenpunkte und Alias für den Abfallkalender im Sonoff NSPanel
     * Es wird der iCal Adapter benötigt und eine URL mit Terminen vom Entsorger bzw. eine .ics-Datei mit den Terminen.
     * Das Script triggert auf dem bereitgestellten JSON im iCal adapter und füllt die 0_userdata.0 Datenpunkte
     * Weitere Informationen findest du in der FAQ auf Github https://github.com/joBr99/nspanel-lovelace-ui/wiki
     * 
     * changelog
     *  - 06.12.2023 - v5.0.2 add custom name for trashtype
     *  - 06.12.2023 - v5.1.0 Refactoring
     * 
     * 
    */
    
    
    const idTrashData: string = 'ical.0.data.table'; // Datenpunkt mit Daten im JSON Format
    const idUserdataAbfallVerzeichnis: string = '0_userdata.0.Abfallkalender'; // Name des Datenpunktverzeichnis unter 0_userdata.0 -> Strandard = 0_userdata.0.Abfallkalender
    const idAliasPanelVerzeichnis: string = 'alias.0.NSPanel.allgemein'; //Name PanelVerzeichnis unter alias.0. Standard = alias.0.NSPanel.1
    const idAliasAbfallVerzeichnis: string = 'Abfall'; //Name Verzeichnis unterhalb der idPanelverzeichnis  Standard = Abfall
    
    const anzahlZeichenLoeschen: number = 0; // x Zeichen links vom String abziehen, wenn vor dem Eventname noch Text steht z.B. Strassenname; Standard = 0
    const jsonEventName1: string = 'Gelbe Tonne, Biotonne, Restmülltonne'; // Vergleichstring für Schwarze Tonne
    const customEventName1: string = 'Ohne Papiertonne';        // benutzerdefinierter Text für schwarze Tonne
    const jsonEventName2: string = 'Gelbe Sack'; // Vergleichstring für Gelbe Tonne / Sack
    const customEventName2: string = '';        // benutzerdefinierter Text für gelbe Tonne
    const jsonEventName3: string = 'Gelbe Tonne, Biotonne, Restmülltonne, Blaue Papiertonne, Restmülltonne 4-wöchentlich';    // Vergleichstring für Blaue Tonne
    const customEventName3: string = 'Mit Papiertonne';       // benutzerdefinierter Text für blaue Tonne
    const jsonEventName4: string = 'Biomüll';   // Vergleichstring für Braune Tonne
    const customEventName4: string = '';        // benutzerdefinierter Text für braune Tonne
    
    
    const Debug: boolean = true;
    
    // ------------------------- Trigger zum füllen der 0_userdata Datenpunkte aus dem json vom ical Adapter -------------------------------
    
    
    T 1 Antwort Letzte Antwort
    0
    • Marko1974M Marko1974

      @tt-tom

      /*
       * @author 2023 @tt-tom
       * 
       * Version 5.1.0
       * 
       * Das Script erstellt die Datenpunkte und Alias für den Abfallkalender im Sonoff NSPanel
       * Es wird der iCal Adapter benötigt und eine URL mit Terminen vom Entsorger bzw. eine .ics-Datei mit den Terminen.
       * Das Script triggert auf dem bereitgestellten JSON im iCal adapter und füllt die 0_userdata.0 Datenpunkte
       * Weitere Informationen findest du in der FAQ auf Github https://github.com/joBr99/nspanel-lovelace-ui/wiki
       * 
       * changelog
       *  - 06.12.2023 - v5.0.2 add custom name for trashtype
       *  - 06.12.2023 - v5.1.0 Refactoring
       * 
       * 
      */
      
      
      const idTrashData: string = 'ical.0.data.table'; // Datenpunkt mit Daten im JSON Format
      const idUserdataAbfallVerzeichnis: string = '0_userdata.0.Abfallkalender'; // Name des Datenpunktverzeichnis unter 0_userdata.0 -> Strandard = 0_userdata.0.Abfallkalender
      const idAliasPanelVerzeichnis: string = 'alias.0.NSPanel.allgemein'; //Name PanelVerzeichnis unter alias.0. Standard = alias.0.NSPanel.1
      const idAliasAbfallVerzeichnis: string = 'Abfall'; //Name Verzeichnis unterhalb der idPanelverzeichnis  Standard = Abfall
      
      const anzahlZeichenLoeschen: number = 0; // x Zeichen links vom String abziehen, wenn vor dem Eventname noch Text steht z.B. Strassenname; Standard = 0
      const jsonEventName1: string = 'Gelbe Tonne, Biotonne, Restmülltonne'; // Vergleichstring für Schwarze Tonne
      const customEventName1: string = 'Ohne Papiertonne';        // benutzerdefinierter Text für schwarze Tonne
      const jsonEventName2: string = 'Gelbe Sack'; // Vergleichstring für Gelbe Tonne / Sack
      const customEventName2: string = '';        // benutzerdefinierter Text für gelbe Tonne
      const jsonEventName3: string = 'Gelbe Tonne, Biotonne, Restmülltonne, Blaue Papiertonne, Restmülltonne 4-wöchentlich';    // Vergleichstring für Blaue Tonne
      const customEventName3: string = 'Mit Papiertonne';       // benutzerdefinierter Text für blaue Tonne
      const jsonEventName4: string = 'Biomüll';   // Vergleichstring für Braune Tonne
      const customEventName4: string = '';        // benutzerdefinierter Text für braune Tonne
      
      
      const Debug: boolean = true;
      
      // ------------------------- Trigger zum füllen der 0_userdata Datenpunkte aus dem json vom ical Adapter -------------------------------
      
      
      T Offline
      T Offline
      TT-Tom
      schrieb am zuletzt editiert von TT-Tom
      #4879

      @marko1974
      du musst die Variable jsonEventNameX anpassen an deine Gegebenheiten / Namen.
      mit cutomEventNameX kannst du einen eigen Namen vergeben, der angezeigt werden soll. Ich habe die Variablen mal angepasst, probiere sie mal. Wenn du noch eine Biotonne hast musst die auch noch anpassen.

      const jsonEventName1: string = 'USB Abfuhr Grau - Restmüll'; // Vergleichstring für Schwarze Tonne
      const customEventName1: string = 'Restmüll';        // benutzerdefinierter Text für schwarze Tonne
      const jsonEventName2: string = 'USB Abfuhr Gelb - kombinierte Wertstofftonne'; // Vergleichstring für Gelbe Tonne / Sack
      const customEventName2: string = 'Gelbe Tonne';        // benutzerdefinierter Text für gelbe Tonne
      const jsonEventName3: string = 'USB Abfuhr Blau - Altpapier';    // Vergleichstring für Blaue Tonne
      const customEventName3: string = 'Papiertonne';       // benutzerdefinierter Text für blaue Tonne
      const jsonEventName4: string = 'Biomüll';   // Vergleichstring für Braune Tonne
      const customEventName4: string = '';        // benutzerdefinierter Text für braune Tonne
      
      

      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

      Marko1974M 1 Antwort Letzte Antwort
      0
      • theknutT Offline
        theknutT Offline
        theknut
        schrieb am zuletzt editiert von
        #4880

        Wie genau funktioniert denn die LChart Karte? Ich habe ein Thermostat und möchte dafür verschiedene Diagramme erstellen, bspw. Temperatur und Luftfeuchte. Das Problem ist schon erstmal, dass er den Alias immer nach .ACTUAL abfragt, also kann ich schon mal nicht HUMIDITY anzeigen, sondern müsste es noch mal in einen separaten Alias packen, wo ich es dann auf ACTUAL legen muss.
        Sei's drum. Ich habe jetzt erstmal mit der Temperatur gestartet und erhalte aber kein Diagramm, was genau mach ich falsch? Ich logge alle Änderungen in meine InfluxDB Instanz, aber ich sehe auch nirgendwo wo das abgefragt wird.

        let diagrammeGaesteZimmerTemperatur : PageType =
        {
            'type': 'cardLChart',
            'heading': 'Gästezimmer',
            'subPage': true,
            'parent': diagramme,
            'home': Object.keys({diagramme})[0], 
            'items': [{ 
                id: 'alias.0.Rooms.Gästezimmer.Heizung',
                yAxis: 'Temperatur [°C]',
                yAxisTicks: [-250, -200, -150, -100,-50, 0, 50, 100, 150, 200, 250, 300],
                onColor: Yellow
             }]
        };
        

        12e6d3f6-c737-4d21-862f-4d27d00f6718-image.png
        Leider konnte ich auch nirgendwo eine Dokumentation dazu finden. Kann mir das jemand erklären? Ich könnte dann die Doku dazu schreiben.

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

        T 1 Antwort Letzte Antwort
        0
        • T TT-Tom

          @marko1974
          du musst die Variable jsonEventNameX anpassen an deine Gegebenheiten / Namen.
          mit cutomEventNameX kannst du einen eigen Namen vergeben, der angezeigt werden soll. Ich habe die Variablen mal angepasst, probiere sie mal. Wenn du noch eine Biotonne hast musst die auch noch anpassen.

          const jsonEventName1: string = 'USB Abfuhr Grau - Restmüll'; // Vergleichstring für Schwarze Tonne
          const customEventName1: string = 'Restmüll';        // benutzerdefinierter Text für schwarze Tonne
          const jsonEventName2: string = 'USB Abfuhr Gelb - kombinierte Wertstofftonne'; // Vergleichstring für Gelbe Tonne / Sack
          const customEventName2: string = 'Gelbe Tonne';        // benutzerdefinierter Text für gelbe Tonne
          const jsonEventName3: string = 'USB Abfuhr Blau - Altpapier';    // Vergleichstring für Blaue Tonne
          const customEventName3: string = 'Papiertonne';       // benutzerdefinierter Text für blaue Tonne
          const jsonEventName4: string = 'Biomüll';   // Vergleichstring für Braune Tonne
          const customEventName4: string = '';        // benutzerdefinierter Text für braune Tonne
          
          
          Marko1974M Offline
          Marko1974M Offline
          Marko1974
          schrieb am zuletzt editiert von
          #4881

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

          const jsonEventName1: string = 'USB Abfuhr Grau - Restmüll'; // Vergleichstring für Schwarze Tonne
          const customEventName1: string = 'Restmüll'; // benutzerdefinierter Text für schwarze Tonne
          const jsonEventName2: string = 'USB Abfuhr Gelb - kombinierte Wertstofftonne'; // Vergleichstring für Gelbe Tonne / Sack
          const customEventName2: string = 'Gelbe Tonne'; // benutzerdefinierter Text für gelbe Tonne
          const jsonEventName3: string = 'USB Abfuhr Blau - Altpapier'; // Vergleichstring für Blaue Tonne
          const customEventName3: string = 'Papiertonne'; // benutzerdefinierter Text für blaue Tonne
          const jsonEventName4: string = 'Biomüll'; // Vergleichstring für Braune Tonne
          const customEventName4: string = ''; // benutzerdefinierter Text für braune Tonne

          Du bist ein Goldstück!!! Vielen Dank!

          abfall12.png

          1 Antwort Letzte Antwort
          0
          • T Offline
            T Offline
            TT-Tom
            schrieb am zuletzt editiert von
            #4882

            @marko1974 na dann weiter viel Spass mit dem Panel 😊

            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

            Marko1974M 1 Antwort Letzte Antwort
            0
            • theknutT theknut

              Wie genau funktioniert denn die LChart Karte? Ich habe ein Thermostat und möchte dafür verschiedene Diagramme erstellen, bspw. Temperatur und Luftfeuchte. Das Problem ist schon erstmal, dass er den Alias immer nach .ACTUAL abfragt, also kann ich schon mal nicht HUMIDITY anzeigen, sondern müsste es noch mal in einen separaten Alias packen, wo ich es dann auf ACTUAL legen muss.
              Sei's drum. Ich habe jetzt erstmal mit der Temperatur gestartet und erhalte aber kein Diagramm, was genau mach ich falsch? Ich logge alle Änderungen in meine InfluxDB Instanz, aber ich sehe auch nirgendwo wo das abgefragt wird.

              let diagrammeGaesteZimmerTemperatur : PageType =
              {
                  'type': 'cardLChart',
                  'heading': 'Gästezimmer',
                  'subPage': true,
                  'parent': diagramme,
                  'home': Object.keys({diagramme})[0], 
                  'items': [{ 
                      id: 'alias.0.Rooms.Gästezimmer.Heizung',
                      yAxis: 'Temperatur [°C]',
                      yAxisTicks: [-250, -200, -150, -100,-50, 0, 50, 100, 150, 200, 250, 300],
                      onColor: Yellow
                   }]
              };
              

              12e6d3f6-c737-4d21-862f-4d27d00f6718-image.png
              Leider konnte ich auch nirgendwo eine Dokumentation dazu finden. Kann mir das jemand erklären? Ich könnte dann die Doku dazu schreiben.

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

              @theknut

              hier ist eine Beschreibung inkl. Script für Influx2

              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

              theknutT 1 Antwort Letzte Antwort
              1
              • T TT-Tom

                @marko1974 na dann weiter viel Spass mit dem Panel 😊

                Marko1974M Offline
                Marko1974M Offline
                Marko1974
                schrieb am zuletzt editiert von
                #4884

                @tt-tom Im Moment ist es kaputt 🙂 Meine Mutter hat sich gefönt und die Sicherung ist rausgeflogen. Warum auch immer. Nach dem Einschalten war es tot.

                In 2. Instanz muss ich mal den Page Aufbau hinbekommen. Habe da im Moment nur Heizungen und Fenster drin.

                Hätte gern ein grid mit 6 Buttons überschrift Heizungen -> / Wohnzimmer / bad / flur ..... etc als Button und dann soll der auf die Unterpages Thermostate.
                Da bin ich dann irgendwie gescheitert.

                Ihr habt das hier immer so schön als Video mit dem Mauszeiger auf dem Panel. Kann man das emulieren, wenn es physisch nicht vorhanden ist?

                theknutT T 2 Antworten Letzte Antwort
                0
                • T TT-Tom

                  @theknut

                  hier ist eine Beschreibung inkl. Script für Influx2

                  theknutT Offline
                  theknutT Offline
                  theknut
                  schrieb am zuletzt editiert von
                  #4885

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

                  @theknut

                  hier ist eine Beschreibung inkl. Script für Influx2

                  Oha, da muss man ja doch noch einiges drum herum machen. Ich bin davon ausgegangen, dass er über den Alias schaut, ob es ein Custom Setting dafür gibt und wenn ja, dann liest er das aus dem Adapter aus (bspw. Influx). Aber gut, dann werd ich mich da morgen mal dran machen. Danke dir!

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

                  1 Antwort Letzte Antwort
                  0
                  • F Offline
                    F Offline
                    Frosti
                    schrieb am zuletzt editiert von Frosti
                    #4886

                    Hey, ich hoffe, ich bin hier richtig - ich habe eine CardUnlock als SubPage (als Schutz vor dem versehentlichen Ausschalten einer Steckdosenleiste). Diese hat bisher immer super funktioniert, nur irgendwann, aus dem Nichts heraus, verschwand der Button "Entriegeln" ca. eine halbe Sekunde nachdem man auf die Unlock-Seite (zum Code eingeben), wechselt.

                    Habe nun heute alles geupdatet (System sowie Skript), aber es hat nicht geholfen.

                    So sieht es im Skript hinsichtlich der MainPage und der UnlockPage aus.

                    let Buero_Seite_1 : PageType =
                    {
                        'type': 'cardEntities',
                        'heading': 'Büro',
                        'useColor': true,
                        'next': 'Haus_Seite_1',
                        'items': [
                            //<PageItem>{ id: 'alias.0.NSPanel.Makerspace.Büro.Steckdosenleiste_Schreibtisch', name: 'Schreibtisch', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
                            { id: 'alias.0.NSPanel.Makerspace.Büro.Schreibtischlampe', name: 'Ultra coole Lampe', interpolateColor: true},
                            { id: 'alias.0.NSPanel.Makerspace.Werkstatt.Wall_Light_Werkstatt', name: 'Wall Light', interpolateColor: true},
                            { navigate: true, id: 'alias.0.NSPanel.General.Unlock' , targetPage: 'Unlock_Steckdosenleiste_Schreibtisch', name: 'Steckdosenleiste', buttonText: 'weiter...'},
                            //<PageItem>{ id: 'alias.0.NSPanel_1.Deckenbeleuchtung', interpolateColor: true},
                            //<PageItem>{ 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},
                            //<PageItem>{ id: 'alias.0.NSPanel_1.Luftreiniger', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen}
                        ]
                    };
                    
                                    //Level 1
                                    let Unlock_Steckdosenleiste_Schreibtisch: PageType   =
                                    {
                                        'type': 'cardUnlock',
                                        'heading': 'Steckdosenleiste',
                                        'useColor': true,
                                        'subPage': true,
                                        'parent': Buero_Seite_1,
                                        'items': [{ id: 'alias.0.NSPanel.General.Unlock', targetPage: 'Steckdosenleiste_Schreibtisch_Seite',  autoCreateALias: true }
                                        ]
                                    };
                    

                    Weiß jemand von euch weiter?

                    Liebe Grüße und vielen Dank!

                    1 Antwort Letzte Antwort
                    0
                    • Marko1974M Marko1974

                      @tt-tom Im Moment ist es kaputt 🙂 Meine Mutter hat sich gefönt und die Sicherung ist rausgeflogen. Warum auch immer. Nach dem Einschalten war es tot.

                      In 2. Instanz muss ich mal den Page Aufbau hinbekommen. Habe da im Moment nur Heizungen und Fenster drin.

                      Hätte gern ein grid mit 6 Buttons überschrift Heizungen -> / Wohnzimmer / bad / flur ..... etc als Button und dann soll der auf die Unterpages Thermostate.
                      Da bin ich dann irgendwie gescheitert.

                      Ihr habt das hier immer so schön als Video mit dem Mauszeiger auf dem Panel. Kann man das emulieren, wenn es physisch nicht vorhanden ist?

                      theknutT Offline
                      theknutT Offline
                      theknut
                      schrieb am zuletzt editiert von
                      #4887

                      @marko1974
                      Emulator: https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Nextion-Editor

                      Das mit der Struktur fand ich sehr verwirrend, ich zeig dir mal wie ich es gemacht habe, der Variablenname ist entscheidend, das war mir unklar.

                      let menuPage: PageType = 
                      {
                          'type': 'cardGrid',
                          'heading': 'Menü',
                          'useColor': false,
                          'items': []
                      };
                      let menuPage2: PageType = 
                      {
                          'type': 'cardGrid',
                          'heading': 'Menü', 
                          'useColor': false,   
                          'items': []
                      };
                      
                      ...
                      
                      // das kommt auf die erste Page
                      
                      // Wohnzimmer
                      let wohnzimmerLicht : PageType =
                      {
                          'type': 'cardGrid',
                          'heading': 'Licht',
                          'useColor': true,
                          'subPage': true,
                          'parent': menuPage,
                          'home': Object.keys({menuPage})[0], 
                          'items': [
                              { id: 'alias.0.Rooms.Wohnzimmer.HueGradientLightStrips', icon: "led-strip-variant", offColor: White, onColor: White, name: 'Lightstrips'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Stehlampe', icon: "lightbulb-outline", offColor: White, onColor: White, name: 'Stehlampe'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Stern', icon: "star-outline", offColor: White, onColor: White, name: 'Stern'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Lichterketten', icon: "lightbulb-outline", offColor: White, onColor: White, name: 'Lichterketten'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Kinomodus', icon: "projector", offColor: White, onColor: White, name: 'Kino'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Lichter_Aus', icon: "lightbulb-group-off-outline", offColor: White, onColor: White, name: 'Alle aus'}
                          ]
                      };
                      
                      let wohnzimmerRollo : PageType =
                      {
                          'type': 'cardEntities',
                          'heading': 'Rollo',
                          'useColor': true,
                          'subPage': true,
                          'parent': menuPage,
                          'home': Object.keys({menuPage})[0], 
                          'items': [
                              { id: 'alias.0.Rooms.Wohnzimmer.Fenster.Wohnen.Rollo', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Raffstore Wohnen'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Fenster.Arbeiten.Rollo', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Raffstore Arbeiten'},
                              { id: 'alias.0.Rooms.Wohnzimmer.Leinwand', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Leinwand'}
                          ]
                      };
                      
                      ....
                      
                      // das kommt auf die zweite Page
                      let technikraum : PageType =
                      {
                          'type': 'cardEntities',
                          'heading': 'Technik',
                          'useColor': true,
                          'subPage': true,
                          'parent': menuPage2,
                          'home': Object.keys({menuPage2})[0], 
                          'items': [
                              ...
                          ]
                      };
                      
                      ...
                      
                      // am Ende die Items hinzufügen
                      
                      
                      menuPage.items = [
                          <PageItem> { navigate: true, id: null, targetPage: Object.keys({wohnzimmerLicht})[0], name: 'Lichter', icon: 'lightbulb-outline', onColor: White, offColor: White },
                          <PageItem> { navigate: true, id: null, targetPage: Object.keys({wohnzimmerRollo})[0], name: 'Rolläden', icon: 'blinds-horizontal', onColor: White, offColor: White },
                      ...
                      ]
                      menuPage2.items = [
                          <PageItem> { navigate: true, id: null, targetPage: Object.keys({technikraum})[0], name: 'Technik', icon: 'meter-electric-outline', onColor: White, offColor: White },
                      ...
                      ]
                      
                      // und dann noch in der Struktur hinzufügen
                      
                      export const config: Config = {
                          // Seiteneinteilung / Page division
                          // Hauptseiten / Mainpages
                          pages: [
                              menuPage,
                              menuPage2
                          ],
                          // Unterseiten / Subpages
                          subPages: [	    
                              wohnzimmerLicht,
                              wohnzimmerRollo,
                              technikraum,
                              ...
                      

                      Btw, ich hab mich hier auch mit viel Hilfe eingefuchst, die Entwickler sind sehr hilfsbereit. Ich würde empfehlen mal was per Paypal zu schicken *hust

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

                      T 1 Antwort Letzte Antwort
                      0
                      • ArmilarA Offline
                        ArmilarA Offline
                        Armilar
                        Most Active Forum Testing
                        schrieb am zuletzt editiert von Armilar
                        #4888

                        @theknut

                        Die vollständige Beschreibung der cardLChart mit Skripten:

                        https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Card-Definitionen-(Seiten)#cardlchart-line-charts-ab-ts-script-v390

                        Oh ha - da hing aber mein Browser 😁

                        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 Antwort Letzte Antwort
                        1
                        • Marko1974M Marko1974

                          @tt-tom Im Moment ist es kaputt 🙂 Meine Mutter hat sich gefönt und die Sicherung ist rausgeflogen. Warum auch immer. Nach dem Einschalten war es tot.

                          In 2. Instanz muss ich mal den Page Aufbau hinbekommen. Habe da im Moment nur Heizungen und Fenster drin.

                          Hätte gern ein grid mit 6 Buttons überschrift Heizungen -> / Wohnzimmer / bad / flur ..... etc als Button und dann soll der auf die Unterpages Thermostate.
                          Da bin ich dann irgendwie gescheitert.

                          Ihr habt das hier immer so schön als Video mit dem Mauszeiger auf dem Panel. Kann man das emulieren, wenn es physisch nicht vorhanden ist?

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

                          @marko1974

                          Dafür musst du dir im Wiki das Thema Navigation anschauen. Dort sind Möglichkeiten beschrieben, wie man mit einem Button zur nächsten Seite kommt.

                          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
                          1
                          • theknutT theknut

                            @marko1974
                            Emulator: https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Nextion-Editor

                            Das mit der Struktur fand ich sehr verwirrend, ich zeig dir mal wie ich es gemacht habe, der Variablenname ist entscheidend, das war mir unklar.

                            let menuPage: PageType = 
                            {
                                'type': 'cardGrid',
                                'heading': 'Menü',
                                'useColor': false,
                                'items': []
                            };
                            let menuPage2: PageType = 
                            {
                                'type': 'cardGrid',
                                'heading': 'Menü', 
                                'useColor': false,   
                                'items': []
                            };
                            
                            ...
                            
                            // das kommt auf die erste Page
                            
                            // Wohnzimmer
                            let wohnzimmerLicht : PageType =
                            {
                                'type': 'cardGrid',
                                'heading': 'Licht',
                                'useColor': true,
                                'subPage': true,
                                'parent': menuPage,
                                'home': Object.keys({menuPage})[0], 
                                'items': [
                                    { id: 'alias.0.Rooms.Wohnzimmer.HueGradientLightStrips', icon: "led-strip-variant", offColor: White, onColor: White, name: 'Lightstrips'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Stehlampe', icon: "lightbulb-outline", offColor: White, onColor: White, name: 'Stehlampe'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Stern', icon: "star-outline", offColor: White, onColor: White, name: 'Stern'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Lichterketten', icon: "lightbulb-outline", offColor: White, onColor: White, name: 'Lichterketten'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Kinomodus', icon: "projector", offColor: White, onColor: White, name: 'Kino'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Lichter_Aus', icon: "lightbulb-group-off-outline", offColor: White, onColor: White, name: 'Alle aus'}
                                ]
                            };
                            
                            let wohnzimmerRollo : PageType =
                            {
                                'type': 'cardEntities',
                                'heading': 'Rollo',
                                'useColor': true,
                                'subPage': true,
                                'parent': menuPage,
                                'home': Object.keys({menuPage})[0], 
                                'items': [
                                    { id: 'alias.0.Rooms.Wohnzimmer.Fenster.Wohnen.Rollo', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Raffstore Wohnen'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Fenster.Arbeiten.Rollo', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Raffstore Arbeiten'},
                                    { id: 'alias.0.Rooms.Wohnzimmer.Leinwand', icon: "blinds-horizontal", offColor: White, onColor: White, name: 'Leinwand'}
                                ]
                            };
                            
                            ....
                            
                            // das kommt auf die zweite Page
                            let technikraum : PageType =
                            {
                                'type': 'cardEntities',
                                'heading': 'Technik',
                                'useColor': true,
                                'subPage': true,
                                'parent': menuPage2,
                                'home': Object.keys({menuPage2})[0], 
                                'items': [
                                    ...
                                ]
                            };
                            
                            ...
                            
                            // am Ende die Items hinzufügen
                            
                            
                            menuPage.items = [
                                <PageItem> { navigate: true, id: null, targetPage: Object.keys({wohnzimmerLicht})[0], name: 'Lichter', icon: 'lightbulb-outline', onColor: White, offColor: White },
                                <PageItem> { navigate: true, id: null, targetPage: Object.keys({wohnzimmerRollo})[0], name: 'Rolläden', icon: 'blinds-horizontal', onColor: White, offColor: White },
                            ...
                            ]
                            menuPage2.items = [
                                <PageItem> { navigate: true, id: null, targetPage: Object.keys({technikraum})[0], name: 'Technik', icon: 'meter-electric-outline', onColor: White, offColor: White },
                            ...
                            ]
                            
                            // und dann noch in der Struktur hinzufügen
                            
                            export const config: Config = {
                                // Seiteneinteilung / Page division
                                // Hauptseiten / Mainpages
                                pages: [
                                    menuPage,
                                    menuPage2
                                ],
                                // Unterseiten / Subpages
                                subPages: [	    
                                    wohnzimmerLicht,
                                    wohnzimmerRollo,
                                    technikraum,
                                    ...
                            

                            Btw, ich hab mich hier auch mit viel Hilfe eingefuchst, die Entwickler sind sehr hilfsbereit. Ich würde empfehlen mal was per Paypal zu schicken *hust

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

                            @theknut kann man so machen, ist aber nicht Standard. Siehe Wiki Navigation.

                            Warum schreibst du die PageItem separat, welchen Vorteil hat dies?

                            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

                            theknutT 1 Antwort Letzte Antwort
                            0
                            • T TT-Tom

                              @theknut kann man so machen, ist aber nicht Standard. Siehe Wiki Navigation.

                              Warum schreibst du die PageItem separat, welchen Vorteil hat dies?

                              theknutT Offline
                              theknutT Offline
                              theknut
                              schrieb am zuletzt editiert von theknut
                              #4891

                              @tt-tom das hat den Vorteil, dass ich den String für home nicht mehr händisch tippen muss, sondern 'home': Object.keys({menuPage})[0] machen kann. Heißt, falls ich mal den Variablennamen für menuPage ändere, dann bekomme ich einen Kompilierfehler und merke es sofort. Andernfalls würde er es erstmal schlucken und die Navigation geht dann einfach nicht mehr. Daher muss ich die Deklaration der Variable und das Hinzufügen der Items trennen.
                              Muss man nicht so machen, aber beugt eben Fehler vor, die bisschen hässlich zu finden sind.

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

                              C 1 Antwort Letzte Antwort
                              2
                              • theknutT theknut

                                @tt-tom das hat den Vorteil, dass ich den String für home nicht mehr händisch tippen muss, sondern 'home': Object.keys({menuPage})[0] machen kann. Heißt, falls ich mal den Variablennamen für menuPage ändere, dann bekomme ich einen Kompilierfehler und merke es sofort. Andernfalls würde er es erstmal schlucken und die Navigation geht dann einfach nicht mehr. Daher muss ich die Deklaration der Variable und das Hinzufügen der Items trennen.
                                Muss man nicht so machen, aber beugt eben Fehler vor, die bisschen hässlich zu finden sind.

                                C Offline
                                C Offline
                                cdn
                                schrieb am zuletzt editiert von
                                #4892

                                Gibt es eigentlich ein best practice zum Updaten der nspanelts.ts? Stand jetzt kopiere ich per Hand immer alle meine Änderungen herein. Ist bei einigen TSPanels schon echt aufwändig.

                                T ArmilarA 2 Antworten Letzte Antwort
                                0
                                • C cdn

                                  Gibt es eigentlich ein best practice zum Updaten der nspanelts.ts? Stand jetzt kopiere ich per Hand immer alle meine Änderungen herein. Ist bei einigen TSPanels schon echt aufwändig.

                                  T Nicht stören
                                  T Nicht stören
                                  ticaki
                                  schrieb am zuletzt editiert von
                                  #4893

                                  @cdn
                                  suche im Skript nach no moremarkiere alles ab da, kopieren, im eigenen Skript ebenfalls suchen, markieren und alles ersetzten.

                                  Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                                  Spenden

                                  C 1 Antwort Letzte Antwort
                                  0
                                  • T ticaki

                                    @cdn
                                    suche im Skript nach no moremarkiere alles ab da, kopieren, im eigenen Skript ebenfalls suchen, markieren und alles ersetzten.

                                    C Offline
                                    C Offline
                                    cdn
                                    schrieb am zuletzt editiert von cdn
                                    #4894

                                    @ticaki
                                    Hmm aber in dem Bereich bis no more hat sich in den letzten Versionen schon was getan.

                                    EDIT: OK, sind nur Kommentare

                                    T 1 Antwort Letzte Antwort
                                    0
                                    • C cdn

                                      @ticaki
                                      Hmm aber in dem Bereich bis no more hat sich in den letzten Versionen schon was getan.

                                      EDIT: OK, sind nur Kommentare

                                      T Nicht stören
                                      T Nicht stören
                                      ticaki
                                      schrieb am zuletzt editiert von ticaki
                                      #4895

                                      @cdn

                                      Das hatte ich verbrochen und sollte nicht nochmal passieren und es war optional 🙂

                                      EDIT: changelog fehlt dann

                                      Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                                      Spenden

                                      C T 2 Antworten Letzte Antwort
                                      1
                                      • T ticaki

                                        @cdn

                                        Das hatte ich verbrochen und sollte nicht nochmal passieren und es war optional 🙂

                                        EDIT: changelog fehlt dann

                                        C Offline
                                        C Offline
                                        cdn
                                        schrieb am zuletzt editiert von
                                        #4896

                                        @ticaki Passt so, danke 🙂

                                        1 Antwort Letzte Antwort
                                        0
                                        • T ticaki

                                          @cdn

                                          Das hatte ich verbrochen und sollte nicht nochmal passieren und es war optional 🙂

                                          EDIT: changelog fehlt dann

                                          T Nicht stören
                                          T Nicht stören
                                          ticaki
                                          schrieb am zuletzt editiert von ticaki
                                          #4897

                                          @ticaki sagte in SONOFF NSPanel mit Lovelace UI:

                                          Das hatte ich verbrochen und sollte nicht nochmal passieren und es war optional 🙂

                                          Die Aussage ziehe ich zu 50% wieder zurück, beim kommenden Update werden PageItems gezählt und zuviele oder zuwenige werden angemeckert.

                                          Wir ändern nix, aber wenn ihr euch nicht an die überschaubare Wiki gehalten habt, müsst ihr was ändern. 🙂

                                          Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                                          Spenden

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


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          745

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

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

                                          • Du hast noch kein Konto? Registrieren

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