FullCalendar change view responsively

cal.js

/*

Uses https://fullcalendar.io/

calendar_events is a multidim array of event info. Eg:
	[{
		title: 'My Event 1',
		url: 'https://myevent_1.booking.page',
		start: '2023-05-28T21:30:00'
	},
  {
		title: 'My Event 2',
		url: 'https://myevent_2.booking.page',
		start: '2023-06-01T19:00:00'
	}
  ]
*/

jQuery(document).ready(function() {
  
    var calendarEl = document.getElementById('bandstand-calendar');
		var calendar = new FullCalendar.Calendar(calendarEl, {
			initialView: isMobile() ? "listMonth" : "dayGridMonth",
			headerToolbar: {
				left: 'title,prev,next',
				center: '',
				right: ''
			},
			titleFormat: { year: 'numeric', month: 'short' },
			windowResize: function(arg) {
        // If screen < 640px wide display the listMonth view
				if ( isMobile() ) {
					this.view.type = "listMonth";
					this.changeView("listMonth");

				} else {
          // If screen >= 640px wide display the dayGridMonth view
					this.view.type = "dayGridMonth";
					this.changeView("dayGridMonth");
				}
  			},
			events: calendar_events,
			eventClick: function(info) {
        // Open even in a new tab when clicked
				info.jsEvent.preventDefault(); // don't let the browser navigate
			
				if (info.event.url) {
					window.open(info.event.url);
				}
			}
			});

		calendar.render();
});
        
// is_mobile if the viewport is < 640px wide
function isMobile() {
	var is_mobile = false;
	if (window.innerWidth < 640) {
		is_mobile = true;
	}
	return is_mobile;
}