H5VideoPlayerBase.js 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. import browser from '../browser.js'
  2. export default class H5VideoPlayerBase {
  3. constructor( ) {
  4. this.video = null
  5. this.videos = new Map()
  6. }
  7. //overlay info -- [metadata.overlay]
  8. addVideo( url) {
  9. let video = this._createVideoElement(url)
  10. this.videos.set(url, video)
  11. video.masters = []
  12. return video
  13. }
  14. getVideo(url, master) {
  15. let video = this.videos.get(url)
  16. if (!video) {
  17. video = this.addVideo(url)
  18. }
  19. master && video.masters.push(master)
  20. video.onloadedmetadata = () => {
  21. video.canPlayed = true
  22. video.masters.forEach(m => {
  23. m.dispatchEvent({ type: 'loadedmetadata' })
  24. })
  25. }
  26. return video
  27. }
  28. _createVideoElement(src) {
  29. let video = document.createElement('video')
  30. video.setAttribute('crossOrigin', 'anonymous')
  31. video.setAttribute('playsinline', 'true')
  32. video.setAttribute('x5-playsinline', 'true')
  33. video.setAttribute('webkit-playsinline', 'true')
  34. video.setAttribute('x5-video-player-type', 'h5')
  35. video.setAttribute('controls', 'true')
  36. video.setAttribute('x-webkit-airplay', 'allow')
  37. video.autoplay = true
  38. video.muted = true
  39. video.loop = true
  40. video.src = src
  41. video.style.position = 'fixed'
  42. video.style.left = '0'
  43. video.style.top = '0'
  44. video.style.zIndex = '1000'
  45. video.style.width = '300px'
  46. video.style.height = '300px'
  47. //video.style.display = browser.urlHasValue('debug') ? 'block' : 'none'
  48. //document.body.appendChild(video)
  49. return video
  50. }
  51. }