{"version":3,"file":"234.97eeaf587ff4d2e22a4f.js","mappings":"4IACA,MAAMA,EAAiBC,OAAOD,gBAAkBE,EAAAA,GAYhD,MAAMC,EAEFC,YAAYC,GACRC,KAAKD,GAAKA,EACV,IAAIE,EAAUF,EAAGG,QAAQC,aACzBH,KAAKI,KAAO,GACZJ,KAAKK,MAAQ,EACbL,KAAKM,iBAAkB,EACvBN,KAAKO,cAAgB,KACrBP,KAAKQ,mBAAqB,EACZ,IAAXP,IACCA,EAAQQ,MAAM,KAAKC,SAAQC,IACvB,IAAIF,EAAQE,EAAEF,MAAM,KACD,GAAhBA,EAAMG,QAAaZ,KAAKI,KAAKS,KAAK,IAAIC,EAAeL,GAAO,IAGnET,KAAKe,GAAK,IAAIrB,GAAesB,IACzB,IAAK,IAAIC,KAASD,EAAS,CACvB,MAAME,EAAKD,EAAME,YACdD,EAAGb,OAASL,KAAKK,QAChBL,KAAKK,MAAQa,EAAGb,MACZL,KAAKM,kBACLN,KAAKM,iBAAkB,EACvBN,KAAKO,cAAgBa,YAAW,KAC5BpB,KAAKqB,SACLrB,KAAKM,iBAAkB,EACvBN,KAAKO,cAAgB,IAAI,GAC1BP,KAAKQ,qBAGpB,KAEJR,KAAKe,GAAGO,QAAQtB,KAAKD,IAE7B,CAEAsB,SACI1B,OAAO4B,uBAAsB,KACzBvB,KAAKI,KAAKM,SAAQC,IACd,IAAIa,GAAc,EACfb,EAAEc,UAAYd,EAAEe,SACfF,EAAcxB,KAAKK,OAASM,EAAEgB,KAAO3B,KAAKK,OAASM,EAAEiB,IAC/CjB,EAAEc,SACRD,EAAcxB,KAAKK,OAASM,EAAEgB,IACxBhB,EAAEe,WACRF,EAAcxB,KAAKK,OAASM,EAAEiB,KAElC5B,KAAKD,GAAG8B,UAAUC,OAAOnB,EAAEoB,YAAaP,EAAY,IAExDxB,KAAKQ,mBAAqB,GAC1Bb,OAAO4B,uBAAsB,KACzBvB,KAAKD,GAAG8B,UAAUG,IAAI,gBAAgB,GACxC,GAEV,EAGJ,MAAMlB,EAEFhB,YAAYa,GACRX,KAAK2B,IAAM,EACX3B,KAAK4B,IAAM,EACX5B,KAAKyB,UAAW,EAChBzB,KAAK0B,UAAW,EAChB1B,KAAK+B,YAAcpB,EAAE,GACrB,IAAIsB,EAAWC,SAASvB,EAAE,IACtBwB,EAAWD,SAASvB,EAAE,IACvBsB,EAAW,IACVjC,KAAK2B,IAAMM,EACXjC,KAAKyB,UAAW,GAEjBU,EAAW,IACVnC,KAAK4B,IAAMO,EACXnC,KAAK0B,UAAW,EAExB,EAIG,SAASU,EAAWC,GACvBA,EAAS3B,SAAS4B,IAEQ,IAAlBA,EAAKC,UACL,IAAI1C,EAAQyC,EAChB,GAER,C","sources":["webpack://riat/./wwwroot/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        this.updateTimeoutDelay = 0;\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                            }, this.updateTimeoutDelay);\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        window.requestAnimationFrame(() => {\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            this.updateTimeoutDelay = 50;\r\n            window.requestAnimationFrame(() => {\r\n                this.el.classList.add('width-watched');\r\n            });\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","window","Polyfill","Watcher","constructor","el","this","getData","dataset","widthWatcher","data","width","updateRequested","updateTimeout","updateTimeoutDelay","split","forEach","d","length","push","WatcherDataSet","ro","entries","entry","cr","contentRect","setTimeout","update","observe","requestAnimationFrame","toggleValue","checkMin","checkMax","min","max","classList","toggle","classString","add","parseMin","parseInt","parseMax","createFrom","wrappers","node","nodeType"],"sourceRoot":""}