Hide early mornings from calendar

ben4 · 2020-06-08T20:35:47.461Z

Hey Everyone,

I hope your expertises can help me yet again. Im using the full calendar plugin from bubble and all is working great. Does anyone know of a way to hide the hours of the day that are not applicable to this calendar. For example, the business doesn’t open till like 8am so can we hide all the stuff before that?

I can’t wait to hear from everyone.

All the best,
Benjamin

ambroisedlg · 2020-06-09T12:37:06.997Z

Hey Ben, does your use case involve bookings? Or is it view-only?

If you want customers to be able to book slots between a business’ opening hour and its closing hour, it can get a bit tricky. You’d need to enable the business to define those hours (using 2 time pickers) per day (using a RG).

You’d then have to let customers pick a date in a date picker, :extract day and show available slots for that day to customers using another RG.

Let me know if that makes sense

ben4 · 2020-06-09T16:42:04.900Z

Hey there,

Its view only. Take a look: https://www.loom.com/share/2420287f0f53443ca81cfacb73347aca

Thank you,
Benjamin

ambroisedlg · 2020-06-09T18:51:10.526Z

Hey @ben4 imo you/your Users would just need to define the opening and closing hours for each day in your DB (in a new data type Timeslots for example) and set the calendar’s data source to Current User’s Timeslots

Or maybe I’m mistaken about your question here, did you mean that you want to hide the unnecessary slots? So that the calendar view starts at 7am and ends at 10pm? In that case I don’t think the calendar plugin would help, you might have to design a custom calendar yourself

lantzgould · 2020-06-09T20:50:06.422Z

@ben4

I think this would work if you specified a specific view…

Give your calendar an ID name (goes after the hash in the below example)
On page load run javascript workflow:

$(’#happy’).fullCalendar({
defaultView: ‘agendaWeek’,
minTime: “07:00:00”,
maxTime: “21:00:00”,
});

Of course, enter your start/end times as needed.

ambroisedlg · 2020-06-09T22:28:50.637Z

Ah well I learnt something useful today, thanks @lantzgould

ben4 · 2020-06-09T22:33:47.628Z

Hey there,
I have gone ahead and done this but it seems that it isn’t working take a look: https://www.loom.com/share/7772ab4745ab4ef2bd77071a68b3b3fa

Let me know if I am missing anything please!!!

Thank you,
Benjamin

lantzgould · 2020-06-09T23:29:18.739Z

Looks good to me. I’d try using another ID. Just tried it and it seems to not like the same name…

ben4 · 2020-06-10T03:09:40.779Z

Hey there,

Thank you for the tip. Although, still doesn’t work

I dont know if this is relevant, I am using the bubble calendar plugin.

Thank you for the help.

Benjamin

lantzgould · 2020-06-10T03:43:57.155Z

I used the one by bubble too. Give me a few and I’ll put together a edit mode page for ya.

lantzgould · 2020-06-12T02:47:20.953Z

*Edit: I don’t think this will work. I have this functioning correctly on only showing certain times, but does not play well with the current version of Full Calendar by Bubble, as it’s not pulling in data. Will update if I ever figure it out…

Sorry

ben4 · 2020-07-05T01:41:21.442Z

Oh, thanks everyone Hope to have a solution

system · 2020-08-17T20:35:48.248Z

This topic was automatically closed after 70 days. New replies are no longer allowed.