Hey Jeff,

we have some users complaining about the page reload, which is fired on orientation-change, while using responsive menus.

We are using the overlay menu as responsive style. The problem is, that we have many nodes with embedded videos, where the automatic behavior of iOS is, that fullscreen mode is activated after hitting the play button – in most cases followed by a device rotation to landscape by the user himself. Thats pretty much how everybody would do it, to enlarge the video. At this point the page reloads, fullscreen mode will be closed and the user has to push play again. Some users reported, that they tried it a number of times before they noticed that the device rotation was the problem. Unfortunately not as user friendly as we would like to be.

To reproduce this, open the following link on an iPhone (portrait mode), click the play button of the video embed and rotate your device.
https://www.pleasuremag.com/columns/videos/yawgoons-18

Is this necessary for the overlay menu or could I just remove it?
I think you need to re-init some scripts with the reload; maybe you could add a listener to the page resize / width instead to trigger these?!

Would be nice if you could give me some advice on how to solve this behavior!

Thanks in advance,
Anton

Comments

toni4i created an issue. See original summary.

Jeff Burnz’s picture

Jeff Burnz CreditAttribution: Jeff Burnz commented
Category: Support request » Bug report

Lets look at removing the reload, I think we could achieve this because it may no longer be required. The reason it's there is because of the way the layout JS would fire through the breakpoints and potentially mess up the layout when you have empty rows and regions (this can happen because of things like placeholders, see this issue (it's epic, but it's the reason): #953034: [meta] Themes improperly check renderable arrays when determining visibility

However, I have since disabled most if not all layout JS that was designed to work around #953034, because while it worked quite well in testing, in the real world there were too many things that broke it.

Upshot is we may be able now to remove the reload as well.

Lets call this a bug - because really it always has been a usability bug.

Jeff Burnz’s picture

Jeff Burnz CreditAttribution: Jeff Burnz commented

BTW you can always remove the library, it's at_core/at.orientationchangereload, at least until I get a chance to look at this properly.

ABaier’s picture

ABaier CreditAttribution: ABaier commented

Sounds good, thanks for investigating this!

I was a bit concerned just removing it, before asking, because our setup does not have a staging environment, so I would push the change directly to the production site. Since orientationchange does only kick in on mobile devices I was currently not able to test it in my local environment ... all my testing was based on the current implementation including the page reload.

I will give it a try though, when I find the time to react on unexpected behaviors quickly.

Jeff Burnz’s picture

Jeff Burnz CreditAttribution: Jeff Burnz commented

All it really does is make 100% certain the page reflows properly, iOS devices can be a pita. I'm working on a patch that will only fire this reload if there's a change in the dom.