Betatest NSPanel-lovelace-ui v0.7.x

ticaki

Aktuelle Test Version	0.7.x
Veröffentlichungsdatum	26.10.2025
Github Link	https://github.com/ticaki/ioBroker.nspanel-lovelace-ui

Installation über benutzerdefiniert und dort diese Zeichenkette rein kopieren: iobroker.nspanel-lovelace-ui@latest
Dann installieren drücken.

Der Adapter ist schon dicht an dem wo wir hinwollen, Nutzung ist erwünscht.

Hier findet ihr die aktuell gültige Alias Tabelle für diesen Adapter.

Anleitung wie man ein NSPanel im Adapter einrichtet findet ihr hier: https://forum.iobroker.net/post/1258258 (16.03.2025)

Dokumentation findet man hier GitHub Wiki

Danke für jedes Feedback von @Armilar, @TT-Tom und mir.

Max_yeah · 26.10.2025

@ticaki eine kleine Erklärung um was es geht wäre gut oder stehe ich auf dem Schlauch? Was ist der Unterschied zur anderen Firmware?

ticaki

@max_yeah
Die Firmware ist sowohl im Skript als auch im Adapter die selbe - beides kann eher als Steuersoftware betrachtet werden. Der Adapter wurde ursprünglich angegangen, weil

das Updaten vom Skript immer ein riesen Akt ist.
es mit dem Adapter möglich ist tiefergreifende Befehle zu benutzen
eine bessere Konfiguration möglich ist (woran wir aber bisher gescheitert sind)
das Skript mal eine Refrakturierung vertragen könnte.
komplexere Dinge möglich sind.

Für den Nutzer gib es wenn das aktuelle vorhaben abgeschlossen ist den Vorteil das er:

Hilfe bei dem Erstellen der Aliase erhält. Falsch erstellte werden angemeckert.
das "Skript" sich per Knopfdruck selbst updated(ist ja dann ein Adapter)
Der Adapter hat seinen eigenen Mqtt-Client und kann einen eigenen Mqtt-Server bereitstellen.(Eine Fehlerquelle weniger und erheblich effizenter)
Es wird leicht zu konfigurierende Vorlagen geben, für die keine Aliase nötig sind.

Wenn wir fertig sind, kann man beschreiben was alles jetzt möglich ist. Zur Zeit haben wir selbst ja nicht mal die Hälfte von dem getestet was möglich sein sollte, deshalb kommt da nicht viel von mir.

Nur mal ein paar Dinge, die in den Tiefen des Adaptercodes möglich sind, keine Ahnung ob das auch zur Verfügung gestellt wird:
Es gibt

in der Navigation einen Doppelklick (also 2 Ziele pro Button)
bei einem button auf einer grid oder entities eine confirm funktion - also 2 mal klicken nötig damit die Aktion ausgeführt wird.
9 verschiedene Art wie aus colorOn, colorOff, colorScale bei einem Zahlenwert die Farbe berechnet wird.
(blau zu rot min: 0 max: 40)
das mehr als 4,6,8 Items auf einer cardGrid/cardEntities verwendet werden können - der Pfeil oben rechts im Bild bedeutet das man runter blättern kann. Ist man ganz unten kann man weiter nach rechts in der Navigation. (Da sollte der Doppelklick auch was machen, aber keine Ahnung, nur eine dunkle Erinnerung an die Möglichkeit vorhanden)
jetzt schon das RGB Lampen im Icon die aktuelle Farbe und CT Lampen die Farbtemperatur visualisieren.

Hoffe das reicht erstmal, muß ja noch alles mehr oder weniger getestet werden.

TT-Tom

@max_yeah

Erstmal sollten wir hier die Begrifflichkeiten klären.

Firmware in dem Sinne gibt es nicht, es sind eher mehrere Pakete die das Panel für seine Funktion benötigt.

Tasmota für den ESP32
Berrydriver als Übersetzer zum Display
TFT / HMI Software (Nextion) für die Darstellung der Seiten

dies liegt alles auf dem Panel im ESP32

NSPanel-Script aktuelle Version 4.5.x
Icon-Mapping Script

beides befindet sich im Javascript Adapter auf dem ioBroker. Zusätzlich wird ein MQTT-Server benötig.

Was soll jetzt der Adapter ersetzen / verbessern:

alle Script und MQTT-Server vereinen
Seitenkonfiguration vom Rest trennen
Erweiterung der Seitenkonfiguration, die mit dem Script nicht Möglich bzw. sehr aufwendig wäre. z.B. scrollen durch cardGrid und cardEntities

Wir stecken zur Zeit sehr viel Energie und Zeit in den Adapter, um das Script irgendwann abzulösen. Werden aktuell auch keine großen Updates von Script mehr bringen. Der Support wird weiterhin dasein und euch voll unterstützen.

ticaki

Oben ergänzt:

EDIT Hab doch noch ein paar wichtige Dinge vergessen zu erwähnen:

Der Adapter verwendet Rule2 und Rule3 auf dem Tasmota - Rule1 könnt ihr für eigene Regeln verwenden.
Bei einem Update des Adapters muß immer das Konfigurationsskript ausgeführt werden - da zur Zeit die hauptsächliche Arbeit in der Konvertierung besteht und diese nur angestoßen wird wenn man das Skript ausführt! Wenn das bei Start des Adapters passieren würde, könnten wir im Skript keine Rückmeldungen ausgeben - bzw. eine nachdem Adapterupdate als fehlerhaft einzustufende Skriptkonfiguration würde den Adapter-Start verhindern

? Offline

@ticaki

Hi, ich habe mal ein Panel vom Script auf den Adapter umgestellt. Leider komm ich da nicht weiter, kannste mir n Tipp geben?
Fehlt oder ist bestimmt noch was falsch..
Anscheinend gibts noch Probleme mit der Communikation zum Adapter vom Panel oder rumgedreht, das Panel zeigt nur den Spinner und wartet auf Content..

Was muss ich im Panel bei mqtt umstellen? der Adapter hat den Port 1881 hierm al ein Screenshot von den Configs:
Screenshot 2025-02-28 at 10.47.40.png Screenshot 2025-02-28 at 10.48.25.png

Das Script sieht so aus (ich hab mal deine Beispiele rausgeworfen)

