Bubble Card pop-ups now work as a frontend module!
v1.5.3 :
Fixed an issue for users from 1.5.0 or 1.5.1 in Regular mode with this console error:
Uncaught DOMException: Failed to execute 'define' on 'CustomElementRegistry': the name "bubble-pop-up" has already been used with this registry
v1.5.2 and v1.5.3 : A new breaking change for some users 👀 Please read this.
I have changed the way Bubble Card works a bit, but it’s much simpler and clearer for new users, and for everyone!
bubble-pop-up.js
has become completely optional and basically it’s like a step back, the pop-ups are back in custom:bubble-card
for new users (what I called the Regular mode in the GUI), while keeping the possibility to use the standalone custom:bubble-pop-up
as a module for more advanced users who want to optimize the initialization of the pop-ups as much as possible (Optimized mode).
This does not change anything for current installations in Optimized mode, the only difference is that the module_installed: true
variable has been removed because it caused more problems than it solved.
BREAKING CHANGE: However, for existing users from 1.5.0 or 1.5.1 who want to stay with the Regular mode, they will have this error custom element doesn't exist: bubble-pop-up
and will have to change their pop-ups back to:
type: vertical-stack
cards:
- type: custom:bubble-card
card_type: pop-up
And I’m really sorry about that, but I was totally overthinking the thing and I prefer to go back before going too far in a wrong way.
Now the installation is pretty basic, install Bubble Card from HACS and if you want the Optimized mode add this in your configuration.yaml
:
frontend:
extra_module_url:
- /hacsfiles/Bubble-Card/bubble-pop-up.js?v=1.5.2
Restart Home Assistant and clear the cache if needed, you should now see Bubble Pop-up appear in the card picker, which corresponds to the Optimized mode.
Now, this will be the end of my optimizations updates for a moment. For the next update I'm planning to add a lot more possibilities for customizing the buttons, with support for new devices! Finally new features, yay!
I really hope that I succeed in clarifying everything in this update 🤞
And I almost forgot to say that Bubble Card is now officially available on the HACS repository! That doesn’t change anything for existing users but I wanted to say it! 🍻
v1.5.1 : Finally an easier installation / update!
Hi! I apologize for the delay, it was a bit more complicated than what I thought but I have finally corrected the configuration issues in the new version 🤞
From now on,
bubble-pop-up.js
will automatically install as a frontend resource. This means that there is no longer a need to modify the configuration for it to work 'out of the box'!Important : The instructions changed a bit for those who prefer to install it as a module, everything is explained here.
I’m really looking forward for your feedback (as always)!
v1.5.0 : First breaking change! Thank you for reading through.
Hi everyone! This update brings the most significant performance improvement since the creation of Bubble Card. In addition, the content of the pop-ups is finally removed from the DOM when it is closed. This means that the cameras are stopped when you close a pop-up, yes I've finally done it 🥳
I'm personally surprised by the difference that this version makes on my config, and it has been tested on almost all browsers!
I’ve also had to introduce the first breaking change. Now, if you want to use a pop-up, you’ll need to install
bubble-pop-up.js
as an extra module (it's included in this release, more info below).Along with this change, the pop-up now have a new type
custom: bubble-pop-up
, this is the real breaking change. If you already have pop-ups configured, you’ll need to make the change for each one, either in YAML or in the GUI editor. Once the change is made on the type, your dashboard will return to how it was before (but better, faster, stronger).This version will finally allow me to move on to adding new features now that the optimization part is finally completed! I’m really excited about the new possibilities this opens up for future development.
I can't wait for your feedback!
Installation
- In your
configuration.yaml
, add the following underfrontend
:frontend: extra_module_url: - /hacsfiles/Bubble-Card/bubble-pop-up.js
- Install / Update Bubble Card.
- Restart Home Assistant.
- You will now have
Bubble Pop-up
andBubble Card
in your card picker in the editor.- For previous users: Replace all your
card-type:pop-up
to usetype: custom:bubble-pop-up
.Here is how a pop-up looks like in YAML now :
type: vertical-stack cards: - type: custom:bubble-pop-up hash: '#pop-up-name'💡 New features
- You can now change the default arrow icons in a cover card, thanks to @tj57 ! #160
- Cameras inside pop-ups are now stopped when you close it. Finally! #85
✔️ Fixes
- Finally fixed the stability / performance issues on all browsers! #152
- The GUI editor has also been extensively optimized.
- Fixed the picture icon that was not changing (e.g. in a media_player button slider).
Thank you once again for your continued support!
🍻