HA SwitchPlate HASPone: DIY In-Wall Touchscreen Home Assistant Controller

@ShadowDrake Thanks that helped allot. That is so cool, to be honest I didn’t know it was a colored screen! Another thing I’ve noticed: If I modify automations, and reload them, the automations under the “Plate” tab, disappear and the wall plate stops working.

Does anyone know why they automations do not reload just for the plate? The only way I’ve found to fix it is to reboot HASSIO, then reenable the automations from the “Plate” tab.

Reload automations flat out isn’t going to work, it’s a Hass thing when using packages. Expect to have to fully restart Home Assistant to pull in any changes while using packages.

There is a feature request to enable reloading automations from packages if that would make anyone feel better: https://community.home-assistant.io/t/reload-when-using-packages

I didn’t know of that. I have just voted. It would be nice that everyone vote there, so we will have more chance that it will be implemented.

I voted for it also, ugg getting tired of restarting HASSIO. I have over 100 ZWAVE devices so it takes a while.

Has anyone had any luck getting the media portion to work correctly. The pause rewind and fas forward work, but I can’t get it to update the artist etc.

here is what I tried:

      data:
        topic: 'hasp/plate01/command/p[8].b[4].font'
        payload_template: '{% if media_player.googlehome0996.media_artist.state|length <= 6 -%}3{% elif (media_player.googlehome0996.media_artist.state|length > 6) and (media_player.googlehome0996.media_artist.state|length <= 10) %}2{% elif (media_player.googlehome0996.media_artist.state|length > 10) and (media_player.googlehome0996.media_artist|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].txt'
        payload_template: '"{{ media_player.googlehome0996.media_artist.state|wordwrap(20, wrapstring="\\r") }}"'
  
  - alias: hasp_plate01_p8_MediaTitle
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].font'
        payload_template: '{% if |length <= 6 -%}3{% elif (media_player.googlehome0996.media_title.state|length > 6) and (media_player.googlehome0996.media_title.state|length <= 10) %}2{% elif (media_player.googlehome0996.media_title.state|length > 10) and (media_player.googlehome0996.media_title.state|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].txt'
        payload_template: '"{{ media_player.googlehome0996.media_title.state|wordwrap(20, wrapstring="\\r") }}"'
  

Here is my device I want to control:

volume_level: 0.6000000238418579
is_volume_muted: false
media_content_id: YArQ641o8V8
media_content_type: music
media_duration: 219
media_position: 0.724
media_position_updated_at: 2018-08-15T23:37:42.255158+00:00
media_title: Only Time
media_artist: Enya
app_id: XXXXXX
app_name: YouTube Music
friendly_name: Master Bathroom Speaker
entity_picture: /api/media_player_proxy/media_player.googlehome0996?token=TOOKOUT
supported_features: 21437

For some background: the way the automations for the media player were built when I wrote this was due to entity attributes not being available in templates. At the time, creating template sensors to hold those values was how that got done, so that’s what the demo included with HASP does. In v0.67 we finally got a new Jina2 function state_attr() which will return a specific attribute which can greatly simplify the automations being demonstrated. At some point I’m going to have to re-write several of the demos to utilize this new function.

So to your problem - first, the template which you’ve created won’t work at all, so I’d like to suggest taking a look at the Template Editor which looks like this in the sidebar:
Template Editor

In there you can paste your templates and see how they render before trying to put them into an automation (and then having to reload hass). Jinja templating is tricky business, you’re going to need to learn how to use it, and shooting blind is going to be painful. Learn to use the editor and you’ll save yourself all sorts of misery.

I’ve edited the code you’ve pasted with what I think should be a workable solution:

      data:
        topic: 'hasp/plate01/command/p[8].b[4].font'
        payload_template: '{% if state_attr('media_player.googlehome0996', 'media_artist')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 6) and (state_attr('media_player.googlehome0996', 'media_artist')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 10) and (media_player.googlehome0996.media_artist|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].txt'
        payload_template: '"{{ state_attr('media_player.googlehome0996', 'media_artist')|wordwrap(20, wrapstring="\\r") }}"'
  
  - alias: hasp_plate01_p8_MediaTitle
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].font'
        payload_template: '{% if state_attr('media_player.googlehome0996', 'media_title')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 6) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 10) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].txt'
        payload_template: '"{{ state_attr('media_player.googlehome0996', 'media_title')|wordwrap(20, wrapstring="\\r") }}"'
1 Like

I think I’m stumped. It’s complained about a few things to which I’ve tried to fix and maybe I made it worse:

##############################################################################
# Automations to display media player info on page 8

