fix: keep a scrollbar on document when Reveal opens #7831

[ncoden]

Description

#11065 was intented to avoid double scrollbars from a Reveal modal, but removing all scrollbars when the modal opens changes the page content width and the content shift. This is a regression of #7831.

The current solution is a mix between the two previous fixes:

• Modal may have a scrollbar or not, following its content height
• Body has no scrollbar and prevent any scroll
• Document may have a scrollbar, following its content height (controlled in JS)

So the body content never shift, as the document has a scrollbar when a Reveal modal is open only if it already had one before.

Changes:

• add the zf-has-scroll global html modifer and toggle it on Reveal opening/closing and on window resizing
• always prevent scroll on body instead of html tag like in fixed issue #7831 #10583

[ncoden]

Poke @isapir for review

[DanielRuf]

This does probably not respect viewport changes.

[DanielRuf]

Poke @isapir for review

Was the review request meant for @isapir or me?

[ncoden]

@DanielRuf Both

[ncoden]

This does probably not respect viewport changes.

You're right, we should watch for viewport changes. I don't like doing things like this in JS but this seems to be the only solution.

[ncoden]

Some comments to describe that "disabled scrollbar" behavior would be useful tho.

[isapir]

@ncoden @DanielRuf It looks fine to me though I didn't test it by running.

IMO in the edge case that the viewport changes while the Reveal is open then it's OK to show a slight shift and/or disabled scrollbar.

[ncoden]

@isapir @DanielRuf I made the requested changes and some refactor.

82a0493 fix: show/hide Reveal scrollbar on window resizing
deda9dc refactor: rename Reveal internal methods for a better clarity
96141b7 docs: add doc for Reveal methods _addGlobalClasses/_removeGlobalClasses

[DanielRuf]

fix: show/hide Reveal scrollbar on window resizing

I guess orientationchange is missing.

[ncoden]

I guess orientationchange is missing.

Doesn't it count as a resize ?

[ncoden]

I got my answer https://stackoverflow.com/a/23996839/4317384

Some devices/browsers do, some not.

Web development often sounds like biology courses. There's rule for everything and exception for every rule.

[ncoden]

@DanielRuf Actually I am using resizeme from utils.triggers, and the entire framework rely on this. So if we decide to use it (according to browser support), we'll not do it in this PR.

[DanielRuf]

Ok.