async function configuration (): Promise<void> {



    

    // Ein Beispiel für eine Gridseite mit verschiedenen Farbskalen
    const irgendeinName: PageType = {
        type: 'cardGrid',
        uniqueName:'main',
        heading: 'Wohnzimmer',
        useColor: true,
        items: [
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.SmartTableLampe', name: 'Tischleuchte', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.Deckenleuchte', name: 'Deckenleuchte', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.TV_Wifilight', name: 'TV Wifilight', minValueBrightness: 0, maxValueBrightness: 100, interpolateColor: true},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.Rolladen', icon: 'window-shutter', name: 'Rolladen', interpolateColor: true},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.Arbeitsmodus', name: 'Arbeitsmodus', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.TFT_Schreibtisch', name: 'TFT Schreibtisch', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
           //  { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.Schloss', name: 'Schloss', icon: 'lock-open', icon2: 'lock',offColor: MSRed, onColor: MSGreen},
             
        ]};
        
    const grid1: PageType = {
        uniqueName: 'grid1', // keine Navigation, am besten uniqueName von config.ts übernehmen
        heading: 'Grid 1',
        items: [
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.SmartTableLampe', name: 'Tischleuchte', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
             { id: 'alias.0.Haus.Obergeschoss.Arbeitszimmer_Bernd.Deckenleuchte', name: 'Deckenleuchte', icon: 'power', icon2: 'power',offColor: MSRed, onColor: MSGreen},
          //  {navigate: true, targetPage:'Wohnzimmer'}, 
            
        ],
        type: 'cardGrid',
        useColor: true
    }

    const config: ScriptConfig.Config = {
        panelTopic: 'NSPanel1/NSPanel1-BB',
        weatherEntity: 'accuweather.0.',
        defaultOffColor: Off,
        defaultOnColor: On,
        defaultColor: Off,
        defaultBackgroundColor: HMIDark,

        // Als Gedankenstütze, die Hauptseite muß main heißen!
        //panelName: 'NSPanel', //unique name for the panel


        // Seiteneinteilung / Page division
        // Hauptseiten / Mainpages
        pages: [
             irgendeinName,
             grid1,
             
            
        ],
        // Unterseiten / Subpages
        subPages: [
        //    fahrplan
        ],

        /***********************************************************************
         **                                                                   **
         **                    Screensaver Configuration                      **
         **                                                                   **
         ***********************************************************************/
        indicatorScreensaverEntity: [
            // indicatorScreensaverEntity 1 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.allgemein.Status_offene_Fenster.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'window-open-variant',
                ScreensaverEntityIconOff: 'window-closed-variant',
                ScreensaverEntityText: 'Fenster',
                ScreensaverEntityUnitText: '%',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 1},
            },
            // indicatorScreensaverEntity 2 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.allgemein.Status_offene_Tuer.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'door-open',
                ScreensaverEntityIconOff: 'door-closed',
                ScreensaverEntityText: 'Tür',
                ScreensaverEntityUnitText: '',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 1},
            },
            // indicatorScreensaverEntity 3 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.allgemein.Status_Licht_An.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'lightbulb',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Licht',
                ScreensaverEntityUnitText: '',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 1},
            },
            // indicatorScreensaverEntity 4 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.Türschloss.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'lock',
                ScreensaverEntityIconOff: 'lock-open',
                ScreensaverEntityText: 'Türschloss',
                ScreensaverEntityUnitText: '',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 1, val_best: 1},
            },
            // indicatorScreensaverEntity 5 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.allgemein.Auto.Safety.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'car-key',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Auto',
                ScreensaverEntityUnitText: '',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 1, val_best: 1},
            },
        ],

        bottomScreensaverEntity: [
            // bottomScreensaverEntity 1
            {
                ScreensaverEntity: 'accuweather.0.Daily.Day1.Sunrise',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityDateFormat: {hour: '2-digit', minute: '2-digit'}, // Description at Wiki-Pages
                ScreensaverEntityIconOn: 'weather-sunset-up',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Sonne',
                ScreensaverEntityUnitText: '%',
                ScreensaverEntityIconColor: MSYellow //{'val_min': 0, 'val_max': 100}
            },
            // bottomScreensaverEntity 2
            {
                ScreensaverEntity: 'accuweather.0.Current.WindSpeed',
                ScreensaverEntityFactor: (1000 / 3600),
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'weather-windy',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: "Wind",
                ScreensaverEntityUnitText: 'm/s',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
            },
            // bottomScreensaverEntity 3
            {
                ScreensaverEntity: 'accuweather.0.Current.WindGust',
                ScreensaverEntityFactor: (1000 / 3600),
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'weather-tornado',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Böen',
                ScreensaverEntityUnitText: 'm/s',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
            },
            // bottomScreensaverEntity 4
            {
                ScreensaverEntity: 'accuweather.0.Current.WindDirectionText',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'windsock',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Windr.',
                ScreensaverEntityUnitText: '°',
                ScreensaverEntityIconColor: White
            },
            // bottomScreensaverEntity 5 (for Alternative and Advanced Screensaver)
            {
                ScreensaverEntity: 'accuweather.0.Current.RelativeHumidity',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'water-percent',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Feuchte',
                ScreensaverEntityUnitText: '%',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 100, 'val_best': 65}
            },
            // bottomScreensaverEntity 6 (for Advanced Screensaver)
            {
                ScreensaverEntity: '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 
        ],

        leftScreensaverEntity: [
            // leftScreensaverEntity 1 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.Flur.Sensor.ANALOG.Temperature.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'thermometer',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Temperatur',
                ScreensaverEntityUnitText: '°C',
                ScreensaverEntityIconColor: {val_min: 0, val_max: 35, val_best: 22},
            },
            // leftScreensaverEntity 2 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.Heizung.WärmeTagesVerbrauch.ACTUAL',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'counter',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Wärme',
                ScreensaverEntityUnitText: ' kWh',
                ScreensaverEntityIconColor: MSYellow, //{'val_min': 0, 'val_max': 5000}
            },
            // leftScreensaverEntity 3 (only Advanced Screensaver)
            {
                ScreensaverEntity: 'alias.0.NSPanel.allgemein.Abfall.event1.INFO',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityDateFormat: {year: 'numeric', month: '2-digit', day: '2-digit'},
                ScreensaverEntityIconOn: 'trash-can',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Abfall',
                ScreensaverEntityUnitText: '',
                ScreensaverEntityIconColor: '0_userdata.0.Abfallkalender.1.color',
            },
        ],

        // Status Icon 
        mrIcon1ScreensaverEntity: {
            ScreensaverEntity: 'Relay.1',
            ScreensaverEntityIconOn: 'lightbulb',
            ScreensaverEntityIconOff: null,
            ScreensaverEntityValue: null,
            ScreensaverEntityValueDecimalPlace: 0,
            ScreensaverEntityValueUnit: null,
            ScreensaverEntityOnColor: On,
            ScreensaverEntityOffColor: HMIOff
        },
        mrIcon2ScreensaverEntity: {
            ScreensaverEntity: 'Relay.2',
            ScreensaverEntityIconOn: 'lightbulb',
            ScreensaverEntityIconOff: null,
            ScreensaverEntityValue: null,
            ScreensaverEntityValueDecimalPlace: 0,
            ScreensaverEntityValueUnit: null,
            ScreensaverEntityOnColor: On,
            ScreensaverEntityOffColor: HMIOff
        },
        // ------ DE: Ende der Screensaver Einstellungen --------------------
        // ------ EN: End of screensaver settings ---------------------------

        //-------DE: Anfang Einstellungen für Hardware Button, wenn Sie softwareseitig genutzt werden (Rule2) -------------
        //-------EN: Start Settings for Hardware Button, if used in software (Rule2) --------------------------------------
        // DE: Konfiguration des linken Schalters des NSPanels
        // EN: Configuration of the left switch of the NSPanel
        button1: {
            // DE: Mögliche Werte wenn Rule2 definiert: 'page', 'toggle', 'set' - Wenn nicht definiert --> mode: null
            // EN: Possible values if Rule2 defined: 'page', 'toggle', 'set' - If not defined --> mode: null
            mode: null,
            // DE: Zielpage - Verwendet wenn mode = page
            // EN: Target page - Used if mode = page
            page: null,
            // DE: Zielentity - Verwendet wenn mode = set oder toggle
            // EN: Target entity - Used if mode = set or toggle
            entity: null,
            // DE: Zielwert - Verwendet wenn mode = set
            // EN: Target value - Used if mode = set
            setValue: null
        },

        // DE: Konfiguration des rechten Schalters des NSPanels
        // EN: Configuration of the right switch of the NSPanel
        button2: {
            mode: null,
            page: null,
            entity: null,
            setValue: null
        },

        //--------- DE: Ende - Einstellungen für Hardware Button, wenn Sie softwareseitig genutzt werden (Rule2) -------------
        //--------- EN: End - settings for hardware button if they are used in software (Rule2) ------------------------------

        // DE: WICHTIG !! Parameter nicht ändern  WICHTIG!!
        // EN: IMPORTANT !! Do not change parameters IMPORTANT!!

    };


    /**
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     *  END STOP END STOP END - No more configuration - END STOP END STOP END       *
     ********************************************************************************
     *  For a update copy and paste the code below from orginal file.               *
     * ******************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     ********************************************************************************
     */

    log(await sendToAsync('nspanel-lovelace-ui.0', 'ScriptConfig', {...config, version}))
}

