Are you talking about a calendar like this one? TopCal Plugin
If so, you can just look at where the Get Available Times “Available Date Times” are referenced and replace those with the fareharbor_date_list results
1 Like
Hi @gf_wolfer, thanks for the plugin—so useful.
I’m trying to work out the best way to add buffer before or after a meeting. Some of my users want to be able to automatically block the 15 minutes after a meeting.
Is there a way to do this? I’ve tried via conditions with no success.
I have also set the minute interval to 15 minutes, however, this is causing an issue with meetings longer than 15 minutes potentially finishing past the desired availability of the user.
By way of example, for a 60 minute meeting, if the availability window is 1-4pm, the user is currently shown options 3:15pm, 3:30pm and 3:45pm, which would all run over 4pm. Is there something I’m missing here?
Below are the current constraints (including one that prevents booking within 2 hours of the current time).
There are a few different types of Buffers that Users often want.
For example - if a massage therapist needs a 15 minute buffer after a booking to clean the room, some individuals will be willing for the last 15 minutes to be able to go over their Schedule, meaning they can be booked 3-4pm, and then will do the cleaning after their ‘bookable time’. On the other hand some User types will need this time to be factored in if this is a strict schedule. Both would change the logic you can then use in the plugin to account for this.
Here are a couple of ways you can think of Buffers and implement with TopCal:
Add Buffers to a Booking only
In the example I gave above, this is useful when a cleaning or prep is needed and the buffer can run before or after their available schedule. You simply save the Booking date range normally, but also a second field of Booking with Buffers date/time range. Then you load the Booking with Buffers date/time range into the GetAvailableTimes element Bookings field
This is the one I usually recommend for similar use cases
Add the Buffer time to the Duration
How long does the actual Booked Time need to be - if this is strict to fit within someone’s availability then simply combine the Duration and Buffer time in the Duration field of the GetAvailableTimes element. The plugin will treat the finding times as though it is a 60 minute meeting, so if the Buffer is to be before, then you may need to use a calculation on page on the Start Times to be ‘Time Slot + Buffer Time’ to show the true start time for the Booker if they should not think of Buffer Time as the start of the meeting
Regarding the 60 minute meeting example, the plugin should not be giving those times as available to be booked. Unless there is something here you are trying with a buffer that I am unsure about.
I would double check:
- That ‘60’ is in the GetAvailableTimes Duration input
- That the 1-4pm availability of their schedule is in the expected time zone.
If you are using an Interval of 15 minutes, you should have 9 bookable time slots (1, 1:15, 1:30, 1:45, 2, 2:15, 2:30, 2:45 and 3pm)
2 Likes
Great, thanks. That’s worked perfectly for my use case. Thanks so much for being so responsive!
Hi
I have purchased this plugin but am not sure how to implement it/if it is what I am looking for?
I am trying to implement a calendar where users can set their own availability and then other users can book in meetings - therefore it needs to have separate functionality for when someone is on their own profile to when viewing someone else’s
Does your plugin support this/how would I do this
Help would be greatly appreciated
Hey there and thanks for the purchase! Sound like a perfect use case.
Have you checked out this page and set of videos → TopCal Plugin
The videos do a good job introducing what the plugin is and how to implement scheduling logic into your app. You will need a beginner-intermediate level of Bubble development experience to fully follow along and to copy some elements over into your app.
Could you please provide an example with screenshot on how to implement this?
My case is almost the same. I need block 1 hour after booking to give ability for worker to drive to next destination. Based on exaple you provided topshelf-elements | Bubble Editor I can’t understand on how to do this.
Thank you in advance
Here are some important steps to do this:
-
Include a Booked time range with Buffer on the Data table like below:
-
When a Booking is made, you will want to save both the original booking time range and the time range with the buffer (gives you more flexibility showing Bookings later on a calendar). The example is an older app setup that uses Groups to hold the Date/Times with the Buffer, but with parentheses this may be able to be calculated in the formulas now (not sure)
-
When loading Booked Times into the GetAvailableTimes element, make sure you use the Booking Range with Buffer so that the extra hour is blocked out of available times:
These examples were screenshotted from my Top Calendar Template that includes Buffer logic
1 Like
Hi @gf_wolfer, thanks for making this plugin. I am looking to create a feature where users can set their availability and clients can book times through a link like calendly. I would then like these appointments to show up on the user’s own calendar for scheduling purposes. How would I go about this using TopCal? Is there any chance you could make a demo video setting something like this up? I’ve been considering purchasing this plugin for some time and I think having this available on top of the editor links you’ve sent would help people feel more confident to purchase. I would definitely. Thanks again!
Hello, sounds like a perfect use for the plugin.
Currently the best resource for how to use the plugin, including videos, can be found here: TopCal Plugin
If your project budget allows, you can save a lot of time by combining the plugin with this template: https://top-calendar.bubbleapps.io
PS - if anyone out there has experience using the TopCal plugin and is good at creating informational videos (paid of course) shoot me a message!
Hi @gf_wolfer ,
I was wondering if you could help me figure this out. I’m trying to set a user’s weekly calendar to a default availability through the backend when they sign up. Basically when they sign up I want them to have a default availability of M-F 8am-5pm. I’m able to have the user do this themselves through the front end using the SetAvailability function below:
But I’m trying to fill the Monday availability data field manually when they sign up through the backend to fill in the data fields like this:
But I’m not sure how to set the list through the backend, this is where I’m stuck:
There could be a few ways to do this but the first one I can think of would be to create a Schedule data item with the availability you want (9-5) through the front end and then manually change it in the database to be a ‘template’ piece of data (add a new field or something to denote this). And then you can clone/copy the template data in this backend workflow - you would need to create on both in the Demo and Live version of the app
1 Like
Thanks, that took care of it
Hi @gf_wolfer and anyone else who can help. When creating all the setting of the availibility and blocking elements I made them change Current User’s TopCal Schedule. However now I am creating the client’s booking page on another page and I was wondering how to set up the data source for the calendar. Because the idea is for the client not to have to have an account or anything to book an appointment, Current User’s TopCal Schedule wouldn’t work right? How should I go about this.
Furthermore, when trying to block multiple dates and doing the workflow Block days add AirDate Block these days Selected Dates, I get the issue that the value to make changes to TopCal Schedule should be date and not a list of dates. It goes away if I were to make it such that only one date could be blocked at a time, but it prevents me from blocking multiple dates at a time. Thanks all for the help.
The common way would be to have a Page Data Type set to ‘Schedule’, and then the User would have a link that goes directly to their schedule - such as www.yourapp.com/schedule/18888888888800 then you reference ‘Current Page’s Schedule’ instead of the current users’
For the Blocked Days issue it is hard to know what the exact issue here is. Where is the error and exactly what is it saying? That might help me know where the issue is.
Have you looked at the Blocked Dates section on this page - topshelf-elements | Bubble Editor?
Thanks for your reply. I guess what I am wondering is how you would set this up: “the User would have a link that goes directly to their schedule - such as `www.yourapp.com/schedule/18888888888800”
I’m not sure how much to describe here, are you familiar with the Bubble Lesson “Sending Data to a Page” here: https://bubble.io/lessons ?
Sorry for the late reply on this, but if you are adding a List of Dates, you need to use the ‘add list’ operator instead of the ‘add’
hey @gf_wolfer,
awesome plugin!
seems to be working, but getting this error in the debugger:
“The plugin TopCal - Dates, Ranges & Time Slots / element Create List of Dates threw the following error: TypeError: Cannot read properties of null (reading ‘getTime’) at eval…(please report this to the plugin author)”
Updated to the newest version and still appears - any idea what’s up?