{"version":3,"file":"app_src_js_width-watcher_js.de3fd2b075cd5f7db986.js","mappings":"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","sources":["webpack://WebpackConfig.Web/./app/src/js/width-watcher.js"],"sourcesContent":["import { ResizeObserver as Polyfill } from '@juggle/resize-observer';\r\nconst ResizeObserver = window.ResizeObserver || Polyfill;\r\n\r\n// WATCH WIDTH\r\n\r\n// Uses resizeObserver to watch for width changes in an element.\r\n// and add/remove classes based on width min/max values.\r\n\r\n// data-watch-width=\"0,499,small|500,999,medium|1000,*,large\"\r\n// pipe-delimited sets of three values - min-width, max-width, classname.\r\n// use * in the min or max values for no limit, eg '*,999,classname' = from zero to 999 px wide.\r\n// sets can overlap, allowing for combinations of classnames.\r\n\r\nclass Watcher {\r\n\r\n    constructor(el) {\r\n        this.el = el;\r\n        let getData = el.dataset.widthWatcher;\r\n        this.data = [];\r\n        this.width = 0;\r\n        this.updateRequested = false;\r\n        this.updateTimeout = null;\r\n        if(getData != \"\") {\r\n            getData.split('|').forEach(d => {\r\n                let split = d.split(',');\r\n                if(split.length == 3) this.data.push(new WatcherDataSet(split));\r\n            });\r\n            // add resize observer\r\n            this.ro = new ResizeObserver(entries => {\r\n                for (let entry of entries) {\r\n                    const cr = entry.contentRect;\r\n                    if(cr.width != this.width) {\r\n                        this.width = cr.width;\r\n                        if(!this.updateRequested) {\r\n                            this.updateRequested = true;\r\n                            this.updateTimeout = setTimeout(() => {\r\n                                this.update();\r\n                                this.updateRequested = false;\r\n                                this.updateTimeout = null;\r\n                            }, 50);\r\n                        }\r\n                    }\r\n                }\r\n            });\r\n            this.ro.observe(this.el); // Watch dimension changes wrapping element\r\n        }\r\n    }\r\n\r\n    update() {\r\n        this.data.forEach(d => {\r\n            let toggleValue = false;\r\n            if(d.checkMin && d.checkMax) {\r\n                toggleValue = this.width >= d.min && this.width <= d.max;\r\n            } else if(d.checkMin) {\r\n                toggleValue = this.width >= d.min;\r\n            } else if(d.checkMax) {\r\n                toggleValue = this.width <= d.max;\r\n            }\r\n            this.el.classList.toggle(d.classString, toggleValue);\r\n        });\r\n    }\r\n}\r\n\r\nclass WatcherDataSet {\r\n\r\n    constructor(d) {\r\n        this.min = 0;\r\n        this.max = 0;\r\n        this.checkMin = false; \r\n        this.checkMax = false;\r\n        this.classString = d[2];\r\n        let parseMin = parseInt(d[0]);\r\n        let parseMax = parseInt(d[1]);\r\n        if(parseMin > 0) {\r\n            this.min = parseMin;\r\n            this.checkMin = true;\r\n        }\r\n        if(parseMax > 0) {\r\n            this.max = parseMax;\r\n            this.checkMax = true;\r\n        }\r\n    }\r\n}\r\n\r\n// export the default function to create\r\nexport function createFrom(wrappers) {\r\n    wrappers.forEach((node) => {\r\n        // if node is an element\r\n        if (node.nodeType === 1) {\r\n            new Watcher(node);\r\n        }\r\n    });\r\n}"],"names":["ResizeObserver","Polyfill","window","Watcher","el","_this","_classCallCheck","getData","dataset","widthWatcher","data","width","updateRequested","updateTimeout","split","forEach","d","length","push","WatcherDataSet","ro","entries","_iterator","_createForOfIteratorHelper","_step","s","n","done","entry","value","cr","contentRect","setTimeout","update","err","e","f","observe","_createClass","key","_this2","toggleValue","checkMin","checkMax","min","max","classList","toggle","classString","parseMin","parseInt","parseMax","createFrom","wrappers","node","nodeType"],"sourceRoot":""}