const version = '0.2.1';
const HMIOff = {red: 68, green: 115, blue: 158};     // Blue-Off - Original Entity Off
const HMIOn = {red: 3, green: 169, blue: 244};     // Blue-On
const HMIDark = {red: 29, green: 29, blue: 29};     // Original Background Color
const Off = {red: 253, green: 128, blue: 0};     // Orange-Off - nicer color transitions
const On = {red: 253, green: 216, blue: 53};
const MSRed = {red: 251, green: 105, blue: 98};
const MSYellow = {red: 255, green: 235, blue: 156};
const MSGreen = {red: 121, green: 222, blue: 121};
const Red = {red: 255, green: 0, blue: 0};
const White = {red: 255, green: 255, blue: 255};
const Yellow = {red: 255, green: 255, blue: 0};
const Green = {red: 0, green: 255, blue: 0};
const Blue = {red: 0, green: 0, blue: 255};
const DarkBlue = {red: 0, green: 0, blue: 136};
const Gray = {red: 136, green: 136, blue: 136};
const Black = {red: 0, green: 0, blue: 0};
const Cyan = {red: 0, green: 255, blue: 255};
const Magenta = {red: 255, green: 0, blue: 255};
const colorSpotify = {red: 30, green: 215, blue: 96};
const colorAlexa = {red: 49, green: 196, blue: 243};
const colorSonos = {red: 216, green: 161, blue: 88};
const colorRadio = {red: 255, green: 127, blue: 0};
const BatteryFull = {red: 96, green: 176, blue: 62};
const BatteryEmpty = {red: 179, green: 45, blue: 25};

//Menu Icon Colors
const Menu = {red: 150, green: 150, blue: 100};
const MenuLowInd = {red: 255, green: 235, blue: 156};
const MenuHighInd = {red: 251, green: 105, blue: 98};

//Dynamische Indikatoren (Abstufung grün nach gelb nach rot)
const colorScale0 = {red: 99, green: 190, blue: 123};
const colorScale1 = {red: 129, green: 199, blue: 126};
const colorScale2 = {red: 161, green: 208, blue: 127};
const colorScale3 = {red: 129, green: 217, blue: 126};
const colorScale4 = {red: 222, green: 226, blue: 131};
const colorScale5 = {red: 254, green: 235, blue: 132};
const colorScale6 = {red: 255, green: 210, blue: 129};
const colorScale7 = {red: 251, green: 185, blue: 124};
const colorScale8 = {red: 251, green: 158, blue: 117};
const colorScale9 = {red: 248, green: 131, blue: 111};
const colorScale10 = {red: 248, green: 105, blue: 107};

//Screensaver Default Theme Colors
const scbackground = {red: 0, green: 0, blue: 0};
const scbackgroundInd1 = {red: 255, green: 0, blue: 0};
const scbackgroundInd2 = {red: 121, green: 222, blue: 121};
const scbackgroundInd3 = {red: 255, green: 255, blue: 0};
const sctime = {red: 255, green: 255, blue: 255};
const sctimeAMPM = {red: 255, green: 255, blue: 255};
const scdate = {red: 255, green: 255, blue: 255};
const sctMainIcon = {red: 255, green: 255, blue: 255};
const sctMainText = {red: 255, green: 255, blue: 255};
const sctForecast1 = {red: 255, green: 255, blue: 255};
const sctForecast2 = {red: 255, green: 255, blue: 255};
const sctForecast3 = {red: 255, green: 255, blue: 255};
const sctForecast4 = {red: 255, green: 255, blue: 255};
const sctF1Icon = {red: 255, green: 235, blue: 156};
const sctF2Icon = {red: 255, green: 235, blue: 156};
const sctF3Icon = {red: 255, green: 235, blue: 156};
const sctF4Icon = {red: 255, green: 235, blue: 156};
const sctForecast1Val = {red: 255, green: 255, blue: 255};
const sctForecast2Val = {red: 255, green: 255, blue: 255};
const sctForecast3Val = {red: 255, green: 255, blue: 255};
const sctForecast4Val = {red: 255, green: 255, blue: 255};
const scbar = {red: 255, green: 255, blue: 255};
const sctMainIconAlt = {red: 255, green: 255, blue: 255};
const sctMainTextAlt = {red: 255, green: 255, blue: 255};
const sctTimeAdd = {red: 255, green: 255, blue: 255};

//Auto-Weather-Colors
const swClearNight = {red: 150, green: 150, blue: 100};
const swCloudy = {red: 75, green: 75, blue: 75};
const swExceptional = {red: 255, green: 50, blue: 50};
const swFog = {red: 150, green: 150, blue: 150};
const swHail = {red: 200, green: 200, blue: 200};
const swLightning = {red: 200, green: 200, blue: 0};
const swLightningRainy = {red: 200, green: 200, blue: 150};
const swPartlycloudy = {red: 150, green: 150, blue: 150};
const swPouring = {red: 50, green: 50, blue: 255};
const swRainy = {red: 100, green: 100, blue: 255};
const swSnowy = {red: 150, green: 150, blue: 150};
const swSnowyRainy = {red: 150, green: 150, blue: 255};
const swSunny = {red: 255, green: 255, blue: 0};
const swWindy = {red: 150, green: 150, blue: 150};

type PageType = ScriptConfig.PageType;
type Config = ScriptConfig.Config;
type PageBaseType = ScriptConfig.PageBaseType;
type PageItem = ScriptConfig.PageItem;
type PageBaseItem = ScriptConfig.PageBaseItem;
type PageMediaItem = ScriptConfig.PageMediaItem;
type PageThermoItem = ScriptConfig.PageThermoItem;
type PageEntities = ScriptConfig.PageEntities;
type PageGrid = ScriptConfig.PageGrid;
type PageGrid2 = ScriptConfig.PageGrid2;
type PageGrid3 = ScriptConfig.PageGrid3;
type PageThermo = ScriptConfig.PageThermo;
type PageMedia = ScriptConfig.PageMedia;
type PageAlarm = ScriptConfig.PageAlarm;
type PageUnlock = ScriptConfig.PageUnlock;
type PageQR = ScriptConfig.PageQR;
type PagePower = ScriptConfig.PagePower;
type PageChart = ScriptConfig.PageChart;
type PagetypeType = ScriptConfig.PagetypeType;
type NavigationItemConfig = ScriptConfig.NavigationItemConfig;
declare namespace ScriptConfig {
    export type PopupType =
        | 'popupFan'
        | 'popupInSel'
        | 'popupLight'
        | 'popupLightNew'
        | 'popupNotify'
        | 'popupShutter'
        | 'popupThermo'
        | 'popupTimer';

    export type EventMethod =
        | 'startup'
        | 'sleepReached'
        | 'pageOpenDetail'
        | 'buttonPress2'
        | 'renderCurrentPage'
        | 'button1'
        | 'button2';
    export type panelRecvType = {
        event: 'event';
        method: EventMethod;
    };

    export type NavigationItemConfig = {
        name: string;
        left?: {
            single?: string;
            double?: string;
        };
        right?: {
            single?: string;
            double?: string;
        };
        page: string;
        optional?: never;
    } | null;

    export type SerialType = 'button' | 'light' | 'shutter' | 'text' | 'input_sel' | 'timer' | 'number' | 'fan';

    /**
     * Defines the possible roles for entities in the NSPanel.
     *
     * This type represents the various roles that entities can have within the NSPanel system.
     *
     */
    export type roles =
        | 'light'
        | 'socket'
        | 'dimmer'
        | 'hue'
        | 'rgb'
        | 'rgbSingle'
        | 'ct'
        | 'blind'
        | 'door'
        | 'window'
        | 'volumeGroup'
        | 'volume'
        | 'info'
        | 'humidity'
        | 'temperature'
        | 'value.temperature'
        | 'value.humidity'
        | 'thermostat'
        | 'warning'
        | 'cie'
        | 'gate'
        | 'motion'
        | 'buttonSensor'
        | 'button'
        | 'value.time'
        | 'level.timer'
        | 'value.alarmtime'
        | 'level.mode.fan'
        | 'lock'
        | 'slider'
        | 'switch.mode.wlan'
        | 'media'
        | 'timeTable'
        | 'airCondition';

    export type ButtonActionType =
        | 'bExit'
        | 'bUp'
        | 'bNext'
        | 'bSubNext'
        | 'bPrev'
        | 'bSubPrev'
        | 'bHome'
        | 'notifyAction'
        | 'OnOff'
        | 'button'
        | 'up'
        | 'stop'
        | 'down'
        | 'positionSlider'
        | 'tiltOpen'
        | 'tiltStop'
        | 'tiltSlider'
        | 'tiltClose'
        | 'brightnessSlider'
        | 'colorTempSlider'
        | 'colorWheel'
        | 'tempUpd'
        | 'tempUpdHighLow'
        | 'media-back'
        | 'media-pause'
        | 'media-next'
        | 'media-shuffle'
        | 'volumeSlider'
        | 'mode-speakerlist'
        | 'mode-playlist'
        | 'mode-tracklist'
        | 'mode-repeat'
        | 'mode-equalizer'
        | 'mode-seek'
        | 'mode-crossfade'
        | 'mode-favorites'
        | 'mode-insel'
        | 'media-OnOff'
        | 'timer-start'
        | 'timer-pause'
        | 'timer-cancle'
        | 'timer-finish'
        | 'hvac_action'
        | 'mode-modus1'
        | 'mode-modus2'
        | 'mode-modus3'
        | 'number-set'
        | 'mode-preset_modes'
        | 'A1'
        | 'A2'
        | 'A3'
        | 'A4'
        | 'D1'
        | 'U1'
        | 'f1Icon'
        | 'f2Icon'
        | 'f3Icon'
        | 'f4Icon'
        | 'f5Icon';

    export type RGB = {
        red: number;
        green: number;
        blue: number;
    };

