diff --git a/resources/assets/src/js/common/utils.js b/resources/assets/src/js/common/utils.js index f8fccd17..f40a476c 100644 --- a/resources/assets/src/js/common/utils.js +++ b/resources/assets/src/js/common/utils.js @@ -62,6 +62,51 @@ function getQueryString(key, defaultValue) { } } +/** + * Check if the `resize` event is fired by scrolling on a mobile browser + * whose address bar (e.g. Chrome) will hide automatically when scrolling. + * + * @return {Boolean} + */ +function isMobileBrowserScrolling() { + let currentWindowWidth = $(window).width(); + let currentWindowHeight = $(window).height(); + + if ($.cachedWindowWidth === undefined) { + $.cachedWindowWidth = currentWindowWidth; + } + + if ($.cachedWindowHeight === undefined) { + $.cachedWindowHeight = currentWindowHeight; + } + + let isWidthChanged = (currentWindowWidth !== $.cachedWindowWidth); + let isHeightChanged = (currentWindowHeight !== $.cachedWindowHeight); + + // If the window width & height changes simultaneously, the resize can't be fired by scrolling. + if (isWidthChanged && isHeightChanged) { + return false; + } + + // If only width was changed, it also can't be. + if (isWidthChanged) { + return false; + } + + // If width didn't change but height changed ? + if (isHeightChanged) { + let last = $.lastWindowHeight; + $.lastWindowHeight = currentWindowHeight; + + if (last === undefined || currentWindowHeight == last) { + return true; + } + } + + // If both width & height did not change + return false; +} + /** * Return a debounced function * @@ -101,5 +146,6 @@ if (typeof require !== 'undefined' && typeof module !== 'undefined') { isEmpty, debounce, getQueryString, + isMobileBrowserScrolling, }; } diff --git a/resources/views/index.tpl b/resources/views/index.tpl index 6475ccfa..bb333bd5 100644 --- a/resources/views/index.tpl +++ b/resources/views/index.tpl @@ -128,8 +128,6 @@