Sonoff NSPanel by ITead - Smart Scene Wall Switch based on ESP32 and custom Nextion Touch Screen Panel Display (non-Pro variant)

Was Tuning the Media-Card to assist a previous post from sandoz.cloud and found the font a touch big to show six Radio stations using text. Can we please have the font reduced at least to be able to use 3 characters, where four would be better.

Below is the Card configuration followed by the script - hope this clears things up for you sandoz.cloud

type: cardMedia
title: Kitchen Speaker
key: kitchenMediaKey
sleepTimeout: 0
navItem1:
  entity: navigate.ssKey
  icon: mdi:home
  color: [55, 55, 55]
navItem2:
  entity: navigate.kitchenKey
  icon: mdi:arrow-up-bold
  color: [55, 55, 55]
entity: media_player.kitchen_speaker
entities:
  - entity: service.script.turn_on
    icon: text:91.9
    data:
      entity_id: script.radio_player
      variables:
        radio_id: Smooth
        radio_type: music
        speaker_id: Kitchen
  - entity: service.script.turn_on
    icon: text:3AW
    data:
      entity_id: script.radio_player
      variables:
        radio_id: 3AW
        radio_type: music
        speaker_id: Kitchen
  - entity: service.script.turn_on
    icon: text:Gol
    data:
      entity_id: script.radio_player
      variables:
        radio_id: Gold
        radio_type: music
        speaker_id: Kitchen
  - entity: service.script.turn_on
    icon: text:Fox
    data:
      entity_id: script.radio_player
      variables:
        radio_id: Fox
        radio_type: music
        speaker_id: Kitchen
  - entity: service.script.turn_on
    icon: text:Nov
    data:
      entity_id: script.radio_player
      variables:
        radio_id: Nova
        radio_type: music
        speaker_id: Kitchen
  - entity: service.script.turn_on
    icon: text:Joy
    data:
      entity_id: script.radio_player
      variables:
        radio_id: Joy
        radio_type: music
        speaker_id: Kitchen

Script to play radio

alias: Radio - Player
variables:
  radio_mapper:
    3AW: https://21363.live.streamtheworld.com/3AWAAC.aac?dist=onlineradiobox
    Smooth: media-source://radio_browser/a2ad30cb-205d-4c46-b14b-ad2363676b23
    Gold: https://ais-arn.streamguys1.com/au_004_icy
    Fox: http://legacy.scahw.com.au/3fox_32
    Nova: http://streaming.novaentertainment.com.au/nova100
    Joy: https://stream.joy.org.au/proxy/joy949?mp=/live
  image_mapper:
    3AW: https://aimresource.b-cdn.net/cra/images/watch_3aw.png
    Smooth: https://aimresource.b-cdn.net/cra/images/watch_3smooth.png
    Gold: https://aimresource.b-cdn.net/cra/images/watch_3kkz.png
    Fox: https://aimresource.b-cdn.net/cra/images/watch_3fox.png
    Nova: https://aimresource.b-cdn.net/cra/images/watch_3mel.png
    Joy: /local/my-radio/joy.jpg
  speaker_mapper:
    Exercise: media_player.exercise_speaker
    Guest: media_player.guest_speaker
    Kitchen: media_player.kitchen_speaker
    Lounge: media_player.lounge_speakers
    Master: media_player.master_speaker
    Study: media_player.study_speaker
    Tara: media_player.tara_speaker
sequence:
  - service: media_player.media_stop
    target:
      entity_id: "{{ speaker_mapper[speaker_id] }}"
    data: {}
  - service: tts.cloud_say
    data:
      entity_id: "{{ speaker_mapper[speaker_id] }}"
      message: This automation is slow but the radio will turn on
      cache: true
  - service: media_player.play_media
    data:
      media_content_id: "{{ radio_mapper[radio_id] }}"
      media_content_type: "{{ radio_type }}"
      enqueue: replace
      extra:
        thumb: "{{ image_mapper[radio_id] }}"
    target:
      entity_id: "{{ speaker_mapper[speaker_id] }}"
mode: restart
icon: mdi:radio

Anyway a minor issue the second icon is not showing inside the box.

Yeah, there wasnā€™t really space to fit that anywhere.

Might be possible to automatically change the font on more than 3 chars, can you open a FR for this on GitHub?

I tried to add the home button but the button is not visible. I added this code to yaml

model: eu
    homeButton: true
    sleepTimeout: 20

Does anyone has a tipp?

Hey this was removed with implementing navItem1 and navItem2

https://docs.nspanel.pky.eu/subpages/?h=navi#override-navigation-items-itself

You 'll need to configure navItem2 with navigate.

1 Like

Hi,

Any progress on this project? Would love the details about integrating it to homekit. I use homebridge and MQTT, but not yet been sure how to tget the NSpanel (Pro version in my case) to work like yours?
Do you have a git page where to check code and documentation ?

Thanks!

Hi,

I have yesterday update ā€œNS Panel Lovelace UIā€ from 3.9.4 to the new version 4.0.5.

The panel then asked for an update, which I did.

