{"version":3,"sources":["components/backgroundVideo.js"],"names":["dmx","Component","tag","initialData","paused","attributes","src","type","String","default","methods","play","this","video","pause","toggle","render","node","$parse","videoWrapper","document","createElement","props","playsinline","autoplay","muted","loop","setAttribute","addEventListener","updateData","bind","style","setProperty","wrapper","parentNode","insertBefore","appendChild","set"],"mappings":";;;;;;AAAAA,IAAAC,UAAA,mBAAA,CAEAC,IAAA,MAEAC,YAAA,CACAC,QAAA,GAGAC,WAAA,CACAC,IAAA,CACAC,KAAAC,OACAC,QAAA,OAIAC,QAAA,CACAC,KAAA,WACAC,KAAAC,MAAAF,QAGAG,MAAA,WACAF,KAAAC,MAAAC,SAGAC,OAAA,WACAH,KAAAC,MAAAT,OACAQ,KAAAC,MAAAF,OAEAC,KAAAC,MAAAC,UAKAE,OAAA,SAAAC,GACAL,KAAAM,SAEA,IAAAC,EAAAC,SAAAC,cAAA,OACAR,EAAAO,SAAAC,cAAA,SACAR,EAAAP,IAAAM,KAAAU,MAAAhB,IACAO,EAAAU,aAAA,EACAV,EAAAW,UAAA,EACAX,EAAAY,OAAA,EACAZ,EAAAa,MAAA,EAEAb,EAAAc,aAAA,QAAA,IACAd,EAAAc,aAAA,cAAA,IAEAd,EAAAe,iBAAA,OAAAhB,KAAAiB,WAAAC,KAAAlB,OACAC,EAAAe,iBAAA,QAAAhB,KAAAiB,WAAAC,KAAAlB,OAEAO,EAAAY,MAAAC,YAAA,WAAA,YACAb,EAAAY,MAAAC,YAAA,QAAA,QACAb,EAAAY,MAAAC,YAAA,SAAA,QACAb,EAAAY,MAAAC,YAAA,WAAA,UAEAnB,EAAAkB,MAAAC,YAAA,WAAA,YACAnB,EAAAkB,MAAAC,YAAA,QAAA,QACAnB,EAAAkB,MAAAC,YAAA,SAAA,QACAnB,EAAAkB,MAAAC,YAAA,YAAA,QACAnB,EAAAkB,MAAAC,YAAA,aAAA,QACAnB,EAAAkB,MAAAC,YAAA,MAAA,OACAnB,EAAAkB,MAAAC,YAAA,OAAA,OACAnB,EAAAkB,MAAAC,YAAA,YAAA,yBAEA,IAAAC,EAAAb,SAAAC,cAAA,OAEAY,EAAAF,MAAAC,YAAA,WAAA,YACAf,EAAAc,MAAAC,YAAA,WAAA,YAEAf,EAAAiB,WAAAC,aAAAF,EAAAhB,GACAE,EAAAiB,YAAAvB,GACAoB,EAAAG,YAAAjB,GACAc,EAAAG,YAAAnB,GAEAL,KAAAC,MAAAA,GAGAgB,WAAA,WACAjB,KAAAyB,IAAA,SAAAzB,KAAAC,MAAAT","file":"../dmxBackgroundVideo/dmxBackgroundVideo.js","sourcesContent":["dmx.Component('background-video', {\r\n\r\n    tag: 'div',\r\n\r\n    initialData: {\r\n        paused: false\r\n    },\r\n\r\n    attributes: {\r\n        src: {\r\n            type: String,\r\n            default: null\r\n        }\r\n    },\r\n\r\n    methods: {\r\n        play: function() {\r\n            this.video.play();\r\n        },\r\n\r\n        pause: function() {\r\n            this.video.pause();\r\n        },\r\n\r\n        toggle: function() {\r\n            if (this.video.paused) {\r\n                this.video.play();\r\n            } else {\r\n                this.video.pause();\r\n            }\r\n        }\r\n    },\r\n\r\n    render: function(node) {\r\n        this.$parse();\r\n\r\n        var videoWrapper = document.createElement('div');\r\n        var video = document.createElement('video');\r\n        video.src = this.props.src;\r\n        video.playsinline = true;\r\n        video.autoplay = true;\r\n        video.muted = true;\r\n        video.loop = true;\r\n\r\n        video.setAttribute('muted', '');\r\n        video.setAttribute('playsinline', '');\r\n\r\n        video.addEventListener('play', this.updateData.bind(this));\r\n        video.addEventListener('pause', this.updateData.bind(this));\r\n\r\n        videoWrapper.style.setProperty('position', 'absolute');\r\n        videoWrapper.style.setProperty('width', '100%');\r\n        videoWrapper.style.setProperty('height', '100%');\r\n        videoWrapper.style.setProperty('overflow', 'hidden');\r\n\r\n        video.style.setProperty('position', 'absolute');\r\n        video.style.setProperty('width', 'auto');\r\n        video.style.setProperty('height', 'auto');\r\n        video.style.setProperty('min-width', '100%');\r\n        video.style.setProperty('min-height', '100%');\r\n        video.style.setProperty('top', '50%');\r\n        video.style.setProperty('left', '50%');\r\n        video.style.setProperty('transform', 'translate(-50%, -50%)');\r\n\r\n        var wrapper = document.createElement('div');\r\n\r\n        wrapper.style.setProperty('position', 'relative');\r\n        node.style.setProperty('position', 'relative');\r\n\r\n        node.parentNode.insertBefore(wrapper, node);\r\n        videoWrapper.appendChild(video);\r\n        wrapper.appendChild(videoWrapper);\r\n        wrapper.appendChild(node);\r\n\r\n        this.video = video;\r\n    },\r\n\r\n    updateData: function() {\r\n        this.set('paused', this.video.paused);\r\n    }\r\n\r\n});\r\n"]}