xgplayer 2.32.2 → 2.32.3

package/src/controls/errorRetry.js

@@ -1,132 +0,0 @@
-import Errors from '../error'
-/**
- * Error retry plugin
- * get config from player.config.errorConfig
- * The Plugin is just deal with the situation that play with video.src,
- * and get the http status of current video.src
- */
-
-const defaultConfig = {
-  maxCount: 3, // max number of retries
-  backupUrl: '', // the backup url for retry
-  isFetch: true, //  is need to check the cdn url statud
-  fetchTimeout: 100 // timeout time for get cdn status
-}
-
-function errorRetry () {
-  const player = this
-  // 无设置参数或者是通过扩展播放的不做处理
-  if (!player.config.errorConfig || player.src.indexOf('blob:') > -1) {
-    return
-  }
-  const errorConfig = {}
-  const _inConfig = player.config.errorConfig
-  for (const key in defaultConfig) {
-    if (_inConfig[key] === undefined) {
-      errorConfig[key] = defaultConfig[key]
-    } else {
-      errorConfig[key] = _inConfig[key]
-    }
-  }
-  player.retryData = {
-    count: 0, // 重试次数
-    errfTimer: null, // 超时设置定时器
-    isFetchReturn: false, // fetch请求是否已经返回
-    currentTime: 0 // 出错的时候时间
-  }
-
-  function errorfetch (player, url, timeout) {
-    const resolveFun = (resolve, data) => {
-      if (!player.retryData.isFetchReturn) {
-        player.retryData.isFetchReturn = true
-        resolve(data)
-      }
-    }
-    return new Promise((resolve, reject) => {
-      try {
-        let xhr = new window.XMLHttpRequest()
-        xhr.open('get', url)
-        xhr.onload = function () {
-          resolveFun(resolve, {status: xhr.status, statusText: xhr.statusText, xhr})
-        }
-        xhr.onerror = function () {
-          resolveFun(resolve, {status: xhr.status, statusText: xhr.statusText || 'The network environment is disconnected or the address is invalid', xhr})
-        }
-        xhr.onabort = function () {
-          // console.log('task onerror', xhr)
-        }
-        player.retryData.errfTimer = window.setTimeout(() => {
-          let errfTimer = player.retryData.errfTimer
-          window.clearTimeout(errfTimer)
-          player.retryData.errfTimer = null
-          resolveFun(resolve, {status: -1, statusText: 'request timeout'})
-        }, timeout)
-        xhr.send()
-      } catch (err) {
-        player.retryData.isFetchReturn = true
-        resolveFun(resolve, {status: -2, statusText: 'request error'})
-      }
-    })
-  }
-
-  function retryCanPlay () {
-    // console.log(`retryCanPlay this.retryData.currentTime:${this.retryData.currentTime}`)
-    this.currentTime = this.retryData.currentTime
-    this.play()
-    this.retryData.retryCode = 0
-    this.retryData.isFetchReturn = false
-    this.retryData.currentTime = 0
-  }
-
-  const _originErrorEmit = player._onError
-  player._onError = (data) => {
-    const errorCount = this.retryData.count
-    // console.log(`originErrorEmit:errorCount:${errorCount}`, data)
-    if (errorCount > errorConfig.maxCount) {
-      if (errorConfig.isFetch) {
-        errorfetch(this, this.currentSrc, errorConfig.fetchTimeout).then((data) => {
-          this.emit('error', new Errors({
-            type: 'network',
-            currentTime: this.currentTime,
-            duration: this.duration || 0,
-            networkState: this.networkState,
-            readyState: this.readyState,
-            currentSrc: this.currentSrc,
-            src: this.src,
-            ended: this.ended,
-            httpCode: data.status,
-            httpMsg: data.statusText,
-            errd: {
-              line: 101,
-              msg: this.error,
-              handle: 'plugin errorRetry'
-            },
-            errorCode: this.video && this.video.error.code,
-            mediaError: this.video && this.video.error
-          }));
-          _originErrorEmit.call(this, data)
-        })
-      } else {
-        _originErrorEmit.call(this, data)
-      }
-      return;
-    }
-    if (errorCount === 0) {
-      this.retryData.currentTime = this.currentTime
-      this.once('canplay', retryCanPlay.bind(this))
-    }
-    let src = ''
-    if (errorConfig.count < 2) {
-      src = errorConfig.backupUrl ? errorConfig.backupUrl : player.currentSrc
-    } else {
-      src = errorConfig.backupUrl && errorCount > 1 ? errorConfig.backupUrl : player.currentSrc
-    }
-    this.retryData.count++
-    this.src = src
-  }
-}
-
-export default {
-  name: 'errorretry',
-  method: errorRetry
-}

