Hey I was wondering if someone can point me in the right direction. I have nearly completed my booking app but it would really benefit from a timeline calendar like the example below
Where the users are on the left and their dates booked appear in a horizontal calendar view. I’m using fullcalendar at the moment, but if more than 3 people have booked the same day off it is hard to read
I’m glad you got pointed in the right direction, @dudders9… I had forgotten to reply to your PM, but that’s where I was going to point you! (Note that you can easily modify that approach to feed a linear type of calendar like you are building!)
Yeah the repeating group plus toolbox plugin is the way to go really. I’ve managed to use as a single calendar view, weekly view and yearly view, works nicely, though the more data present on page, there will be a slight lag, though for your example it will be quite light.
The calendar plugin is very basic, not much flexibility there tbh.
Thanks @keith & @luke2 - Appreciate the help guys. I have copied the elements and the workflows from the forum and it already feels much more like what I am looking to build. Would you suggest some groups within the repeating group to pull the users dates in?
Adding 7 columns is great, but the only limitation is that the far left column for the user avatar/ name is much wider that the date columns and where bubble divides them equally - I can’t see how to do this.
Yeah with the width issues you’ve got with columns, I would suggest keeping that repeating group for the dates, so that can be split evenly, keeping the user’s name separate.
For instance, one approach would be to have a repeating group within a repeating group. So you’d have the main repeating group 1 column and say 5 rows, you can choose the settings that fit best, but something like full list would work, setting the data types. Then you’d draw out the repeating group inside that cell, set to 7 columns, 1 row and use this for the toolbox custom calendar. The calendar dates can use the conditions of the main repeating group’s data.
To be honest and not too meta, you actually might need a 3 levels of repeating groups, as you’d need to fetch the week e.g. Week 2 - March 2019 and this could use a customised version of the calendar toolbox, then you’d have the 2 repeating groups inside, as mentioned.
Sorry if this doesn’t quite add up, its difficult to summarise the implementation of this with just words.
Do you have the link to the demo ’ timeline calendar’ so I can see it in action?
Sorry for the delay in getting back to you. I have tried to follow your instructions but I’m struggling. I have created a new app and shared the link below. If you get a chance would you mind taking a look and seeing if you can get it to work.
I’ve had a quick look and made some changes - converted to week view, applied some conditions to weekends. Still needs some work and I’m not sure from the 1st example you shared how other things work on the calendar e.g. the blue background date.
Also another tricky thing is to display the month coinciding/joined with the week number in the month e.g. Week 3 - March 2019, this may require some custom JS.