Custom Widget for Neato BotVac Vacuum Cleaner in HABPanel

Hello everyone! I wanted to share my recent project with the Neato BotVac Vacuum Cleaner and HABPanel. Over the past week, I’ve been working on creating a custom widget to better integrate my vacuum cleaner into my smart home setup. It’s been a fun challenge, and I’m thrilled with the results!

The widget I created allows me to monitor and control my Neato BotVac directly from HABPanel. I used the Matrix Theme for HABPanel, which provided a great foundation for the design. The widget includes features like the last cleaning map, current status, battery level, and control buttons for starting, pausing, or stopping the cleaning process.

One of the main challenges was getting the last cleaning map to display correctly. I had to use Python scripts to fetch the map from Neato’s servers, crop it to the right size, and adjust the background color to match the theme. It took some trial and error, but I managed to get it working smoothly!

I also wanted to ensure that the widget was user-friendly. For example, the ‘Dock’ button only appears if the vacuum has detected the docking station. This prevents users from trying to dock the vacuum when it’s not possible, which is a nice touch.

Here’s the code I used for the widget:

markdown

I’d like to give a special thanks to [@ysc] and [@pmpkk] for their incredible work on the Matrix Theme. Their UI design made my widget look much better than I initially expected!

If anyone has questions or wants to modify this widget for their own use, feel free to reach out. I’d be happy to share more details or help troubleshoot any issues you might encounter. Happy coding and happy vacuuming! :blush: