{"version":3,"sources":["services/intersection-observer-factory.js"],"names":["angular","module","factory","$window","configs","defaultObserver","name","root","rootMargin","threshold","lazyloadObserver","stickyNavObserver","keepWatch","IntersectionObserverFactory","config","subscribers","observer","undefined","subscriber","push","observe","IntersectionObserver","i","length","intersectionRatio","unobserve","target","func","forEach","el","intObservers","key","createObserver","_subscribe","subscribe"],"mappings":"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","sourcesContent":["/**\r\n * Sets up IntersectionObserver as an observable.\r\n * Prevents potential scope issues.\r\n */\r\n\r\n(function() {\r\n angular.module('ngIntersectionObserver', [])\r\n .factory('ngIntersectionObserverService', ['$window',\r\n function($window) {\r\n\r\n var configs = {\r\n // default will fire when target is 100% in screen\r\n defaultObserver: {\r\n name: 'defaultObserver',\r\n root: null,\r\n rootMargin: \"0px 0px\",\r\n threshold: 0\r\n },\r\n lazyloadObserver: {\r\n // fires when target is 50px below the fold\r\n name: 'lazyloadObserver',\r\n root: null,\r\n rootMargin: '50px 0px',\r\n threshold: 0\r\n },\r\n stickyNavObserver: {\r\n name: 'stickyNavObserver',\r\n root: null,\r\n threshold: 0,\r\n rootMargin: '-5px 0px',\r\n keepWatch: true\r\n }\r\n };\r\n\r\n class IntersectionObserverFactory {\r\n constructor(config) {\r\n this.config = config;\r\n this.subscribers = [];\r\n this.observer = undefined;\r\n }\r\n\r\n subscribe(subscriber) {\r\n this.subscribers.push(subscriber);\r\n }\r\n\r\n observe(subscriber) {\r\n this.observer.observe(subscriber);\r\n }\r\n\r\n /**\r\n * createObserver-\r\n * @param { boolean } keepWatch - whether the observer should stop observing after element has entered screen.\r\n * Set in the config.\r\n */\r\n createObserver(keepWatch) {\r\n if ('IntersectionObserver' in $window) { // Confirm browser support\r\n\r\n /**\r\n * NOTE:\r\n * subscribers !== this.subscribers;\r\n * They represent the same element but are different objects.\r\n * this.subscribers = the original list of subscribers passed in {el, func};\r\n * subscribers = the local variable for the IntersectionObserver\r\n */\r\n this.observer = new IntersectionObserver(subscribers => {\r\n \r\n for(let i = 0; i < subscribers.length; i++) {\r\n\r\n if(subscribers[i].intersectionRatio > 0) {\r\n\r\n if(!keepWatch) {\r\n /**\r\n * Stop watching after the element is in screen\r\n */\r\n this.observer.unobserve(subscribers[i].target);\r\n }\r\n \r\n /**\r\n * Reference the callback from this.subscribers.\r\n * Pass the specific target from the IntersectionObserver\r\n */\r\n this.subscribers[i].func(subscribers[i].target);\r\n }\r\n }\r\n }, this.config);\r\n } else {\r\n /**\r\n * Loop through all subscribers.\r\n * Fire whatever function that would otherwise have been fired by the IntersectionObserver.\r\n * subscriber.el[0] = the reference to the actual DOM node.\r\n */\r\n this.subscribers.forEach(subscriber => {\r\n subscriber.func(subscriber.el[0]);\r\n });\r\n }\r\n }\r\n }\r\n\r\n // Init array that will hold the observers\r\n var intObservers = [];\r\n\r\n for (var key in configs) {\r\n /**\r\n * Adds a new instance of InitIntersectionsObserver class.\r\n * intObservers[configs[key].name] adds new instance with the name of the config but not as a string\r\n */\r\n intObservers[configs[key].name] = new IntersectionObserverFactory(configs[key]);\r\n /**\r\n * Initiate the observer for this particular class\r\n */\r\n\r\n intObservers[configs[key].name].createObserver(configs[key].keepWatch);\r\n }\r\n\r\n /**\r\n * Subscribe takes an object for its parameters containing:\r\n * @param { ngElement } el - the el from ngDirective Link function\r\n * @param { string } config - the name of the config for the observer, will also become the name of the observer\r\n * @param { function } func - callback function inside the link. Use to set a class, change src etc\r\n */\r\n var _subscribe = function(el, config, func) {\r\n\r\n intObservers[configs[config].name].subscribe({ el: el, func: func });\r\n\r\n /**\r\n * @param { ngElement } el[0] - pass it as the 0 index to refer to actual DOM element.\r\n */\r\n intObservers[configs[config].name].observe(el[0]);\r\n };\r\n\r\n return {\r\n subscribe: _subscribe\r\n };\r\n }\r\n ]);\r\n}());"],"file":"../../services/intersection-observer-factory.js"}