Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Hardware
    4. SONOFF NSPanel mit Lovelace UI

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    SONOFF NSPanel mit Lovelace UI

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

      @cdn

      Wegen dem RFID Reader:

      Was spricht denn dagegen, über 3D Druck eine Platte zu machen, auf der du das Panel platzierst und daneben/darüber/darunter eine Vorrichtung für einen WEMOS D1 mini mit angeschlossenem RFID Reader. Via Tasmota+MQTT und IoB und Skripte kannst Du alles zusammen laufen lassen. und eine Einstempel-Möglichkeit schaffen.

      Wegen dem Fenster:

      Ich bastele gerade an einem PopupNotify, welches Zeilenweise Text anzeigen kann.
      Du könntest das mit einem Button öffnen und darüber sehen welche Fenster offen sind und zwar nur dann was anzeigen, wenn wirklich ein Fenster offen ist und welches.
      In Kombination mit dem, was @Armilar vorgeschlagen hat auf dem Screensaver zumindest ein Icon was ein offenes Fenster zeigt, wenn es eines gibt, sollte machbar sein.

      Vlt. ist das ja interessant für Dich 🙂

      C 1 Reply Last reply Reply Quote 1
      • Armilar
        Armilar Most Active Forum Testing @Gargano last edited by Armilar

        @gargano

        mach mal einen PR für HMI. Das ist leichter anzunehmen, als selbst neu zu schreiben oder zu erweitern - besonders dann, wenn das Rad bereits erfunden wurde 😊

        Solange die Events nur auf den 5 Indicator-Icons sind, spricht da von meiner Seite nichts gegen. Selbst falls von irgend jemand nicht gewollt, könnten wir das parametrierbar machen und bei Bedarf ein bExit initiieren.

        Zumindest würdet ihr euch die Sonderlocken-Kopiererei bei jedem Script-Update sparen.

        T Gargano 3 Replies Last reply Reply Quote 0
        • T
          ticaki Developer @Armilar last edited by

          @armilar sagte in SONOFF NSPanel mit Lovelace UI:

          @gargano

          Solange die Events nur auf den 5 Indicator-Icons sind, spricht da von meiner Seite nichts gegen. Selbst falls von irgend jemand nicht gewollt, könnten wir das parametrierbar machen und bei Bedarf ein bExit initiieren.

          Das wäre genau das was mir auch gefallen würde, das wäre dann auch bei jedem Screensaver verwendbar.

          1 Reply Last reply Reply Quote 2
          • theknut
            theknut last edited by

            So Leute, ich habs versprochen: Ich präsentiere meine erste Contribution 😄
            https://github.com/joBr99/nspanel-lovelace-ui/pull/1142
            Ich find das mit den yAxisTicks für die ChartPage vollkommen unnötig und kompliziert für Laien (so wie mich :D). Man muss eine Range finden für mögliche Werte und dann pro Signal anpassen. Dabei kann man das problemlos alles berechnen, sie PR.

            Ich habe auch noch das Skript zum Schreiben der Werte für die Signale überarbeitet. Ist jetzt async und wesentlich flexibler. Das kommt dann die Tage mal noch mit einem separaten PR.

            theknut created this issue in joBr99/nspanel-lovelace-ui

            closed feat: calculate yAxisTicks based on given values #1142

            Armilar 1 Reply Last reply Reply Quote 1
            • Gargano
              Gargano @Armilar last edited by Gargano

              @armilar PR kann ich machen ( für HMI und IoBroker)
              Wurde damals mit der Begründung von @joBr99 abgelehnt :
              adding actions to the 5 icons requires adding 5 variables; no way to fit this into the page as it is already packed with way to much elements, there is just not enough memory on the panel

              Ich brauche aber keine Variablen, und es passt auch ins Panel.

              [Edit] PR ist gemacht (https://github.com/joBr99/nspanel-lovelace-ui/pull/1144) (HMI und iobroker), die entsprechenden Stellen sind in nspanel.ts mit 'gargano' gekennzeichnet.

              Mal schauen was passiert.

              SurfGargano created this issue in joBr99/nspanel-lovelace-ui

              closed implement click on indicator function #1144

              Armilar 1 Reply Last reply Reply Quote 0
              • Armilar
                Armilar Most Active Forum Testing @Gargano last edited by

                @gargano

                Dann puste mal die Änderungen hoch ;-).

                Wären zwei referenzierende PR, da das eine für die HMI für alle Systeme gilt und die Änderungen im NSPanelTs.ts nur ioBroker betreffen...

                Gargano 1 Reply Last reply Reply Quote 0
                • Gargano
                  Gargano @Armilar last edited by Gargano

                  @armilar Hab ich schon gepustet 🙂 Ich habs aber in einem gemacht. Ist das schlimm oder soll ich nochmal für HMI extra

                  Armilar 1 Reply Last reply Reply Quote 2
                  • Armilar
                    Armilar Most Active Forum Testing @Gargano last edited by

                    @gargano

                    Nein - nicht schlimm - lasse es so...

                    1 Reply Last reply Reply Quote 0
                    • Armilar
                      Armilar Most Active Forum Testing @theknut last edited by Armilar

                      @theknut

                      Lösung ist doch echt gut... Werde nachher ein noch paar Tests machen...

                      EDIT: ist in die DEV 4.3.3.38 eingeflossen...

                      1 Reply Last reply Reply Quote 1
                      • C
                        cdn @Kuckuckmann last edited by

                        @kuckuckmann
                        Ja würde dann aber bedeuten, dass ich noch eine weitere Hohlwanddose an der Stelle verbauen würde. Sonst sieht das nicht gut aus denke ich. Man könnte hier dann auch einfach einen Federdeckel draufmachen und auf die Rückseite den RFID-Leser kleben. Das Ganze dann via MQTT wäre eine schicke Sache.

                        Das mit dem PopupNotify klingt interessant! Ich würde gerne schon direkt auf dem Screensaver sehen wollen, welches Fenster offen ist. Nur das Fenster offen sind ist dann wieder zu aufwändig. Für zu Hause OK. In der Firma den Mitarbeitern das beizubringen, dass diese erstmal drücken müssen: Keine Chance 😄

                        Gargano K 2 Replies Last reply Reply Quote 0
                        • Gargano
                          Gargano @cdn last edited by Gargano

                          @cdn ungefähr so wie hier mit einem Temperatur/Luftfeuchte Fühler über I²C. Der Fühler steckt in der unteren umgebauten Schalterdose. Den Schalter rausbauen und nur den Träger verwenden.
                          Deckel ist bei dem Foto noch nicht drauf
                          20230219_084525.jpg

                          Hier mit Deckel. Oben und unten sind Schlitze für die Luft.
                          20240119_155845.jpg

                          C 1 Reply Last reply Reply Quote 0
                          • C
                            cdn @Gargano last edited by

                            @gargano Ja dann würde ich einfach eine Blindabdeckung nehmen mit Rahmen. 🙂

                            Gargano 1 Reply Last reply Reply Quote 0
                            • Gargano
                              Gargano @cdn last edited by

                              @cdn Ich hab halt noch alte Schalter rumliegen und ich brauchte für die Luftzirkulation etwas, was aus der Wand hervorsteht.

                              C 1 Reply Last reply Reply Quote 0
                              • C
                                cdn @Gargano last edited by

                                @gargano Ja das macht dann natürlich Sinn.

                                1 Reply Last reply Reply Quote 0
                                • K
                                  Kuckuckmann @cdn last edited by Kuckuckmann

                                  @cdn
                                  Hm und wenn das Popup mit den infos aufgeht, wenn der RFID benutzt wird?
                                  Könnte man bestimmt hin bekommen, dass das Ausstempeln erst geht, wenn alle Fenster zu sind 😄

                                  Ich poste die Tage mal einen Screenshot, wenn ich das Projekt soweit habe.

                                  Da ich ein NSPanel der alten Charge habe, welches nicht in unsere UP-Dosen passt, habe ich es ein stück weit von der Wand abgesetzt. Habe das als Basis benutzt und dann modifiziert:

                                  https://www.thingiverse.com/thing:5256325

                                  WhatsApp Image 2024-01-19 at 21.08.17.jpeg

                                  Damit könnte man was machen 😉

                                  C 1 Reply Last reply Reply Quote 1
                                  • D
                                    docf last edited by

                                    Hallo Zusammen
                                    Ich habe heute von 4.3.3.22 auf 4.3.3.36 upgedatet.
                                    Dabei ist mir aufgefallen, dass beim Sonos Adapter die Type Änderung zu einem Fehler führt
                                    Wenn ich die alte Syntax also let Sonos = <PageMedia> verwende funktioniert alles einwandfrei ?

                                    Was mache ich da denn falsch

                                    let Sonos: PageType =
                                    //let Sonos = <PageMedia>
                                    {
                                        'type': 'cardMedia',
                                        'heading': 'Sonos Wohnzimmer',
                                        'useColor': true,
                                        'items': [<PageItem>{   
                                                    id: AliasPath + 'Sonos.Sonos_Wohnzimmer', 
                                                    adapterPlayerInstance: 'sonos.0.',
                                                    mediaDevice: '192_168_1_103',
                                                    speakerList: ['Wohnzimmer',`Terrasse`],
                                                    playList: [`1`]     
                                                    colorMediaIcon: colorSpotify,
                                                    colorMediaArtist: Yellow,
                                                    colorMediaTitle: Yellow,
                                                    alwaysOnDisplay: true,
                                                    autoCreateALias: true
                                                 }]
                                    };
                                    

                                    Und der Fehler aus dem Protokoll.

                                    9:39:21.248	error	javascript.0 (1526) script.js.NS_Panels.NSPanel43336: TypeScript compilation failed: 'useColor': true, ^ ERROR: Type '{ type: "cardMedia"; heading: string; useColor: boolean; items: NSPanel.PageItem[]; }' is not assignable to type 'PageType'. Object literal may only specify known properties, and ''useColor'' does not exist in type 'PageMedia'.
                                    
                                    

                                    Danke

                                    T 1 Reply Last reply Reply Quote 0
                                    • T
                                      TT-Tom @docf last edited by

                                      @docf
                                      es gibt auf der cardMedia kein useColor mehr. Du brauchst nur

                                      'useColor': true,
                                      

                                      weglassen , dann sollte der Fehler weg sein.

                                      D 1 Reply Last reply Reply Quote 1
                                      • D
                                        docf @TT-Tom last edited by

                                        @tt-tom

                                        Funktioniert leider nicht

                                        javascript.0 (1526) script.js.NS_Panels.NSPanel43336: TypeScript compilation failed: let Sonos: PageType = ^ ERROR: Type '{ type: "cardMedia"; heading: string; items: NSPanel.PageItem[]; }' is not assignable to type 'PageType'. Types of property ''items'' are incompatible. Type 'PageItem[]' is not assignable to type 'PageMediaItem[] & PageItem[]'. Type 'PageItem[]' is not assignable to type 'PageMediaItem[]'. Type 'PageItem' is not assignable to type 'PageMediaItem'. Type 'PageBaseItem' is not assignable to type 'PageMediaItem'. Property 'adapterPlayerInstance' is missing in type 'PageBaseItem' but required in type '{ adapterPlayerInstance: adapterPlayerInstanceType; mediaDevice?: string; colorMediaIcon?: RGB; colorMediaArtist?: RGB; colorMediaTitle?: RGB; ... 5 more ...; crossfade?: boolean; }'.
                                        
                                        T Armilar 2 Replies Last reply Reply Quote 0
                                        • T
                                          TT-Tom @docf last edited by

                                          @docf zeige mal wie die Config jetzt aus sieht

                                          D 1 Reply Last reply Reply Quote 0
                                          • D
                                            docf @TT-Tom last edited by

                                            @tt-tom

                                            Danke fürs helfen bin da nicht so fit ; )

                                            
                                            /******************************* Begin CONFIG Parameter *******************************/
                                            
                                            // DE: liefert bei true detailliertere Meldundgen im Log.
                                            // EN: if true, provides more detailed messages in the log.
                                            let Debug: boolean = false;
                                            
                                            
                                            /***** 1. Tasmota-Config *****/
                                            
                                                // DE: Anpassen an die Verzeichnisse der MQTT-Adapter-Instanz
                                                // EN: Adapt to the MQTT adapter instance directories
                                                const NSPanelReceiveTopic: string = 'mqtt.0.NSPanel_Wohnzimmer.RESULT';
                                                const NSPanelSendTopic: string = 'mqtt.0.NSPanel_Wohnzimmer.cmnd.CustomSend';
                                            
                                                // DE: nur ändern, falls der User im Tasmota vor dem Kompilieren umbenannt wurde (Standard Tasmota: admin)
                                                // EN: only change if the user was renamed in Tasmota before compiling (default Tasmota: admin)
                                                const tasmota_web_admin_user: string = 'admin';
                                                
                                                // DE: setzten, falls "Web Admin Password" in Tasmota vergeben
                                                // EN set if "Web Admin Password" is assigned in Tasmota
                                                const tasmota_web_admin_password: string = '';
                                            
                                                // DE: Setzen der bevorzugten Tasmota32-Version (für Updates)
                                                // EN: Set preferred Tasmota32 version (for updates)
                                                const tasmotaOtaVersion: string = 'asmota32-nspanel.bin';
                                                    // DE: Es können ebenfalls andere Versionen verwendet werden wie zum Beispiel:
                                                    // EN: Other versions can also be used, such as:
                                                    // 'tasmota32-nspanel.bin' or 'tasmota32.bin' or 'tasmota32-DE.bin' or etc.
                                            
                                            
                                            /***** 2. Directories in 0_userdata.0... *****/
                                            
                                                // DE: Anpassen an das jeweilige NSPanel
                                                // EN: Adapt to the respective NSPanel
                                                const NSPanel_Path = '0_userdata.0.NSPanel.1.';
                                            
                                                // DE: Pfad für gemeinsame Nutzung durch mehrere Panels (bei Nutzung der cardAlarm/cardUnlock)
                                                // EN: Path for sharing between multiple panels (when using cardAlarm/cardUnlock)
                                                const NSPanel_Alarm_Path = '0_userdata.0.NSPanel.';
                                            
                                            
                                            /***** 3. Weather adapter Config *****/
                                            
                                                // DE: Mögliche Wetteradapter 'accuweather.0.' oder 'daswetter.0.'
                                                // EN: Possible weather adapters 'accuweather.0.' or 'the weather.0.'
                                                const weatherAdapterInstance: string = 'accuweather.0.';
                                                
                                                // DE: Mögliche Werte: 'Min', 'Max' oder 'MinMax' im Screensaver
                                                // EN: Possible values: 'Min', 'Max' or 'MinMax' in the screensaver
                                                const weatherScreensaverTempMinMax: string = 'MinMax';
                                            
                                                // DE: Dieser Alias wird automatisch für den gewählten Wetter erstellt und kann entsprechend angepasst werden
                                                // EN: This alias is automatically created for the selected weather and can be adjusted accordingly
                                                const weatherEntityPath: string = 'alias.0.Wetter';
                                            
                                            
                                            /***** 4. Color constants for use in the PageItems *****/
                                            
                                                // DE: Bei Bedarf können weitere Farben definiert werden
                                                // EN: If necessary, additional colors can be defined
                                                const HMIOff:           RGB = { red:  68, green: 115, blue: 158 };     // Blue-Off - Original Entity Off
                                                const HMIOn:            RGB = { red:   3, green: 169, blue: 244 };     // Blue-On
                                                const HMIDark:          RGB = { red:  29, green:  29, blue:  29 };     // Original Background Color
                                                const Off:              RGB = { red: 253, green: 128, blue:   0 };     // Orange-Off - nicer color transitions
                                                const On:               RGB = { red: 253, green: 216, blue:  53 };
                                                const MSRed:            RGB = { red: 251, green: 105, blue:  98 };
                                                const MSYellow:         RGB = { red: 255, green: 235, blue: 156 };
                                                const MSGreen:          RGB = { red: 121, green: 222, blue: 121 };
                                                const Red:              RGB = { red: 255, green:   0, blue:   0 };
                                                const White:            RGB = { red: 255, green: 255, blue: 255 };
                                                const Yellow:           RGB = { red: 255, green: 255, blue:   0 };
                                                const Green:            RGB = { red:   0, green: 255, blue:   0 };
                                                const Blue:             RGB = { red:   0, green:   0, blue: 255 };
                                                const DarkBlue:         RGB = { red:   0, green:   0, blue: 136 };
                                                const Gray:             RGB = { red: 136, green: 136, blue: 136 };
                                                const Black:            RGB = { red:   0, green:   0, blue:   0 };
                                                const colorSpotify:     RGB = { red:  30, green: 215, blue:  96 };
                                                const colorAlexa:       RGB = { red:  49, green: 196, blue: 243 };
                                                const colorSonos:       RGB = { red: 216, green: 161, blue:  88 };
                                                const colorRadio:       RGB = { red: 255, green: 127, blue:   0 };
                                                const BatteryFull:      RGB = { red:  96, green: 176, blue:  62 };
                                                const BatteryEmpty:     RGB = { red: 179, green:  45, blue:  25 };
                                            
                                                //Menu Icon Colors
                                                const Menu:             RGB = { red: 150, green: 150, blue: 100 };
                                                const MenuLowInd:       RGB = { red: 255, green: 235, blue: 156 };
                                                const MenuHighInd:      RGB = { red: 251, green: 105, blue:  98 };
                                            
                                                //Dynamische Indikatoren (Abstufung grün nach gelb nach rot)
                                                const colorScale0:      RGB = { red:  99, green: 190, blue: 123 };
                                                const colorScale1:      RGB = { red: 129, green: 199, blue: 126 };
                                                const colorScale2:      RGB = { red: 161, green: 208, blue: 127 };
                                                const colorScale3:      RGB = { red: 129, green: 217, blue: 126 };
                                                const colorScale4:      RGB = { red: 222, green: 226, blue: 131 };
                                                const colorScale5:      RGB = { red: 254, green: 235, blue: 132 };
                                                const colorScale6:      RGB = { red: 255, green: 210, blue: 129 };
                                                const colorScale7:      RGB = { red: 251, green: 185, blue: 124 };
                                                const colorScale8:      RGB = { red: 251, green: 158, blue: 117 };
                                                const colorScale9:      RGB = { red: 248, green: 131, blue: 111 };
                                                const colorScale10:     RGB = { red: 248, green: 105, blue: 107 };
                                            
                                                //Screensaver Default Theme Colors
                                                const scbackground:     RGB = { red:   0, green:   0, blue:   0};
                                                const scbackgroundInd1: RGB = { red: 255, green:   0, blue:   0};
                                                const scbackgroundInd2: RGB = { red: 121, green: 222, blue: 121};
                                                const scbackgroundInd3: RGB = { red: 255, green: 255, blue:   0};
                                                const sctime:           RGB = { red: 255, green: 255, blue: 255};
                                                const sctimeAMPM:       RGB = { red: 255, green: 255, blue: 255};
                                                const scdate:           RGB = { red: 255, green: 255, blue: 255};
                                                const sctMainIcon:      RGB = { red: 255, green: 255, blue: 255};
                                                const sctMainText:      RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast1:     RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast2:     RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast3:     RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast4:     RGB = { red: 255, green: 255, blue: 255};
                                                const sctF1Icon:        RGB = { red: 255, green: 235, blue: 156};
                                                const sctF2Icon:        RGB = { red: 255, green: 235, blue: 156};
                                                const sctF3Icon:        RGB = { red: 255, green: 235, blue: 156};
                                                const sctF4Icon:        RGB = { red: 255, green: 235, blue: 156};
                                                const sctForecast1Val:  RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast2Val:  RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast3Val:  RGB = { red: 255, green: 255, blue: 255};
                                                const sctForecast4Val:  RGB = { red: 255, green: 255, blue: 255};
                                                const scbar:            RGB = { red: 255, green: 255, blue: 255};
                                                const sctMainIconAlt:   RGB = { red: 255, green: 255, blue: 255};
                                                const sctMainTextAlt:   RGB = { red: 255, green: 255, blue: 255};
                                                const sctTimeAdd:       RGB = { red: 255, green: 255, blue: 255};
                                            
                                                //Auto-Weather-Colors
                                                const swClearNight:     RGB = { red: 150, green: 150, blue: 100};
                                                const swCloudy:         RGB = { red:  75, green:  75, blue:  75};
                                                const swExceptional:    RGB = { red: 255, green:  50, blue:  50};
                                                const swFog:            RGB = { red: 150, green: 150, blue: 150};
                                                const swHail:           RGB = { red: 200, green: 200, blue: 200};
                                                const swLightning:      RGB = { red: 200, green: 200, blue:   0};
                                                const swLightningRainy: RGB = { red: 200, green: 200, blue: 150};
                                                const swPartlycloudy:   RGB = { red: 150, green: 150, blue: 150};
                                                const swPouring:        RGB = { red:  50, green:  50, blue: 255};
                                                const swRainy:          RGB = { red: 100, green: 100, blue: 255};
                                                const swSnowy:          RGB = { red: 150, green: 150, blue: 150};
                                                const swSnowyRainy:     RGB = { red: 150, green: 150, blue: 255};
                                                const swSunny:          RGB = { red: 255, green: 255, blue:   0};
                                                const swWindy:          RGB = { red: 150, green: 150, blue: 150};
                                            
                                            
                                            /***** 5. Script - Parameters *****/
                                             
                                                // DE: Für diese Option muss der Haken in setObjects in deiner javascript.X. Instanz gesetzt sein.
                                                // EN: This option requires the check mark in setObjects in your javascript.X. instance must be set.
                                                const autoCreateAlias = true;
                                            
                                                // DE: Verzeichnis für Auto-Aliase (wird per Default aus dem NSPanel-Verzeichnis gebildet und muss nicht verändert werden)
                                                // EN: Directory for auto aliases (is created by default from the NSPanel directory and does not need to be changed)
                                                const AliasPath: string = 'alias.0.' + NSPanel_Path.substring(13, NSPanel_Path.length);
                                            
                                                // DE: Default-Farbe für Off-Zustände
                                                // EN: Default color for off states
                                                const defaultOffColorParam: any = Off;
                                                
                                                // DE: Default-Farbe für On-Zustände
                                                // EN: Default color for on states
                                                const defaultOnColorParam: any = On;
                                            
                                                const defaultColorParam: any = Off;
                                                
                                                // DE: Default-Hintergrundfarbe HMIDark oder Black
                                                // EN: Default background color HMIDark or Black
                                                const defaultBackgroundColorParam: any = HMIDark;
                                            
                                            /******************************** End CONFIG Parameter ********************************/
                                            
                                            //-- Anfang für eigene Seiten -- z.T. selbstdefinierte Aliase erforderlich ----------------
                                            //-- Start for your own pages -- some self-defined aliases required ----------------
                                              
                                                //-- https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Page-%E2%80%90-Typen_How-2_Beispiele
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            /******************************** Seiten Programmierung *************************************************************************************************/
                                            
                                            
                                            // Hauptseite
                                            var Seite1 = <PageGrid>
                                            {
                                                "type": "cardGrid",
                                                "heading": "Erster Test",
                                                "useColor": true,
                                                "subPage": false,
                                                "parent": undefined,
                                                "items": [
                                                    <PageItem>{ id: "alias.0.OG.Büro.OG_Büro_Hauptlicht" , name: "Bürolicht" , interpolateColor:true },
                                                    <PageItem>{ id: "alias.0.NSPanel.AlarmTime" , name: "TestTimer" , interpolateColor:true },
                                                    <PageItem>{ id: "alias.0.NSPanel.Countown" , name: "ContdownTimer" , interpolateColor:true },
                                            
                                            
                                            
                                                ]
                                            };
                                            
                                            //let Sonos: PageType =
                                            let Sonos = <PageMedia>
                                            {
                                                'type': 'cardMedia',
                                                'heading': 'Sonos Wohnzimmer',
                                                 //   'useColor': true,
                                                'items': [<PageItem>{   
                                                            id: AliasPath + 'Sonos.Sonos_Wohnzimmer', 
                                                            adapterPlayerInstance: 'sonos.0.',
                                                            mediaDevice: '192_168_1_103',
                                                            speakerList: ['Wohnzimmer',`Terrasse`],
                                                            playList: [`1`],
                                                                    
                                                            colorMediaIcon: colorSpotify,
                                                            colorMediaArtist: Yellow,
                                                            colorMediaTitle: Yellow,
                                                            alwaysOnDisplay: true,
                                                            autoCreateALias: true
                                                         }]
                                            };
                                             
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            //-- ENDE für eigene Seiten -- z.T. selbstdefinierte Aliase erforderlich -------------------------
                                            //-- END for your own pages -- some self-defined aliases required ------------------------
                                            
                                            
                                            /***********************************************************************************************
                                             **  Service Pages mit Auto-Alias (Nachfolgende Seiten werden mit Alias automatisch angelegt) **
                                             **  https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Service-Men%C3%BC             **
                                             ***********************************************************************************************/
                                            
                                            /* DE: German
                                               Wenn das Service Menü abgesichert werden soll, kann eine cardUnlock vorgeschaltet werden. 
                                               Für diesen Fall ist folgende Vorgehensweise erforderlich:
                                               - cardUnlock Seite "Unlock_Service" in der Config unter pages auskommentieren ("//" entfernen)
                                               - Servicemenü aus pages "NSPanel_Service" unter pages kommentieren ("//" hinzufügen)
                                            */ 
                                            
                                            /*************************************************************************************************
                                              ** Service pages with auto alias (subsequent pages are automatically created with alias)      **
                                              ** https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-Service-Men%C3%BC               **
                                              ************************************************************************************************/
                                            
                                            /* EN: English
                                                If the service menu needs to be secured, a cardUnlock can be installed upstream.
                                                In this case, the following procedure is required:
                                                - comment out cardUnlock page "Unlock_Service" in the config under pages (remove "//")
                                                - Comment service menu from pages "NSPanel_Service" under pages (add "//")
                                            */
                                            
                                            //Level 0 (if service pages are used with cardUnlock)
                                            let Unlock_Service: PageType =
                                            {
                                                'type': 'cardUnlock',
                                                'heading': findLocaleServMenu('service_pages'),
                                                'useColor': true,
                                                'items': [<PageItem>{ id: 'alias.0.NSPanel.Unlock',
                                                                      targetPage: 'NSPanel_Service_SubPage',
                                                                      autoCreateALias: true }
                                                ]
                                            };
                                            
                                            //Level_0 (if service pages are used without cardUnlock)
                                            let NSPanel_Service: PageType =
                                            {
                                                'type': 'cardEntities',
                                                'heading': findLocaleServMenu('service_menu'),
                                                'useColor': true,
                                                'items': [
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Infos', icon: 'information-outline', offColor: Menu, onColor: Menu, name: findLocaleServMenu('infos'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Einstellungen', icon: 'monitor-edit', offColor: Menu, onColor: Menu, name: findLocaleServMenu('settings'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Firmware', icon: 'update', offColor: Menu, onColor: Menu, name: findLocaleServMenu('firmware'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ id: AliasPath + 'Config.rebootNSPanel', name: findLocaleServMenu('reboot') ,icon: 'refresh', offColor: MSRed, onColor: MSGreen, buttonText: findLocaleServMenu('start')},
                                                ]
                                            };
                                            
                                            //Level_0 (if service pages are used with cardUnlock)
                                            let NSPanel_Service_SubPage: PageType =
                                            {
                                                'type': 'cardEntities',
                                                'heading': findLocaleServMenu('service_menu'),
                                                'useColor': true,
                                                'subPage': true,
                                                'parent': Unlock_Service,
                                                'home': 'Unlock_Service', 
                                                'items': [
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Infos', icon: 'information-outline', offColor: Menu, onColor: Menu, name: findLocaleServMenu('infos'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Einstellungen', icon: 'monitor-edit', offColor: Menu, onColor: Menu, name: findLocaleServMenu('settings'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ navigate: true, id: 'NSPanel_Firmware', icon: 'update', offColor: Menu, onColor: Menu, name: findLocaleServMenu('firmware'), buttonText: findLocaleServMenu('more')},
                                                    <PageItem>{ id: AliasPath + 'Config.rebootNSPanel', name: findLocaleServMenu('reboot') ,icon: 'refresh', offColor: MSRed, onColor: MSGreen, buttonText: findLocaleServMenu('start')},
                                                ]
                                            };
                                            
                                                    //Level_1
                                                    let NSPanel_Infos: PageType =
                                                    {
                                                        'type': 'cardEntities',
                                                        'heading': findLocaleServMenu('nspanel_infos'),
                                                        'useColor': true,
                                                        'subPage': true,
                                                        'parent': NSPanel_Service,
                                                        'home': 'NSPanel_Service',        
                                                        'items': [
                                                            <PageItem>{ navigate: true, id: 'NSPanel_Wifi_Info_1', icon: 'wifi', offColor: Menu, onColor: Menu, name: findLocaleServMenu('wifi'), buttonText: findLocaleServMenu('more')},
                                                            <PageItem>{ navigate: true, id: 'NSPanel_Sensoren', icon: 'memory', offColor: Menu, onColor: Menu, name: findLocaleServMenu('sensors_hardware'), buttonText: findLocaleServMenu('more')},
                                                            <PageItem>{ navigate: true, id: 'NSPanel_IoBroker', icon: 'information-outline', offColor: Menu, onColor: Menu, name: findLocaleServMenu('info_iobroker'), buttonText: findLocaleServMenu('more')}
                                                        ]
                                                    };
                                                            //Level_2
                                                            let NSPanel_Wifi_Info_1: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('nspanel_wifi1'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Infos,
                                                                'next': 'NSPanel_Wifi_Info_2',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'ipAddress', name: findLocaleServMenu('ip_address'), icon: 'ip-network-outline', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.BSSId', name: findLocaleServMenu('mac_address'), icon: 'check-network', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.RSSI', name: findLocaleServMenu('rssi'), icon: 'signal', unit: '%', colorScale: {'val_min': 100, 'val_max': 0} },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.Signal', name: findLocaleServMenu('wifi_signal'), icon: 'signal-distance-variant', unit: 'dBm', colorScale: {'val_min': 0, 'val_max': -100} },
                                                                ]
                                                            };
                                            
                                                            let NSPanel_Wifi_Info_2: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('nspanel_wifi2'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'prev': 'NSPanel_Wifi_Info_1',
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.SSId', name: findLocaleServMenu('ssid'), icon: 'signal-distance-variant', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.Mode', name: findLocaleServMenu('mode'), icon: 'signal-distance-variant', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.Channel', name: findLocaleServMenu('channel'), icon: 'timeline-clock-outline', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Wifi.AP', name: findLocaleServMenu('accesspoint'), icon: 'router-wireless-settings', offColor: Menu, onColor: Menu },
                                                                ]
                                                            };
                                            
                                                            let NSPanel_Sensoren: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('sensors1'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Infos,
                                                                'next': 'NSPanel_Hardware',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Sensor.ANALOG.Temperature', name: findLocaleServMenu('room_temperature'), icon: 'home-thermometer-outline', unit: '°C', colorScale: {'val_min': 0, 'val_max': 40, 'val_best': 22 } },
                                                                    <PageItem>{ id: AliasPath + 'Sensor.ESP32.Temperature', name: findLocaleServMenu('esp_temperature'), icon: 'thermometer', unit: '°C', colorScale: {'val_min': 0, 'val_max': 100, 'val_best': 50 } },
                                                                    <PageItem>{ id: AliasPath + 'Sensor.TempUnit', name: findLocaleServMenu('temperature_unit'), icon: 'temperature-celsius', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Sensor.Time', name: findLocaleServMenu('refresh'), icon: 'clock-check-outline', offColor: Menu, onColor: Menu },
                                                                ]
                                                            };
                                            
                                                            let NSPanel_Hardware: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('hardware2'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'prev': 'NSPanel_Sensoren',
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Product', name: findLocaleServMenu('product'), icon: 'devices', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Hardware', name: findLocaleServMenu('esp32_hardware'), icon: 'memory', offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Display.Model', name: findLocaleServMenu('nspanel_version'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Uptime', name: findLocaleServMenu('operating_time'), icon: 'timeline-clock-outline', offColor: Menu, onColor: Menu },
                                                                ]
                                                            };
                                            
                                                            let NSPanel_IoBroker: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('info_iobroker'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Infos,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'IoBroker.ScriptVersion', name: findLocaleServMenu('script_version_nspanelts'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'IoBroker.NodeJSVersion', name: findLocaleServMenu('nodejs_version'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'IoBroker.JavaScriptVersion', name: findLocaleServMenu('instance_javascript'), offColor: Menu, onColor: Menu },
                                                                ]
                                                            };
                                            
                                                    //Level_1
                                                    let NSPanel_Einstellungen: PageType =
                                                        {
                                                            'type': 'cardGrid',
                                                            'heading': findLocaleServMenu('settings'),
                                                            'useColor': true,
                                                            'subPage': true,
                                                            'parent': NSPanel_Service,
                                                            'home': 'NSPanel_Service',
                                                            'items': [
                                                                <PageItem>{ navigate: true, id: 'NSPanel_Screensaver', icon: 'monitor-dashboard',offColor: Menu, onColor: Menu, name: findLocaleServMenu('screensaver'), buttonText: findLocaleServMenu('more')},
                                                                <PageItem>{ navigate: true, id: 'NSPanel_Relays', icon: 'electric-switch', offColor: Menu, onColor: Menu, name: findLocaleServMenu('relays'), buttonText: findLocaleServMenu('more')},
                                                                <PageItem>{ id:AliasPath + 'Config.temperatureUnitNumber', icon: 'gesture-double-tap', name: findLocaleServMenu('temp_unit'), offColor: Menu, onColor: Menu, 
                                                                modeList: ['°C', '°F', 'K']},
                                                                <PageItem>{ id: AliasPath + 'Config.localeNumber', icon: 'select-place', name: findLocaleServMenu('language'), offColor: Menu, onColor: Menu, 
                                                                modeList: ['en-US', 'de-DE', 'nl-NL', 'da-DK', 'es-ES', 'fr-FR', 'it-IT', 'ru-RU', 'nb-NO', 'nn-NO', 'pl-PL', 'pt-PT', 'af-ZA', 'ar-SY', 
                                                                           'bg-BG', 'ca-ES', 'cs-CZ', 'el-GR', 'et-EE', 'fa-IR', 'fi-FI', 'he-IL', 'hr-xx', 'hu-HU', 'hy-AM', 'id-ID', 'is-IS', 'lb-xx', 
                                                                           'lt-LT', 'ro-RO', 'sk-SK', 'sl-SI', 'sv-SE', 'th-TH', 'tr-TR', 'uk-UA', 'vi-VN', 'zh-CN', 'zh-TW']},
                                                               <PageItem>{ navigate: true, id: 'NSPanel_Script', icon: 'code-json',offColor: Menu, onColor: Menu, name: findLocaleServMenu('script'), buttonText: findLocaleServMenu('more')},            
                                                            ]
                                                        };
                                            
                                                            //Level_2
                                                            let NSPanel_Screensaver: PageType =
                                                            {
                                                                'type': 'cardGrid',
                                                                'heading': findLocaleServMenu('screensaver'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Einstellungen,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverDimmode', icon: 'sun-clock', offColor: Menu, onColor: Menu, name: findLocaleServMenu('dimmode')},
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverBrightness', icon: 'brightness-5', offColor: Menu, onColor: Menu, name: findLocaleServMenu('brightness')},
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverLayout', icon: 'page-next-outline', offColor: Menu, onColor: Menu, name: findLocaleServMenu('layout')},
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverWeather', icon: 'weather-partly-rainy', offColor: Menu, onColor: Menu, name: findLocaleServMenu('weather')},
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverDateformat', icon: 'calendar-expand-horizontal', offColor: Menu, onColor: Menu, name: findLocaleServMenu('date_format')},
                                                                    <PageItem>{ navigate: true, id: 'NSPanel_ScreensaverIndicators', icon: 'monitor-edit', offColor: Menu, onColor: Menu, name: findLocaleServMenu('indicators')}
                                                                ]
                                                            };
                                                                        
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverDimmode: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('dimmode'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'Dimmode.brightnessDay', name: findLocaleServMenu('brightness_day'), icon: 'brightness-5', offColor: Menu, onColor: Menu, minValue: 5, maxValue: 10},
                                                                            <PageItem>{ id: AliasPath + 'Dimmode.brightnessNight', name: findLocaleServMenu('brightness_night'), icon: 'brightness-4', offColor: Menu, onColor: Menu, minValue: 0, maxValue: 4},
                                                                            <PageItem>{ id: AliasPath + 'Dimmode.hourDay', name: findLocaleServMenu('hour_day'), icon: 'sun-clock', offColor: Menu, onColor: Menu, minValue: 0, maxValue: 23},
                                                                            <PageItem>{ id: AliasPath + 'Dimmode.hourNight', name: findLocaleServMenu('hour_night'), icon: 'sun-clock-outline', offColor: Menu, onColor: Menu, minValue: 0, maxValue: 23}
                                                                        ]
                                                                    };
                                            
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverBrightness: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('brightness'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'ScreensaverInfo.activeBrightness', name: findLocaleServMenu('brightness_activ'), icon: 'brightness-5', offColor: Menu, onColor: Menu, minValue: 20, maxValue: 100},
                                                                            <PageItem>{ id: AliasPath + 'Config.Screensaver.timeoutScreensaver', name: findLocaleServMenu('screensaver_timeout'), icon: 'clock-end', offColor: Menu, onColor: Menu, minValue: 0, maxValue: 60},
                                                                            <PageItem>{ id: AliasPath + 'Config.Screensaver.screenSaverDoubleClick', name: findLocaleServMenu('wakeup_doublecklick') ,icon: 'gesture-two-double-tap', offColor: HMIOff, onColor: HMIOn}
                                                                        ]
                                                                    };
                                            
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverLayout: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('layout'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'Config.Screensaver.alternativeScreensaverLayout', name: findLocaleServMenu('alternative_layout') ,icon: 'page-previous-outline', offColor: HMIOff, onColor: HMIOn},
                                                                            <PageItem>{ id: AliasPath + 'Config.Screensaver.ScreensaverAdvanced', name: findLocaleServMenu('advanced_layout') ,icon: 'page-next-outline', offColor: HMIOff, onColor: HMIOn},
                                                                        ]
                                                                    };
                                            
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverWeather: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('weather_parameters'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'ScreensaverInfo.weatherForecast', name: findLocaleServMenu('weather_forecast_offon') ,icon: 'weather-sunny-off', offColor: HMIOff, onColor: HMIOn},
                                                                            <PageItem>{ id: AliasPath + 'ScreensaverInfo.weatherForecastTimer', name: findLocaleServMenu('weather_forecast_change_switch') ,icon: 'devices', offColor: HMIOff, onColor: HMIOn},
                                                                            <PageItem>{ id: AliasPath + 'ScreensaverInfo.entityChangeTime', name: findLocaleServMenu('weather_forecast_change_time'), icon: 'cog-sync', offColor: Menu, onColor: Menu, minValue: 15, maxValue: 60},
                                                                            <PageItem>{ id: AliasPath + 'Config.Screensaver.autoWeatherColorScreensaverLayout', name: findLocaleServMenu('weather_forecast_icon_colors') ,icon: 'format-color-fill', offColor: HMIOff, onColor: HMIOn},
                                                                        ]
                                                                    };
                                            
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverDateformat: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('date_format'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'Config.Dateformat.Switch.weekday', name: findLocaleServMenu('weekday_large') ,icon: 'calendar-expand-horizontal', offColor: HMIOff, onColor: HMIOn},
                                                                            <PageItem>{ id: AliasPath + 'Config.Dateformat.Switch.month', name: findLocaleServMenu('month_large') ,icon: 'calendar-expand-horizontal', offColor: HMIOff, onColor: HMIOn},
                                                                        ]
                                                                    };
                                            
                                                                    //Level_3
                                                                    let NSPanel_ScreensaverIndicators: PageType =
                                                                    {
                                                                        'type': 'cardEntities',
                                                                        'heading': findLocaleServMenu('indicators'),
                                                                        'useColor': true,
                                                                        'subPage': true,
                                                                        'parent': NSPanel_Screensaver,
                                                                        'home': 'NSPanel_Service',
                                                                        'items': [
                                                                            <PageItem>{ id: AliasPath + 'Config.MRIcons.alternateMRIconSize.1', name: findLocaleServMenu('mr_icon1_size') ,icon: 'format-size', offColor: HMIOff, onColor: HMIOn},
                                                                            <PageItem>{ id: AliasPath + 'Config.MRIcons.alternateMRIconSize.2', name: findLocaleServMenu('mr_icon2_size') ,icon: 'format-size', offColor: HMIOff, onColor: HMIOn},
                                                                        ]
                                                                    };
                                            
                                                            //Level_2
                                                            let NSPanel_Relays: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('relays'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Einstellungen,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Relay.1', name: findLocaleServMenu('relay1_onoff'), icon: 'power', offColor: HMIOff, onColor: HMIOn},
                                                                    <PageItem>{ id: AliasPath + 'Relay.2', name: findLocaleServMenu('relay2_onoff'), icon: 'power', offColor: HMIOff, onColor: HMIOn},
                                                                ]
                                                            };
                                            
                                                            //Level_2
                                                            let NSPanel_Script: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('script'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Einstellungen,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Config.ScripgtDebugStatus', name: findLocaleServMenu('debugmode_offon') ,icon: 'code-tags-check', offColor: HMIOff, onColor: HMIOn},
                                                                    <PageItem>{ id: AliasPath + 'Config.MQTT.portCheck', name: findLocaleServMenu('port_check_offon') ,icon: 'check-network', offColor: HMIOff, onColor: HMIOn},
                                                                ]
                                                            };
                                            
                                                    //Level_1
                                                    let NSPanel_Firmware: PageType =
                                                        {
                                                            'type': 'cardEntities',
                                                            'heading': findLocaleServMenu('firmware'),
                                                            'useColor': true,
                                                            'subPage': true,
                                                            'parent': NSPanel_Service,
                                                            'home': 'NSPanel_Service',
                                                            'items': [
                                                                <PageItem>{ id: AliasPath + 'autoUpdate', name: findLocaleServMenu('automatically_updates') ,icon: 'power', offColor: HMIOff, onColor: HMIOn},
                                                                <PageItem>{ navigate: true, id: 'NSPanel_FirmwareTasmota', icon: 'usb-flash-drive', offColor: Menu, onColor: Menu, name: findLocaleServMenu('tasmota_firmware'), buttonText: findLocaleServMenu('more')},
                                                                <PageItem>{ navigate: true, id: 'NSPanel_FirmwareBerry', icon: 'usb-flash-drive', offColor: Menu, onColor: Menu, name: findLocaleServMenu('berry_driver'), buttonText: findLocaleServMenu('more')},
                                                                <PageItem>{ navigate: true, id: 'NSPanel_FirmwareNextion', icon: 'cellphone-cog', offColor: Menu, onColor: Menu, name: findLocaleServMenu('nextion_tft_firmware'), buttonText: findLocaleServMenu('more')}
                                                            ]
                                                        };
                                            
                                                            let NSPanel_FirmwareTasmota: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('tasmota'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Firmware,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Tasmota.Version', name: findLocaleServMenu('installed_release'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Tasmota_Firmware.onlineVersion', name: findLocaleServMenu('available_release'), offColor: Menu, onColor: Menu },                        
                                                                    <PageItem>{ id: 'Divider' },
                                                                    <PageItem>{ id: AliasPath + 'Config.Update.UpdateTasmota', name: findLocaleServMenu('update_tasmota') ,icon: 'refresh', offColor: HMIOff, onColor: MSGreen, buttonText: findLocaleServMenu('start')},
                                                                ]
                                                            };
                                            
                                                            let NSPanel_FirmwareBerry: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('berry_driver'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Firmware,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Display.BerryDriver', name: findLocaleServMenu('installed_release'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Berry_Driver.onlineVersion', name: findLocaleServMenu('available_release'), offColor: Menu, onColor: Menu},                        
                                                                    <PageItem>{ id: 'Divider' },
                                                                    <PageItem>{ id: AliasPath + 'Config.Update.UpdateBerry', name: findLocaleServMenu('update_berry_driver') ,icon: 'refresh', offColor: HMIOff, onColor: MSGreen, buttonText: findLocaleServMenu('start')},
                                                                ]
                                                            };
                                            
                                                            let NSPanel_FirmwareNextion: PageType =
                                                            {
                                                                'type': 'cardEntities',
                                                                'heading': findLocaleServMenu('nextion_tft'),
                                                                'useColor': true,
                                                                'subPage': true,
                                                                'parent': NSPanel_Firmware,
                                                                'home': 'NSPanel_Service',
                                                                'items': [
                                                                    <PageItem>{ id: AliasPath + 'Display_Firmware.TFT.currentVersion', name: findLocaleServMenu('installed_release'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Display_Firmware.TFT.desiredVersion', name: findLocaleServMenu('desired_release'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Display.Model', name: findLocaleServMenu('nspanel_model'), offColor: Menu, onColor: Menu },
                                                                    <PageItem>{ id: AliasPath + 'Config.Update.UpdateNextion', name: 'Nextion TFT Update' ,icon: 'refresh', offColor: HMIOff, onColor: MSGreen, buttonText: findLocaleServMenu('start')},
                                                                ]
                                                            };
                                            
                                            // End of Service Pages
                                            
                                            /***********************************************************************
                                             **                                                                   **
                                             **                           Configuration                           **
                                             **                                                                   **
                                             ***********************************************************************/
                                            
                                            export const config: Config = {
                                            
                                            
                                                /******************************** Seiten Programmierung *************************************************************************************************/
                                                // Hauptseiten / Mainpages
                                                pages: [
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                                    Seite1
                                                    Sonos
                                                    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.WindDirection',
                                                            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: 'Street',
                                                         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 Lampe im Screensaver
                                                mrIcon1ScreensaverEntity: 
                                                    { 
                                                        //ScreensaverEntity: NSPanel_Path + 'Relay.1', 
                                                                    ScreensaverEntity:  'mqtt.0.NSPanel_Wohnzimmer.POWER1',
                                                        ScreensaverEntityIconOn: 'lightbulb',
                                                        ScreensaverEntityIconOff: null, 
                                                        ScreensaverEntityValue: null,
                                                        ScreensaverEntityValueDecimalPlace : 0,
                                                        ScreensaverEntityValueUnit: null,
                                                        ScreensaverEntityOnColor: On, 
                                                        ScreensaverEntityOffColor: HMIOff 
                                                    },
                                                mrIcon2ScreensaverEntity: 
                                                    { 
                                                        ScreensaverEntity:  'mqtt.0.NSPanel_Wohnzimmer.POWER2', 
                                                        ScreensaverEntityIconOn: 'lightbulb',
                                                        ScreensaverEntityIconOff: null, 
                                                        ScreensaverEntityValue: null,
                                                        ScreensaverEntityValueDecimalPlace : 0,
                                                        ScreensaverEntityValueUnit: null, 
                                                        ScreensaverEntityOnColor: On, 
                                                        ScreensaverEntityOffColor: HMIOff 
                                                    },
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            
                                            // ------ DE: Ende der Screensaver Einstellungen --------------------
                                            
                                                    
                                            // ------ 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) ------------------------------
                                            
                                            
                                                // DE: WICHTIG !! Parameter nicht ändern  WICHTIG!!
                                                // EN: IMPORTANT !! Do not change parameters IMPORTANT!!
                                                panelRecvTopic: NSPanelReceiveTopic,
                                                panelSendTopic: NSPanelSendTopic,
                                                weatherEntity: weatherEntityPath,
                                                defaultOffColor: defaultOffColorParam,
                                                defaultOnColor: defaultOnColorParam,
                                                defaultColor: defaultColorParam,
                                                defaultBackgroundColor: defaultBackgroundColorParam,
                                            };
                                            
                                            
                                            
                                            T 1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            690
                                            Online

                                            31.7k
                                            Users

                                            79.9k
                                            Topics

                                            1.3m
                                            Posts

                                            lovelace ui nspanel sonoff
                                            265
                                            7277
                                            4994781
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo