Forum Discussion

john john's avatar
john john
Steel Contributor
Oct 30, 2023

Show SharePoint list items inside a calender-like horizontal gallery

I have 3 SharePoint lists:-

 

1) Media. With those fields; ID + Title

2) Network. With those fields; ID + Title + MediumID

3) BookingCalendar. With those fields; ID + Title +  Brand + NetWorkID + StartDate + EndDate+ ColorCode

 

now I want to build screen as follow:-

 

 

So first i have a horizontal gallery to show the Media items on top, then under it i have a month and year to chose from, then i will show the list of Networks and their booking item based on the StartDate + EndDate + Color code (showing the Booking item Title+BrandName).

 

I did the following;-

 

1) I added a horizontal Gallery for the Media, as follow:-

 

 

2) then i added a vertical gallery showing the networks for the selected Media, as follow:-

 

 

3) and for the previous month arrow onselect property:-

/*changes month view to previous month*/
Set(_firstDayOfMonth, DateAdd(_firstDayOfMonth, -1, TimeUnit.Months));
Set(_firstDayInView, DateAdd(_firstDayOfMonth, -(Weekday(_firstDayOfMonth) - 2 + 1), TimeUnit.Days));
Set(_lastDayOfMonth, DateAdd(DateAdd(_firstDayOfMonth, 1, TimeUnit.Months), -1, TimeUnit.Days));

4) for the next month arrow onselect:-

/*changes month view to next month*/
Set(_firstDayOfMonth, DateAdd(_firstDayOfMonth, 1, TimeUnit.Months));
Set(_firstDayInView, DateAdd(_firstDayOfMonth, -(Weekday(_firstDayOfMonth) - 2 + 1), TimeUnit.Days));
/*collects calendar events for all days in current month view. Updates _maxDate to prevent duplicate data collection if user returns to this month view*/
Set(_lastDayOfMonth, DateAdd(DateAdd(_firstDayOfMonth, 1, TimeUnit.Months), -1, TimeUnit.Days));

5) for the month, year label Text property:-

Text(_firstDayOfMonth, "mmmm yyyy")

but not sure how i can show the following:-

1) center the calendar for each month on today date and show 3 weeks before and 3 weeks after? so each network calendar should show total of six weeks? then to show the related booking items inside the related Days? as shown in the above picture?

 

Thanks

No RepliesBe the first to reply

Resources