[Free Plugin] 🌟 Animated Rating Stars by EzCode

stars_demo
New Free Plugin

Make your rating field more attractive.
A five stars rating that animates on click and shows a little face with different mood that depends on the rating.
The face can be hidden from the plugin settings.

  • Supports autobinding
  • Triggers an event on click
  • Selected rating is available in the state “Stars clicked”

Demo: https://ezcodepluginsdemo.bubbleapps.io/animated_stars

Editor Demo: https://bubble.io/page&name=animated_stars

Plugin: https://bubble.io/plugin/animated-rating-stars-1597057936761x455488134944915460


Follow us on Twitter: https://twitter.com/ezcode_official

Feel free to contact us for any inquiries and we’ll be happy to find a solution for your ideas EzCode.co

14 Likes

Update 1.1
:star: :star: :star: :star: :star:

Added a new feature, set the initial value.

Screenshot 2020-10-30 at 16.27.30

Update 1.3

New features, change the Color of selected and unselected stars :slight_smile:

Screenshot 2020-11-19 at 15.19.06

1 Like

Thanks for making it free!
The plugin looks great and I would like to use it.
But… Does it work in a Repeating Group?
For me, it looks like the CSS is not loaded properly when I put your plugin in a Repeating Group.

Did I miss something?

1 Like

This is really cool cant wait to use it.

1 Like

Hey @viljames165 , thanks for reaching out

Yes, it works well with repeating groups, here is example from our template

Maybe you can share a short demo how you set it in your app, or maybe link to editor in DM so we can figure what is wrong ?

Regards EzCode Team !

Update v1.4

Added a new action - Reset

Love it-- does it have the ability to show fractional values? like 3.5 stars?

Unfortunately no, only whole numbers.

What? Another update to this great free plugin?
Yes!

Update v.1.5

  • You can now make it unclickable (for view only mode)

Update and check the plugin element settings

when i have a number of Animatedstars setup in different group, say for instance I have StarRating A B C D, sometimes when the user selected the A star rating, it would get passed to the “Star Selected” of the B star rating, but without affecting the actual number of star displayed.

I have tried to put them in separate containers / different names / give different ID Attribute, but nothing seemed to fix the issue.

here is an example, I have put the number of “Star selected” at the end of the title.
As you can see, only the first star rating has selected and the number is passed to the second one. It is double checked that they’re referencing the correct star rating next to them.

Thanks and appreciate that.

Hey @finn.rothacker

Can You try on “General Event When page is loaded” add action “Reset Animatedstars”, because we made 1 hour test, without any resets actions, and all looks fine.

Looking forward

1 Like

Would LOVE to see this implemented to be able to do half-stars.

Hi,

Love the plugin and it is working better than the other star rating plugins I’ve tried! I had a feature request for the plugin.

It would be great to be able to remove the animation when loading the stars if input is disabled. I say this because on the main page of my app, I have a repeating group with a lot of items. I do have the RG set to not show all items initially, but since the plugin still has to load in each item and they all do an animation “boot up” then it takes a couple seconds for all the stars to load, behind everything else on the page. On this main page, all the star ratings input is disabled, so they are just static.

Thanks and let me know!

Hey @mikev , just pushed update and added demo new action too ! Hope you will like

Regards Pavel @ EazyCode team.

Hi. Awesome! But, it looks like the 5th star still animates, so the plugin definitely loads faster, but I think the 5th star animation is still slowing it down. Would love to see it be full-static when doing the disable animation toggle. Thanks!

1 Like

Hey @mikev , there is action without animation in last update

stars_noanim

You can see on video and how to set

Hope it helps

Regards Pavel @ EazyCode team.

Hi. I tried this, but some of the 5-stars still do a jumping animation when the page loads (see attached). Thanks!
Screen Capture on 2023-02-06 at 12-59-49

1 Like

Hi! Is there any way to highlight stars in some cases? For instance when user submits with 0 stars selected, I want to trigger something to highlight that it has to be selected