client/src/assets/player/videojs-components/peertube-link-button.ts

   1 import videojs from 'video.js'
   2 import { buildVideoLink, decorateVideoLink } from '@shared/core-utils'
   3 import { PeerTubeLinkButtonOptions } from '../peertube-videojs-typings'
   4
   5 const Button = videojs.getComponent('Button')
   6 class PeerTubeLinkButton extends Button {
   7   private shortUUID: string
   8
   9   constructor (player: videojs.Player, options?: PeerTubeLinkButtonOptions) {
  10     super(player, options as any)
  11
  12     this.shortUUID = options.shortUUID
  13   }
  14
  15   createEl () {
  16     return this.buildElement()
  17   }
  18
  19   updateHref () {
  20     this.el().setAttribute('href', this.buildLink())
  21   }
  22
  23   handleClick () {
  24     this.player().pause()
  25   }
  26
  27   private buildElement () {
  28     const el = videojs.dom.createEl('a', {
  29       href: this.buildLink(),
  30       innerHTML: 'PeerTube',
  31       title: this.player().localize('Video page (new window)'),
  32       className: 'vjs-peertube-link',
  33       target: '_blank'
  34     })
  35
  36     el.addEventListener('mouseenter', () => this.updateHref())
  37
  38     return el as HTMLButtonElement
  39   }
  40
  41   private buildLink () {
  42     const url = buildVideoLink({ shortUUID: this.shortUUID })
  43
  44     return decorateVideoLink({ url, startTime: this.player().currentTime() })
  45   }
  46 }
  47
  48 videojs.registerComponent('PeerTubeLinkButton', PeerTubeLinkButton)