package/src/controls/fullscreen.js

@@ -1,145 +0,0 @@
-import { hasClass, addClass, removeClass, PresentationMode, checkWebkitSetPresentationMode } from '../utils/util'
-
-let fullscreen = function () {
-  let player = this
-  let root = player.root
-
-  function onFullscreenBtnClick () {
-    if (player.config.rotateFullscreen) {
-      if (hasClass(root, 'xgplayer-rotate-fullscreen')) {
-        player.exitRotateFullscreen()
-      } else {
-        player.getRotateFullscreen()
-      }
-    } else {
-      if (hasClass(root, 'xgplayer-is-fullscreen')) {
-        player.exitFullscreen(root)
-      } else {
-        player.getFullscreen(root)
-      }
-    }
-  }
-  player.on('fullscreenBtnClick', onFullscreenBtnClick)
-
-  function onFullscreenChange () {
-    let fullscreenEl = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement
-    if (fullscreenEl && fullscreenEl === root) {
-      addClass(root, 'xgplayer-is-fullscreen')
-      player.emit('requestFullscreen')
-    } else if (hasClass(root, 'xgplayer-is-fullscreen')) {
-      removeClass(root, 'xgplayer-is-fullscreen')
-      player.emit('exitFullscreen')
-    }
-    if (player.danmu && typeof player.danmu.resize === 'function') {
-      player.danmu.resize()
-    }
-  };
-  ['fullscreenchange', 'webkitfullscreenchange', 'mozfullscreenchange', 'MSFullscreenChange'].forEach(item => {
-    document.addEventListener(item, onFullscreenChange)
-  })
-
-  player.video.addEventListener('webkitbeginfullscreen', function () {
-    addClass(root, 'xgplayer-is-fullscreen')
-    player.emit('requestFullscreen')
-  })
-
-  player.video.addEventListener('webkitendfullscreen', function () {
-    removeClass(root, 'xgplayer-is-fullscreen')
-    player.emit('exitFullscreen')
-  })
-
-  function onWebkitpresentationmodechanged (e) {
-    const mode = player.video.webkitPresentationMode
-    // 非全屏模式 退出全屏
-    if (mode !== PresentationMode.FULLSCREEN) {
-      removeClass(root, 'xgplayer-is-fullscreen')
-      player.emit('exitFullscreen')
-    }
-  }
-
-  checkWebkitSetPresentationMode(player.video) &&
-  player.video.addEventListener('webkitpresentationmodechanged', onWebkitpresentationmodechanged)
-
-  function onDestroy () {
-    player.off('fullscreenBtnClick', onFullscreenBtnClick);
-    ['fullscreenchange', 'webkitfullscreenchange', 'mozfullscreenchange', 'MSFullscreenChange'].forEach(item => {
-      document.removeEventListener(item, onFullscreenChange)
-    })
-
-    checkWebkitSetPresentationMode(player.video) &&
-    player.video.removeEventListener('webkitpresentationmodechanged', onWebkitpresentationmodechanged)
-
-    player.off('destroy', onDestroy)
-  }
-  player.once('destroy', onDestroy)
-
-  player.getFullscreen = function (el) {
-    let player = this
-    if (el.requestFullscreen) {
-      let fullscreenPromise = el.requestFullscreen()
-      if (fullscreenPromise) {
-        fullscreenPromise.catch(function () {
-          player.emit('fullscreen error')
-        })
-      }
-    } else if (el.mozRequestFullScreen) {
-      el.mozRequestFullScreen()
-    } else if (el.webkitRequestFullscreen) {
-      el.webkitRequestFullscreen(window.Element.ALLOW_KEYBOARD_INPUT)
-    } else if (player.video.webkitSupportsFullscreen) {
-      player.video.webkitEnterFullscreen()
-    } else if (el.msRequestFullscreen) {
-      el.msRequestFullscreen()
-    } else {
-      addClass(el, 'xgplayer-is-cssfullscreen')
-    }
-  }
-
-  player.exitFullscreen = function (el) {
-    if (document.exitFullscreen) {
-      document.exitFullscreen()
-    } else if (document.webkitExitFullscreen) {
-      document.webkitExitFullscreen()
-    } else if (document.mozCancelFullScreen) {
-      document.mozCancelFullScreen()
-    } else if (document.msExitFullscreen) {
-      document.msExitFullscreen()
-    }
-    removeClass(el, 'xgplayer-is-cssfullscreen')
-  }
-
-  player.getRotateFullscreen = function () {
-    let player = this
-    document.documentElement.style.width = '100%'
-    document.documentElement.style.height = '100%'
-    if (player.config.fluid) {
-      player.root.style['padding-top'] = ''
-      player.root.style['max-width'] = 'unset'
-    }
-    if (player.root && !hasClass(player.root, 'xgplayer-rotate-fullscreen')) {
-      addClass(player.root, 'xgplayer-rotate-fullscreen')
-    }
-    player.emit('getRotateFullscreen')
-  }
-
-  player.exitRotateFullscreen = function () {
-    let player = this
-    document.documentElement.style.width = 'unset'
-    document.documentElement.style.height = 'unset'
-    if (player.config.fluid) {
-      player.root.style['width'] = '100%'
-      player.root.style['height'] = '0'
-      player.root.style['padding-top'] = `${player.config.height * 100 / player.config.width}%`
-      player.root.style['max-width'] = '100%'
-    }
-    if (player.root && hasClass(player.root, 'xgplayer-rotate-fullscreen')) {
-      removeClass(player.root, 'xgplayer-rotate-fullscreen')
-    }
-    player.emit('exitRotateFullscreen')
-  }
-}
-
-export default {
-  name: 'fullscreen',
-  method: fullscreen
-}

