Betatest NSPanel-lovelace-ui v0.2.x

hm_krause

@ticaki
@teletapi
Das ändern des Panelnamens war die Lösung welche nun zum Start des Adapters führte.
Unter dem vorherigen Namen war das Script von dem Projekt
https://forum.iobroker.net/topic/58170/sonoff-nspanel-mit-lovelace-ui
angelegt.
Danke für Eure Hilfe.
Das Panel ist noch offline, dachte aber das hier minimal den Sreensaver angezeigt wird.
Leider nur "waiting for content...
Was muss ich hier noch tun?

TT-Tom

@hm_krause

dein Topic stimmt laut Bildern nicht

in tasmota steht übersetzt nspanel_1/nspanel_1/%prefix%

im Adapter steht nspanel_1/%prefix%

lösche in Tasmota -> /%topic%

prüfe aber auch den Topic im Script

TT-Tom

@teletapi

0,1 und 0,01 ergeben beide nur eine Nachkommastelle.

ja, kann den Fehler nachstellen, muss ich mir in Ruhe ansehen.

ticaki

@hm_krause
Skript ausführen und Adapter neustarten.

Das andere Projekt hat nichts mit diesem hier zu tun. ( außer den selben Betreuern)

Bin in ca 1h zuhause

hm_krause

@tt-tom
Wurde schon selbstständig geändert

warum auch immer

@ticaki
..kein Stress..

TT-Tom

@hm_krause