    export type Payload = {
        payload: string;
    };

    export type PageBaseType = {
        type: PagetypeType;
        uniqueName?: string;
        heading: string;
        items: PageItem[];
        useColor: boolean;
        subPage?: boolean;
        parent?: string;
        parentIcon?: string;
        parentIconColor?: RGB;
        prev?: string;
        prevIcon?: string;
        prevIconColor?: RGB;
        next?: string;
        nextIcon?: string;
        nextIconColor?: RGB;
        home?: string;
        homeIcon?: string;
        homeIconColor?: RGB;
        hiddenByTrigger?: boolean;
    };

    export type PagetypeType =
        | 'cardChart'
        | 'cardLChart'
        | 'cardEntities'
        | 'cardGrid'
        | 'cardGrid2'
        | 'cardGrid3'
        | 'cardThermo'
        | 'cardMedia'
        | 'cardUnlock'
        | 'cardQR'
        | 'cardAlarm'
        | 'cardPower'; //| 'cardBurnRec'

    export type PageType =
        | PageChart
        | PageEntities
        | PageGrid
        | PageGrid2
        | PageGrid3
        | PageThermo
        | PageMedia
        | PageUnlock
        | PageQR
        | PageAlarm
        | PagePower
        | {type: undefined; heading?: string; native: any};

    export type PageEntities = {
        type: 'cardEntities';
        items: PageItem[];
    } & PageBaseType;

    export type PageGrid = {
        type: 'cardGrid';
        items: PageItem[];
    } & PageBaseType;

    export type PageGrid2 = {
        type: 'cardGrid2';
        items: PageItem[];
    } & PageBaseType;

    export type PageGrid3 = {
        type: 'cardGrid3';
        items: PageItem[];
    } & PageBaseType;

    export type PageThermo = {
        type: 'cardThermo';
        items: [PageThermoItem];
    } & Omit<PageBaseType, 'useColor'>;

    export type PageMedia = {
        type: 'cardMedia';
        items: [PageMediaItem];
    } & Omit<PageBaseType, 'useColor' | 'autoCreateAlias'>;

    export type PageAlarm = {
        type: 'cardAlarm';
        items: [PageItem];
    } & Omit<PageBaseType, 'useColor'>;

    export type PageUnlock = {
        type: 'cardUnlock';
        items: [PageItem];
    } & Omit<PageBaseType, 'useColor'> &
        Partial<Pick<PageBaseType, 'useColor'>>;

    export type PageQR = {
        type: 'cardQR';
        items: [PageItem];
    } & Omit<PageBaseType, 'useColor'>;

    export type PagePower = {
        type: 'cardPower';
        items: [PageItem];
    } & Omit<PageBaseType, 'useColor'>;

    export type PageChart = {
        type: 'cardChart' | 'cardLChart';
        items: PageItem[];
    } & Omit<PageBaseType, 'useColor'>;

    export type PageItem = PageBaseItem | PageMediaItem | PageThermoItem;

    export type PageMediaItem = {
        adapterPlayerInstance: adapterPlayerInstanceType;
        mediaDevice?: string;
        colorMediaIcon?: RGB;
        colorMediaArtist?: RGB;
        colorMediaTitle?: RGB;
        speakerList?: string[];
        playList?: string[];
        equalizerList?: string[];
        repeatList?: string[];
        globalTracklist?: string[];
        crossfade?: boolean;
    } & PageBaseItem;

    export type PageThermoItem = {
        popupThermoMode1?: string[];
        popupThermoMode2?: string[];
        popupThermoMode3?: string[];
        popUpThermoName?: string[];
        setThermoAlias?: string[];
        setThermoDestTemp2?: string;
    } & PageBaseItem;
    // mean string start with getState(' and end with ').val
    type getStateID = string;
    export type PageBaseItem = {
        uniqueName?: string;
        role?: string;
        /**
         * The data point with the data to be used.
         */
        id?: string | null;
        /**
         * The icon that is used in the standard case or if ID is true
         */
        icon?: string;
        /**
         * The icon that is used when id is false
         */
        icon2?: string;
        /**
         * Used with blinds for partially open.
         */
        icon3?: string;
        /**
         * The color that is used in the standard case or if ID is true
         */
        onColor?: RGB;
        /**
         * The color that is used when id is false
         */
        offColor?: RGB;
        useColor?: boolean;
        /**
         * Interpolate the icon colour by ID
         */
        interpolateColor?: boolean;
        minValueBrightness?: number;
        maxValueBrightness?: number;
        minValueColorTemp?: number;
        maxValueColorTemp?: number;
        minValueLevel?: number;
        maxValueLevel?: number;
        minValueTilt?: number;
        maxValueTilt?: number;
        minValue?: number;
        maxValue?: number;
        stepValue?: number;
        prefixName?: string;
        suffixName?: string;
        name?: string;
        secondRow?: string;
        buttonText?: string;
        unit?: string;
        navigate?: boolean;
        colormode?: string;
        colorScale?: IconScaleElement;
        targetPage?: string;
        modeList?: string[];
        hidePassword?: boolean;
        autoCreateALias?: boolean;
        yAxis?: string;
        yAxisTicks?: number[] | string;
        xAxisDecorationId?: string;
        useValue?: boolean;
        monobutton?: boolean;
        inSel_ChoiceState?: boolean;
        iconArray?: string[];
        customIcons?: any[];
        fontSize?: number;
        actionStringArray?: string[];
        alwaysOnDisplay?: boolean;
    };

    export type DimMode = {
        dimmodeOn: boolean | undefined;
        brightnessDay: number | undefined;
        brightnessNight: number | undefined;
        timeDay: string | undefined;
        timeNight: string | undefined;
    };

    export type ConfigButtonFunction = {
        mode: 'page' | 'toggle' | 'set' | null;
        page:
        | PageThermo
        | PageMedia
        | PageAlarm
        | PageQR
        | PageEntities
        | PageGrid
        | PageGrid2
        | PagePower
        | PageChart
        | PageUnlock
        | null;
        entity: string | null;
        setValue: string | number | boolean | null;
        setOn?: {dp: string; val: iobJS.StateValue};
        setOff?: {dp: string; val: iobJS.StateValue};
    };

