mirror of
https://github.com/YunoHost/SSOwat.git
synced 2024-09-03 20:06:27 +02:00
Fixing overlay causes scrolling freezes on iOS
This commit is contained in:
parent
bf74cc12a5
commit
3cac2c4ee5
2 changed files with 36 additions and 6 deletions
|
@ -20,9 +20,12 @@
|
|||
html.ynh-panel-active {
|
||||
/* Disable any scrolling on app */
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
|
||||
body {/*overflow-y: scroll;*/}
|
||||
body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#ynh-overlay-switch,
|
||||
#ynh-overlay-switch *,
|
||||
|
@ -70,14 +73,14 @@ body {/*overflow-y: scroll;*/}
|
|||
|
||||
/* Background */
|
||||
#ynh-overlay {
|
||||
visibility: hidden;
|
||||
overflow-y: hidden;
|
||||
position: fixed;
|
||||
top:0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 9999999;
|
||||
display: block;
|
||||
display: none;
|
||||
border: none;
|
||||
color:#fff;
|
||||
background: #41444F;
|
||||
|
@ -176,4 +179,4 @@ body {/*overflow-y: scroll;*/}
|
|||
width: 80px;
|
||||
height: 75px;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -265,8 +265,8 @@ function init_portal_button_and_overlay()
|
|||
var portalOverlay = document.createElement('iframe');
|
||||
portalOverlay.src = "/yunohost/sso/portal.html";
|
||||
portalOverlay.setAttribute("id","ynh-overlay");
|
||||
portalOverlay.setAttribute("style","visibility: hidden;"); // make sure the overlay is invisible already when loading it
|
||||
portalOverlay.setAttribute("class","ynh-fadeOut"); // set overlay as masked when loading it
|
||||
portalOverlay.setAttribute("style","display: none;"); // make sure the overlay is invisible already when loading it
|
||||
// portalOverlay.setAttribute("class","ynh-fadeOut"); // set overlay as masked when loading it
|
||||
document.body.insertBefore(portalOverlay, null);
|
||||
|
||||
// Inject portal button
|
||||
|
@ -287,10 +287,12 @@ function init_portal_button_and_overlay()
|
|||
Element.toggleClass(portalOverlay, 'ynh-active');
|
||||
|
||||
if (Element.hasClass(portalOverlay, 'ynh-active')) {
|
||||
portalOverlay.setAttribute("style","display: block;");
|
||||
meta_viewport.setAttribute('content', meta_viewport_content);
|
||||
Element.addClass(portalOverlay, 'ynh-fadeIn');
|
||||
Element.removeClass(portalOverlay, 'ynh-fadeOut');
|
||||
} else {
|
||||
portalOverlay.setAttribute("style","display: none;");
|
||||
meta_viewport.setAttribute('content', "width=device-width");
|
||||
Element.removeClass(portalOverlay, 'ynh-fadeIn');
|
||||
Element.addClass(portalOverlay, 'ynh-fadeOut');
|
||||
|
@ -342,6 +344,7 @@ function init_portal()
|
|||
});
|
||||
}
|
||||
|
||||
|
||||
function tweak_portal_when_in_iframe()
|
||||
{
|
||||
// Set class to body to show we're in overlay
|
||||
|
@ -371,3 +374,27 @@ function tweak_portal_when_in_iframe()
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
var lastY = 0; // Needed in order to determine direction of scroll.
|
||||
$(".scroll-container").on('touchstart', function(event) {
|
||||
lastY = event.touches[0].clientY;
|
||||
});
|
||||
|
||||
$('.scroller').on('touchmove', function(event) {
|
||||
var top = event.touches[0].clientY;
|
||||
|
||||
// Determine scroll position and direction.
|
||||
var scrollTop = $(event.currentTarget).scrollTop();
|
||||
var direction = (lastY - top) < 0 ? "up" : "down";
|
||||
|
||||
// FIX IT!
|
||||
if (scrollTop == 0 && direction == "up") {
|
||||
// Prevent scrolling up when already at top as this introduces a freeze.
|
||||
event.preventDefault();
|
||||
} else if (scrollTop >= (event.currentTarget.scrollHeight - event.currentTarget.outerHeight()) && direction == "down") {
|
||||
// Prevent scrolling down when already at bottom as this also introduces a freeze.
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
lastY = top;
|
||||
});
|
Loading…
Reference in a new issue