package/src/controls/keyboard.js

@@ -1,214 +0,0 @@
-import { on, hasClass, removeClass, addClass } from '../utils/util'
-class Keyboard {
-  constructor (player) {
-    this.player = player
-    this.state = {
-      playbackRate: 0,
-      isRepeat: false,
-      keyCode: 0,
-      repeat: 0,
-      isBody: false
-    }
-    this.timer = null
-    this.initEvents()
-  }
-
-  initEvents () {
-    const {root, config} = this.player
-    this.player.onBodyKeydown = this.onBodyKeydown.bind(this)
-    this.player.onKeydown = this.onKeydown.bind(this)
-    this.player.onKeyup = this.onKeyup.bind(this)
-    if (!config.keyShortcut || config.keyShortcut === 'on') {
-      document.addEventListener('keydown', this.player.onBodyKeydown)
-      root.addEventListener('keydown', this.player.onKeydown)
-      let destroyFunc = () => {
-        document.removeEventListener('keydown', this.player.onBodyKeydown)
-        root.removeEventListener('keydown', this.player.onKeydown)
-        clearTimeout(this.timer)
-        this.timer = null
-      }
-      on(this.player, 'destroy', destroyFunc)
-    }
-  }
-
-  checkTarget (e) {
-    const {player} = this
-    return e.target === player.root || e.target === player.video || e.target === player.controls
-  }
-
-  onBodyKeydown (event) {
-    let e = event || window.event
-    const keyCode = e.keyCode
-    if ((e.target === document.body) && (keyCode === 37 || keyCode === 39 || keyCode === 32)) {
-      e.preventDefault()
-      e.cancelBubble = true
-      e.returnValue = false
-      if (!e.repeat) {
-        document.addEventListener('keyup', this.player.onKeyup)
-      }
-      this.handler(e)
-      return false
-    }
-  }
-
-  onKeydown (event) {
-    let e = event || window.event
-    const keyCode = e.keyCode
-    if (this.checkTarget(e) && (keyCode === 37 || keyCode === 38 || keyCode === 39 || keyCode === 40 || keyCode === 32 || keyCode === 27)) {
-      e.preventDefault()
-      e.cancelBubble = true
-      e.returnValue = false
-      this.player.emit('focus')
-      if (!e.repeat) {
-        this.player.root.addEventListener('keyup', this.player.onKeyup)
-      }
-      this.handler(e)
-      return false
-    }
-  }
-
-  onKeyup () {
-    const {state, player} = this
-    document.removeEventListener('keyup', this.player.onKeyup)
-    player.root.removeEventListener('keyup', this.player.onKeyup)
-    if (!state.keyCode) {
-      return
-    }
-    if (state.playbackRate !== 0) {
-      player.playbackRate = state.playbackRate
-    }
-
-    if (!state.isRepeat) {
-      this.handlerKeyCode(state.keyCode, false)
-    }
-    state.playbackRate = 0
-    state.isRepeat = false
-    state.keyCode = 0
-    state.repeat = 0
-    this.changeVolumeSlide()
-  }
-
-  handler (e) {
-    const {state, player} = this
-    state.keyCode = e.keyCode
-    state.isRepeat = e.repeat
-    if (e.repeat) {
-      if (player.config.disableLongPress) {
-        this.handlerKeyCode(state.keyCode, false)
-      } else if(state.repeat % 2 === 0) {
-        this.handlerKeyCode(state.keyCode, true)
-      }
-      state.repeat++
-    }
-  }
-
-  handlerKeyCode (keyCode, isLonePress) {
-    const {player, state} = this
-    switch (keyCode) {
-      case 39:
-        // 快进
-        if (isLonePress) {
-          state.repeat === 0 && this.changeRate()
-        } else {
-          this.seek(false, isLonePress)
-        }
-        break
-      case 37:
-        // 快退
-        this.seek(true, isLonePress)
-        break
-      case 38:
-        this.changeVolume(true)
-        // 上
-        break
-      case 40:
-        this.changeVolume(false)
-        // 下
-        break
-      case 32:
-        if (!isLonePress) {
-          player.paused ? player.play() : player.pause()
-        }
-        break
-      case 27:
-        if (hasClass(player.root, 'xgplayer-is-cssfullscreen')) {
-          player.exitCssFullscreen()
-        }
-        break
-      default:
-        //
-    }
-  }
-
-  seek (isBack, isLongPress) {
-    const {player} = this
-    const keyShortcutStep = player.config.keyShortcutStep || {}
-    const currentTimeStep = keyShortcutStep.currentTime || 10
-    if (player.isLoading || player.isSeeking || (isLongPress && this.state.repeat % 8 > 0)) {
-      return
-    }
-    if (isBack) {
-      if (player.currentTime - currentTimeStep >= 0) {
-        player.currentTime -= currentTimeStep
-      } else {
-        player.currentTime = 0
-      }
-    } else {
-      if(player.maxPlayedTime && player.config.allowSeekPlayed && (player.currentTime + currentTimeStep > player.maxPlayedTime)) {
-        player.currentTime = player.maxPlayedTime
-      } else {
-        if (player.currentTime + currentTimeStep <= player.duration) {
-          player.currentTime += currentTimeStep
-        } else {
-          player.currentTime = player.duration + 1
-        }
-      }
-    }
-  }
-
-  changeRate () {
-    this.state.playbackRate = this.player.playbackRate
-    this.player.playbackRate = this.player.config.keyboardRate || 5
-  }
-
-  changeVolumeSlide (show) {
-    const {player} = this
-    if (!player.controls) {
-      return
-    }
-    if (show) {
-      player.emit('focus')
-      if (!hasClass(player.root, 'xgplayer-volume-active')) {
-        addClass(player.root, 'xgplayer-volume-active')
-      }
-    } else {
-      clearTimeout(this.timer)
-      this.timer = setTimeout(() => {
-        removeClass(player.root, 'xgplayer-volume-active')
-      }, 1000)
-    }
-  }
-
-  changeVolume (isup) {
-    const {player} = this
-    const keyShortcutStep = player.config.keyShortcutStep || {}
-    const volumeStep = keyShortcutStep.volume || 0.1
-    this.changeVolumeSlide(true)
-    const volume = player.volume
-    if (isup && volume + volumeStep <= 1) {
-      player.volume = volume + volumeStep
-    } else if (!isup && volume - volumeStep >= 0) {
-      player.volume = volume - volumeStep
-    }
-  }
-}
-
-let keyboard = function () {
-  let player = this
-  player.keyboard = new Keyboard(player)
-}
-
-export default {
-  name: 'keyboard',
-  method: keyboard
-}