    export type Config = {
        panelName?: string;
        /**
         * The topic to receive and send messages to the panel.
         */
        panelTopic: string;
        weatherEntity: string;
        leftScreensaverEntity: leftScreensaverEntityType;
        bottomScreensaverEntity: ScreenSaverElement[];
        indicatorScreensaverEntity: indicatorScreensaverEntityType;
        mrIcon1ScreensaverEntity: ScreenSaverMRElement;
        mrIcon2ScreensaverEntity: ScreenSaverMRElement;
        defaultColor: RGB;
        defaultOnColor: RGB;
        defaultOffColor: RGB;
        defaultBackgroundColor: RGB;
        pages: PageType[];
        subPages: PageType[];
        button1: ConfigButtonFunction;
        button2: ConfigButtonFunction;
        /**
         * Native page items for the panel
         */
        nativePageItems?: any;
        navigation?: NavigationItemConfig[];
    };
    export type leftScreensaverEntityType =
        | [ScreenSaverElementWithUndefined?, ScreenSaverElementWithUndefined?, ScreenSaverElementWithUndefined?]
        | [];
    export type indicatorScreensaverEntityType =
        | [
            ScreenSaverElementWithUndefined?,
            ScreenSaverElementWithUndefined?,
            ScreenSaverElementWithUndefined?,
            ScreenSaverElementWithUndefined?,
            ScreenSaverElementWithUndefined?,
        ]
        | [];
    export type ScreenSaverElementWithUndefined = null | undefined | ScreenSaverElement;
    export type ScreenSaverElement = {
        ScreensaverEntity: string;
        ScreensaverEntityText: string;
        /**
         * Value wird mit diesem Factor multipliziert.
         */
        ScreensaverEntityFactor?: number;
        ScreensaverEntityDecimalPlaces?: number;
        ScreensaverEntityDateFormat?: Intl.DateTimeFormatOptions;
        ScreensaverEntityIconOn?: string | null;
        ScreensaverEntityIconOff?: string | null;
        ScreensaverEntityUnitText?: string;
        ScreensaverEntityIconColor?: RGB | IconScaleElement | string;
        ScreensaverEntityOnColor?: RGB;
        ScreensaverEntityOffColor?: RGB;
        ScreensaverEntityOnText?: string | null;
        ScreensaverEntityOffText?: string | null;
        ScreensaverEntityNaviToPage?: PageType;
        /**
         * To show different icons for different values in the screensaver
         * 
         * Value is the threshold for the icon. Lower values are first.
         * Example:
         * [
                    {icon: 'sun-thermometer', value:40},
                    {icon: 'sun-thermometer-outline', value: 35},
                    {icon: 'thermometer-high', value: 30},
                    {icon: 'thermometer', value: 25},
                    {icon: 'thermometer-low', value: 15},
                    {icon: 'snowflake-alert', value: 2},
                    {icon: 'snowflake-thermometer', value: -2},
                    {icon: 'snowflake', value: -10},
                    ]
         */
        ScreensaverEntityIconSelect?: {icon: string; value: number}[] | null;
    };

    export type ScreenSaverMRElement = {
        ScreensaverEntity: string | null;
        ScreensaverEntityIconOn: string | null;
        ScreensaverEntityIconSelect?: {[key: string]: string} | null | undefined;
        ScreensaverEntityIconOff: string | null;
        ScreensaverEntityValue: string | null;
        ScreensaverEntityValueDecimalPlace: number | null;
        ScreensaverEntityValueUnit: string | null;
        ScreensaverEntityOnColor: RGB;
        ScreensaverEntityOffColor: RGB;
    };
    export type ScreenSaverMRDataElement = {
        ScreensaverEntity: string | number | boolean | null;
        ScreensaverEntityIconOn: string | null;
        ScreensaverEntityIconOff: string | null;
        ScreensaverEntityValue: string | number | boolean | null;
        ScreensaverEntityValueDecimalPlace: number | null;
        ScreensaverEntityValueUnit: string | null;
        ScreensaverEntityOnColor: RGB;
        ScreensaverEntityOffColor: RGB;
        ScreensaverEntityIconSelect: {[key: string]: string} | null;
    };

    export type IconScaleElement = {
        val_min: number;
        val_max: number;
        val_best?: number;
        /**
         * The color mix mode. Default is 'mixed'.
         * ‘mixed’: the target colour is achieved by scaling between the two RGB colours.
         * 'cie': the target colour is achieved by mixing according to the CIE colour table. 
         * 'hue': the target colour is calculated by scaling via colour, saturation and brightness.
         */
        mode?: 'mixed' | 'hue' | 'cie';
        /**
         * The logarithm scaling to max, min or leave undefined for linear scaling.
         */
        log10?: 'max' | 'min';
    };
    /** we need this to have a nice order when using switch() */
    export type adapterPlayerInstanceType =
        | 'alexa2.0.'
        | 'alexa2.1.'
        | 'alexa2.2.'
        | 'alexa2.3.'
        | 'alexa2.4.'
        | 'alexa2.5.'
        | 'alexa2.6.'
        | 'alexa2.7.'
        | 'alexa2.8.'
        | 'alexa2.9.'
        | 'sonos.0.'
        | 'sonos.1.'
        | 'sonos.2.'
        | 'sonos.3.'
        | 'sonos.4.'
        | 'sonos.5.'
        | 'sonos.6.'
        | 'sonos.7.'
        | 'sonos.8.'
        | 'sonos.9.'
        | 'spotify-premium.0.'
        | 'spotify-premium.1.'
        | 'spotify-premium.2.'
        | 'spotify-premium.3.'
        | 'spotify-premium.4.'
        | 'spotify-premium.5.'
        | 'spotify-premium.6.'
        | 'spotify-premium.7.'
        | 'spotify-premium.8.'
        | 'spotify-premium.9.'
        | 'volumio.0.'
        | 'volumio.1.'
        | 'volumio.2.'
        | 'volumio.3.'
        | 'volumio.4.'
        | 'volumio.5.'
        | 'volumio.6.'
        | 'volumio.7.'
        | 'volumio.8.'
        | 'volumio.9.'
        | 'squeezeboxrpc.0.'
        | 'squeezeboxrpc.1.'
        | 'squeezeboxrpc.2.'
        | 'squeezeboxrpc.3.'
        | 'squeezeboxrpc.4.'
        | 'squeezeboxrpc.5.'
        | 'squeezeboxrpc.6.'
        | 'squeezeboxrpc.7.'
        | 'squeezeboxrpc.8.'
        | 'squeezeboxrpc.9.'
        | 'bosesoundtouch.0.'
        | 'bosesoundtouch.1.'
        | 'bosesoundtouch.2.'
        | 'bosesoundtouch.3.'
        | 'bosesoundtouch.4.'
        | 'bosesoundtouch.5.'
        | 'bosesoundtouch.6.'
        | 'bosesoundtouch.7.'
        | 'bosesoundtouch.8.'
        | 'bosesoundtouch.9.';

