Der neue Monatsrückblick für Mai und Juni 2026 ist online!

[mcm1957]

https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/issues/743

[TT-Tom]

@teletapi
Ist bekannt und wird nach dem Urlaub umgesetzt. Letzte Beta Version wird für den Admin 7.x ins Stable gehen.

[Foradh 0]

Hallo zusammen,
ich würde gerne von einer vorhanden Installation "NSPanel Lovelace UI" ohne Adapter mit TS Script auf den neuen Adapter wechseln.
Ist es möglich die bestehende Konfiguration zu migrieren?
Diese sah bisher folgendermaßen aus

let NSPanel_Seite1: PageGrid =
            {
                'type': 'cardGrid',
                'heading': 'Home',
                'useColor': true,
                'items': [
                    <PageItem>{ navigate: true, id: 'Thermostat', icon: 'thermostat',offColor: White, onColor: White, name: 'Thermostat'},
                    <PageItem>{ navigate: true, id: 'NSPanel_Licht1', icon: 'lightbulb-group',offColor: White, onColor: White, name: 'Licht'},
                    <PageItem>{ navigate: true, id: 'NSPanel_Fenster', icon: 'window-closed-variant',offColor: White, onColor: White, name: 'Fenster/Türen'},
                    <PageItem>{ navigate: true, id: 'NSPanel_Abfall', icon: 'trash-can',offColor: White, onColor: White, name: 'Abfall'},
                    <PageItem>{ navigate: true, id: 'NSPanel_Energie', icon: 'home-lightning-bolt-outline',offColor: White, onColor: White, name: 'Energie'},
                    <PageItem>{ navigate: true, id: 'NSPanel_WLAN', icon: 'wifi',offColor: White, onColor: White, name: 'Gäste WLAN'},
           
                ]
            };

    let Thermostat: PageThermo =
    {
    'type': 'cardThermo',
    'heading': 'Solltemperatur',
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    'items': [<PageItem>{ 
                id: 'alias.0.NSPanel.Thermostat.Thermostat_Buero_OG', 
                minValue: 100, 
                maxValue: 250,
                stepValue: 5
             }]
    };

    let NSPanel_Licht1: PageGrid =
    {
    'type': 'cardGrid',
    'heading': 'Licht',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    'items': [
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Gartenbeleuchtung', icon: 'lightbulb', offColor: White, onColor: Yellow, name: 'Garten', monobutton: true},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Poolbeleuchtung', icon: 'lightbulb', offColor: White, onColor: Yellow, name: 'Pool', monobutton: true},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Saunaraumbeleuchtung', icon: 'lightbulb', offColor: White, onColor: Yellow, name: 'Saunaraum', monobutton: true},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.WLED_Wohnzimmer', icon: 'lightbulb', offColor: White, onColor: Yellow, name: 'Wohnzimmer', monobutton: true},
    ]
    };

    let NSPanel_Fenster: PageGrid =
    {
    'type': 'cardGrid',
    'heading': 'Fenster/Türen',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    'items': [
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Noel_Tür', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Noel'},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Schlafzimmertür', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Schlafzimmer'},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Badfenster_OG', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Bad OG'},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Bandfenster_EG', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Bad EG'},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Heizung_Fenster', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Heizung'},
        <PageItem>{id: 'alias.0.NSPanel.Geräte.Wohnzimmertür', icon: 'window-open-variant', icon2: 'window-closed-variant', offColor: MSGreen, onColor: MSRed, name: 'Wohnzimmertür'},
    ]
    };

    let NSPanel_Abfall: PageEntities =
    {
    'type': 'cardEntities',
    'heading': 'Abfallkalender',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    "items": [
        <PageItem>{ id: 'alias.0.NSPanel.Abfall.event_1', icon: 'trash-can'},  
        <PageItem>{ id: 'alias.0.NSPanel.Abfall.event_2', icon: 'trash-can'},  
        <PageItem>{ id: 'alias.0.NSPanel.Abfall.event_3', icon: 'trash-can'},  
        <PageItem>{ id: 'alias.0.NSPanel.Abfall.event_4', icon: 'trash-can'}  
    ]
    };

    var NSPanel_Energie: PagePower =
    {
    'type': 'cardPower',
    'heading': 'Energie',
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    "items": [
 //       <PageItem>{  }, //Demomode
        <PageItem>{ id: "alias.0.NSPanel.Geräte.CardPower",
                    alwaysOnDisplay: true }
    ]
};

    let NSPanel_WLAN: PageQR =
    {
     'type': 'cardQR',
     'heading': 'Gäste WLAN',
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
     'items': [
         <PageItem>{ id: 'alias.0.NSPanel.Geräte.Gäste_WLAN', hidePassword: false }
     ]
    };

