text: import Player from '../player'
  
  let definition = function () {
    let player = this; let util = Player.util; let sniffer = Player.sniffer
    let ul = util.createDom('xg-definition', '', {tabindex: 3}, 'xgplayer-definition'); let root = player.controls
    if (sniffer.device === 'mobile') {
      return
    }
    player.on('resourceReady', function (list) {
      if (list && list instanceof Array && list.length > 1) {
        util.addClass(player.root, 'xgplayer-is-definition')
        player.on('canplay', function () {
          let tmp = ['<ul>']; let src = player.config.url; let a = document.createElement('a')
          if (player.switchURL) {
            ['mp4', 'hls', 'flv'].every(item => {
              if (player[item]) {
                a.href = player[item].url
                src = a.href
                return false
              } else {
                return true
              }
            })
          } else {
            src = player.currentSrc || player.src
          }
          list.forEach(item => {
            a.href = item.url
            tmp.push(`<li url='${item.url}' cname='${item.cname}' class='${a.href === src ? 'definition' : ''}'>${item.name}</li>`)
          })
          let cursrc = list.filter(item => { a.href = item.url; return a.href === src })
          tmp.push(`</ul><p class="name"><em>${(cursrc[0] || {cname: ''}).cname}</em></p>`)
          let urlInRoot = root.querySelector('.xgplayer-definition')
          if (urlInRoot) {
            urlInRoot.innerHTML = '<xg-tips class="xgplayer-tips">清晰度</xg-tips>' + tmp.join('')
          } else {
            ul.innerHTML = '<xg-tips class="xgplayer-tips">清晰度</xg-tips>' + tmp.join('')
            root.appendChild(ul)
          }
        })
      }
    });
  
    ['touchstart', 'click'].forEach(item => {
      ul.addEventListener(item, function (e) {
        e.preventDefault()
        e.stopPropagation()
        let li = e.target || e.srcElement; let a = document.createElement('a')
        if (li && li.tagName.toLocaleLowerCase() === 'li') {
          Array.prototype.forEach.call(li.parentNode.childNodes, item => {
            util.removeClass(item, 'definition')
          })
          util.addClass(li, 'definition')
          li.parentNode.nextSibling.innerHTML = `<em>${li.getAttribute('cname')}</em>`
          a.href = li.getAttribute('url')
          if (player.switchURL) {
            let curRUL = document.createElement('a');
            ['mp4', 'hls', 'flv'].every(item => {
              if (player[item]) {
                curRUL = player[item].url
                return false
              } else {
                return true
              }
            })
            if (curRUL.href !== a.href && !player.ended) {
              player.switchURL(a.href)
            }
          } else {
            if (a.href !== player.currentSrc) {
              let curTime = player.currentTime; let paused = player.paused
              if (!player.ended) {
                player.src = a.href
                player.once('canplay', function () {
                  player.currentTime = curTime
                  if (!paused) {
                    player.play()
                  }
                })
              }
            }
          }
          player.emit('definitionchange', a.href)
        } else if (li && (li.tagName.toLocaleLowerCase() === 'p' || li.tagName.toLocaleLowerCase() === 'em')) {
          util.addClass(ul, 'xgplayer-definition-active')
          ul.focus()
        }
      }, false)
    })
  
    ul.addEventListener('blur', (e) => {
      e.preventDefault()
      e.stopPropagation()
      util.removeClass(ul, 'xgplayer-definition-active')
    })
  
    player.once('destroy', () => {
      ul = null
    })
  }
  
  Player.install('definition', definition)
  