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

Share your Projects!
1397

Hey @Gagan_Kochar these are great. Love the idea of being able to change the fronts.

Are you able to share any of the plans you made in making these stencils?

1398

Hey @luma

Just catching up again.
Actually what I wanted to do was add a temp and humidity sensor to the Spare pins on the wemos and send that data over mqtt.

Any advice or suggestions on where to start?

Cheers

1399

@jezzard

hi thank you for appreciating, i havenā€™t got time so havenā€™t shared the designs yet its just in 2 piece front and frame i like to call it , i guess by stencil you are referring to the front facia

1400

A question that might already have been answered.

For every switch plate I get a link on my sidebar but the links are just blank pages for me? Did I forget to set something up that would put content on these pages?

1401

in the packages sub folders you have your HA switchplate folders

look in the *_components.yaml file for the panel_iframe: section

mine look like this

 panel_iframe:
   plate01:
     title: "plate01"
     url: "http://plate01"
     icon: "mdi:cellphone-text"

just # it out

# panel_iframe:
#   plate01:
#     title: "plate01"
#     url: "http://plate01"
#     icon: "mdi:cellphone-text"

do a config check and a restart fix

1 Like
1402

Hi, would you by any chance still have the Node-Red flow and still be willing to share it? It would be awesome for me to have a template to start withā€¦ Thank you! :slight_smile:

1403

That will require modification to the Arduino side of the project. I donā€™t currently have any plans for adding arbitrary sensor libraries to the project.

1 Like
1404

To add some context to this: if youā€™re using SSL the iframe wonā€™t work. I donā€™t think there is any workaround for this, so using @myleā€™s suggestion to remove the iframe is probably your best course of action.

1405

Hi everyone,
Iā€™m quite new with HA SwitchPlate, and Iā€™m now learning to play around with the different components.
My first trial was to use the page 4 dimmers to control the position of some roller shutters (cover in HA).
However, I donā€™t understand why:

  1. only one of the 3 covers is working when I move the slider on the display
  2. when I chenge page on HASP and go back to the page with the sliders, they go back to the middle-position (50%)
  3. the sliders do not ā€œsyncā€ with the sliders in lovelace
    Iā€™m quite sure thereā€™s something obvious that Iā€™m doing wrong, but I really cannot figure out!
    I have started from the default set of settings provided from @lumaā€™s github repository and modified as follows.

Below is the code for the automations (the default one, modified at my best):

##############################################################################
# Automations to configure slider controls on page 4 as light dimmers
automation:
  - alias: hasp_displ_entrance_p4_DimmersInit
    trigger:
    - platform: state
      entity_id: 'binary_sensor.displ_entrance_connected'
      to: 'on'
    - platform: homeassistant
      event: start
    action:
    - service: mqtt.publish
      data:
        topic: 'hasp/displ_entrance/command/p[4].b[4].txt'
        payload: '"Living left"'
    - service: mqtt.publish
      data:
        topic: 'hasp/displ_entrance/command/p[4].b[5].txt'
        payload: '"Living right"'
    - service: mqtt.publish
      data:
        topic: 'hasp/displ_entrance/command/p[4].b[6].txt'
        payload: '"Bedroom"'
  
  # when the user moves the slider, change the light in Hass
  - alias: hasp_displ_entrance_p4_Dimmer7UpdateHass
    trigger:
    - platform: mqtt
      topic: 'hasp/displ_entrance/state/p[4].b[7].val'
    action:
    - service: cover.set_cover_position
      data_template:
        entity_id: cover.tapparella_salotto_sinistra
        position: '{{ trigger.payload }}'
  
  # When the light is changed in Hass, update HASP to move the dimmer
  - alias: hasp_displ_entrance_p4_Dimmer7UpdateHASP
    trigger:
    - platform: state
      entity_id: 'binary_sensor.displ_entrance_connected'
      to: 'on'
    - platform: homeassistant
      event: start
    - platform: state
      entity_id: cover.tapparella_salotto_sinistra
    action:
    - service: mqtt.publish
      data_template:
        topic: 'hasp/displ_entrance/command/p[4].b[7].val'
        payload_template: '{{states.cover.tapparella_tapparella_salotto_sinistra.attributes.position|default(0)|int}}'
  
  # when the user moves the slider, change the light in Hass
  - alias: hasp_displ_entrance_p4_Dimmer8UpdateHass
    trigger:
    - platform: mqtt
      topic: 'hasp/displ_entrance/state/p[4].b[8].val'
    action:
    - service: cover.set_cover_posiiton
      data_template:
        entity_id: cover.tapparella_salotto_destra
        position: '{{ trigger.payload }}'
  
  # When the light is changed in Hass, update HASP to move the dimmer
  - alias: hasp_displ_entrance_p4_Dimmer8UpdateHASP
    trigger:
    - platform: state
      entity_id: 'binary_sensor.displ_entrance_connected'
      to: 'on'
    - platform: homeassistant
      event: start
    - platform: state
      entity_id: light.light_2
    action:
    - service: mqtt.publish
      data_template:
        topic: 'hasp/displ_entrance/command/p[4].b[8].val'
        payload_template: '{{states.cover.tapparella_salotto_destra.attributes.position|default(0)|int}}'
  
  # when the user moves the slider, change the light in Hass
  - alias: hasp_displ_entrance_p4_Dimmer9UpdateHass
    trigger:
    - platform: mqtt
      topic: 'hasp/displ_entrance/state/p[4].b[9].val'
    action:
    - service: cover.set_cover_position
      data_template:
        entity_id: cover.tapparella_camera
        position: '{{ trigger.payload }}'
  
  # When the light is changed in Hass, update HASP to move the dimmer
  - alias: hasp_displ_entrance_p4_Dimmer9UpdateHASP
    trigger:
    - platform: state
      entity_id: 'binary_sensor.displ_entrance_connected'
      to: 'on'
    - platform: homeassistant
      event: start
    - platform: state
      entity_id: cover.tapparella_camera
    action:
    - service: mqtt.publish
      data_template:
        topic: 'hasp/displ_entrance/command/p[4].b[9].val'
        payload_template: '{{states.cover.tapparella_camera.attributes.position|default(0)|int}}'