package/src/controls/localPreview.js

@@ -1,32 +0,0 @@
-import { hasClass } from '../utils/util'
-
-let localPreview = function () {
-  let player = this
-  let root = player.root
-  function onUpload (upload) {
-    player.uploadFile = upload.files[0]
-    let url = URL.createObjectURL(player.uploadFile)
-    if (hasClass(root, 'xgplayer-nostart')) {
-      player.config.url = url
-      player.start()
-    } else {
-      player.src = url
-      let playPromise = player.play()
-      if (playPromise !== undefined && playPromise) {
-        playPromise.catch(err => {})
-      }
-    }
-  }
-  player.on('upload', onUpload)
-
-  function onDestroy () {
-    player.off('upload', onUpload)
-    player.off('destroy', onDestroy)
-  }
-  player.once('destroy', onDestroy)
-}
-
-export default {
-  name: 'localPreview',
-  method: localPreview
-}

package/src/controls/memoryPlay.js

@@ -1,14 +0,0 @@
-let memoryPlay = function () {
-  let player = this
-  player.on('memoryPlayStart', (lastPlayTime) => {
-    setTimeout(() => {
-      console.log('memoryPlayStart', lastPlayTime, player.readyState, 11)
-      player.currentTime = lastPlayTime
-    },)
-  })
-}
-
-export default {
-  name: 'memoryPlay',
-  method: memoryPlay
-}

