client/src/assets/player/mobile/peertube-mobile-plugin.ts

   1 import './peertube-mobile-buttons'
   2 import videojs from 'video.js'
   3
   4 const Plugin = videojs.getPlugin('plugin')
   5
   6 class PeerTubeMobilePlugin extends Plugin {
   7
   8   constructor (player: videojs.Player, options: videojs.PlayerOptions) {
   9     super(player, options)
  10
  11     player.addChild('PeerTubeMobileButtons')
  12
  13     if (videojs.browser.IS_ANDROID && screen.orientation) {
  14       this.handleFullscreenRotation()
  15     }
  16   }
  17
  18   private handleFullscreenRotation () {
  19     this.player.on('fullscreenchange', () => {
  20       if (!this.player.isFullscreen() || this.isPortraitVideo()) return
  21
  22       screen.orientation.lock('landscape')
  23         .catch(err => console.error('Cannot lock screen to landscape.', err))
  24     })
  25   }
  26
  27   private isPortraitVideo () {
  28     return this.player.videoWidth() < this.player.videoHeight()
  29   }
  30 }
  31
  32 videojs.registerPlugin('peertubeMobile', PeerTubeMobilePlugin)
  33 export { PeerTubeMobilePlugin }