1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
|
import videojs from 'video.js'
import { PlaylistPluginOptions } from '../../types'
import { PlaylistMenu } from './playlist-menu'
const ClickableComponent = videojs.getComponent('ClickableComponent')
class PlaylistButton extends ClickableComponent {
private playlistInfoElement: HTMLElement
private wrapper: HTMLElement
constructor (player: videojs.Player, options?: PlaylistPluginOptions & { playlistMenu: PlaylistMenu }) {
super(player, options as any)
}
createEl () {
this.wrapper = super.createEl('div', {
className: 'vjs-playlist-button',
innerHTML: '',
tabIndex: -1
}) as HTMLElement
const icon = super.createEl('div', {
className: 'vjs-playlist-icon',
innerHTML: '',
tabIndex: -1
})
this.playlistInfoElement = super.createEl('div', {
className: 'vjs-playlist-info',
innerHTML: '',
tabIndex: -1
}) as HTMLElement
this.wrapper.appendChild(icon)
this.wrapper.appendChild(this.playlistInfoElement)
this.update()
return this.wrapper
}
update () {
const options = this.options_ as PlaylistPluginOptions
this.playlistInfoElement.innerHTML = options.getCurrentPosition() + '/' + options.playlist.videosLength
this.wrapper.title = this.player().localize('Playlist: {1}', [ options.playlist.displayName ])
}
handleClick () {
const playlistMenu = this.getPlaylistMenu()
playlistMenu.open()
}
private getPlaylistMenu () {
return (this.options_ as any).playlistMenu as PlaylistMenu
}
}
videojs.registerComponent('PlaylistButton', PlaylistButton)
export { PlaylistButton }
|
