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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
|
import videojs from 'video.js'
const Component = videojs.getComponent('Component')
class PeerTubeMobileButtons extends Component {
private rewind: Element
private forward: Element
private rewindText: Element
private forwardText: Element
createEl () {
const container = super.createEl('div', {
className: 'vjs-mobile-buttons-overlay'
}) as HTMLDivElement
const mainButton = super.createEl('div', {
className: 'main-button'
}) as HTMLDivElement
mainButton.addEventListener('touchstart', e => {
e.stopPropagation()
if (this.player_.paused() || this.player_.ended()) {
this.player_.play()
return
}
this.player_.pause()
})
this.rewind = super.createEl('div', { className: 'rewind-button vjs-hidden' })
this.forward = super.createEl('div', { className: 'forward-button vjs-hidden' })
for (let i = 0; i < 3; i++) {
this.rewind.appendChild(super.createEl('span', { className: 'icon' }))
this.forward.appendChild(super.createEl('span', { className: 'icon' }))
}
this.rewindText = this.rewind.appendChild(super.createEl('div', { className: 'text' }))
this.forwardText = this.forward.appendChild(super.createEl('div', { className: 'text' }))
container.appendChild(this.rewind)
container.appendChild(mainButton)
container.appendChild(this.forward)
return container
}
displayFastSeek (amount: number) {
if (amount === 0) {
this.hideRewind()
this.hideForward()
return
}
if (amount > 0) {
this.hideRewind()
this.displayForward(amount)
return
}
if (amount < 0) {
this.hideForward()
this.displayRewind(amount)
return
}
}
private hideRewind () {
this.rewind.classList.add('vjs-hidden')
this.rewindText.textContent = ''
}
private displayRewind (amount: number) {
this.rewind.classList.remove('vjs-hidden')
this.rewindText.textContent = this.player().localize('{1} seconds', [ amount + '' ])
}
private hideForward () {
this.forward.classList.add('vjs-hidden')
this.forwardText.textContent = ''
}
private displayForward (amount: number) {
this.forward.classList.remove('vjs-hidden')
this.forwardText.textContent = this.player().localize('{1} seconds', [ amount + '' ])
}
}
videojs.registerComponent('PeerTubeMobileButtons', PeerTubeMobileButtons)
export {
PeerTubeMobileButtons
}
|
