I’m still relatively new to Bubble, and am creating a feature where users set a radius in their profile, to set the geographic area in which they’d like to be notified of events. A slider is a good fit, but I need to pair that with a dropdown selector so that users can toggle between miles and km. I’m having a hard time understanding how to show the slider value in the text box while subjecting it to the appropriate conversion.
My thinking is that the slider would go from 1-100 miles, and have that as the base value. Ultimately I’ll need to figure out how to take the value that users submit and use that to alert them when events are posted in that geographic area. I have no idea how to approach that, so any insights there are also much appreciated.
Thanks in advance!
Yes that seems like the easiest route. Use miles as the standard (slider will always use miles, database will always use miles etc…) and only convert to km on the frontend. Add a field on your user dataType which store the user preference. Then add a conditional to the ‘11’ text, with the folllowing condition User's km/mile selection is km. If the condition is true then the text would become Slider’s value * conversion ratio: rounded.
You can use the Maps Javascript API to query the distance between two points, either straight line or taking into account roads and traffic. There will probably be a plugin that does this for you if you don’t want to do it yourself.
If you only need a straight line distance, you could use a simple javascript function which calculates the estimated distance solely using latitude and longitude values using some basic trig. This would be quicker and cheaper than using the Google Maps API. You can ask chatGPT to create the function for you.
Essentially, when a new event is created, you’d need to create a recursive workflow which iterates through all users, retrieves the distance between the user and the event, and notifies the user if this distance is less than the user preference.
Having a way to sort out users which are obviously too far away (different country/different city) could save on costs.
Thanks for the answer. Here’s how far I got before getting stumped by something pretty basic. I can’t seem to get the conditional to work. I have the "sliders value * " but I can’t get the second part. How should I format that? 0. 62 as arbitrary text doesn’t seem to work, so I tried making it as an invisible element and linking that but no luck.
Still have a lot to learn about doing math in conditions.
Thanks for your other comment as well, I may have to follow up on that once I get that far.
You need Bubble to format 0.62 as a number, not a text. In programming there is a difference between the string ‘0.62’ and the number 0.62, and you can’t multiply with texts.
If you arbitrary text, make sure to use :converted to number to format it as a number.
If Conversion text 0.62 is a text element, it won’t work. Text elements do not publish a value that can be used elsewhere, they are just used as a display. You could use an input instead if you want to access its value → Conversion Input’s Value. Just make sure that the type is set to decimal.
1 Like
It works! Thank you for the help in getting past this roadblock and learning a new bubble skill.
