1 | import '../styles/vidage.scss'
|
2 |
|
3 | import debounce from 'debounce'
|
4 | import defaults from './helpers/defaults'
|
5 | import detectTouchOrSmallScreen from './helpers/feature-detect'
|
6 | import { restoreVideo, removeVideo } from './helpers/handle-video-selector'
|
7 | import validateSelector from './helpers/validate-selector'
|
8 |
|
9 | export default class Vidage {
|
10 | constructor (selector, options = {}) {
|
11 | this.options = Object.assign(defaults, options)
|
12 | this._name = this.constructor.name
|
13 | this.element = validateSelector(selector, this._name)
|
14 |
|
15 | this.init()
|
16 | }
|
17 |
|
18 | init () {
|
19 | if (this.element.readyState >= this.element.HAVE_FUTURE_DATA) {
|
20 | this.handler()
|
21 | }
|
22 | else {
|
23 | this.element.addEventListener('canplay', () => {
|
24 | this.handler()
|
25 | })
|
26 | }
|
27 |
|
28 | window.addEventListener('resize', debounce(() => {
|
29 | this.handler()
|
30 | }, 250))
|
31 | }
|
32 |
|
33 | handler () {
|
34 | const body = document.body
|
35 |
|
36 | if (detectTouchOrSmallScreen()) {
|
37 | this.element.pause()
|
38 |
|
39 | if (this.options.videoRemoval) {
|
40 | removeVideo(this.element)
|
41 | }
|
42 |
|
43 | body.classList.remove(this.options.helperClass)
|
44 | }
|
45 | else {
|
46 | if (this.options.videoRemoval) {
|
47 | restoreVideo(this.element)
|
48 | }
|
49 |
|
50 | this.element.play()
|
51 |
|
52 | body.classList.add(this.options.helperClass)
|
53 | }
|
54 | }
|
55 | }
|