YunoHost/SSOwat
1
0
Fork 0
mirror of https://github.com/YunoHost/SSOwat.git synced 2024-09-03 20:06:27 +02:00
Code Issues Projects Releases Packages Wiki Activity

Fixing overlay causes scrolling freezes on iOS

Browse source
This commit is contained in:
unknown 2021-05-12 02:50:49 +04:00
parent bf74cc12a5
commit 3cac2c4ee5
2 changed files with 36 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
portal/assets/css/ynh_overlay.css
View file

@ -20,9 +20,12 @@
html.ynh-panel-active { html.ynh-panel-active {
/* Disable any scrolling on app */ /* Disable any scrolling on app */
overflow: hidden; overflow: hidden;
} }
body {/*overflow-y: scroll;*/} body {
overflow-y: auto;
}
#ynh-overlay-switch, #ynh-overlay-switch,
#ynh-overlay-switch *, #ynh-overlay-switch *,
@ -70,14 +73,14 @@ body {/*overflow-y: scroll;*/}
/* Background */ /* Background */
#ynh-overlay { #ynh-overlay {
visibility: hidden; overflow-y: hidden;
position: fixed; position: fixed;
top:0; top:0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 9999999; z-index: 9999999;
display: block; display: none;
border: none; border: none;
color:#fff; color:#fff;
background: #41444F; background: #41444F;

31
portal/assets/js/ynh_portal.js
View file

@ -265,8 +265,8 @@ function init_portal_button_and_overlay()
var portalOverlay = document.createElement('iframe'); var portalOverlay = document.createElement('iframe');
portalOverlay.src = "/yunohost/sso/portal.html"; portalOverlay.src = "/yunohost/sso/portal.html";
portalOverlay.setAttribute("id","ynh-overlay"); portalOverlay.setAttribute("id","ynh-overlay");
portalOverlay.setAttribute("style","visibility: hidden;"); // make sure the overlay is invisible already 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 // portalOverlay.setAttribute("class","ynh-fadeOut"); // set overlay as masked when loading it
document.body.insertBefore(portalOverlay, null); document.body.insertBefore(portalOverlay, null);
// Inject portal button // Inject portal button
@ -287,10 +287,12 @@ function init_portal_button_and_overlay()
Element.toggleClass(portalOverlay, 'ynh-active'); Element.toggleClass(portalOverlay, 'ynh-active');
if (Element.hasClass(portalOverlay, 'ynh-active')) { if (Element.hasClass(portalOverlay, 'ynh-active')) {
portalOverlay.setAttribute("style","display: block;");
meta_viewport.setAttribute('content', meta_viewport_content); meta_viewport.setAttribute('content', meta_viewport_content);
Element.addClass(portalOverlay, 'ynh-fadeIn'); Element.addClass(portalOverlay, 'ynh-fadeIn');
Element.removeClass(portalOverlay, 'ynh-fadeOut'); Element.removeClass(portalOverlay, 'ynh-fadeOut');
} else { } else {
portalOverlay.setAttribute("style","display: none;");
meta_viewport.setAttribute('content', "width=device-width"); meta_viewport.setAttribute('content', "width=device-width");
Element.removeClass(portalOverlay, 'ynh-fadeIn'); Element.removeClass(portalOverlay, 'ynh-fadeIn');
Element.addClass(portalOverlay, 'ynh-fadeOut'); Element.addClass(portalOverlay, 'ynh-fadeOut');
@ -342,6 +344,7 @@ function init_portal()
}); });
} }
function tweak_portal_when_in_iframe() function tweak_portal_when_in_iframe()
{ {
// Set class to body to show we're in overlay // 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;
});