//-- Seite 2 
let NSPanel_Seite2: PageGrid =
            {
                'type': 'cardGrid',
                'heading': 'Home',
                'useColor': true,
                'items': [
                    <PageItem>{ navigate: true, id: 'NSPanel_Maehroboter', icon: 'robot-mower',offColor: White, onColor: White, name: 'Mähroboter'},
                    <PageItem>{ navigate: true, id: 'NSPanel_Pool', icon: 'pool',offColor: White, onColor: White, name: 'Pool'},
                    <PageItem>{ navigate: true, id: 'NSPanel_GoogleKalender', icon: 'calendar',offColor: White, onColor: White, name: 'Kalender'},
           
                ]
            };

    let NSPanel_Maehroboter: PageEntities =
    {
    'type': 'cardEntities',
    'heading': 'Mähroboter',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite2,
    'home': 'NSPanel_Seite1',
    'items': [
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Mähroboter_Status', icon: 'robot-mower', offColor: White, onColor: White, name: 'Status'},
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Mähroboter_Batterie', icon: 'battery', offColor: White, onColor: White, name: 'Batterie'},
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Mähroboter_Messer', icon: 'box-cutter', offColor: White, onColor: White, name: 'Messerqualität'},
    ]
    };

    let NSPanel_Pool: PageEntities =
    {
    'type': 'cardEntities',
    'heading': 'Pool',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite2,
    'home': 'NSPanel_Seite1',
    'items': [
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Pool_PH', icon: 'water', offColor: White, onColor: White, name: 'PH Wert'},
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Pool_Chlor', icon: 'water', offColor: White, onColor: White, name: 'Redox Wert'},
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Pool_Temp', icon: 'water-thermometer', offColor: White, onColor: White, name: 'Temperatur'},

    ]
    };

    let NSPanel_Waschmaschine: PageEntities =
    {
    'type': 'cardEntities',
    'heading': 'Waschmaschine',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite1,
    'home': 'NSPanel_Seite1',
    'items': [
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Waschmaschine_Status', icon: 'washing-machine', offColor: White, onColor: Yellow, name: 'Status'},
        <PageItem>{ id: 'alias.0.NSPanel.Geräte.Waschmaschine_Restzeit', icon: 'timer', offColor: White, onColor: Yellow, name: 'Restzeit'},
    ]
    };
   
    let NSPanel_GoogleKalender: PageEntities =
    {
    'type': 'cardEntities',
    'heading': 'Kalender',
    'useColor': true,
    'subPage': true,
    'parent': NSPanel_Seite2,
    'home': 'NSPanel_Seite1',
    "items": [
        <PageItem>{ id: 'alias.0.NSPanel.GoogleKalender.event_1', icon: 'calendar'},  
        <PageItem>{ id: 'alias.0.NSPanel.GoogleKalender.event_2', icon: 'calendar'},  
        <PageItem>{ id: 'alias.0.NSPanel.GoogleKalender.event_3', icon: 'calendar'},  
        <PageItem>{ id: 'alias.0.NSPanel.GoogleKalender.event_4', icon: 'calendar'}  
    ]
    };

Ich habe im Adapter zum Test eine Menüseite erstellt und verstehe leider nicht ganz wie ich die im Adapter erstellen Seiten in das TS Skript vom Adapter einpflegen muss.

Beste Grüße
Foradh

[MichaelF]

@Foradh-0

Hi, im prinzip genauso wie in dem alten script.

Der Adaper erzeugt diese scripte:

und hier werden dann die Seiten angelegt:

    /**************************************************************************************
     **                                                                                  **
     ** 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 main: PageType = {
        type: 'cardThermo2',
        uniqueName:'main',
        heading: 'Bad',
        thermoItems:[
            {name: 'Bad', id:'alias.0.NSPanel.Thermostat_Bad', minValue: 10.0, maxValue:30.0, stepValue: 0.5, unit: "°C" modeList:['Manuell','Automatik'], modeId:'alias.0.NSPanel.Thermostat_Bad.MODE', thermoId1:'alias.0.NSPanel.Thermostat_Bad.ACTUAL', set:'alias.0.NSPanel.Thermostat_Bad.SET', thermoId2:'alias.0.NSPanel.Thermostat_Bad.HUMIDITY'}],
            items:[
        { id: 'alias.0.NSPanel.TemperaturWassserSpeicher', name: 'TemperaturSpeicher', useValue: true, suffixName: '°C', fontSize: 0 },
        { id: 'alias.0.NSPanel.Dachfenster', name: 'Dachfenster', icon: 'window-open-variant', icon2: 'window-closed-variant', onColor: MSRed, offColor: MSGreen},
        { id: 'alias.0.NSPanel.Heizung', icon: 'heat-wave', offColor: MSRed, onColor: MSGreen, name: 'Heizung'},
        //{ navigate: true, id: null, targetPage: 'Abfall', onColor: White, name: 'Abfallkalender', icon: 'trash-can'},
        { id: 'alias.0.NSPanel.Heizung_Spiegel', icon: 'heat-pump-outline', offColor: MSRed, onColor: MSGreen, name: 'Speigelheizung'},
        { id: 'alias.0.NSPanel.Endstufe', icon: 'soundbar', offColor: MSRed, onColor: MSGreen, name: 'Endstufe'},
        { id: 'alias.0.NSPanel.Lüfter',name: 'Ventilator', icon: 'fan', onColor: On, offColor: HMIOff},
        { id: 'alias.0.NSPanel.Fussbodenheizung', icon: 'heating-coil', offColor: MSRed, onColor: MSGreen, name: 'Fussbodenheizung'},
        { id: 'alias.0.NSPanel.Deckenbeleuchtung_Klein', icon: 'lightbulb', offColor: MSRed, onColor: MSGreen, name: 'Licht'}
            ],
    };

        const powerGrid: ScriptConfig.PagePower = {
        uniqueName: 'Solar', // muss mit dem Namen im Admin übereinstimmen
        type: 'cardPower'
    };

const Bad1: ScriptConfig.PageEntities ={
    type: 'cardEntities',
    uniqueName: 'Bad1',
    heading: 'Bad',
    useColor: true,
    items: [
        { id: 'alias.0.NSPanel.Deckenbeleuchtung_Gross', interpolateColor: true, name: 'Licht Gross'},
        { id: 'alias.0.NSPanel.Deckenbeleuchtung_Klein', interpolateColor: true, name: 'Licht Klein'},
        { id: 'alias.0.NSPanel.Lüfter', icon: 'power', offColor: MSRed, onColor: MSGreen, name: 'Lüfter'},
        { id: 'alias.0.NSPanel.Endstufe', icon: 'power', offColor: MSRed, onColor: MSGreen, name: 'Endstufe'},
    ]
};

const Bad2: ScriptConfig.PageEntities ={
    type: 'cardEntities',
    uniqueName: 'Bad2',
    heading: 'Bad',
    useColor: true,
    items: [
        { id: 'alias.0.NSPanel.Heizung_Spiegel', icon: 'power', offColor: MSRed, onColor: MSGreen, name: 'Speigelheizung'},
        { id: 'alias.0.NSPanel.Dachfenster', onColor: White, name: 'Dach Kuppel'},
        { id: 'alias.0.NSPanel.Heizung', icon: 'power', offColor: MSRed, onColor: MSGreen, name: 'Heizung'},
        { id: 'alias.0.NSPanel.Fussbodenheizung', icon: 'power', offColor: MSRed, onColor: MSGreen, name: 'Fussbodenheizung'}
    ]
};

Alternativ lassen sich auch Seiten in dem Adapter selbst anlegen, ist in der Doku gut beschrieben. Ich bin auch von dem Scrip zum Adapter gewechselt hat ein wenig gedauert ist dann aber wesentlich komfortabler.

Grüße

[TT-Tom]

@Foradh-0 sagte:

Ich habe im Adapter zum Test eine Menüseite erstellt und verstehe leider nicht ganz wie ich die im Adapter erstellen Seiten in das TS Skript vom Adapter ein pflegen muss.

Welche Version hast du Installiert?
Hast du die Anleitung im Wiki gelesen?
Wo ist dein aktueller Stand?

Du benötigst im Script mindestens eine main - Seite. Die restlichen Seiten können über den Adapter erstellt werden. Es befindet sich auf jedem Tab in der Adapter Config ein Link ins Wiki. Dort ist alles dann beschrieben, sollten Fragen offen sein, hier melden.

Im Abschnitt ScriptConfig https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki/ScriptConfig#seiten-konfiguration ist auch die neue Schreibweise beschrieben, ich würde dir aber zur Config der Seiten im Adapter raten. Wichtig erst Seiten anlegen, dann die Navigation zu den Seiten.

[ticaki]

v1.0.0

mit Unterstützung für admin8 - und Mindestanforderung admin8

[MichaelF]

@ticaki

Kann ich dann nicht updaten?

Meine Version:

[ticaki]

Ja, die version ist für admin 8 - admin 8 ist breaking. Ich mußt dafür auch hoch gehen, wollte ich eigentlich nicht aber geht ja nicht anders

[teletapi]

@ticaki sagte:

Ja, die version ist für admin 8 - admin 8 ist breaking. Ich mußt dafür auch hoch gehen, wollte ich eigentlich nicht aber geht ja nicht anders

läuft aber alles

[ticaki]

ja geht alles, zum Glück. Aber vorher ging auch alles ;)