šŸŽØ [Free Plugin] Color picker

Now itā€™s working. I donā€™t know why yesterday itā€™s not working. I just deleted all my color picker then placed new color picker again

I have a problem with the Air Color Picker when I am in a group and this group is born empty.

image

I am getting the same issue when displaying the picker in a reusable popup or in groupFocus.
Getting this from the Chrome console:

x10:6 h.spectrum is not a function at HTMLDocument.eval (PLUGIN_Air-Color-Picker-updateā€“Air-Color-picker-.js:4:3) at j (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/7b11f03ā€¦/xfalse/x10:2:29948) at k (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/7b11f03ā€¦/xfalse/x10:2:30262)

  1. Object

  2. UNCAUGHT: ā€œcaught by window.onerrorā€

  3. code: ā€œ1610955888088x698999299393548800ā€

  4. origin: ā€œnative errorā€

  5. proto: Object

@seanhoots

FYI, Iā€™m also seeing that it does not work in a reusable popup. However, it does work everywhere else.

Hey Bubblers :wave:
Happy to share the news that this plugin along with all the other plugins made by notorious bubbler @seanhoots have been acquired by Zeroqode :rocket:

Weā€™ll do our best to maintain and improve these plugins in a timely and efficient manner. Look out for updates on these plugins soon :slight_smile: For any questions or assistance requests please make sure to tag @ZeroqodeSupport

Here is the full list of acquired plugins:

To see almost 300 other Bubble plugins made by Zeroqode please go to No-Code App Plugins for Bubble | Zeroqode

Levon Terteryan
Founder @ Zeroqode
#1 Bubble Publisher and Developer

logo-icon-S-circle

100+ Bubble Templates
25+ Bubble Courses
250+ Bubble Plugins
20+ Bubble Building Blocks
Convert Web to iOS & Android
No-code Development Services
Zero Code Conference Replay - watch all the no-code industry leaders share their expertise and insights on building and scaling startups without code

Congrats on this purchase @levon - one small question I would have asked of @seanhoots, but may be more appropriate for you guys now relative to a very specific user flow and setup.

Setup: The air color picker is placed in a popup.

User flow: The user changes a color using the picker, saves a change, then closes the popup. After seeing the change, they want to change it again so they reload the popup. When they go to change the color again, the color picker sits under the greyout blur.

Is there a way to change where this sits on the back-to-front spectrum of the page to avoid that issue?

Hello, @brian
Thanks for your appreciation.

Unfortunately, but such a function is not available for this plugin.
In case you want to blur an element whose color can no longer be changed (after saving it), we can propose you another workflow:

  • You set the color picker element in a group, for example;
  • You should set the condition ā€œwhen color picker value is savedā€ the group is visible on the page.

So, using the same conditions on your page, you will be able to disable the possibility to change the already saved color.

In case of any additional questions will appear - please be free to contact us.
Regards,
Zeroqode Support Team

Thanks @ZeroqodeSupport - I think thereā€™s been a little confusion here. Iā€™m not requesting a feature. Iā€™m pointing out a bug. When the color picker sits in a popup, it always blurs out the second time itā€™s accessed. Iā€™m assuming it isnā€™t meant to work this way, so Iā€™m pointing that out and seeing if thereā€™s a quick fix for it.

Hello, @brian
We are sorry for this misunderstanding.

Iā€™m afraid that we were unable to reproduce the mentioned issue without more details from your side.
Please provide us the next information in order to investigate your use case more carefully:

  • error screenshots from debugger and browser console;
  • the description of what you wanted to achieve and the actual result;
  • how to reproduce your issue;
  • screenshot\screencast of your current settings for PopUp and Color Picker element.

Looking to hear you soon.
Zeroqode Support Team

Thanks for coming back to me @ZeroqodeSupport - Iā€™ve attached screenshots of the behavior and a link to reproduce it. The basic structure, as noted above, is:

  1. Color picker housed in a popup.
  2. On first load, the picker works/looks as expected.
  3. Choose a color and close the popup.
  4. Launch the popup again to choose another color.
  5. This time, the color picker sits behind the page blur (though above the greyout).

To reproduce, you can edit the Links section on the page below.

https://instabook.io/version-test/hub/mhhoeuhi?ViewMode=edit

Hello, @brian
Thanks for the screenshots and link for an application.

We have checked it and found out that an animation filter has been applied to your popup, which affects the blur.
Once we tried removing this from the page code, the problem was solved and the blur effect disappeared.
Please find below the code, which should be set:

The easier way to fix it in the Bubble - to add your custom CSS on the page.
You can make in by using the ā€œHTMLā€ bubble element or to add meta tags in the settings:
section:

In case you have created the blur effect on your Pop Up yourself, allow me to recommend you remove it.

Hope it helps you.
Best regards,
Zeroqode Support Team.

Thanks @ZeroqodeSupport - this is super helpful. Weā€™ll have a look at the code and update from our side. We never would. have figured this out without you. Great support. :100:

1 Like

Hello, @brian
We are happy to hear that it was helpful for you.

You are always welcome! :slightly_smiling_face:

Best regards,
Zeroqode Support Team

Hey @ZeroqodeSupport - just circling back to close the loop here. The code you referred to was actually in Bubbleā€™s base code. Itā€™s blurring the background on the popup, so the issue here is that your color picker sits ahead of that popup on first load and behind it on the second. Iā€™ve just killed the blur on the popup, but still something to look at for future updates to the plugin.

Thanks again for the help on this.

Hello, @brian

Thank you for these details. We will take into consideration the ability to investigate this feature and to check it for future updates.

Thanks for your feedback!
Best regards,
Zeroqode Support Team

Hey @ZeroqodeSupport, Iā€™m trying to use auto-binding with no success.
Iā€™ve put an input a expression to the picker get a color from my DB (success)
An input with Inicial content value= AirColorpicker value (success)
but when i check auto-binder box in that input, it stop to get data from AirColorpickerā€¦

@ZeroqodeSupport, any chance this plugin could be updated to use autobinding? Pretty please? :grinning:

Hi @eLPDev, thank you for your message.

We will check how feasible it will be to add the requested feature to the future plugin update.
Thank you for suggesting it :pray:t3:

Have a good day!

Regards,
Zeroqode Support Team

1 Like

@ZeroqodeSupport I third the request for autobinding for this plugin - might it be possible? Thanks!

Hi @samosa, thank you for your message, and thanks for using our plugin on your website :hugs:

We will consider your feedback on the auto-binding feature for the Color Picker plugin :pray:t3:
Once there will be any progress on the improvement we will get back with an update in this thread.

Appreciate your feedback, thanks again!

Regards,
Zeroqode Support Team