From a946d72542db1f89c62f59a9dae8a1082788fb7e Mon Sep 17 00:00:00 2001 From: James Rea Date: Wed, 25 Apr 2018 16:22:52 +0100 Subject: [PATCH 1/4] removed legacy fix which paused javascript on scroll --- src/core/js/libraries/inview.js | 90 +++++++++++++-------------------- 1 file changed, 35 insertions(+), 55 deletions(-) diff --git a/src/core/js/libraries/inview.js b/src/core/js/libraries/inview.js index e3d0d3fb0..7daacfed8 100644 --- a/src/core/js/libraries/inview.js +++ b/src/core/js/libraries/inview.js @@ -42,9 +42,9 @@ var isLocked = locking.isLocked(); var $element = $(element); - handlers.registered.push({ + handlers.registered.push({ id: expando.make(element, data), - data: data, + data: data, $element: $element, type: type, _onscreen: isLocked ? null : measurements.get($element).uniqueMeasurementId, @@ -76,10 +76,10 @@ handlers.shouldReProcess = true; while (handlers.shouldReProcess) { handlers.shouldReProcess = false; - + registeredCount = registered.length; if (registeredCount == 0) return; - + for (var i = 0; i < registeredCount; i++) { var item = registered[i]; var measure = measurements.get(item.$element); @@ -120,7 +120,7 @@ processInView: function(item, measure) { - var isTopOnScreen = (measure.percentFromTop >= 0 && measure.percentFromTop <= 100); + var isTopOnScreen = (measure.percentFromTop >= 0 && measure.percentFromTop <= 100); var isBottomOnScreen = (measure.percentFromBottom >= 0 && measure.percentFromBottom <= 100); var isLeftOnScreen = (measure.percentFromLeft >= 0 && measure.percentFromLeft <= 100); var isRightOnScreen = (measure.percentFromRight >= 0 && measure.percentFromRight <= 100); @@ -143,26 +143,6 @@ visiblePartY //top, bottom, both, none ]; - if (item._inviewPreviousState !== undefined && config.options.allowScrollOver ) { - //this is for browsers which pause javascript execution on scroll - - //check previous state and current state - var wasScrolledOver = (item._measurePreviousState.percentFromBottom <= 100 && measure.percentFromBottom >= 100 ); - - //if inview state hasn't changed, don't retrigger event - if (item._inviewPreviousState[0] == inviewState[0] && - item._inviewPreviousState[1] == inviewState[1] && - item._inviewPreviousState[2] == inviewState[2] && - !wasScrolledOver) return; - - if (wasScrolledOver) { - //make sure to trigger a scrolled over both top and bottom event - inviewState[0] = true; - inviewState[1] = "both"; - inviewState[2] = "both"; - } - } - item._inviewPreviousState = inviewState; item._measurePreviousState = measure; @@ -187,7 +167,7 @@ }, repeat: function() { - + loop.stop(); if (loop.hasRaf) { @@ -202,7 +182,7 @@ var timeSinceLast = (new Date()).getTime() - loop.lastStartEvent; if (timeSinceLast < 1500) return; - + loop.stop() return true; }, @@ -267,21 +247,21 @@ $.extend($.event.special, { onscreen: { - + noBubble: true, add: function(data) { handlers.register(this, data, handlers.TYPE.onscreen); }, - remove: function(data) { + remove: function(data) { handlers.unregister(this, data, handlers.TYPE.onscreen); } }, inview: { - + noBubble: true, add: function(data) { @@ -325,7 +305,7 @@ } }); - + //interface to allow for inview/onscreen to be disabled var locking = { locks: [], @@ -364,13 +344,13 @@ } } return false; - + } }; var config = { - + options: { allowScrollOver: true }, @@ -409,14 +389,14 @@ loop.start(); } - }; + }; var measurements = { featureDetect: function() { - + loop.hasRaf = (window.requestAnimationFrame && window.cancelAnimationFrame); - + }, get: function get($element) { @@ -432,10 +412,10 @@ // IE11 throws an error if the element isn't present in the DOM offset = { top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 }; } - + var height = offset.height; var width = offset.width; - + //topleft from topleft of window var top = offset["top"]; var left = offset["left"]; @@ -472,7 +452,7 @@ } else { //fully inscreen inviewVertical = height; } - + // cap floor at 0 - cannot have negative inviews. if (inviewVertical < 0) inviewVertical = 0; if (inviewHorizontal < 0) inviewHorizontal = 0; @@ -495,16 +475,16 @@ if (cssHidden) onscreen = false; if (onscreen) { - + // perform some extra checks to make sure item is onscreen var parents = measurements.getParents(el); - + // go through all the parents except the html tag for (var i = 0, l = parents.length-1; i < l; i++) { var parent = parents[i]; - + cssHidden = measurements.isElementHidden(parent); - + // check if parents are visibility hidden or display none if (cssHidden) { onscreen = false; @@ -523,17 +503,17 @@ } var uniqueMeasurementId = ""+top+left+bottom+right+height+width+wndw.height+wndw.width+onscreen; - - return { - top: top, - left: left, + + return { + top: top, + left: left, bottom: bottom, - right: right, - percentFromTop: percentFromTop, - percentFromLeft: percentFromLeft, - percentFromBottom: percentFromBottom, - percentFromRight: percentFromRight, - percentInview: percentInview, + right: right, + percentFromTop: percentFromTop, + percentFromLeft: percentFromLeft, + percentFromBottom: percentFromBottom, + percentFromRight: percentFromRight, + percentInview: percentInview, percentInviewHorizontal: percentInviewHorizontal, percentInviewVertical: percentInviewVertical, onscreen: onscreen, @@ -567,7 +547,7 @@ var isScrollWidthOverflowing = (parent.clientWidth < parent.scrollWidth); var isScrollHeightOverflowing = (parent.clientHeight < parent.scrollHeight); var isOverflowing = (isScrollWidthOverflowing || isScrollHeightOverflowing); - + var $parent = $(parent); if (!isOverflowing || ($parent.css("overflow") === "visible")) { @@ -586,7 +566,7 @@ // check inclusive of bounding rectangle edges var isOutOfBounds = (childOffsetTop >= parent.clientHeight - || childOffsetLeft >= parent.clientWidth + || childOffsetLeft >= parent.clientWidth || childOffsetBottom <= 0 || childOffsetRight <= 0); From ff14edac9d7dca98af002075355aa81cb47f4e96 Mon Sep 17 00:00:00 2001 From: James Rea Date: Tue, 19 Jun 2018 09:54:31 +0100 Subject: [PATCH 2/4] removed configureInview & call --- src/core/js/app.js | 14 -------------- 1 file changed, 14 deletions(-) diff --git a/src/core/js/app.js b/src/core/js/app.js index 364a9b47f..405080920 100644 --- a/src/core/js/app.js +++ b/src/core/js/app.js @@ -42,8 +42,6 @@ require([ && Adapt.components.models.length > 0 && Adapt.course.get('_id')) { - configureInview(); - mapAdaptIdsToObjects(); if (typeof Adapt.course.get('_buttons').submit !== 'undefined') { @@ -137,18 +135,6 @@ require([ } - function configureInview() { - - var adaptConfig = Adapt.config.get("_inview"); - - var allowScrollOver = (adaptConfig && adaptConfig._allowScrollOver === false ? false : true); - - $.inview.config({ - allowScrollOver: allowScrollOver - }); - - } - function mapAdaptIdsToObjects () { Adapt.contentObjects._byAdaptID = Adapt.contentObjects.groupBy("_id"); Adapt.articles._byAdaptID = Adapt.articles.groupBy("_id"); From ec5860d3bca27f937655e6ae7dab9bdcd34a2c49 Mon Sep 17 00:00:00 2001 From: James Date: Wed, 27 Jun 2018 15:17:08 +0100 Subject: [PATCH 3/4] updated based on comments in jquery.onscreen PR --- src/core/js/app.js | 14 -------------- src/core/js/libraries/inview.js | 23 +---------------------- 2 files changed, 1 insertion(+), 36 deletions(-) diff --git a/src/core/js/app.js b/src/core/js/app.js index f86fe0dcb..fbc8a65ca 100644 --- a/src/core/js/app.js +++ b/src/core/js/app.js @@ -42,8 +42,6 @@ require([ Adapt.components.models.length > 0 && Adapt.course.get('_id')) { - configureInview(); - mapAdaptIdsToObjects(); Adapt.log.debug('Firing app:dataLoaded'); @@ -115,18 +113,6 @@ require([ } - function configureInview() { - - var adaptConfig = Adapt.config.get("_inview"); - - var allowScrollOver = (adaptConfig && adaptConfig._allowScrollOver === false ? false : true); - - $.inview.config({ - allowScrollOver: allowScrollOver - }); - - } - function mapAdaptIdsToObjects () { Adapt.contentObjects._byAdaptID = Adapt.contentObjects.groupBy("_id"); Adapt.articles._byAdaptID = Adapt.articles.groupBy("_id"); diff --git a/src/core/js/libraries/inview.js b/src/core/js/libraries/inview.js index e3d0d3fb0..55fce34c8 100644 --- a/src/core/js/libraries/inview.js +++ b/src/core/js/libraries/inview.js @@ -143,25 +143,6 @@ visiblePartY //top, bottom, both, none ]; - if (item._inviewPreviousState !== undefined && config.options.allowScrollOver ) { - //this is for browsers which pause javascript execution on scroll - - //check previous state and current state - var wasScrolledOver = (item._measurePreviousState.percentFromBottom <= 100 && measure.percentFromBottom >= 100 ); - - //if inview state hasn't changed, don't retrigger event - if (item._inviewPreviousState[0] == inviewState[0] && - item._inviewPreviousState[1] == inviewState[1] && - item._inviewPreviousState[2] == inviewState[2] && - !wasScrolledOver) return; - - if (wasScrolledOver) { - //make sure to trigger a scrolled over both top and bottom event - inviewState[0] = true; - inviewState[1] = "both"; - inviewState[2] = "both"; - } - } item._inviewPreviousState = inviewState; item._measurePreviousState = measure; @@ -371,9 +352,7 @@ var config = { - options: { - allowScrollOver: true - }, + options: {}, config: function(options) { if (typeof options !== "object") return; From 8cd11207c9c32787e62a2e44f72c30538b870786 Mon Sep 17 00:00:00 2001 From: James Date: Wed, 27 Jun 2018 16:47:21 +0100 Subject: [PATCH 4/4] restored &&s to their rightful position --- src/core/js/app.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/core/js/app.js b/src/core/js/app.js index 7f08c5dfc..6ac49ea21 100644 --- a/src/core/js/app.js +++ b/src/core/js/app.js @@ -36,11 +36,11 @@ require([ // This function is called anytime a course object is loaded // Once all course files are loaded trigger events and call Adapt.initialize Adapt.checkDataIsLoaded = function(newLanguage) { - if (Adapt.contentObjects.models.length > 0 - && Adapt.articles.models.length > 0 - && Adapt.blocks.models.length > 0 - && Adapt.components.models.length > 0 - && Adapt.course.get('_id')) { + if (Adapt.contentObjects.models.length > 0 && + Adapt.articles.models.length > 0 && + Adapt.blocks.models.length > 0 && + Adapt.components.models.length > 0 && + Adapt.course.get('_id')) { mapAdaptIdsToObjects();