This commit is contained in:
Administrator
2022-04-18 06:52:24 +00:00
parent 28f29fa610
commit 01c592100d
474 changed files with 48732 additions and 1609 deletions

View File

@@ -0,0 +1,21 @@
parcelRequire=function(e,r,t,n){var i,o="function"==typeof parcelRequire&&parcelRequire,u="function"==typeof require&&require;function f(t,n){if(!r[t]){if(!e[t]){var i="function"==typeof parcelRequire&&parcelRequire;if(!n&&i)return i(t,!0);if(o)return o(t,!0);if(u&&"string"==typeof t)return u(t);var c=new Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}p.resolve=function(r){return e[t][1][r]||r},p.cache={};var l=r[t]=new f.Module(t);e[t][0].call(l.exports,p,l,l.exports,this)}return r[t].exports;function p(e){return f(p.resolve(e))}}f.isParcelRequire=!0,f.Module=function(e){this.id=e,this.bundle=f,this.exports={}},f.modules=e,f.cache=r,f.parent=o,f.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]};for(var c=0;c<t.length;c++)try{f(t[c])}catch(e){i||(i=e)}if(t.length){var l=f(t[t.length-1]);"object"==typeof exports&&"undefined"!=typeof module?module.exports=l:"function"==typeof define&&define.amd?define(function(){return l}):n&&(this[n]=l)}if(parcelRequire=f,i)throw i;return f}({"Omyb":[function(require,module,exports) {
"use strict";function e(e,t){var r=window.MutationObserver;if(r){var n=new r(t);return n.observe(e,{childList:!0,subtree:!0}),n}return e.addEventListener("DOMNodeInserted",t,!1),e.addEventListener("DOMNodeRemoved",t,!1),null}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"A8OV":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("../helpers/observe-dom"));function s(){var e=this,s=this.options.container;s instanceof HTMLElement&&("static"===window.getComputedStyle(s).position&&(s.style.position="relative"));this._observer=t.default(document.querySelector("body"),function(){Object.keys(e.trackedElements).forEach(function(t){e.on("enter",t),e.on("leave",t)})}),s.addEventListener("scroll",this._scroll,{passive:!0}),window.addEventListener("resize",this._scroll,{passive:!0}),this._scroll(),this.attached=!0}exports.default=s;
},{"../helpers/observe-dom":"Omyb"}],"OJn0":[function(require,module,exports) {
"use strict";function e(e,t){if(!e)throw new Error("You should specify the element you want to test");"string"==typeof e&&(e=document.querySelector(e));var n=e.getBoundingClientRect();return n.bottom-t.tolerance>0&&n.right-t.tolerance>0&&n.left+t.tolerance<(window.innerWidth||document.documentElement.clientWidth)&&n.top+t.tolerance<(window.innerHeight||document.documentElement.clientHeight)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"m6QN":[function(require,module,exports) {
"use strict";function e(e,t){if(!e)throw new Error("You should specify the element you want to test");if("string"==typeof e&&(e=document.querySelector(e)),"string"==typeof t&&(t={tolerance:0,container:document.querySelector(t)}),"string"==typeof t.container&&(t.container=document.querySelector(t.container)),t instanceof HTMLElement&&(t={tolerance:0,container:t}),!t.container)throw new Error("You should specify a container element");var o=t.container.getBoundingClientRect();return e.offsetTop+e.clientHeight-t.tolerance>t.container.scrollTop&&e.offsetLeft+e.clientWidth-t.tolerance>t.container.scrollLeft&&e.offsetLeft+t.tolerance<o.width+t.container.scrollLeft&&e.offsetTop+t.tolerance<o.height+t.container.scrollTop}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"VqMh":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var i=e(require("./in-viewport")),n=e(require("./in-container"));function t(e,t){void 0===e&&(e={}),void 0===t&&(t={container:window,tolerance:0});var o,r=Object.keys(e);r.length&&(o=t.container===window?i.default:n.default,r.forEach(function(i){e[i].nodes.forEach(function(n){if(o(n.node,t)?(n.wasVisible=n.isVisible,n.isVisible=!0):(n.wasVisible=n.isVisible,n.isVisible=!1),!0===n.isVisible&&!1===n.wasVisible){if(!e[i].enter)return;Object.keys(e[i].enter).forEach(function(t){"function"==typeof e[i].enter[t]&&e[i].enter[t](n.node,"enter")})}if(!1===n.isVisible&&!0===n.wasVisible){if(!e[i].leave)return;Object.keys(e[i].leave).forEach(function(t){"function"==typeof e[i].leave[t]&&e[i].leave[t](n.node,"leave")})}})}))}exports.default=t;
},{"./in-viewport":"OJn0","./in-container":"m6QN"}],"GRp5":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("../helpers/scroll-handler"));function r(){var e,r=this;return function(){clearTimeout(e),e=setTimeout(function(){t.default(r.trackedElements,r.options)},r.options.debounce)}}exports.default=r;
},{"../helpers/scroll-handler":"VqMh"}],"FO0g":[function(require,module,exports) {
"use strict";function e(){this._observer instanceof MutationObserver&&this._observer.disconnect(),this.options.container.removeEventListener("scroll",this._scroll),window.removeEventListener("resize",this._scroll),this.attached=!1}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"nGOL":[function(require,module,exports) {
"use strict";function e(e,t,s){var l=Object.keys(this.trackedElements[t].enter||{}),n=Object.keys(this.trackedElements[t].leave||{});if({}.hasOwnProperty.call(this.trackedElements,t))if(s){if(this.trackedElements[t][e]){var r="function"==typeof s?s.name:s;delete this.trackedElements[t][e][r]}}else delete this.trackedElements[t][e];l.length||n.length||delete this.trackedElements[t]}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"NKIH":[function(require,module,exports) {
"use strict";function e(e,t,r){if(!e)throw new Error("No event given. Choose either enter or leave");if(!t)throw new Error("No selector to track");if(["enter","leave"].indexOf(e)<0)throw new Error(e+" event is not supported");({}).hasOwnProperty.call(this.trackedElements,t)||(this.trackedElements[t]={}),this.trackedElements[t].nodes=[];for(var s=0,n=document.querySelectorAll(t);s<n.length;s++){var o={isVisible:!1,wasVisible:!1,node:n[s]};this.trackedElements[t].nodes.push(o)}"function"==typeof r&&(this.trackedElements[t][e]||(this.trackedElements[t][e]={}),this.trackedElements[t][e][r.name||"anonymous"]=r)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=e;
},{}],"QCba":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("./methods/attach")),r=e(require("./methods/debounced-scroll")),n=e(require("./methods/destroy")),o=e(require("./methods/off")),i=e(require("./methods/on")),u=e(require("./helpers/in-viewport"));function a(e){void 0===e&&(e={tolerance:0,debounce:100,container:window}),this.options={},this.trackedElements={},Object.defineProperties(this.options,{container:{configurable:!1,enumerable:!1,get:function(){var t;return"string"==typeof e.container?t=document.querySelector(e.container):e.container instanceof HTMLElement&&(t=e.container),t||window},set:function(t){e.container=t}},debounce:{get:function(){return e.debounce||100},set:function(t){e.debounce=t}},tolerance:{get:function(){return e.tolerance||0},set:function(t){e.tolerance=t}}}),Object.defineProperty(this,"_scroll",{enumerable:!1,configurable:!1,writable:!1,value:this._debouncedScroll.call(this)}),this.attach()}Object.defineProperties(a.prototype,{_debouncedScroll:{configurable:!1,writable:!1,enumerable:!1,value:r.default},attach:{configurable:!1,writable:!1,enumerable:!1,value:t.default},destroy:{configurable:!1,writable:!1,enumerable:!1,value:n.default},off:{configurable:!1,writable:!1,enumerable:!1,value:o.default},on:{configurable:!1,writable:!1,enumerable:!1,value:i.default}}),a.check=u.default,exports.default=a;
},{"./methods/attach":"A8OV","./methods/debounced-scroll":"GRp5","./methods/destroy":"FO0g","./methods/off":"nGOL","./methods/on":"NKIH","./helpers/in-viewport":"OJn0"}]},{},["QCba"], null)

View File

@@ -0,0 +1,404 @@
/**
* Observes DOM mutations and runs a callback function when
* detecting one.
*
* @param {node} obj The DOM node you want to observe
* @param {function} callback The callback function you want to call
* @return {MutationObserver} obs The mutation observer instance used to track DOM mutations
*/
function observeDOM(obj, callback) {
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
/* istanbul ignore else */
if (MutationObserver) {
var obs = new MutationObserver(callback);
obs.observe(obj, {
childList: true,
subtree: true
});
return obs;
}
obj.addEventListener('DOMNodeInserted', callback, false);
obj.addEventListener('DOMNodeRemoved', callback, false);
return null;
}
/**
* Attaches the scroll event handler
*
* @return {void}
*/
function attach() {
var _this = this;
var container = this.options.container;
if (container instanceof HTMLElement) {
var style = window.getComputedStyle(container);
if (style.position === 'static') {
container.style.position = 'relative';
}
}
this._observer = observeDOM(document.querySelector('body'), function () {
Object.keys(_this.trackedElements).forEach(function (element) {
_this.on('enter', element);
_this.on('leave', element);
});
});
container.addEventListener('scroll', this._scroll, { passive: true });
window.addEventListener('resize', this._scroll, { passive: true });
this._scroll();
this.attached = true;
}
/**
* Checks an element's position in respect to the viewport
* and determines wether it's inside the viewport.
*
* @param {node} element The DOM node you want to check
* @return {boolean} A boolean value that indicates wether is on or off the viewport.
*/
function inViewport(el) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { tolerance: 0 };
if (!el) {
throw new Error('You should specify the element you want to test');
}
if (typeof el === 'string') {
el = document.querySelector(el);
}
var elRect = el.getBoundingClientRect();
return (
// Check bottom boundary
elRect.bottom - options.tolerance > 0 &&
// Check right boundary
elRect.right - options.tolerance > 0 &&
// Check left boundary
elRect.left + options.tolerance < (window.innerWidth || document.documentElement.clientWidth) &&
// Check top boundary
elRect.top + options.tolerance < (window.innerHeight || document.documentElement.clientHeight)
);
}
/**
* Checks an element's position in respect to a HTMLElement
* and determines wether it's within its boundaries.
*
* @param {node} element The DOM node you want to check
* @return {boolean} A boolean value that indicates wether is on or off the container.
*/
function inContainer(el) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { tolerance: 0, container: '' };
if (!el) {
throw new Error('You should specify the element you want to test');
}
if (typeof el === 'string') {
el = document.querySelector(el);
}
if (typeof options === 'string') {
options = {
tolerance: 0,
container: document.querySelector(options)
};
}
if (typeof options.container === 'string') {
options.container = document.querySelector(options.container);
}
if (options instanceof HTMLElement) {
options = {
tolerance: 0,
container: options
};
}
if (!options.container) {
throw new Error('You should specify a container element');
}
var containerRect = options.container.getBoundingClientRect();
return (
// // Check bottom boundary
el.offsetTop + el.clientHeight - options.tolerance > options.container.scrollTop &&
// Check right boundary
el.offsetLeft + el.clientWidth - options.tolerance > options.container.scrollLeft &&
// Check left boundary
el.offsetLeft + options.tolerance < containerRect.width + options.container.scrollLeft &&
// // Check top boundary
el.offsetTop + options.tolerance < containerRect.height + options.container.scrollTop
);
}
// TODO: Refactor this so it can be easily tested
/* istanbul ignore next */
function eventHandler() {
var trackedElements = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { tolerance: 0 };
var selectors = Object.keys(trackedElements);
var testVisibility = void 0;
if (!selectors.length) return;
if (options.container === window) {
testVisibility = inViewport;
} else {
testVisibility = inContainer;
}
selectors.forEach(function (selector) {
trackedElements[selector].nodes.forEach(function (item) {
if (testVisibility(item.node, options)) {
item.wasVisible = item.isVisible;
item.isVisible = true;
} else {
item.wasVisible = item.isVisible;
item.isVisible = false;
}
if (item.isVisible === true && item.wasVisible === false) {
if (!trackedElements[selector].enter) return;
Object.keys(trackedElements[selector].enter).forEach(function (callback) {
if (typeof trackedElements[selector].enter[callback] === 'function') {
trackedElements[selector].enter[callback](item.node, 'enter');
}
});
}
if (item.isVisible === false && item.wasVisible === true) {
if (!trackedElements[selector].leave) return;
Object.keys(trackedElements[selector].leave).forEach(function (callback) {
if (typeof trackedElements[selector].leave[callback] === 'function') {
trackedElements[selector].leave[callback](item.node, 'leave');
}
});
}
});
});
}
/**
* Debounces the scroll event to avoid performance issues
*
* @return {void}
*/
function debouncedScroll() {
var _this = this;
var timeout = void 0;
if (this.options.debounce === false) {
return function () {
return eventHandler(_this.trackedElements, _this.options);
};
}
return function () {
clearTimeout(timeout);
timeout = setTimeout(function () {
eventHandler(_this.trackedElements, _this.options);
}, _this.options.debounce);
};
}
/**
* Removes the scroll event handler
*
* @return {void}
*/
function destroy() {
if (this._observer instanceof MutationObserver) {
this._observer.disconnect();
}
this.options.container.removeEventListener('scroll', this._scroll);
window.removeEventListener('resize', this._scroll);
this.attached = false;
}
/**
* Stops tracking elements matching a CSS selector. If a selector has no
* callbacks it gets removed.
*
* @param {string} event The event you want to stop tracking (enter or leave)
* @param {string} selector The CSS selector you want to stop tracking
* @return {void}
*/
function off(event, selector, handler) {
var enterCallbacks = Object.keys(this.trackedElements[selector].enter || {});
var leaveCallbacks = Object.keys(this.trackedElements[selector].leave || {});
if ({}.hasOwnProperty.call(this.trackedElements, selector)) {
if (handler) {
if (this.trackedElements[selector][event]) {
var callbackName = typeof handler === 'function' ? handler.name : handler;
delete this.trackedElements[selector][event][callbackName];
}
} else {
delete this.trackedElements[selector][event];
}
}
if (!enterCallbacks.length && !leaveCallbacks.length) {
delete this.trackedElements[selector];
}
}
/**
* Starts tracking elements matching a CSS selector
*
* @param {string} event The event you want to track (enter or leave)
* @param {string} selector The element you want to track
* @param {function} callback The callback function to handle the event
* @return {void}
*/
function on(event, selector, callback) {
var allowed = ['enter', 'leave'];
if (!event) throw new Error('No event given. Choose either enter or leave');
if (!selector) throw new Error('No selector to track');
if (allowed.indexOf(event) < 0) throw new Error(event + ' event is not supported');
if (!{}.hasOwnProperty.call(this.trackedElements, selector)) {
this.trackedElements[selector] = {};
}
this.trackedElements[selector].nodes = [];
for (var i = 0, elems = document.querySelectorAll(selector); i < elems.length; i++) {
var item = {
isVisible: false,
wasVisible: false,
node: elems[i]
};
this.trackedElements[selector].nodes.push(item);
}
if (typeof callback === 'function') {
if (!this.trackedElements[selector][event]) {
this.trackedElements[selector][event] = {};
}
this.trackedElements[selector][event][callback.name || 'anonymous'] = callback;
}
}
/**
* Detects wether DOM nodes enter or leave the viewport
*
* @constructor
* @param {object} options The configuration object
*/
function OnScreen() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : { tolerance: 0, debounce: 100, container: window };
this.options = {};
this.trackedElements = {};
Object.defineProperties(this.options, {
container: {
configurable: false,
enumerable: false,
get: function get() {
var container = void 0;
if (typeof options.container === 'string') {
container = document.querySelector(options.container);
} else if (options.container instanceof HTMLElement) {
container = options.container;
}
return container || window;
},
set: function set(value) {
options.container = value;
}
},
debounce: {
get: function get() {
if (options.debounce === false) {
return false;
}
return parseInt(options.debounce, 10) || 100;
},
set: function set(value) {
options.debounce = value;
}
},
tolerance: {
get: function get() {
return parseInt(options.tolerance, 10) || 0;
},
set: function set(value) {
options.tolerance = value;
}
}
});
Object.defineProperty(this, '_scroll', {
enumerable: false,
configurable: false,
writable: false,
value: this._debouncedScroll.call(this)
});
this.attach();
}
Object.defineProperties(OnScreen.prototype, {
_debouncedScroll: {
configurable: false,
writable: false,
enumerable: false,
value: debouncedScroll
},
attach: {
configurable: false,
writable: false,
enumerable: false,
value: attach
},
destroy: {
configurable: false,
writable: false,
enumerable: false,
value: destroy
},
off: {
configurable: false,
writable: false,
enumerable: false,
value: off
},
on: {
configurable: false,
writable: false,
enumerable: false,
value: on
}
});
OnScreen.check = inViewport;
export default OnScreen;

File diff suppressed because one or more lines are too long