prüfe im script, was hier hinter panelTopic steht, da muss nspanel_1 stehen

    const config: ScriptConfig.Config = {
        panelTopic: 'SmartHome/NSPanel_1',
        weatherEntity: 'openweathermap.0.',
        defaultOffColor: Off,
        defaultOnColor: On,
        defaultBackgroundColor: HMIDark,
        weatherAddDefaultItems: false,

der Name vom Script, muss gleich dem Namen vom Panel sein.

Script starten, danach adapter neu starten.

bitte auch mal das Log zeigen vom Scriptstart und Adapterstart.

hm_krause

@tt-tom
...vom Script

javascript.0	19:50:26.202	info	

Compiling TypeScript source script.js.nspanel-lovelace-ui_0.Panel_1

javascript.0	19:50:26.309	info	

source code did not change, using cached compilation result...

javascript.0	19:50:26.321	info	

registered 0 subscriptions, 0 schedules, 0 messages, 0 logs and 0 file subscriptions

javascript.0	19:50:26.522	info	

[
  'Panel for Topic: nspanel_1 Script version 0.9.1 is correct!',
  'No navigation items found! This needs to be fixed!',
  'done'
]

javascript.0	19:50:26.588	info	

Stopping script script.js.nspanel-lovelace-ui_0.Panel_1

...Adapter

nspanel-lovelace-ui.0
	2025-08-14 19:52:02.321	info	[Panel_1] Panel startup finished!
nspanel-lovelace-ui.0
	2025-08-14 19:52:02.320	debug	[Panel_1] Set screeensaver timeout to 2s.
nspanel-lovelace-ui.0
	2025-08-14 19:52:02.220	debug	[Panel_1] Set screeensaver timeout to 15s.
nspanel-lovelace-ui.0
	2025-08-14 19:52:01.867	debug	[///Adapter-Info] Switch page to visible!
nspanel-lovelace-ui.0
	2025-08-14 19:52:00.070	debug	[controller] Panel E4_65_B8_48_80_70 created
nspanel-lovelace-ui.0
	2025-08-14 19:51:59.867	warn	[Panel_1-navigation] Dont find navigation main page for main
nspanel-lovelace-ui.0
	2025-08-14 19:51:59.867	warn	[Panel_1-navigation] Dont find a navigation node with name main
nspanel-lovelace-ui.0
	2025-08-14 19:51:59.866	warn	[Panel_1-navigation] Dont find a navigation node with name main
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.927	warn	[Panel_1] is offline!
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.919	info	[Panel_1] is online!
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.754	debug	[system-notifications] Received notifications from "system.host.iob-huawei": {"system":{"categories":{},"description":{"en":"These notifications are collected by the ioBroker system and point to issues you should check and fix.","de":"Diese Benachrichtigungen werden vom ioBroker-System erfasst und weisen auf Probleme hin, die überprüft und behoben werden sollten.","ru":"Эти уведомления собираются системой ioBroker и указывают на проблемы, которые вы должны проверить и исправить.","pt":"Essas notificações são coletadas pelo sistema ioBroker e apontam para problemas que você deve verificar e corrigir.","nl":"Deze meldingen worden verzameld door het ioBroker-systeem en wijzen op problemen die u moet controleren en oplossen.","fr":"Ces notifications sont collectées par le système ioBroker et indiquent des problèmes que vous devez vérifier et résoudre.","it":"Queste notifiche vengono raccolte dal sistema ioBroker e indicano problemi che dovresti controllare e correggere.","es":"Estas notificaciones son recopiladas por el sistema ioBroker y señalan problemas que debe verificar y solucionar.","pl":"Te powiadomienia są zbierane przez system ioBroker i wskazują problemy, które należy sprawdzić i naprawić.","uk":"Ці сповіщення збираються системою ioBroker і вказують на проблеми, які ви повинні перевірити та виправити.","zh-cn":"这些通知由ioBroker系统收集，并指出您应检查并修复的问题"},"name":{"en":"System Notifications","de":"System-Benachrichtigungen","ru":"Системные уведомления","pt":"Notificações do sistema","nl":"Systeemmeldingen","fr":"Notifications système","it":"Notifiche di sistema","es":"Notificaciones del sistema","pl":"Powiadomienia systemowe","uk":"Системні сповіщення","zh-cn":"系统通知"}}}
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.748	debug	[system-notifications] Request notifications from "system.host.iob-huawei"
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.748	debug	[system-notifications] Received notifications from "system.host.Iobroker": {}
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.725	debug	[system-notifications] Request notifications from "system.host.Iobroker"
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.713	debug	[mqttClient] subscripe to: nspanel_1/stat/#
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.711	debug	[mqttClient] subscripe to: nspanel_1/tele/#
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.711	debug	[Panel_1] Panel E4_65_B8_48_80_70 is initialised!
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.671	debug	[controller] Set current Date with time: Thu Aug 14 2025 19:51:57 GMT+0200 (Central European Summer Time)
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.606	debug	[mqttClient] subscripe to: nspanel_1/stat/RESULT
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.559	debug	[controller] controller created
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.557	debug	42818.65625k
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.556	info	[mqttClient] Connection is active.
nspanel-lovelace-ui.0
	2025-08-14 19:51:57.502	debug	Check configuration!
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.469	info	Force an MQTT reconnect from the Nspanel with the ip 192.168.178.56 in 10 seconds!
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.391	debug	[library] Load language de
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.390	info	Raw script config found for nspanel_1
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.388	error	[config-manager] No navigation items found! This needs to be fixed!
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.387	debug	[config-manager] Screensaver pageItems count: 17
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.384	warn	Invalid color value: "0_userdata.0.Abfallkalender.1.color"
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.291	info	[config-manager] Start converting configuration for nspanel_1
nspanel-lovelace-ui.0
	2025-08-14 19:51:55.238	info	starting. Version 0.2.4 (non-npm: ticaki/ioBroker.nspanel-lovelace-ui#955fb48e830b9ffc2f648d9d50adbbde0e5318ba) in /opt/iobroker/node_modules/iobroker.nspanel-lovelace-ui, node: v20.19.4, js-controller: 7.0.6
nspanel-lovelace-ui.0
	2025-08-14 19:51:50.324	info	terminating
nspanel-lovelace-ui.0
	2025-08-14 19:51:49.837	info	Terminated (ADAPTER_REQUESTED_TERMINATION): Without reason
nspanel-lovelace-ui.0
	2025-08-14 19:51:49.836	info	terminating
nspanel-lovelace-ui.0
	2025-08-14 19:51:49.835	info	[mqttClient] Connection is closed.
nspanel-lovelace-ui.0
	2025-08-14 19:51:49.833	debug	[///Adapter-Info] Switch page to invisible!
nspanel-lovelace-ui.0
	2025-08-14 19:51:49.822	info	Got terminate signal TERMINATE_YOURSELF

ticaki

Zeig mal den kompletten oberen Teil vom Skript.

ticaki

Hab in der aktuellen Github version mal etwas mehr Log eingebaut damit das mit Topics besser zu sehen ist einmal beim startup:

... Configured panels: name#topic -> [ns_panel4#nspanel/ns_panel4], [nspanel6#nspanel/ns_panel6]
... Found 2 script configs for topics: nspanel/ns_panel4, nspanel/ns_panel6

Beim übertragen des Skripts gibts noch zusätzlich:
Bildschirmfoto 2025-08-14 um 21.10.52.png

Im log steht dann:

2025-08-14 21:06:18.038  - error: nspanel-lovelace-ui.0 (99753) [config-manager] Panel for Topic: nspanel/ns_panel67 not found in adapter config!

hm_krause

@ticaki
hier bitte

async function configuration(): Promise<void> {

    const overrideConfig: Partial<ScriptConfig.Config> = {
        // hier kann man die Werte von unten überschreiben bzw nicht ewig im Skript suchen wo nochmal die Farbe steht :)
        // pages und subpages geht hier nicht, weil die Seiten ja erst später angelegt werden. Bei const gehts nach Reihenfolge.
        // panelTopic: 'nspanel/ns_panel4',
        weatherEntity: 'pirate-weather.0.',
        defaultOffColor: Off,
        defaultOnColor: On,
        weatherAddDefaultItems: false,
    }

        /**************************************************************************************
         **                                                                                  **
         ** https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki/Adapter-Installation **
         **                                                                                  **
         *************************************************************************************/
        
         

        /***********************************************************************
         **                                                                   **
         **                       Page Configuration                          **
         **                                                                   **
         ***********************************************************************/

    // Diese Konfiguration für den Fahrplan ist ein Beispiel was die interne Adapterkonfiguration benutzt, diese 
    // ist recht komplex und wird nicht weiter erläutert. Da gibts später fertige Templates die man hier verwenden kann.
    // wie am Fahrplan Beispiel zu sehen ist.

    /* const fahrplan: any = {
        heading: 'Fahrplan Script',
        native: {
            card: 'cardEntities',
            dpInit: 'fahrplan.0.0',
            uniqueID: 'fahrplanrouten',
            template: 'entities.fahrplan.routes',
        }
    }; */

    // Konfiguration findet im Admin statt, uniqueName muß gleich dem namen in der Adminkonfiguration sein.

    /* const qrCode: ScriptConfig.PageQR = {
        type: 'cardQR',
        uniqueName: 'qrCode'
    }; */

    // Konfiguration findet im Admin statt, uniqueName muß gleich dem namen in der Adminkonfiguration sein.

    /* const chartHeizung: ScriptConfig.PageChart = {
        type: 'cardChart',
        uniqueName: 'temperatur'
    }; */

    // Ein Beispiel für eine Gridseite mit verschiedenen Farbskalen

    /* const irgendeinName: ScriptConfig.PageGrid = {
        type: 'cardGrid',
        uniqueName: 'main',
        heading: 'Wohnzimmer',
        useColor: true,
        items: [
            {id: 'alias.0.Temperatur', name: 'standard', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40}},
            {id: 'alias.0.Temperatur', name: 'hue', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue'}},
            {id: 'alias.0.Temperatur', name: 'cie', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie'}},
            {id: 'alias.0.Temperatur', name: 'standard log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'hue log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue', log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'cie log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie', log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'standard', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40}},
            {id: 'alias.0.Temperatur', name: 'hue', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue'}},
            {id: 'alias.0.Temperatur', name: 'cie', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie'}},
            {id: 'alias.0.Temperatur', name: 'standard log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, log10: 'max'}},
            {id: 'alias.0.Temperatur', name: 'hue log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue', log10: 'max'}},
            {id: 'alias.0.Temperatur', name: 'cie log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie', log10: 'max'}},
        ]
    }; */

    /* const grid1: ScriptConfig.PageGrid = {
        uniqueName: 'grid1', // keine Navigation, am besten uniqueName von config.ts übernehmen
        heading: 'Grid 1',
        items: [
            {id: 'alias.0.Licht.lights.Gerät_1'},
            {id: 'alias.0.Licht.lights.Gerät_2'},
            {id: '0_userdata.0.Einzelne_Geräte.dimmer'},
            {id: 'alias.0.NSPanel.allgemein.hue', },
            {navigate: true, targetPage: 'fahrplanrouten'},
            {id: 'alias.0.NSPanel.allgemein.shutter'}
        ],
        type: 'cardGrid',
        useColor: true
    } */ 

    const config: ScriptConfig.Config = {
        panelTopic: 'nspanel_1',
        weatherEntity: 'pirate-weather.0',
        defaultOffColor: Off,
        defaultOnColor: On,
        defaultBackgroundColor: HMIDark,
        weatherAddDefaultItems: false,

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


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

        /***********************************************************************
         **                                                                   **
         **                    Screensaver Configuration                      **
         **                                                                   **
         ***********************************************************************/


        favoritScreensaverEntity: [
            {
                type: 'template',
                template: 'text.openweathermap.favorit',
                dpInit: `/^openweathermap\\.0.+/`,
                modeScr: 'favorit',
            }
        ],
        alternateScreensaverEntity: [
            // only used with alternate Screensaver
        ],

        indicatorScreensaverEntity: [
            // indicatorScreensaverEntity 1 (only Advanced Screensaver)
            {
                type: 'script',
                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)
            {
                type: 'script',
                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)
            {
                type: 'script',
                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)
            {
                type: 'script',
                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)
            {
                type: 'script',
                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
            {
                type: 'template',
                template: 'text.openweathermap.sunriseset',
                dpInit: `/^openweathermap\\.0\\.forecast\\.current.+/`,
                modeScr: 'bottom',
            },
            // bottomScreensaverEntity 2
            /*{
                type: 'template',
                template: 'text.hmip.windcombo',
                dpInit: 'hmip.0.devices.3014F711A000185F2999676C',
                modeScr: 'bottom',
                //readOptions: {directionOfPanel: 81}
            },*/ 
            {
                type: 'script',
                ScreensaverEntity: 'openweathermap.0.forecast.current.windSpeed',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'weather-windy',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: "Wind",
                ScreensaverEntityUnitText: 'm/s',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
            },
            // bottomScreensaverEntity 3
            {
                type: 'script',
                ScreensaverEntity: 'openweathermap.0.forecast.current.windGust',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 1,
                ScreensaverEntityIconOn: 'weather-tornado',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Böen',
                ScreensaverEntityUnitText: 'm/s',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 120}
            },
            // bottomScreensaverEntity 4
            {
                type: 'template',
                template: 'text.openweathermap.winddirection',
                dpInit: `/^openweathermap\\.0./`,
                modeScr: 'bottom',
            },
            // bottomScreensaverEntity 5 (Advanced Screensaver)
            {
                type: 'script',
                ScreensaverEntity: 'openweathermap.0.forecast.current.humidity',
                ScreensaverEntityFactor: 1,
                ScreensaverEntityDecimalPlaces: 0,
                ScreensaverEntityIconOn: 'water-percent',
                ScreensaverEntityIconOff: null,
                ScreensaverEntityText: 'Feuchte',
                ScreensaverEntityUnitText: '%',
                ScreensaverEntityIconColor: {'val_min': 0, 'val_max': 100, 'val_best': 60}
            },
            // bottomScreensaverEntity 6 (for Advanced Screensaver)
            // the 6th day from dasWetter
            {
                type: 'native',
                native: dasWetterBottomScreensaverEntity6
            },
            // Examples for Advanced-Screensaver: https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Config-Screensaver#entity-status-icons-ab-v400 

            // Some templates for the screensaver uncomment the lines to use them
            // If u use an other instance for the weather data, change the instance in the following lines
            // If you want to have them all, set weatherAddDefaultItems=true in the config and leave the following lines as they are!

hm_krause

und

javascript.0	21:19:50.614	info	

Compiling TypeScript source script.js.nspanel-lovelace-ui_0.Panel_1

javascript.0	21:19:50.697	info	

source code did not change, using cached compilation result...

javascript.0	21:19:50.709	info	

registered 0 subscriptions, 0 schedules, 0 messages, 0 logs and 0 file subscriptions

javascript.0	21:19:50.767	info	

[
  'Panel for Topic: nspanel_1 Script version 0.9.1 is correct!',
  'No navigation items found! This needs to be fixed!',
  'done'
]

javascript.0	21:19:50.992	info	

Stopping script script.js.nspanel-lovelace-ui_0.Panel_1

ticaki

@hm_krause
Du hast alles auskommentiert - kein Wunder das da nix läuft.

Wenn keine Seite mit dem uniqueName: 'main' vorhanden ist, ist das Verhalten des Adapter undefiniert. Kommentiere "irgendeinName" wieder ein entferne alle pageItems und kommentiere es auch in pages wieder ein - dann sollte zumindest was angezeigt werden... wobei hab noch net ausprobiert ob cardGrid mit 0 items geht.

EDIT: zu dem undefinierten Verhalten - ich muß vor dem Screensaver irgendwas anzeigen und das Skript funktioniert, auch wenn du die Datenpunkte nicht hast - ich dachte dann passen die User das an.

hm_krause

@ticaki
Danke erstmal,
werde das morgen nochmal in Ruhe angehen.
Ich habe von Scripte leider überhaupt keine Ahnung.
Bisher lief das mit anderen Sachen per Copy/Paste
Melde mich dann wieder...

ticaki

@hm_krause
Sry ich sehe gerade das TT-Tom das auskommentiert hat nicht du. Ich muß das jetzt mal selbst durch probieren. Ich teste halt sehr selten das neuerstellen - glaube ist schon 2 Monate her

Ok, bis auf die Fehlermeldungen gehts doch... ist echt zu warm heute

Egal machen wir morgen weiter - im Bespielskript sollte aber ne funktionierende Hauptseite sein - mal gucken wo ich states finde die jeder hat

ticaki

@hm_krause
Füge im Skript unterhalb von

         /***********************************************************************
         **                                                                   **
         **                       Page Configuration                          **
         **                                                                   **
         ***********************************************************************/

das hier

    const Hauptseite: ScriptConfig.PageGrid = {
        type: 'cardGrid',
        uniqueName: 'main',
        heading: 'Die Leere',
        items: []
    };

ein und und füge in pages Hauptseite ein damit das so aussieht:

        pages: [
            Hauptseite
            //irgendeinName,
            //grid1,
            //qrCode,
            //chartHeizung,
        ],

ticaki

Mal ein paar Vorlagen mit Erklärung dazu wo sie benutzt werden können und wie. (Das nächste glaube ich)Screensaver Vorlagen funktionieren nicht für cardGrid/cardEntites und umgedreht (muß das mal testen ).

modeScr ist immer variable - obs Sinn macht ist was anderes -> ein Bottomicon für wind im indicator anzuzeigen macht keinen Sinn.

Allgemeines

dpInit: 'sainlogic.0', bezeichnet immer den Datenpfad unter dem man die dazu gehörigen Datenpunkte finden kann. Das muß zu eindeutigen Ergenissen führen. Wenn es also sainlogic.0 und sainlogic.1 mal gibt muß dort sainlogic.0 oder sainlogic.1stehen

Screensaver: Windrichtung/-geschwindigkeit für sainlogic

            {
                type: 'template',
                template: 'text.sainlogic.windarrow',
                dpInit: 'sainlogic.0',
                modeScr: 'bottom',
                readOptions: {directionOfPanel: 0} //0-360
            },

readOptions ist optional und die darin enthaltende Eigenschaft directionOfPanel bestimmt in welche Richtung die Person schaut, wenn sie auf das Panel sieht. Wenn dort nichts oder 0 steht ist der Pfeil genordet - also oben ist norden. Wenn man es anpasst wie beschrieben ist oben die Richtung relativ zur Person die drauf guckt zu sehen.

Aussehen:

Screensaver: Windrichtung/-geschwindigkeit generisch

            {
                type: 'template',
                template: 'text.generic.windarrow',
                dpInit: 'Bitte anpassen',
                modeScr: 'bottom',
                readOptions: {directionOfPanel: 0} //0-360
            },

dpinit muß hier angepasst werden und auf einen Order zeigen in dem 2 Datenpunkte mit folgenden Rolen und Typen zu finden sind.

// Datenpunkt 1 für Richtung
type: 'number',
role: 'value.direction.wind',

// Datenpunkt 2 für Geschwindigkeit
type: 'number',
role: 'value.speed.wind',
unit:'km/h', // oder m/s oder was auch immer

Screensaver: Batterieanzeige für bydhvs

Zeigt Ladestand in 10er Schritten an, ändert die Farbe wenn sie leer wird. Laden und entladen sind unterschiedliche Icons - werden ca. 20 verschiedene Icons verwendet.

             {
                type: 'template',
                template: 'text.battery.bydhvs',
                dpInit: 'bydhvs.0',
                modeScr: 'bottom',
            }

sieht so aus:

Screensaver: Wetterdaten anzeigen für Pirate-Weather oder Openweathermap

Dazu findet man viel Beispiele für Wetterdaten im Konfigskript - Da der Adapter aber nichts im Nutzercode ändert, muß man für aktuelle Beispiele auf Github schauen: https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/blob/main/script/example_sendTo_script_iobroker.ts - ich kopiere die mal hier mit dazu:

OPENWEATHERMAP

            //OPENWEATHERMAP

            // Bottom 1 - sunrise/set
            {
                type: 'template',
                template: 'text.openweathermap.favorit',
                dpInit: `/^openweathermap\\.0.+/`,
                modeScr: 'favorit',
            },
            // Bottom 2 -  Forecast Day 1
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day0/`,
                modeScr: 'bottom',
            },

            // Bottom 3 - Forecast Day 2
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day1/`,
                modeScr: 'bottom',
            },

            // Bottom 4 - Forecast Day 3
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day2/`,
                modeScr: 'bottom',
            },

            // Bottom 5 - Forecast Day 4
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day3/`,
                modeScr: 'bottom',
            },
            // Bottom 6 - Forecast Day 5
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day4/`,
                modeScr: 'bottom',
            },
            // Bottom 7 -  Forecast Day 6
            {
                type: 'template',
                template: 'text.openweathermap.bot2values',
                dpInit: `/^openweathermap\\.0.+?day5/`,
                modeScr: 'bottom',
            },

            // Bottom 8 - Windgeschwindigkeit
            {
                type: 'template',
                template: 'text.openweathermap.windspeed',
                dpInit: `/^openweathermap\\.0./`,
                modeScr: 'bottom',
            },

            // Bottom 9 - Böen
            {
                type: 'template',
                template: 'text.openweathermap.windgust',
                dpInit: `/^openweathermap\\.0./`,
                modeScr: 'bottom',
            },

            // Bottom 10 - Windrichtung
            {
                type: 'template',
                template: 'text.openweathermap.winddirection',
                dpInit: `/^openweathermap\\.0./`,
                modeScr: 'bottom',
            },

PIRATE-WEATHER

            // PIRATE-WEATHER

            // Bottom 1 - sunrise/set
            {
                type: 'template',
                template: 'text.pirate-weather.sunriseset',
                dpInit: `/^pirate-weather\\.0\\.weather\\.daily\\.00.+/`,
                modeScr: 'bottom',
            },
            // Bottom 2 -  Forecast Day 1
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.01/`,
                modeScr: 'bottom',
            },

            // Bottom 3 - Forecast Day 2
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.02/`,
                modeScr: 'bottom',
            },

            // Bottom 4 - Forecast Day 3
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.03/`,
                modeScr: 'bottom',
            },

            // Bottom 5 - Forecast Day 4
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.04/`,
                modeScr: 'bottom',
            },
            // Bottom 6 - Forecast Day 5
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.05/`,
                modeScr: 'bottom',
            },
            // Bottom 7 -  Forecast Day 6
            {
                type: 'template',
                template: 'text.pirate-weather.bot2values',
                dpInit: `/^pirate-weather\\.0.+?\\.daily\\.06/`,
                modeScr: 'bottom',
            },

            // Bottom 8 - Windgeschwindigkeit
            {
                type: 'template',
                template: 'text.pirate-weather.windspeed',
                dpInit: `/^pirate-weather\\.0\\.weather\\.currently./`,
                modeScr: 'bottom',
            },

            // Bottom 9 - Böen
            {
                type: 'template',
                template: 'text.pirate-weather.windgust',
                dpInit: `/^pirate-weather\\.0\\.weather\\.currently./`,
                modeScr: 'bottom',
            },

            // Bottom 10 - Windrichtung
            {
                type: 'template',
                template: 'text.pirate-weather.winddirection',
                dpInit: `/^pirate-weather\\.0\\.weather\\.currently./`,
                modeScr: 'bottom',
            },

            // Bottom 11 - UV-Index
            {
                type: 'template',
                template: 'text.pirate-weather.uvindex',
                dpInit: `/^pirate-weather\\.0\\.weather\\.currently./`,
                modeScr: 'bottom',
            },

// hier mit kann man dann eine Stundenübersicht erzeugen durch anpassen der 02 bzw. 04
{
                type: 'template',
                template: 'text.pirate-weather.hourlyweather',
                dpInit: `/^pirate-weather\\.0.+?\\.hourly\\.02/`,
                modeScr: 'bottom',
            },
            {
                type: 'template',
                template: 'text.pirate-weather.hourlyweather',
                dpInit: `/^pirate-weather\\.0.+?\\.hourly\\.04/`,
                modeScr: 'bottom',
            },

Da kann man sich einzelne Rauspicken und die dort anzeigen wo man möchte - also bottom geht als favorit und left als bottom usw. wie man möchte.

ticaki

Pirate-Weather

Ist in der aktuellen Githubversion implementiert

hm_krause

@ticaki
Hallo,
leider immer noch der gleiche, nicht funktionende Stand.
Script:

async function configuration(): Promise<void> {

    const overrideConfig: Partial<ScriptConfig.Config> = {
        // hier kann man die Werte von unten überschreiben bzw nicht ewig im Skript suchen wo nochmal die Farbe steht :)
        // pages und subpages geht hier nicht, weil die Seiten ja erst später angelegt werden. Bei const gehts nach Reihenfolge.
        // panelTopic: 'nspanel/ns_panel4',
        weatherEntity: 'openweathermap.0.',
        defaultOffColor: Off,
        defaultOnColor: On,
        weatherAddDefaultItems: false,
    }

        /**************************************************************************************
         **                                                                                  **
         ** https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki/Adapter-Installation **
         **                                                                                  **
         *************************************************************************************/
        
         

        /***********************************************************************
         **                                                                   **
         **                       Page Configuration                          **
         **                                                                   **
         ***********************************************************************/


    // Beispiel Hauptseite / Mainpage
    // Diese Seite ist die Hauptseite, sie wird immer als erstes angezeigt und hat den uniqueName 'main'.
    // uniqueName 'main' muß mindestens einmal vorkommen, damit die Navigation funktioniert.
    const Hauptseite: ScriptConfig.PageGrid = {
        type: 'cardGrid',
        uniqueName: 'main',
        heading: 'Die Leere',
        items: []
    };

    // Diese Konfiguration für den Fahrplan ist ein Beispiel was die interne Adapterkonfiguration benutzt, diese 
    // ist recht komplex und wird nicht weiter erläutert. Da gibts später fertige Templates die man hier verwenden kann.
    // wie am Fahrplan Beispiel zu sehen ist.

    /* const fahrplan: any = {
        heading: 'Fahrplan Script',
        native: {
            card: 'cardEntities',
            dpInit: 'fahrplan.0.0',
            uniqueID: 'fahrplanrouten',
            template: 'entities.fahrplan.routes',
        }
    }; */

    // Konfiguration findet im Admin statt, uniqueName muß gleich dem namen in der Adminkonfiguration sein.

    /* const qrCode: ScriptConfig.PageQR = {
        type: 'cardQR',
        uniqueName: 'qrCode'
    }; */

    // Konfiguration findet im Admin statt, uniqueName muß gleich dem namen in der Adminkonfiguration sein.

    /* const chartHeizung: ScriptConfig.PageChart = {
        type: 'cardChart',
        uniqueName: 'temperatur'
    }; */

    // Ein Beispiel für eine Gridseite mit verschiedenen Farbskalen

    /* const irgendeinName: ScriptConfig.PageGrid = {
        type: 'cardGrid',
        uniqueName: 'main',
        heading: 'Wohnzimmer',
        items: [
            {id: 'alias.0.Temperatur', name: 'standard', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40}},
            {id: 'alias.0.Temperatur', name: 'hue', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue'}},
            {id: 'alias.0.Temperatur', name: 'cie', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie'}},
            {id: 'alias.0.Temperatur', name: 'standard log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'hue log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue', log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'cie log min', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie', log10: 'min'}},
            {id: 'alias.0.Temperatur', name: 'standard', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40}},
            {id: 'alias.0.Temperatur', name: 'hue', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue'}},
            {id: 'alias.0.Temperatur', name: 'cie', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie'}},
            {id: 'alias.0.Temperatur', name: 'standard log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, log10: 'max'}},
            {id: 'alias.0.Temperatur', name: 'hue log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'hue', log10: 'max'}},
            {id: 'alias.0.Temperatur', name: 'cie log max', onColor: Red, offColor: Blue, colorScale: {'val_min': 0, 'val_max': 40, mode: 'cie', log10: 'max'}},
        ]
    }; */

    /* const grid1: ScriptConfig.PageGrid = {
        uniqueName: 'grid1', // keine Navigation, am besten uniqueName von config.ts übernehmen
        heading: 'Grid 1',
        items: [
            {id: 'alias.0.Licht.lights.Gerät_1'},
            {id: 'alias.0.Licht.lights.Gerät_2'},
            {id: '0_userdata.0.Einzelne_Geräte.dimmer'},
            {id: 'alias.0.NSPanel.allgemein.hue', },
            {navigate: true, targetPage: 'fahrplanrouten'},
            {id: 'alias.0.NSPanel.allgemein.shutter'}
        ],
        type: 'cardGrid',
    } */ 

    const config: ScriptConfig.Config = {
        panelTopic: 'topic',
        weatherEntity: 'openweathermap.0.',
        defaultOffColor: Off,
        defaultOnColor: On,
        defaultBackgroundColor: HMIDark,
        weatherAddDefaultItems: false,

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


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

Script Log:

javascript.0	13:54:46.322	info	

Compiling TypeScript source script.js.nspanel-lovelace-ui_0.Panel_1

javascript.0	13:54:46.399	info	

source code did not change, using cached compilation result...

javascript.0	13:54:46.420	info	

registered 0 subscriptions, 0 schedules, 0 messages, 0 logs and 0 file subscriptions

javascript.0	13:54:46.538	info	

[ 'Panel for Topic: topic Script version 0.9.1 is correct!', 'done' ]

javascript.0	13:54:46.673	info	

Stopping script script.js.nspanel-lovelace-ui_0.Panel_1

Adapter:

nspanel-lovelace-ui.0
	2025-08-15 13:55:54.566	info	[Panel_1] Panel startup finished!
nspanel-lovelace-ui.0
	2025-08-15 13:55:54.566	debug	[Panel_1] Set screeensaver timeout to 2s.
nspanel-lovelace-ui.0
	2025-08-15 13:55:54.465	debug	[Panel_1] Set screeensaver timeout to 15s.
nspanel-lovelace-ui.0
	2025-08-15 13:55:54.455	debug	[main] Switch page to visible!
nspanel-lovelace-ui.0
	2025-08-15 13:55:54.024	debug	[controller] Panel E4_65_B8_48_80_70 created
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.715	warn	[Panel_1] is offline!
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.707	info	[Panel_1] is online!
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.549	debug	[system-notifications] Received notifications from "system.host.iob-huawei": {"system":{"categories":{},"description":{"en":"These notifications are collected by the ioBroker system and point to issues you should check and fix.","de":"Diese Benachrichtigungen werden vom ioBroker-System erfasst und weisen auf Probleme hin, die überprüft und behoben werden sollten.","ru":"Эти уведомления собираются системой ioBroker и указывают на проблемы, которые вы должны проверить и исправить.","pt":"Essas notificações são coletadas pelo sistema ioBroker e apontam para problemas que você deve verificar e corrigir.","nl":"Deze meldingen worden verzameld door het ioBroker-systeem en wijzen op problemen die u moet controleren en oplossen.","fr":"Ces notifications sont collectées par le système ioBroker et indiquent des problèmes que vous devez vérifier et résoudre.","it":"Queste notifiche vengono raccolte dal sistema ioBroker e indicano problemi che dovresti controllare e correggere.","es":"Estas notificaciones son recopiladas por el sistema ioBroker y señalan problemas que debe verificar y solucionar.","pl":"Te powiadomienia są zbierane przez system ioBroker i wskazują problemy, które należy sprawdzić i naprawić.","uk":"Ці сповіщення збираються системою ioBroker і вказують на проблеми, які ви повинні перевірити та виправити.","zh-cn":"这些通知由ioBroker系统收集，并指出您应检查并修复的问题"},"name":{"en":"System Notifications","de":"System-Benachrichtigungen","ru":"Системные уведомления","pt":"Notificações do sistema","nl":"Systeemmeldingen","fr":"Notifications système","it":"Notifiche di sistema","es":"Notificaciones del sistema","pl":"Powiadomienia systemowe","uk":"Системні сповіщення","zh-cn":"系统通知"}}}
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.539	debug	[system-notifications] Request notifications from "system.host.iob-huawei"
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.538	debug	[system-notifications] Received notifications from "system.host.Iobroker": {}
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.534	debug	[system-notifications] Request notifications from "system.host.Iobroker"
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.503	debug	[mqttClient] subscripe to: nspanel_1/stat/#
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.501	debug	[mqttClient] subscripe to: nspanel_1/tele/#
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.501	debug	[Panel_1] Panel E4_65_B8_48_80_70 is initialised!
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.451	debug	[controller] Set current Date with time: Fri Aug 15 2025 13:55:51 GMT+0200 (Central European Summer Time)
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.395	debug	[mqttClient] subscripe to: nspanel_1/stat/RESULT
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.343	debug	[controller] controller created
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.342	debug	46401.5234375k
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.340	info	[mqttClient] Connection is active.
nspanel-lovelace-ui.0
	2025-08-15 13:55:51.295	debug	Check configuration!
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.263	info	Force an MQTT reconnect from the Nspanel with the ip 192.168.178.56 in 10 seconds!
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.166	debug	[library] Load language de
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.165	info	Raw script config found for nspanel_1
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.161	debug	[config-manager] Screensaver pageItems count: 17
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.158	warn	Invalid color value: "0_userdata.0.Abfallkalender.1.color"
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.088	info	[config-manager] Start converting configuration for nspanel_1
nspanel-lovelace-ui.0
	2025-08-15 13:55:49.035	info	starting. Version 0.2.4 (non-npm: ticaki/ioBroker.nspanel-lovelace-ui#955fb48e830b9ffc2f648d9d50adbbde0e5318ba) in /opt/iobroker/node_modules/iobroker.nspanel-lovelace-ui, node: v20.19.4, js-controller: 7.0.6
host.Iobroker
	2025-08-15 13:55:47.616	info	instance system.adapter.nspanel-lovelace-ui.0 in version "0.2.4" (non-npm: ticaki/ioBroker.nspanel-lovelace-ui#955fb48e830b9ffc2f648d9d50adbbde0e5318ba) started with pid 45081
host.Iobroker
	2025-08-15 13:55:44.162	info	instance system.adapter.nspanel-lovelace-ui.0 terminated with code 11 (ADAPTER_REQUESTED_TERMINATION)
nspanel-lovelace-ui.0
	2025-08-15 13:55:44.054	info	terminating
host.Iobroker
	2025-08-15 13:55:43.614	info	stopInstance system.adapter.nspanel-lovelace-ui.0 send kill signal
nspanel-lovelace-ui.0
	2025-08-15 13:55:43.569	info	Terminated (ADAPTER_REQUESTED_TERMINATION): Without reason
nspanel-lovelace-ui.0
	2025-08-15 13:55:43.568	info	terminating
nspanel-lovelace-ui.0
	2025-08-15 13:55:43.567	info	[mqttClient] Connection is closed.
nspanel-lovelace-ui.0
	2025-08-15 13:55:43.564	debug	[main] Switch page to invisible!
nspanel-lovelace-ui.0
	2025-08-15 13:55:43.553	info	Got terminate signal TERMINATE_YOURSELF
host.Iobroker
	2025-08-15 13:55:43.550	info	stopInstance system.adapter.nspanel-lovelace-ui.0 (force=false, process=true)

ticaki

@hm_krause

Definiere bitte "nicht funktionende Stand." was genau funktioniert nicht? Bin zuhause - und klimatisiert - heißt ich hab zeit und bin nicht kurz vorm ausflippen wegen hitze

hm_krause

@ticaki
Panel sagt:
waiting for content.....

NEWS

Betatest NSPanel-lovelace-ui v0.2.x

Allgemeines

Screensaver: Windrichtung/-geschwindigkeit für sainlogic

Screensaver: Windrichtung/-geschwindigkeit generisch

Screensaver: Batterieanzeige für bydhvs

Screensaver: Wetterdaten anzeigen für Pirate-Weather oder Openweathermap

Pirate-Weather

Support us

899
Online

32.0k
Users

80.4k
Topics

1.3m
Posts

NEWS

Betatest NSPanel-lovelace-ui v0.2.x

Allgemeines

Screensaver: Windrichtung/-geschwindigkeit für sainlogic

Screensaver: Windrichtung/-geschwindigkeit generisch

Screensaver: Batterieanzeige für bydhvs

Screensaver: Wetterdaten anzeigen für Pirate-Weather oder Openweathermap

Pirate-Weather

Support us

899Online

32.0kUsers

80.4kTopics

1.3mPosts

899
Online

32.0k
Users

80.4k
Topics

1.3m
Posts