automation:
# Initialize button text/font for media controls on start
  - alias: hasp_plate01_p8_MediaInit
    trigger:
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[6].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[8].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[6].txt'
        payload: '"9"'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].txt'
        payload: '";"'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[8].txt'
        payload: '":"'
  
  # Play/Pause button action
  - alias: hasp_plate01_p8_MediaPauseButton7
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[7]'
      payload: 'ON'
    action:
      service: media_player.media_play_pause
      entity_id: media_player.googlehome0996
  
  # Prev Track button action
  - alias: hasp_plate01_p8_MediaPrevTrackButton6
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[6]'
      payload: 'ON'
    action:
      service: media_player.media_previous_track
      entity_id: media_player.googlehome0996
      
  # Next Track button action
  - alias: hasp_plate01_p8_MediaNextTrackButton8
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[8]'
      payload: 'ON'
    action:
      service: media_player.media_next_track
      entity_id: media_player.googlehome0996
      
  # Scale media information fonts to fit
  # 0 consolas 24 - 20 chars x 2 lines (wrapped)
  # 1 consolas 32 - 15 chars x 2 lines (wrapped)
  # 2 consolas 48 - 10 chars x 1 line
  # 3 consolas 80 - 6 chars x 1 line
  - alias: hasp_plate01_p8_MediaArtist
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].font'
        payload_template: <{% if (state_attr('media_player.googlehome0996', 'media_artist')|length <= 6) -%}3{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 6) and (state_attr('media_player.googlehome0996', 'media_artist')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 10) and (state_attr('media_player.googlehome0996', 'media_artist')|length <= 15) %}1{% else %}0{%- endif %}>
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].txt'
        payload_template: <"{{ state_attr('media_player.googlehome0996', 'media_artist')|wordwrap(20, wrapstring="\\r") }}">
    - alias: hasp_plate01_p8_MediaTitle
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].font'
        payload_template: <{% if (state_attr('media_player.googlehome0996', 'media_title')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 6) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 10) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 15) %}1{% else %}0{%- endif %}>
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].txt'
        payload_template: <"{{ state_attr('media_player.googlehome0996', 'media_title')|wordwrap(20, wrapstring="\\r") }}">
  - alias: hasp_plate01_p8_MediaPlayPause
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].txt'
        payload_template: "\"{%- if is_state('media_player.googlehome0996', 'playing') %};{% elif is_state('media_player.googlehome0996', 'paused') %}4{% endif -%}\""
  
  # Volume slider value published, apply published state
  - alias: hasp_plate01_p8_MediaVolSliderUpdateHass
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[9].val'
    action:
    - service: sensor.media_player_volume
      data_template:
        entity_id: media_player.googlehome0996
        volume_level: '{{ (trigger.payload|int) / 100 }}'
        
  # Volume slider value changed by hass, update HASP 
  - alias: hasp_plate01_p8_MediaVolSliderUpdateHASP 
    trigger:
    - platform: state
      entity_id: sensor.media_player_volume
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[9].val'
        payload_template: '{{ (media_player.googlehome0996.volume_level * 100)|int }}'

error:

Testing configuration at /config ERROR:homeassistant.util.yaml:YAML file /config/packages/plate01/hasp_plate01_p8_media.yaml contains duplicate key "trigger". Check lines 72 and 88. ERROR:homeassistant.util.yaml:YAML file /config/packages/plate01/hasp_plate01_p8_media.yaml contains duplicate key "action". Check lines 78 and 94.
10:13 PM components/hassio/__init__.py (ERROR)
YAML file /config/packages/plate01/hasp_plate01_p8_media.yaml contains duplicate key "action". Check lines 78 and 94.
10:12 PM util/yaml.py (ERROR)
YAML file /config/packages/plate01/hasp_plate01_p8_media.yaml contains duplicate key "trigger". Check lines 72 and 88.

I may just give up on the media page. Everything else is working pretty well. I created a video for first time setup.

You have an indentation error on line 88 ( - alias: hasp_plate01_p8_MediaTitle). You have 4 leading spaces on that line, when it should have 2. Sadly, this is super typical when dealing with YAML.

Thanks. That took care of the error I was getting but still the screen wont update with whats playing. I had to change some of your lines to start with < instead of ’

<{% if state_attr('media_player.googlehome0996', 'media_title')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 6) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 10) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 15) %}1{% else %}0{%- endif %}>

Is that okay?

I don’t think that’s valid Jinja, did you test that in the template editor?

1 Like

Thanks. When I place the code you suggested in I get this:

Error loading /config/configuration.yaml: while parsing a block mapping
Error loading /config/configuration.yaml: while parsing a block mapping
  in "/config/packages/plate01/hasp_plate01_p8_media.yaml", line 82, column 9
expected <block end>, but found '<scalar>'
  in "/config/packages/plate01/hasp_plate01_p8_media.yaml", line 83, column 46

I’ll try the debugger

Here is the total media file

##############################################################################
# Automations to display media player info on page 8

