{"version":3,"sources":["components/video.js"],"names":["dmx","Component","constructor","node","parent","this","inView","bind","BaseComponent","call","initialData","position","duration","ended","muted","paused","playbackRate","volume","tag","attributes","src","type","String","default","autopause","Boolean","playinview","methods","pos","$node","currentTime","rate","load","play","pause","render","prototype","ondurationchange","requestUpdate","onended","onpause","onplay","onplaying","onratechange","onseeked","ontimeupdate","onvolumechange","window","addEventListener","update","rect","getBoundingClientRect","bottom","right","top","innerHeight","document","documentElement","clientHeight","left","innerWidth","clientWidth","data","props","set","NaN","destroy","removeEventListener"],"mappings":";;;;;;AAAAA,IAAAC,UAAA,QAAA,CAEAC,YAAA,SAAAC,EAAAC,GACAC,KAAAC,OAAAD,KAAAC,OAAAC,KAAAF,MACAL,IAAAQ,cAAAC,KAAAJ,KAAAF,EAAAC,IAGAM,YAAA,CACAC,SAAA,EACAC,SAAA,EACAC,OAAA,EACAC,OAAA,EACAC,QAAA,EACAC,aAAA,EACAC,OAAA,EACAX,QAAA,GAGAY,IAAA,QAEAC,WAAA,CAiCAC,IAAA,CACAC,KAAAC,OACAC,QAAA,MAGAC,UAAA,CACAH,KAAAI,QACAF,SAAA,GAGAG,WAAA,CACAL,KAAAI,QACAF,SAAA,IAIAI,QAAA,CACAhB,SAAA,SAAAiB,GACAvB,KAAAwB,MAAAC,YAAAF,GAGAZ,aAAA,SAAAe,GACA1B,KAAAwB,MAAAb,aAAAe,GAGAd,OAAA,SAAAA,GACAZ,KAAAwB,MAAAZ,OAAAA,GAGAe,KAAA,SAAAZ,GACAf,KAAAwB,MAAAT,IAAAA,EACAf,KAAAwB,MAAAG,QAGAC,KAAA,WACA5B,KAAAwB,MAAAI,QAGAC,MAAA,WACA7B,KAAAwB,MAAAK,UAIAC,OAAA,SAAAhC,GACAH,IAAAQ,cAAA4B,UAAAD,OAAA1B,KAAAJ,KAAAF,GAEAE,KAAAwB,MAAAQ,iBAAArC,IAAAsC,cACAjC,KAAAwB,MAAAU,QAAAvC,IAAAsC,cACAjC,KAAAwB,MAAAW,QAAAxC,IAAAsC,cACAjC,KAAAwB,MAAAY,OAAAzC,IAAAsC,cACAjC,KAAAwB,MAAAa,UAAA1C,IAAAsC,cACAjC,KAAAwB,MAAAc,aAAA3C,IAAAsC,cACAjC,KAAAwB,MAAAe,SAAA5C,IAAAsC,cACAjC,KAAAwB,MAAAgB,aAAA7C,IAAAsC,cACAjC,KAAAwB,MAAAiB,eAAA9C,IAAAsC,cAEAS,OAAAC,iBAAA,SAAA3C,KAAAC,QACAyC,OAAAC,iBAAA,SAAA3C,KAAAC,QAEAD,KAAA4C,OAAA,IACA5C,KAAAC,UAGAA,OAAA,WACA,IAAA4C,EAAA7C,KAAAwB,MAAAsB,wBACA7C,EACA,EAAA4C,EAAAE,QACA,EAAAF,EAAAG,OACAH,EAAAI,KAAAP,OAAAQ,aAAAC,SAAAC,gBAAAC,eACAR,EAAAS,MAAAZ,OAAAa,YAAAJ,SAAAC,gBAAAI,cAGAvD,GAAAD,KAAAyD,KAAAxD,QAAAD,KAAA0D,MAAAvC,WACAnB,KAAAwB,MAAAK,QAGA5B,IAAAD,KAAAyD,KAAAxD,QAAAD,KAAA0D,MAAArC,YACArB,KAAAwB,MAAAI,OAGA5B,KAAA2D,IAAA,SAAA1D,IAGA2C,OAAA,SAAAc,GAgBAA,EAAA3C,KAAAf,KAAA0D,MAAA3C,MACAf,KAAAwB,MAAAT,IAAAf,KAAA0D,MAAA3C,IACAf,KAAAwB,MAAAG,QAGA3B,KAAA2D,IAAA,WAAA3D,KAAAwB,MAAAC,aACAzB,KAAA2D,IAAA,WAAAC,KAAA5D,KAAAwB,MAAAjB,SAAA,EAAAP,KAAAwB,MAAAjB,UACAP,KAAA2D,IAAA,QAAA3D,KAAAwB,MAAAhB,OACAR,KAAA2D,IAAA,QAAA3D,KAAAwB,MAAAf,OACAT,KAAA2D,IAAA,SAAA3D,KAAAwB,MAAAd,QACAV,KAAA2D,IAAA,eAAA3D,KAAAwB,MAAAb,cACAX,KAAA2D,IAAA,SAAA3D,KAAAwB,MAAAZ,SAGAiD,QAAA,WACAnB,OAAAoB,oBAAA,SAAA9D,KAAAC,QACAyC,OAAAoB,oBAAA,SAAA9D,KAAAC","file":"../dmxVideo/dmxVideo.js","sourcesContent":["dmx.Component('video', {\r\n\r\n  constructor: function(node, parent) {\r\n    this.inView = this.inView.bind(this);\r\n    dmx.BaseComponent.call(this, node, parent);\r\n  },\r\n\r\n  initialData: {\r\n      position: 0,\r\n      duration: 0,\r\n      ended: false,\r\n      muted: false,\r\n      paused: false,\r\n      playbackRate: 1,\r\n      volume: 1,\r\n      inView: false\r\n  },\r\n\r\n  tag: 'video',\r\n\r\n  attributes: {\r\n    /*\r\n    autoplay: {\r\n      type: Boolean,\r\n      default: false\r\n    },\r\n\r\n    controls: {\r\n      type: Boolean,\r\n      default: false\r\n    },\r\n\r\n    loop: {\r\n      type: Boolean,\r\n      default: false\r\n    },\r\n\r\n    muted: {\r\n      type: Boolean,\r\n      default: false\r\n    },\r\n\r\n    preload: {\r\n      type: String,\r\n      default: 'metadata' // none, metadata, auto\r\n    },\r\n\r\n    poster: {\r\n      type: String,\r\n      default: null\r\n    },\r\n    */\r\n\r\n    src: {\r\n      type: String,\r\n      default: null\r\n    },\r\n\r\n    autopause: {\r\n      type: Boolean,\r\n      default: false\r\n    },\r\n\r\n    playinview: {\r\n      type: Boolean,\r\n      default: false\r\n    }\r\n  },\r\n\r\n  methods: {\r\n    position: function(pos) {\r\n      this.$node.currentTime = pos;\r\n    },\r\n\r\n    playbackRate: function(rate) {\r\n      this.$node.playbackRate = rate;\r\n    },\r\n\r\n    volume: function(volume) {\r\n      this.$node.volume = volume;\r\n    },\r\n\r\n    load: function(src) {\r\n      this.$node.src = src;\r\n      this.$node.load();\r\n    },\r\n\r\n    play: function() {\r\n      this.$node.play();\r\n    },\r\n\r\n    pause: function() {\r\n      this.$node.pause();\r\n    }\r\n  },\r\n\r\n  render: function(node) {\r\n    dmx.BaseComponent.prototype.render.call(this, node);\r\n\r\n    this.$node.ondurationchange = dmx.requestUpdate;\r\n    this.$node.onended = dmx.requestUpdate;\r\n    this.$node.onpause = dmx.requestUpdate;\r\n    this.$node.onplay = dmx.requestUpdate;\r\n    this.$node.onplaying = dmx.requestUpdate;\r\n    this.$node.onratechange = dmx.requestUpdate;\r\n    this.$node.onseeked = dmx.requestUpdate;\r\n    this.$node.ontimeupdate = dmx.requestUpdate;\r\n    this.$node.onvolumechange = dmx.requestUpdate;\r\n\r\n    window.addEventListener('scroll', this.inView);\r\n    window.addEventListener('resize', this.inView);\r\n\r\n    this.update({});\r\n    this.inView();\r\n  },\r\n\r\n  inView: function() {\r\n    var rect = this.$node.getBoundingClientRect();\r\n    var inView = (\r\n      rect.bottom > 0 &&\r\n      rect.right > 0 &&\r\n      rect.top < (window.innerHeight || document.documentElement.clientHeight) &&\r\n      rect.left < (window.innerWidth || document.documentElement.clientWidth)\r\n    );\r\n\r\n    if (!inView && this.data.inView && this.props.autopause) {\r\n      this.$node.pause();\r\n    }\r\n\r\n    if (inView && !this.data.inView && this.props.playinview) {\r\n      this.$node.play();\r\n    }\r\n\r\n    this.set('inView', inView);\r\n  },\r\n\r\n  update: function(props) {\r\n    /*\r\n    this.$node.autoplay = this.props.autoplay;\r\n    this.$node.controls = this.props.controls;\r\n    this.$node.loop = this.props.loop;\r\n    this.$node.muted = this.props.muted;\r\n\r\n    if (props.preload != this.props.preload) {\r\n      this.$node.preload = this.props.preload;\r\n    }\r\n\r\n    if (props.poster != this.props.poster) {\r\n      this.$node.poster = this.props.poster;\r\n    }\r\n    */\r\n\r\n    if (props.src != this.props.src) {\r\n      this.$node.src = this.props.src;\r\n      this.$node.load();\r\n    }\r\n\r\n    this.set('position', this.$node.currentTime);\r\n    this.set('duration', this.$node.duration == NaN ? 0 : this.$node.duration);\r\n    this.set('ended', this.$node.ended);\r\n    this.set('muted', this.$node.muted);\r\n    this.set('paused', this.$node.paused);\r\n    this.set('playbackRate', this.$node.playbackRate);\r\n    this.set('volume', this.$node.volume);\r\n  },\r\n\r\n  destroy: function() {\r\n    window.removeEventListener('scroll', this.inView);\r\n    window.removeEventListener('resize', this.inView);\r\n  }\r\n\r\n});\r\n"]}