{"version":3,"sources":["core/imageParallax.js","attributes/imageParallax.js"],"names":["dmx","imageParallax","running","elements","lastPosition","start","node","push","opts","dmxImageParallax","container","overflow","wrap","style","transform","scale","delay","transition","willChange","requestAnimationFrame","animate","stop","forEach","updateElement","wrapper","document","createElement","className","display","parentNode","insertBefore","appendChild","offsetParent","elmRect","getBoundingClientRect","width","height","viewport","getScrollParent","window","viewportRect","top","left","right","innerWidth","bottom","innerHeight","perc","max","clientHeight","val","translateX","translateY","orientation","indexOf","isScrollParent","getComputedStyle","test","overflowX","overflowY","e","Attribute","attr","modifiers","value"],"mappings":"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","file":"../dmxImageParallax/dmxImageParallax.js","sourcesContent":["dmx.imageParallax = {\r\n    running: false,\r\n\r\n    elements: [],\r\n\r\n    lastPosition: -1,\r\n\r\n    start: function(node) {\r\n        dmx.imageParallax.elements.push(node);\r\n\r\n        var opts = node.dmxImageParallax;\r\n\r\n        opts.container = node;\r\n\r\n        if (!opts.overflow) {\r\n            opts.container = dmx.imageParallax.wrap(node);\r\n            node.style.transform = 'scale(' + opts.scale + ')';\r\n        }\r\n\r\n        if (opts.delay > 0) {\r\n            node.style.transition = 'transform ' + opts.delay + 's ' + opts.transition;\r\n        }\r\n\r\n        node.style.willChange = 'transform';\r\n\r\n        if (!dmx.imageParallax.running) {\r\n            dmx.imageParallax.running = true;\r\n            requestAnimationFrame(dmx.imageParallax.animate);\r\n        }\r\n    },\r\n\r\n    stop: function() {\r\n        dmx.imageParallax.running = false;\r\n    },\r\n\r\n    animate: function() {\r\n        if (!dmx.imageParallax.running) return;\r\n\r\n        dmx.imageParallax.elements.forEach(function(node) {\r\n            dmx.imageParallax.updateElement(node);\r\n        });\r\n\r\n        requestAnimationFrame(dmx.imageParallax.animate);\r\n    },\r\n\r\n    wrap: function(node) {\r\n        var wrapper = document.createElement('div');\r\n        wrapper.className = node.className;\r\n        wrapper.style.display = 'inline-block';\r\n        wrapper.style.overflow = 'hidden';\r\n        node.parentNode.insertBefore(wrapper, node);\r\n        wrapper.appendChild(node);\r\n        //node.className = '';\r\n        return wrapper;\r\n    },\r\n\r\n    updateElement: function(node) {\r\n        if (!node.offsetParent) return;\r\n\r\n        var opts = node.dmxImageParallax;\r\n        var elmRect = opts.container.getBoundingClientRect();\r\n\r\n        if (elmRect.width === 0 || elmRect.height === 0) return;\r\n\r\n        /*if (opts.container != node && !opts.container.style.width) {\r\n            opts.container.style.width = node.clientWidth + 'px';\r\n            opts.container.style.height = node.clientHeight + 'px';\r\n        }*/\r\n\r\n        var viewport = dmx.imageParallax.getScrollParent(node);\r\n\r\n        if (viewport == window) {\r\n            var viewportRect = {\r\n                top: 0,\r\n                left: 0,\r\n                right: window.innerWidth,\r\n                bottom: window.innerHeight,\r\n                width: window.innerWidth,\r\n                height: window.innerHeight\r\n            };\r\n        } else {\r\n            var viewportRect = viewport.getBoundingClientRect();\r\n        }\r\n\r\n        if (elmRect.bottom < viewportRect.top || elmRect.top > viewportRect.bottom) return;\r\n\r\n        var perc = (viewportRect.bottom - elmRect.top) / (viewportRect.height + elmRect.height);\r\n        var max = node.clientHeight * opts.scale - node.clientHeight;\r\n        var val = ~~(perc * max - max / 2)\r\n\r\n        var translateX = 0;\r\n        var translateY = 0;\r\n\r\n        if (opts.orientation.indexOf('left') != -1) {\r\n            translateX = -val;\r\n        }\r\n\r\n        if (opts.orientation.indexOf('right') != -1) {\r\n            translateX = val;\r\n        }\r\n\r\n        if (opts.orientation.indexOf('up') != -1) {\r\n            translateY = -val;\r\n        }\r\n\r\n        if (opts.orientation.indexOf('down') != -1) {\r\n            translateY = val;\r\n        }\r\n\r\n        var transform = 'translate3d(' + translateX + 'px, ' + translateY + 'px, 0)';\r\n\r\n        if (!opts.overflow) {\r\n            transform += ' scale(' + opts.scale + ')';\r\n        }\r\n\r\n        if (node.style.transform != transform) {\r\n            node.style.transform = transform;\r\n        }\r\n    },\r\n\r\n    isScrollParent: function(node) {\r\n        try {\r\n            var style = window.getComputedStyle(node);\r\n            return (/(auto|scroll)/).test(style.overflow + style.overflowX + style.overflowY);\r\n        } catch(e) {\r\n            return false;\r\n        }\r\n    },\r\n\r\n    getScrollParent: function(node) {\r\n        if (!node) return window;\r\n        if (dmx.imageParallax.isScrollParent(node)) return node;\r\n        return dmx.imageParallax.getScrollParent(node.parentNode);\r\n    },\r\n};\r\n","dmx.Attribute('image-parallax', 'mounted', function(node, attr) {\r\n    node.dmxImageParallax = {\r\n        scale: attr.modifiers.scale ? attr.modifiers.scale / 100 : 1.3,\r\n        delay: attr.modifiers.delay ? attr.modifiers.delay / 1000 : 0.4,\r\n        overflow: !!attr.modifiers.overflow,\r\n        transition: 'cubic-bezier(0,0,0,1)',\r\n        orientation: attr.value || 'up'\r\n    };\r\n\r\n    dmx.imageParallax.start(node);\r\n});\r\n"]}