    export type PlayerType = _PlayerTypeWithMediaDevice | _PlayerTypeWithOutMediaDevice;

    export type _PlayerTypeWithOutMediaDevice = 'spotify-premium' | 'volumio' | 'bosesoundtouch';
    export type _PlayerTypeWithMediaDevice = 'alexa2' | 'sonos' | 'squeezeboxrpc';

    export type notSortedPlayerType =
        | `${PlayerType}.0.`
        | `${PlayerType}.1.`
        | `${PlayerType}.2.`
        | `${PlayerType}.3.`
        | `${PlayerType}.4.`
        | `${PlayerType}.5.`
        | `${PlayerType}.6.`
        | `${PlayerType}.7.`
        | `${PlayerType}.8.`
        | `${PlayerType}.9.`;

    export type mediaOptional =
        | 'seek'
        | 'crossfade'
        | 'speakerlist'
        | 'playlist'
        | 'tracklist'
        | 'equalizer'
        | 'repeat'
        | 'favorites';
}
configuration();

TT-Tom

@neuschwansteini sagte in Alphatest NSPanel-lovelace-ui v0.1.1:

const config: ScriptConfig.Config = {
panelTopic: 'NSPanel1/NSPanel1-BB',

hier ein Fehler.

da er die ID gelesen hat hat auch die Verbindung zum Panel geklappt.

hast du noch Fehlermeldungen vom Starten des Script? Du musst das ConfigScript einmal Starten und wieder stoppen.

ggf. zeige mal noch die Seite General von der UI

? Offline

@tt-tom

und welcher Fehler ist das, ich versteh es leider nicht, wie es richtig sein muss.. ??
Alias Errors kommen keine, das Script startet ohne Fehler.

Seite General des Adapters:

Screenshot 2025-02-28 at 11.57.05.png

ticaki

Wir haben das per Voice geklärt. Für die die mitlesen -

panelTopic im Skript muß den selben Eintrag haben, wie der panel topic im Admin. Daran erkennt der Adapter welches Panel konfiguriert werden soll.

ticaki

Bitte löscht den Ordner panels wenn ihr eine aktuelle Version zieht, hab da etwas umstrukturiert.

In nspanel-lovelace-ui.0 wird im Objekt die Skriptkonfiguration gespeichert, wenn ihr den löscht müsst ihr die Konfig nochmal rüberschicken. Auch kein Problem, aber macht arbeit

Und natürlich immer den Adapter neustarten, wenn ihr da was löscht.

Max_yeah

@ticaki Danke für die Erklärung und Klarstellung.

Allein der Vorteil durch die leichteren updates wäre es Wert umzusteigen, (sofern man die gleichen Funktionen hat).
Ich habe noch ein Panel rumliegen, mit dem ich das sobald ich zeit habe mal testen kann.
In einem produktiv einsatz wären aber PowerCard und Charts für mich essentiel.

ticaki

@max_yeah
Produktiv sehe ich leider noch kein Datum für - wir haben aktuell ca. 40% und davon 15% ausreichend getestet Das installiert man um zu gucken und Einfluss zu nehmen - Wir sind für konsturktives Feedback auch negatives dankbar.

Max_yeah

@ticaki natürlich, ist ein super Sache. Finde gefühlt Täglich neue Anwendungsmöglichkeiten für die Panels (Ob man die wirklich braucht ist eine andere sache xP ). Würde mich freuen wenn ich zum Erfolg etwas beisteuern kann.

Hansi1234

@max_yeah kurz ot: z.B.?

Max_yeah

@hansi1234 said in Alphatest NSPanel-lovelace-ui v0.1.1:

@max_yeah kurz ot: z.B.?

naja Geräte die ich im Haus habe (die zum Teil nicht smart sind) die ich dann damit steure oder deren Zustand anzeige. Aber auch Smarte Geräte die aktuell nur ich einstellen oder ablesen kann weil nur ich die App auf dem Handy hab. Zum Teil hat es auch nicht wirklich was mit dem Panel zu tun. Weil die Logic ja nicht auf dem Panel läuft. Das Panel dient dann nur als Anzeige oder als Alternative trigger methode zur Alexa.

Hier ein paar Beispiele.

Ein Beispiel ist, wir haben im Haus eine Lüftungsanlage. Die hatte bis zum Einzug nur einen Manuellen Drehschallter. Den hab ich dann erstmal gegen ein smart Relay getauscht. Das konnte ich dann schon über eine Alexa Routine steuern. War also noch relativ dumm. Jetzt dachte ich es wäre cool dafür auch so art Scenen zu erstellen. Das die Lüftung zb. Nachts im sommer bisschen mehr gas gibt um frische kühle luft ins Haus zu bringen, natürlich nur sofern die außen Temperatur < Innen Temperatur ist.
Dafür bräuchte man erstmal das Panel nicht, jedoch wäre es eben auch für andere Hausbewohner außer mir interessant welche Scene gereade läuft und diese eventuell zu ändern.

Anderes Beispiel ist, wir haben eine NAS für Datensicherungen. Diese geht aber automatisch in den Sleep Mode (ich will nicht das sie die ganze Zeit die Platten aktiv sind.
Drum hab ich mir jetzt einen Button ins panel gemacht das einen WOL(Wake On Lan) Befehl sendet. Damit muss ich nicht extra ins Büro laufen wenn ich die NAS aufwecken will.

Ich kann unseren Staubsauger Robotter, dessen App verküpung natürlich nur auf meinem Handy läuft, über das Panel starten. Das soll in zukunft noch ausgebaut werden, mit Werten über den Robbi sowie meldungen die er bringt bezüglich Verbrauchsgütern.
Das würde zum Teil natürlich auch über die Alexa gehen. Jedoch will ich eig bisschen weg von der sprachsteuerung, zumindest solange sie noch so "Dumm" ist und nur feste befehle befolgen kann. Mit der neuen Alexa+ könnte sich das natürlich ändern. Der Punkt ist das wenn man nicht den genauen Sprachbefehl kennt, dann kann man es nicht steuern. Auf dem Panel kamm man einfach danach suchen.

Die Anzeige der Solar Leistung ist warscheinlich üblich, die PowerCard liefert da einen super Überblick. Was in Zukunft dazu kommen soll, sobald wir ein eAuto haben, wird sein, das wir über das Panel steuern und einstellen können wann das Auto mit Solarstrom geladen werden soll. Und noch weiter wenn es mal soweit ist das man einen dynamischen Stromtarif hat.

ticaki

Kurz gemeldet

ab 0.1.5:
Wenn das Skript angepasst wird, muss zu jedem Bildschirmschonerelement noch die Eigenschaft type: "script" hinzugefügt werden.

0.1.5 ist ein bissle buggy, nix wirklich schlimmes aber lohnt nicht sich die fehler anzugucken

0.1.6 wird heute kommen und das ist dann schon deutlich besser

? Offline

@ticaki

freut mich, dass ihr so dran bleibt!
Bin mit meinem Testpanel wieder zurueck zum Script, mich hatte es ja erstmal nur interessiert, was muss ich am Panel aendern, was am iobroker..

Dann warte ich mal, bis ein "feuer frei fuer Beta tests" kommt..

ticaki

@neuschwansteini sagte in Alphatest NSPanel-lovelace-ui v0.1.1:

Dann warte ich mal, bis ein "feuer frei fuer Beta tests" kommt..

Roadmap ohne Datum sieht so aus:

0.2 Screensaver/cardGrid/cardEntities/Basisfunktionen laufen soweit und sind zum testen freigegeben
0.3 cardMedia ist verfügbar
0.4 alle cards sind verfügbar
0.5 erweiterte Funktionen (tasmota updates und ähnliches sind drin)

Kannst dann selbst entscheiden was du brauchst und wobei du dann helfen willst - aktuell ist der noch nix zum antesten. imho Hab selbst nur ein unwichtiges Panel auf dem Adapter im produktiven Einsatz laufen.

patricknitsch

@ticaki Hi Ticaki,

funktioniert denn die virtuelle Version über den Nextion Editor auch mit eurem Adapter? Würde ein normaler ESP32 Chip auch erkannt werden?

Wäre ja zu Testzwecken auch interessant, da ich auch so mit dem Editor arbeite, um nicht ständig hinlaufen zu müssen.

ticaki

@patricknitsch
Soweit ich weiß benutzt @Armilar das auf dem Emulator. Was nicht geht - man kann kein berry vom Adapter installieren lassen, soweit ich weiß ist das eine andere Version als die beim normalen NSpanel - Sind aber kaum richtige Bezeichnungen im Admin, nur Tokens für die Übersetzungen. Interner MQTT-Server ist gut getestet - aktuell nutzt das kaum wer mit einem Extern... Obwohl @TT-Tom hast du nicht einen externen am laufen?

Kurze Einrichtungsanleitung für ein normales NSPanel

Das hier sollte selbsterklärend sein - brokenCommen... bezieht sich auf info channels - da sind datenpunkte drunter die als common.type='state' haben - das ist natürlich vollkommen falsch - werden mit der option im ganzen alias.0 Datenzweig gefixt. Anschließend wird die option deaktiviert und der Adapter neugestartet.
Bildschirmfoto 2025-03-16 um 13.38.33.png

Dann das hinzufügen der Panels:
Bildschirmfoto 2025-03-16 um 13.41.37.png

-tasmotaIp: Die Ip des Gerätes das hinzugefügt/bearbeitet werden soll.
-tasmotaName: Name des Gerätes der an vielen Stellen zu finden ist.
-tasmotaTopic: Freiwählbarer kompletter Topic muss mit einem buchstaben anfangen - wenn da also 'a' steht, reicht das ist nur beim auseinanderhalten vielleicht nicht sinnvoll

Ist das ausgefüllt werden die Schaltflächen unten aktiv - TasmotaSendTo stellt das NSPanel auf die Werte im Adapter und für den Adapter ein - keine Nutzer eingabe auf dem NSPanel nötig, außer man will was spezielles

Diese Sachen werden geändert:

` MqttHost ${obj.message.mqttServer ? obj.message.internalServerIp : obj.message.mqttIp};` +
` MqttPort ${obj.message.mqttPort}; MqttUser ${obj.message.mqttUsername}; MqttPassword ${obj.message.mqttPassword};` +
` FullTopic ${`${obj.message.tasmotaTopic}/%prefix%/`.replaceAll('//', '/')};` +
` MqttRetry 10; FriendlyName1 ${obj.message.tasmotaName}; Hostname ${obj.message.tasmotaName.replaceAll(/[^a-zA-Z0-9_-]/g, '_')};` +
` WebLog 2; template {"NAME":"${obj.message.tasmotaName}", "GPIO":[0,0,0,0,3872,0,0,0,0,0,32,0,0,0,0,225,0,480,224,1,0,0,0,33,0,0,0,0,0,0,0,0,0,0,4736,0],"FLAG":0,"BASE":1};` +
` Module 0; MqttClient ${obj.message.tasmotaName.replaceAll(/[^a-zA-Z0-9_-]/g, '_')}%06X;` +
` Restart 1`;

Dann bitte 20 Sekunden warten - da muß ich noch ne "taasmota ist fertig" routine einbauen. Die das ganze blockiert bis er wieder da ist.

Falls offene Änderungen aus einem der anderen Tabs nicht gespeichert sind, jetzt speichern
Anschließend auf TasmotaAdd... klicken, das prüft ob der Tasmota über mqtt erreichbar ist und fügt ihn dann der oberen Tabelle hinzu - falls das geschieht, wird der browser neugeladen und der Tasmota ist eingetragen - alle nicht gespeicherten Änderungen gehen dabei aktuell verloren - deshalb speichern bevor du auf den Schalter drückst.

Damit installierst du das aktuelle Berryscript (nicht für Emulator)
Bildschirmfoto 2025-03-16 um 13.48.04.png

Hiermit wird die aktuell von uns freigegebene TFT Version auf dem Tasmota installiert
Bildschirmfoto 2025-03-16 um 13.48.51.png

Bei beiden letzteren gibt es keine "ist fertig" anzeige.

Noch fragen? Raus damit

EDIT: Ich erkläre das so ausführlich, weils jemand anderes benutzen soll, so das wir wissen das es funktioniert.

NEWS

Betatest NSPanel-lovelace-ui v0.7.x

Kurze Einrichtungsanleitung für ein normales NSPanel

Support us

610

32.4k

81.4k

1.3m