Now I have the same problem again, which shows me the power card nothing:

Furthermore, the screen shows me when I want to show Screensaver2.
Unfortunately only the time and date?

Iā€™ve also tried to see if the old version would work.

FlashNextion http://nspanel.pky.eu/lovelace-ui/github/nspanel-v3.9.3.tft

But when I play it, I get a message on the panel that a newer one is available.

Did you restart the AppDaemon Addon?

That was it. Oh man, I thought I completely redesigned home assistant.

Well, learned something again. Thank you

Is there any way to get the standard energy dashboard from Home Assistant to display on the NSPanel (ideally the non-pro) variant? I know of the power panel with Lovelace UI, but I prefer the looks from the energy dashboard.

1 Like

I would love it when the Power card could make easy calculations, such as home is the sum of solar and grid.
NVM, that was already possibleā€¦

EDIT: solved!

Hi,

I run the NS Panel EU together with JoBrā€™s Firmware. I use ESPHome instead of Tasmota. It worked well for months until I made an update this morning. Now it sucks with the ā€œWaiting for Contentā€ ā€¦ circle.

I checked the FAQ (FAQ - NsPanel Lovelace UI Docs) to find the issue step by step.

The AppDamon Log says that MQTT is connected (I also can see the topics in the MQTTMonitor). But it seems like the Panel itself does not connect anymore:

[10:52:09][W][mqtt:264]: MQTT Disconnected: TCP disconnected.
[10:52:09][I][mqtt:176]: Connecting to MQTT...

This is what the Logs of EspHome is are showing. But I donā€™t get it, Broker, Password, User, nspanel.yaml, als the same.

Does anyone know how to fix this?

Thanks in advance,
Florian

EDIT:

Sorry, this is solved. I changed the secrets of EspHome to a forwarder to the secrets.yaml of HA itself a long while ago. In this file the MQTT server was not correct ā€¦ an obviously I did not install the config since then.
Searching for hours, then add the questions a minutes later I found it. Sorry.

1 Like

Hi. I have a very simple question, but not sure how to solve and couldnā€™t find an answer for days. Iā€™m programming the NSPanel with a custom UI (see screenshot), and Iā€™m trying to change 2 items (a double state button and a text field that has the label at the same time) but Iā€™m not able to figure out how to do it. Reason is text (label) has a background, and I need to change both the button and the text at time of pressing. Thanks!!

Is there a easy way to change the value of speed in negative or positive, depending on the positive or negative value of a sensor?