Here is the normal configuration.yaml for the covers involved that I use in HA:

cover:
  -  platform: mqtt
     name: "Tapparella camera"
     state_topic: "shellies/shellyswitch-32B81B/roller/0"
     command_topic: "shellies/shellyswitch-32B81B/roller/0/command"
     position_topic: "shellies/shellyswitch-32B81B/roller/0/pos"
     set_position_topic: "shellies/shellyswitch-32B81B/roller/0/command/pos"
     payload_open: "open"
     payload_close: "close"
     payload_stop: "stop"
     retain: false
     optimistic: false
     qos: 1
     position_open: 100
     position_closed: 0
  -  platform: mqtt
     name: "Tapparella salotto destra"
     state_topic: "shellies/shellyswitch-32BABB/roller/0"
     command_topic: "shellies/shellyswitch-32BABB/roller/0/command"
     position_topic: "shellies/shellyswitch-32BABB/roller/0/pos"
     set_position_topic: "shellies/shellyswitch-32BABB/roller/0/command/pos"
     payload_open: "open"
     payload_close: "close"
     payload_stop: "stop"
     retain: false
     optimistic: false
     qos: 1
     position_open: 100
     position_closed: 0
  -  platform: mqtt
     name: "Tapparella salotto sinistra"
     state_topic: "shellies/shellyswitch-32BBE7/roller/0"
     command_topic: "shellies/shellyswitch-32BBE7/roller/0/command"
     position_topic: "shellies/shellyswitch-32BBE7/roller/0/pos"
     set_position_topic: "shellies/shellyswitch-32BBE7/roller/0/command/pos"
     payload_open: "open"
     payload_close: "close"
     payload_stop: "stop"
     retain: false
     optimistic: false
     qos: 1
     position_open: 100
     position_closed: 0

Thanks a lot to anybody who can help!

1406

Thanks @Gagan_Kochar
I seem to have some time on my hands. Any tips for creating the two part frame? I see your inside is slimmer/smaller than the outer case.

1407

Iā€™ve spent the last couple of weeks preparing for a LoRaWAN event I was presenting for a local startup accelerator which had the HASP project on the back burner. To nobodyā€™s surprise, that event got cancelled with everything else, and now Iā€™m flat out of excuses to be working on HASP :smiley:

Todayā€™s experiment was to try replacing FontAwesome with Material Design icons to better align w/ Home Assistant. The result is a huge number of icons available (5118 all together), which you can preview here.

Iā€™m only mentioning this because several folks are digging into the dev build and I wanted to make sure those folks are aware that any customization you might be working on w/ the FA fontset is going to need to be changed over to Material. I hope to have an updated dev build available for testers within a day or three.

