stephenharris / Event-Organiser

WordPress plug-in, Event Organiser, development repository
http://wordpress.org/extend/plugins/event-organiser/
GNU General Public License v3.0
100 stars 76 forks source link

Resizing page with fullCalendar shortcode and a different view resets the main calendar #536

Open zachflauaus opened 1 year ago

zachflauaus commented 1 year ago

I've recently discovered a bug where if a page is using the eo_fullcalendar shortcode, has different view options available, and the user has selected a non-default view, the calendar will reset to the default view that is set. For example, if the page is using the following shortcode:

[eo_fullcalendar headerLeft='today,prev,next' headerCenter='prev,title,next' headerRight='month,agendaWeek,agendaDay']

The calendar's default view will be the month grid view. But if the user selects the Week or Day view and resizes the window, the calendar will reset back to the month view. This was discovered because our custom theme uses a Javascript library that fires event listeners for the resize event to determine if the navigation bar should stick to the top of the window based on the height. Here's a screen recording of the issue:

https://github.com/stephenharris/Event-Organiser/assets/2138175/cd39b8e8-945f-4e2c-97cf-6905f130eead

I've also created a demo site with a page that uses the view options and has the bug and one that doesn't use the view options and does not have the bug.

It seems like this is caused by the frontend.js file on line 281:

windowResize: function(view) {
    if( view.calendar.options.responsive && $(window).width() < view.calendar.options.responsiveBreakpoint ){
        $(this).fullCalendar( 'changeView', _eoResponsiveViewMap[view.calendar.options.previousView] );
    } else {
        $(this).fullCalendar( 'changeView', view.calendar.options.previousView );
    }
},

Removing the else condition fixes that bug and allows the calendar to go into the responsive list view but it then breaks in the opposite direction and does not change the responsive list view into the grid view when the window is larger than the responsive breakpoint. I could also be totally off base and the issue could also lie in the fullCalendar library itself. If I can provide any other information or help, let me know. 👍


Tested with: