{ "version": 3, "sources": ["../../src/es6/Shimmer.js", "../../src/es6/Shimmer2.js", "../../src/es6/Basic.js"], "sourcesContent": ["\n/**\n * Shimmer applies styles and animations to an element based on a few computations.\n * The first computation is whether the element is below-screen, on-screen or above-screen.\n */\nexport class Shimmer {\n\tconstructor(e) {\n\t\tthis.el = e;\n\n\t\tlet k = Shimmer.findKeyframe(e.getAttribute(`data-keyframe`));\n\t\tif (!k) {\n\t\t\tconsole.log(`failed to find @keyframe ${e.getAttribute(`data-keyframe`)}`);\n\t\t\treturn;\n\t\t}\n\t\tdocument.addEventListener(`scroll`, evt=>{\n\t\t\tthis.scroll(evt);\t\t\t\n\t\t}, { passive: true });\n\t\tdocument.addEventListener(`resize`, evt=>{\n\t\t\tthis.apply();\n\t\t}, { passive: true });\n\t\tthis.keyframes = new KeyframeEffect(this.el,\n\t\t\tk,\n\t\t\t{\n\t\t\t\tduration: 3000, \n\t\t\t\tfill: `forwards`,\n\t\t\t\trepeat: 1,\n\t\t\t\t// easing: \"none\",\n\t\t\t}\n \t\t\t);\n\n\t\tthis.animate = new Animation(this.keyframes, document.timeline);\n\t\tthis.animate.startTime = 0;\n\t\tthis.animate.pause();\n\t\tthis.animate.currentTime = 1500;\n\t\tthis.apply();\n\t}\n\n\t/**\n\t * Camelize a string, cutting the string by multiple separators like\n\t * hyphens, underscores and spaces.\n\t * \n\t * @param {text} string Text to camelize\n\t * @return string Camelized text\n\t */\n\tstatic camelize(text) {\n\t return text.replace(/^([A-Z])|[\\s-_]+(\\w)/g, function(match, p1, p2, offset) {\n\t if (p2) return p2.toUpperCase();\n\t return p1.toLowerCase(); \n\t });\n\t}\n\t/**\n\t * findKeyframe finds the last named keyframe sequence with the given\n\t * name, and converts it to a keyframe format per \n\t * https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats\n\t */\n\tstatic findKeyframe(name) {\n\t\tlet lastRule = null;\n\t\tfor (let s of document.styleSheets) {\n\t\t\tfor (let c of s.cssRules) {\n\t\t\t\tif (c.name==name && c.type==c.KEYFRAMES_RULE) {\n\t\t\t\t\tlastRule = c;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tif (!lastRule) return null;\n\t\t// Convert lastRule into a Keyframe format\n\t\tlet ks = [];\n\t\tfor (let r of lastRule.cssRules) {\n\t\t\tlet s = {};\n\t\t\tfor (let i=0; i scrollY + top.innerHeight\t\t \n\t\t */\n\t\tlet yTop = r.top + window.scrollY;\n\t\tlet yProp = (yTop - (window.scrollY - r.height)) / (top.innerHeight + r.height);\n\t\tyProp = 1-Math.min(Math.max(yProp, 0), 1);\n\t\tthis.animate.currentTime = yProp * 3000;\n\n\t}\n\tscroll(evt) {\n\t\tthis.apply();\n\t}\n\tstatic init() {\n\t\tfor (let e of document.querySelectorAll(`[data-instance=\"Shimmer\"]`)) {\n\t\t\tnew Shimmer(e);\n\t\t}\n\t}\n}", "export class Shimmer2 {\n\tconstructor(e) {\n\t\tthis.el = e;\n\t\tthis.classes = [];\n\t\tthis.classes[-1] = this.el.getAttribute(`data-aboveclass`);\n\t\tthis.classes[0] = this.el.getAttribute(`data-onclass`);\n\t\tthis.classes[1] = this.el.getAttribute(`data-belowclass`);\n\n\t\tdocument.addEventListener(`scroll`, evt=>{\n\t\t\tthis.apply();\n\t\t}, { passive: true });\n\t\tdocument.addEventListener(`resize`, evt=>{\n\t\t\tthis.apply();\n\t\t}, { passive: true });\n\t\tthis._position = false;\n\t\tthis.apply();\n\t}\n\n\tapply() {\n\t\tlet p = this.position();\n\t\tif (p===this._position) return;\n\t\tconsole.log(`Shimmer2 applying...`);\n\t\tthis._position = p;\n\t\tfor (let i=-1; i<=1; i++) {\n\t\t\tif (p===i) {\n\t\t\t\tthis.el.classList.add(this.classes[i]);\n\t\t\t} else {\n\t\t\t\tthis.el.classList.remove(this.classes[i]);\n\t\t\t}\n\t\t}\n\t}\n\n\t// position returns -1 if we are 'above' the element (ie scrolling down, the element is still to come),\n\t// 0 if we are 'on' the element,\n\t// and 1 if we are 'below' the element (ie we have scrolled past the element)\n\tposition() {\n\t\tlet midline = window.scrollY + top.innerHeight/2;\n\t\tlet delta = top.innerHeight/4;\n\t\tlet r = this.el.getBoundingClientRect();\n\t\tlet elTop = window.scrollY + r.top;\n\t\tlet elBottom = elTop + r.height;\n\n\t\tif (elTop > midline + delta) {\n\t\t\treturn -1;\n\t\t}\n\t\tif (elBottom < midline-delta) {\n\t\t\treturn 1;\n\t\t}\n\t\treturn 0;\t// we are 'on' the element\n\t}\n\tstatic init() {\n\t\tfor (let e of document.querySelectorAll(`[data-instance=\"Shimmer2\"]`)) {\n\t\t\tnew Shimmer2(e);\n\t\t}\n\t}\n}", "import {Shimmer} from './Shimmer.js';\nimport {Shimmer2} from './Shimmer2.js';\n\nclass Basic {\n\tstatic init() {\n\t\tconsole.log(`Basic::init()`);\n\t\tShimmer.init();\n\t\tShimmer2.init();\n\t}\t\n}\n\ndocument.addEventListener(`DOMContentLoaded`, Basic.init);"], "mappings": "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", "names": ["p"] }