edit: sadly, the entire experiment is a bust :frowning: Too many icons in the set to make it fit on a Nextion. Back to font awesome!

1408

So I ended up not customizing my design since the screen does not have a great viewing angle the black on white simplistic design is the most readable. With that said I have a couple of requests that might be useful to users

ā€¢ a simple color picker for colored lights. Maybe itā€™s more like 9 buttons you can manually add colors to and then 1 slider at the bottom due to the screens limitations.

ā€¢ a dimmer page, this page would be dynamic depending on what light was selected previously. I have a very big living room so it has a ton of lights. Beside from having scenes sometimes people like to adjust them manually and right now if you are dimming you are limited to 3 lights, so with a dynamic dimmer page you could have 8 lights and when tapping each light you get 1 dimmer page that has 1 vertical slider on it.

ā€¢ for the media page it would be nice, if possible, if there is no media playing another page will take its place So you could have a radio station selector for example. Right now the media page is blank and then serves no purpose and you eliminate the chance to have another screen in its place.

I got 3 of these installed now and I am planning to add 3 more in the next coming week.

:clap::clap::clap:

1409

Hi All, my name is Simon, I have been following this project for a while and decided to get involved, I have purchased Nextron screen and `ESP8266 etc, I read through the posts here and wow so much work has gone into this so impressed, can someone give me a pointer on where to start with configuring things, I am running the latest HA through lovelace UI, using HASSIO, any assistance would be grateful
I live in Scotland, and now with lockdown imminent I will have heaps of time on my hands to do this and other projects I have not been able to fine time with

1410

Hey @luma,

I havenā€™t got much further with the sensors yet but saw your post regarding the icons.

Would this be the same if we could access the pro version of font awesome?

Cheers

Ross

1411

If anything the pro set (being ~6x the size of the free set) makes the problem worse :frowning:

I think weā€™re OK w/ the free set, I was more trying to make Material Design icons work just to get in alignment w/ the rest of Home Assistant. The result is too big to fit into the project, while the FA set just barely works. That will do, and I think it still looks good for our purposes.

1412

iā€™ve found the tjc tft for 0.40 beta, iā€™m trying to upload it via sd card but it seams to be stuck at 90%

1413

Thanks for the headā€™s up @Superimo88! Just pushed all the TJC stuff out yesterday, but hadnā€™t tested it fully yet. Iā€™ll take a deeper look into this.

1414

iā€™m now uploading it via ftdi, it will take a lot of time but will see if it works

1415

Thank you very much luma!
The hour now shows correctly, for the temperature I think that the problem is that Iā€™m using Celsius instead of Fahrenheitā€¦ How can I export a log file?
Thank you again!
Best regards

Simone

1416

HASP v0.40 release

New fonts, new pages, new automations, new models, and some core code improvements

Nextion HMI

This release marks the first major update the Nextion HMI used by the HASP project.

  • Proportional fonts - Noto Sans has been added in 6 different sizes and styles
  • Anti-aliased fonts - The existing Consolas and Wingdings fonts, as well as the new Noto Sans font are now all anti-aliased.
  • FontAwesome icons - All free FontAwesome icon codepoints have been added to the Noto Sans fonts in the project, allowing mixed used of text and icons anywhere text is allowed.
  • Removed page 9 with graph component - A poll of users suggested this wasnā€™t being used and we gained a lot of RAM by removing it.
  • Added new page 9 with HVAC control demonstration
  • Added new page 10 with Ceiling Fan control demonstration
  • Added new page 11 with one large, blank button for future use
  • Removed QR code from page 0 - again, a memory saving feature. WiFi setup QR is now a static picture object.
  • Upgraded to Nextion firmware 1.60 - latest release as of this writing

Home Assistant Automations

Nearly too many to list but here are the major points:

  • Full compatibility with Lovelace UI
  • Color ā€œthemeā€ support with pull-down list of included themes
  • Interactive color select UI
  • Font select UI for page select buttons
  • Icons added to several pages
  • New automations for HVAC control
  • New automations for Ceiling Fan control
  • General compatibility and code cleanup

ESP8266 code v0.40

  • Improvement in WiFi performance and stability by disabling power save modes
  • Updates to better utilize new QR image and icon fonts
  • Add support for haptic or audio feedback device, thanks @benmprojects!
  • Add backlight reset button in web UI
  • Updated ESP8266 Arduino core to 2.6.3

Home Assistant Update Procedure

Run the deployhasp.sh script to pull down the updated automations using one of the guides below:

Links for more HASP info

3 Likes