Problem/Motivation

The height and contentHeight calendar settings are non-functional. The settings are added to the outer array of options for the calendar like this:

"fullcalendar":{"ID":{"height":"auto","contentHeight":"auto", ... ,"options":{"aspectRatio":"", ... }}}

Instead, they need to be added to the inner options array like this:

"fullcalendar":{"ID":{ ... ,"options":{"aspectRatio":"","height":"auto","contentHeight":"auto", ... }}}

Steps to reproduce

In a FullCalendar view's "Calendar Appearance/Sizing" settings set the "Width-height ratio" to an empty value. Then try to set values for the "Height" and "View area height". They have no effect. Check the drupalSettings JSON and see that the height settings are not added to the options array.

Drupal\fullcalendar\Plugin\fullcalendar\type\FullCalendar::preView() performs validation and data normalization on the settings. It decides how to normalize based on values obtained from OptionsFormHelperTrait::getCalendarProperties(). If an option isn't set up in getCalendarProperties(), then the normalization ignores the setting (there's no default case in the switch statement on line 1435) and it doesn't get added to the calendar options.

Proposed resolution

Add height and contentHeight to the getCalendarProperties() array so they get processed properly as options.

Remaining tasks

User interface changes

Introduced terminology

API changes

Data model changes

Release notes snippet

Issue fork fullcalendar-3499954

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

ttnt created an issue. See original summary.

erutan’s picture

erutan commented

The ratio values are just being passed into fullcalendar via it's API... that's how the JS works under the hood.

https://fullcalendar.io/docs/sizing

If you haven't figured this out yet, looking a bit wider the issue in fullcalendar itself (vs this drupal bridge / contrib) could be useful. Perhaps loading contentHeight as well as height would work via custom JS, or make a patch to include contentHeight in the UI?

$('#calendar').fullCalendar({
    height: 'auto',
    contentHeight: 'auto'
});
mortona2k’s picture

mortona2k commented

I'm seeing a vertical scroll when the month view is at a narrow width. If I set the ratio low, like .5, it stretches it out too long.

More clarity/control over this would be much appreciated.

dcam’s picture

dcam commented
Title: Double scrollbar / unintuitive ratio setting » height and contentHeight settings are non-functional
Version: 3.0.2 » 3.0.x-dev
Category: Feature request » Bug report
Issue summary: View changes

It seems like the original reporter of this issue didn't realize they found a bug, but they described it fairly well in the summary:

I did what was recommended: set the Width-height ratio to null, and View area height / Height to 'auto' (+ every possible conceivable combination): the result is always the same: no scrollbar, and a bunch of useless whitespace added to every week in the month view. I went through the fullcalendar docs and tried to mess with the behaviour using external JS, but that went nowhere.

I discovered it for the same reason: I needed to remove the scrollbar inside the calendar. I have to do it for accessibility reasons. After a while of struggling with it I realized that it's because the height and contentHeight settings are not added to the options array in the JS settings. So I'm repurposing this issue to deal with the bug.

dcam opened merge request !77

dcam’s picture

dcam commented
Status: Active » Needs review

I even added a Unit test. Its provider can be extended later with test cases for other options.

mortona2k’s picture

mortona2k commented

Quick test - setting height and contentHeight to auto gets rid of the constrained height and double scrollbars I was seeing.