Eg if I am importing electricity (sensor value is negative eg -3000 W) , speed should be -20 ( and when I am exporting (sensor value is positive eg +200 W) electricity, speed should be +20

you can calculate the speed using a template

https://docs.nspanel.pky.eu/card-power/?h=speed

Im driving my self crazy here!
I implemented an alarm panel, but I want to lock the nspanel to the ā€œdisarmā€ screen when the alarm is on.
Here is my code:

switch:
  - platform: template
    name: $device_name Alarm screen
    id: alarm_activated
    restore_state: false
    assumed_state: off
    optimistic: true
    lambda: |-
      if (id(alarm_estado).state == "arming" or id(alarm_estado).state == "armed_away" or id(alarm_estado).state == "armed_home" or id(alarm_estado).state == "triggered"  or id(alarm_estado).state == "pending"  ) {
        return true;
      } else {
        return false;
      }
    on_turn_on:
      - lambda: id(disp1).send_command_printf("page 11");
    on_turn_off:
      - lambda: id(disp1).send_command_printf("page 0");
display:
  - platform: nextion
    id: disp1
    uart_id: tf_uart
    tft_url: $tft_url
    # A little fun...
    on_setup:
      then:
        # Enable 1 light page (up to 4 available)
        - lambda: id(disp1).send_command_printf("Lights.pages.val=1");
        - number.set:
            id: brightness
            value: 30
        - lambda: id(disp1).send_command_printf("page 4");
        - wait_until:
            api.connected
        - switch.template.publish:
            id: nextion_init
            state: on
        - if:
            condition:
              - switch.is_on: alarm_activated
            then:
              - lambda: id(disp1).send_command_printf("page 11");
            else:
              - delay: 5s
              - lambda: id(disp1).send_command_printf("page 0");

The page 11 is the ā€œdisarmā€ screen. The page 0 ih the ā€œHomeā€ screen. There is also a page 5 that is the ā€œArmā€ screen.

Every time I arm the alarm it goes to page 11 but when the screen goes to sleep it comes back to home screen, but I want to lock it on the ā€œdisarmā€ screen.

To be clearerā€¦ ā€œArmā€ screen is the one where I can Arm the alarm, and ā€œdisarmā€ screen is the one for disarming de alarm.

Hi Claire
I hope you cane help please? I am trying to replicate you radio function but i am just getting the standard media card with no Navigation keys or option to choose radio station. Here is my code - any ideas?

    cards:
      - type: cardGrid
        entities:
          - entity: light.livingroomshelly
            name: Living Room
          - entity: light.diningroomshelly
            name: Dining Room
          - entity: switch.dining_lamp
            name: Lamp
            icon: mdi:lamp
          - entity: switch.lamp2
            name: Lamp
            icon: mdi:lamp
          - entity: scene.movie_mode
            name: Movie Mode
            icon: mdi:theater
        key: HomePage
        title: Lights
      - type: cardThermo
        title: Heating
        entity: climate.hive
      - type: cardEntities
        entities:
          - entity: sensor.recycling_bins
            name: Recycling
            icon: mdi:recycle
          - entity: sensor.food_waste
            name: Food Waste
            icon: mdi:food
          - entity: sensor.black_bins
            name: Black Bins
            icon: mdi:delete
          - entity: sensor.green_bins
            name: Garden Waste
            icon: mdi:shovel
        title: Bin Collection
      - type: cardMedia
        title: Living Room Speaker
        key: kitchenMediaKey
        sleepTimeout: 0
        navitem1:
          entity: navigate.ssKey
          icon: mdi:home
          color: [55, 55, 55]
        navitem2:
          entity: navigate.KitchenKey
          icon: mdi:arrow-up-bold
          color: [55, 55, 55]
        entity: media_player.living_room
    entities:
      - entity: service.script.turn_on
        icon: text:91.9
        data:
          entity_id: script.radio_player
          variables:
            radio_id: Smooth
            radio_type: music
            speaker_id: LivingRoom
      - entity: service.script.turn_on
        icon: text:3AW
        data:
          entity_id: script.radio_player
          variables:
            radio_id: 3AW
            radio_type: music
            speaker_id: LivingRoom
      - entity: service.script.turn_on
        icon: text:Gol
        data:
          entity_id: script.radio_player
          variables:
            radio_id: Gold
            radio_type: music
            speaker_id: LivingRoom

your indentation is wrong entities is on the wrong level

      - type: cardMedia
        title: Living Room Speaker
        key: kitchenMediaKey
        sleepTimeout: 0
        navitem1:
          entity: navigate.ssKey
          icon: mdi:home
          color: [55, 55, 55]
        navitem2:
          entity: navigate.KitchenKey
          icon: mdi:arrow-up-bold
          color: [55, 55, 55]
        entity: media_player.living_room
        entities:
          - entity: service.script.turn_on
            icon: text:91.9
            data:
              entity_id: script.radio_player
              variables:
                radio_id: Smooth
                radio_type: music
                speaker_id: LivingRoom
          - entity: service.script.turn_on
            icon: text:3AW
            data:
              entity_id: script.radio_player
              variables:
                radio_id: 3AW
                radio_type: music
                speaker_id: LivingRoom
          - entity: service.script.turn_on
            icon: text:Gol
            data:
              entity_id: script.radio_player
              variables:
                radio_id: Gold
                radio_type: music
                speaker_id: LivingRoom

Thank you for the reply - sorry my YAML skills are not very good, could you help to fix the config? When i use your example i get a lot of ā€œend of stream or a document serperator expectedā€ messages in Studio Code Server

1 Like

this should be ok:

cards:
      - type: cardGrid
        entities:
          - entity: light.livingroomshelly
            name: Living Room
          - entity: light.diningroomshelly
            name: Dining Room
          - entity: switch.dining_lamp
            name: Lamp
            icon: mdi:lamp
          - entity: switch.lamp2
            name: Lamp
            icon: mdi:lamp
          - entity: scene.movie_mode
            name: Movie Mode
            icon: mdi:theater
        key: HomePage
        title: Lights
      - type: cardThermo
        title: Heating
        entity: climate.hive
      - type: cardEntities
        entities:
          - entity: sensor.recycling_bins
            name: Recycling
            icon: mdi:recycle
          - entity: sensor.food_waste
            name: Food Waste
            icon: mdi:food
          - entity: sensor.black_bins
            name: Black Bins
            icon: mdi:delete
          - entity: sensor.green_bins
            name: Garden Waste
            icon: mdi:shovel
        title: Bin Collection
      - type: cardMedia
        title: Living Room Speaker
        key: kitchenMediaKey
        sleepTimeout: 0
        navitem1:
          entity: navigate.ssKey
          icon: mdi:home
          color: [55, 55, 55]
        navitem2:
          entity: navigate.KitchenKey
          icon: mdi:arrow-up-bold
          color: [55, 55, 55]
        entity: media_player.living_room
        entities:
          - entity: service.script.turn_on
            icon: text:91.9
            data:
              entity_id: script.radio_player
              variables:
                radio_id: Smooth
                radio_type: music
                speaker_id: LivingRoom
          - entity: service.script.turn_on
            icon: text:3AW
            data:
              entity_id: script.radio_player
              variables:
                radio_id: 3AW
                radio_type: music
                speaker_id: LivingRoom
          - entity: service.script.turn_on
            icon: text:Gol
            data:
              entity_id: script.radio_player
              variables:
                radio_id: Gold
                radio_type: music
                speaker_id: LivingRoom    

even though this isnā€™t different from what Iā€™ve posted above, no issues when testing with an online yaml parser