package/src/controls/miniplayer.js

@@ -1,128 +0,0 @@
-import { findDom, hasClass, createDom, addClass, removeClass } from '../utils/util'
-import Draggabilly from 'draggabilly'
-
-let miniplayer = function () {
-  let player = this
-  let root = player.root
-  function onMiniplayerBtnClick () {
-    if (hasClass(root, 'xgplayer-miniplayer-active')) {
-      player.exitMiniplayer()
-    } else {
-      player.getMiniplayer()
-    }
-  }
-  player.on('miniplayerBtnClick', onMiniplayerBtnClick)
-
-  function onDestroy () {
-    player.off('miniplayerBtnClick', onMiniplayerBtnClick)
-    player.off('destroy', onDestroy)
-  }
-  player.once('destroy', onDestroy)
-
-  player.getMiniplayer = function () {
-    if (hasClass(root, 'xgplayer-is-fullscreen')) {
-      this.exitFullscreen(root)
-    }
-    if (hasClass(root, 'xgplayer-is-cssfullscreen')) {
-      this.exitCssFullscreen()
-    }
-    if (hasClass(root, 'xgplayer-rotate-fullscreen')) {
-      this.exitRotateFullscreen()
-    }
-    // let ro = this.root.getBoundingClientRect()
-    // let Top = ro.top
-    // let Left = ro.left
-    let dragLay = createDom('xg-miniplayer-lay', '<div></div>', {}, 'xgplayer-miniplayer-lay')
-    this.root.appendChild(dragLay)
-    let dragHandle = createDom('xg-miniplayer-drag', `<div class="drag-handle"><span>${this.lang.MINIPLAYER_DRAG}</span></div>`, {tabindex: 9}, 'xgplayer-miniplayer-drag')
-    this.root.appendChild(dragHandle)
-    // eslint-disable-next-line no-unused-vars
-    let draggie = new Draggabilly('.xgplayer', {
-      handle: '.drag-handle'
-    })
-    addClass(this.root, 'xgplayer-miniplayer-active')
-    this.root.style.right = 0
-    this.root.style.bottom = '200px'
-    this.root.style.top = ''
-    this.root.style.left = ''
-    this.root.style.width = '320px'
-    this.root.style.height = '180px'
-    if (this.config.miniplayerConfig) {
-      if (this.config.miniplayerConfig.top !== undefined) {
-        this.root.style.top = this.config.miniplayerConfig.top + 'px'
-        this.root.style.bottom = ''
-      }
-      if (this.config.miniplayerConfig.bottom !== undefined) {
-        this.root.style.bottom = this.config.miniplayerConfig.bottom + 'px'
-      }
-      if (this.config.miniplayerConfig.left !== undefined) {
-        this.root.style.left = this.config.miniplayerConfig.left + 'px'
-        this.root.style.right = ''
-      }
-      if (this.config.miniplayerConfig.right !== undefined) {
-        this.root.style.right = this.config.miniplayerConfig.right + 'px'
-      }
-      if (this.config.miniplayerConfig.width !== undefined) {
-        this.root.style.width = this.config.miniplayerConfig.width + 'px'
-      }
-      if (this.config.miniplayerConfig.height !== undefined) {
-        this.root.style.height = this.config.miniplayerConfig.height + 'px'
-      }
-    }
-    if (this.config.fluid) {
-      this.root.style['padding-top'] = ''
-    }
-    let player = this;
-    ['click', 'touchend'].forEach(item => {
-      dragLay.addEventListener(item, function (e) {
-        e.preventDefault()
-        e.stopPropagation()
-        player.exitMiniplayer()
-        // player.root.style.top = `${Top}px`
-        // player.root.style.left = `${Left}px`
-      })
-    })
-  }
-
-  player.exitMiniplayer = function () {
-    removeClass(this.root, 'xgplayer-miniplayer-active')
-    this.root.style.right = ''
-    this.root.style.bottom = ''
-    this.root.style.top = ''
-    this.root.style.left = ''
-    if (this.config.fluid) {
-      this.root.style['width'] = '100%'
-      this.root.style['height'] = '0'
-      this.root.style['padding-top'] = `${this.config.height * 100 / this.config.width}%`
-    } else {
-      if (this.config.width) {
-        if (typeof this.config.width !== 'number') {
-          this.root.style.width = this.config.width
-        } else {
-          this.root.style.width = `${this.config.width}px`
-        }
-      }
-      if (this.config.height) {
-        if (typeof this.config.height !== 'number') {
-          this.root.style.height = this.config.height
-        } else {
-          this.root.style.height = `${this.config.height}px`
-        }
-      }
-    }
-
-    let dragLay = findDom(this.root, '.xgplayer-miniplayer-lay')
-    if (dragLay && dragLay.parentNode) {
-      dragLay.parentNode.removeChild(dragLay)
-    }
-    let dragHandle = findDom(this.root, '.xgplayer-miniplayer-drag')
-    if (dragHandle && dragHandle.parentNode) {
-      dragHandle.parentNode.removeChild(dragHandle)
-    }
-  }
-}
-
-export default {
-  name: 'miniplayer',
-  method: miniplayer
-}