Web Interface Custom Theme

[spuder]

Problem

As a user, I want to see an improved web interface
So that interactions with the esphome web UI provides a friction free user experience

Objective

Research feasibility of creating a new web interface theme that runs on the esp32

Information

The esphome library currently uses the v3 implementation of the web server component

https://esphome.io/components/web_server.html

Constraints

Requirements:

• Run on an esp32-s3 board with 2-4MB PSRAM
• Have all includes compiled into the firmware (no internet required, see esphome advanced usage docs

Optional:

• Run on an esp32-s2 board with 0MB PSRAM (early adopters got s2 boards, it would be good to upgrade them if possible)
• Include the OpenSpool Logo (svg/png is included in the images folder.

Resources

• 3rd party esphome web interface: https://esp.veli.ee
• esphome web interface documentation: https://esphome.io/components/web_server.html

Additional Notes

I previously did research into using a native ESPHOME color picker, however ran into problems because the filament type is an 'led' object with ColorCapability::BRIGHTNESS hard coded.

To get a color picker either the web interface javascript would need to be modified, or a custom component would need to be made. See branch color-picker

https://discord.com/channels/429907082951524364/524177279270780928/1299942698664333385