automation:
# Initialize button text/font for media controls on start
  - alias: hasp_plate01_p8_MediaInit
    trigger:
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[6].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[8].font'
        payload: '4'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[6].txt'
        payload: '"9"'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].txt'
        payload: '";"'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[8].txt'
        payload: '":"'
  
  # Play/Pause button action
  - alias: hasp_plate01_p8_MediaPauseButton7
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[7]'
      payload: 'ON'
    action:
      service: media_player.media_play_pause
      entity_id: media_player.media_player
  
  # Prev Track button action
  - alias: hasp_plate01_p8_MediaPrevTrackButton6
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[6]'
      payload: 'ON'
    action:
      service: media_player.media_previous_track
      entity_id: media_player.media_player
      
  # Next Track button action
  - alias: hasp_plate01_p8_MediaNextTrackButton8
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[8]'
      payload: 'ON'
    action:
      service: media_player.media_next_track
      entity_id: media_player.media_player
      
  # Scale media information fonts to fit
  # 0 consolas 24 - 20 chars x 2 lines (wrapped)
  # 1 consolas 32 - 15 chars x 2 lines (wrapped)
  # 2 consolas 48 - 10 chars x 1 line
  # 3 consolas 80 - 6 chars x 1 line
  - alias: hasp_plate01_p8_MediaArtist
    trigger:
    - platform: state
      entity_id: sensor.media_player_artist
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].font'
        payload_template: '{% if state_attr('media_player.googlehome0996', 'media_artist')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 6) and (state_attr('media_player.googlehome0996', 'media_artist')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_artist')|length > 10) and (media_player.googlehome0996.media_artist|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[4].txt'
        payload_template: '"{{ state_attr('media_player.googlehome0996', 'media_artist')|wordwrap(20, wrapstring="\\r") }}"'
  
  - alias: hasp_plate01_p8_MediaTitle
    trigger:
    - platform: state
      entity_id: media_player.googlehome0996
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].font'
        payload_template: '{% if state_attr('media_player.googlehome0996', 'media_title')|length <= 6 -%}3{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 6) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 10) %}2{% elif (state_attr('media_player.googlehome0996', 'media_title')|length > 10) and (state_attr('media_player.googlehome0996', 'media_title')|length <= 15) %}1{% else %}0{%- endif %}'
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[5].txt'
        payload_template: '"{{ state_attr('media_player.googlehome0996', 'media_title')|wordwrap(20, wrapstring="\\r") }}"'
  - alias: hasp_plate01_p8_MediaPlayPause
    trigger:
    - platform: state
      entity_id: media_player.media_player
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[7].txt'
        payload_template: "\"{%- if is_state('media_player.media_player', 'playing') %};{% elif is_state('media_player.media_player', 'paused') %}4{% endif -%}\""
  
  # Volume slider value published, apply published state
  - alias: hasp_plate01_p8_MediaVolSliderUpdateHass
    trigger:
      platform: mqtt
      topic: 'hasp/plate01/state/p[8].b[9].val'
    action:
    - service: media_player.volume_set
      data_template:
        entity_id: media_player.media_player
        volume_level: '{{ (trigger.payload|int) / 100 }}'
        
  # Volume slider value changed by hass, update HASP 
  - alias: hasp_plate01_p8_MediaVolSliderUpdateHASP 
    trigger:
    - platform: state
      entity_id: sensor.media_player_volume
    - platform: mqtt
      topic: 'hasp/plate01/status'
      payload: 'ON'
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/plate01/command/p[8].b[9].val'
        payload_template: '{{ (states.sensor.media_player_volume.state * 100)|int }}'

Hi,

I’m working on new STL files to fit uk size switch, but im testing the design with nextion 4.3" screen.
Any interest on that?

(New users can put only one image in post, so i will upload the photos on another reply)

the HASP board is a little bit long and it bearly fits, im not sure if i can connect the wires from under it,

Any one can help to edit the pcb and move the screen and ac connectors to left side??

2 Likes

With nextion 4.3"

4 Likes

5 Likes

I may be losing my mind, but I thought I saw a post with a desktop stand for the display. I searched and scrolled through the thread twice without finding anything. Is my memory deceiving me?

The only thing I can think of is in the video attached to the original post, luma has it on his desk in a switchbox with a faceplate on it. And that’s maybe what you were thinking of.

I could whip you up something pretty quickly though, were you thinking of it sitting on a desk facing upwards at an angle?

Wow, thanks for the offer! I want to put it on my nightstand, so angled slightly up would be great.

I guess I did make it up completely in my head!

I cannot seem to get past the display showing “Wifi Connected and MQTT connected.”
Changed page controls, nothing
Disabled and re-enabled all automatiuons, nothing.
Tried to run first time automation, it showed ass toggled off, pushed the trigger, nada.
MQTT shows connected but the hasp1 sensor at the top of the page shows “Unavailable”.
Started from scratch with HASP, re-downloaded with wget command, ran first time automation (still toggled off btw), and nada.

Hass.os 77.1 on rpi3b+

Any suggestions/help?

You figured this out yet? Seems i have the same problem.

MQTT logging says:
socket error on client “plate_name”, disconnecting.

Reinstalled MQTT unfortunaly no luck.

I had to wipe my custom named component then clone the default packages and re-run first time setup BEFORE connecting HASP to my HA instance.

There might be an issue with the setup script for hass.io which is incompatible with hassos.