xgplayer 2.32.2 → 2.32.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/browser/controls/danmu.js +3 -1
- package/browser/controls/errorRetry.js +1 -1
- package/browser/controls/nativeTextTrack.js +1 -1
- package/browser/core_player.js +1 -1
- package/browser/core_player.js.map +1 -1
- package/browser/index.js +7 -5
- package/browser/index.js.map +1 -1
- package/browser/simple_player.js +1 -1
- package/browser/simple_player.js.map +1 -1
- package/dist/controls/danmu.js +3 -1
- package/dist/controls/errorRetry.js +1 -1
- package/dist/controls/nativeTextTrack.js +1 -1
- package/dist/core_player.js +6 -7
- package/dist/core_player.js.map +1 -1
- package/dist/index.js +2881 -1887
- package/dist/index.js.map +1 -1
- package/dist/index.min.css +1 -0
- package/dist/index.min.js +2 -0
- package/dist/index.min.js.map +1 -0
- package/dist/simple_player.js +6 -7
- package/dist/simple_player.js.map +1 -1
- package/es/controls/danmu.js +3 -1
- package/es/controls/errorRetry.js +1 -1
- package/es/controls/nativeTextTrack.js +1 -1
- package/es/core_player.js +1 -1
- package/es/core_player.js.map +1 -1
- package/es/index.js +7 -5
- package/es/index.js.map +1 -1
- package/es/simple_player.js +1 -1
- package/es/simple_player.js.map +1 -1
- package/package.json +11 -2
- package/types/index.d.ts +0 -11
- package/postcss.config.js +0 -7
- package/src/bind/airplay.js +0 -10
- package/src/bind/cssFullscreen.js +0 -10
- package/src/bind/danmu.js +0 -10
- package/src/bind/definition.js +0 -10
- package/src/bind/download.js +0 -10
- package/src/bind/enter.js +0 -8
- package/src/bind/error.js +0 -8
- package/src/bind/errorRetry.js +0 -8
- package/src/bind/flex.js +0 -8
- package/src/bind/fullscreen.js +0 -10
- package/src/bind/i18n.js +0 -8
- package/src/bind/keyboard.js +0 -8
- package/src/bind/loading.js +0 -8
- package/src/bind/localPreview.js +0 -10
- package/src/bind/memoryPlay.js +0 -10
- package/src/bind/miniplayer.js +0 -10
- package/src/bind/mobile.js +0 -8
- package/src/bind/nativeTextTrack.js +0 -8
- package/src/bind/pc.js +0 -8
- package/src/bind/pip.js +0 -10
- package/src/bind/play.js +0 -10
- package/src/bind/playNext.js +0 -10
- package/src/bind/playbackRate.js +0 -8
- package/src/bind/poster.js +0 -8
- package/src/bind/progress.js +0 -8
- package/src/bind/reload.js +0 -10
- package/src/bind/replay.js +0 -10
- package/src/bind/rotate.js +0 -10
- package/src/bind/screenShot.js +0 -10
- package/src/bind/stallCheck.js +0 -8
- package/src/bind/start.js +0 -10
- package/src/bind/textTrack.js +0 -8
- package/src/bind/time.js +0 -8
- package/src/bind/volume.js +0 -10
- package/src/controls/airplay.js +0 -20
- package/src/controls/cssFullscreen.js +0 -49
- package/src/controls/danmu.js +0 -75
- package/src/controls/definition.js +0 -13
- package/src/controls/download.js +0 -28
- package/src/controls/errorRetry.js +0 -132
- package/src/controls/fullscreen.js +0 -145
- package/src/controls/keyboard.js +0 -214
- package/src/controls/localPreview.js +0 -32
- package/src/controls/memoryPlay.js +0 -14
- package/src/controls/miniplayer.js +0 -128
- package/src/controls/mobile.js +0 -100
- package/src/controls/pc.js +0 -123
- package/src/controls/pip.js +0 -52
- package/src/controls/play.js +0 -34
- package/src/controls/playNext.js +0 -29
- package/src/controls/reload.js +0 -24
- package/src/controls/replay.js +0 -30
- package/src/controls/rotate.js +0 -99
- package/src/controls/screenShot.js +0 -65
- package/src/controls/stallCheck.js +0 -38
- package/src/controls/start.js +0 -60
- package/src/controls/textTrack.js +0 -182
- package/src/controls/volume.js +0 -178
- package/src/controls.js +0 -36
- package/src/core_player.js +0 -13
- package/src/error.js +0 -74
- package/src/index.js +0 -57
- package/src/player.js +0 -553
- package/src/proxy.js +0 -495
- package/src/simple_player.js +0 -42
- package/src/skin/assets/airplay.svg +0 -1
- package/src/skin/assets/download.svg +0 -14
- package/src/skin/assets/exitCssFull.svg +0 -3
- package/src/skin/assets/exitFull.svg +0 -3
- package/src/skin/assets/loading.svg +0 -3
- package/src/skin/assets/panel.svg +0 -4
- package/src/skin/assets/pause.svg +0 -3
- package/src/skin/assets/play.svg +0 -3
- package/src/skin/assets/playNext.svg +0 -3
- package/src/skin/assets/reload.svg +0 -3
- package/src/skin/assets/replay.svg +0 -3
- package/src/skin/assets/requestCssFull.svg +0 -3
- package/src/skin/assets/requestFull.svg +0 -3
- package/src/skin/assets/rotate.svg +0 -11
- package/src/skin/assets/startPause.svg +0 -3
- package/src/skin/assets/startPlay.svg +0 -3
- package/src/skin/assets/volumeLarge.svg +0 -4
- package/src/skin/assets/volumeMuted.svg +0 -4
- package/src/skin/assets/volumeSmall.svg +0 -4
- package/src/skin/controls/airplay.js +0 -44
- package/src/skin/controls/cssFullscreen.js +0 -36
- package/src/skin/controls/danmu.js +0 -214
- package/src/skin/controls/definition.js +0 -251
- package/src/skin/controls/download.js +0 -29
- package/src/skin/controls/enter.js +0 -21
- package/src/skin/controls/error.js +0 -57
- package/src/skin/controls/flex.js +0 -13
- package/src/skin/controls/fullscreen.js +0 -43
- package/src/skin/controls/i18n.js +0 -168
- package/src/skin/controls/loading.js +0 -17
- package/src/skin/controls/localPreview.js +0 -18
- package/src/skin/controls/memoryPlay.js +0 -39
- package/src/skin/controls/miniplayer.js +0 -26
- package/src/skin/controls/nativeTextTrack.js +0 -153
- package/src/skin/controls/pip.js +0 -26
- package/src/skin/controls/play.js +0 -43
- package/src/skin/controls/playNext.js +0 -41
- package/src/skin/controls/playbackRate.js +0 -141
- package/src/skin/controls/poster.js +0 -18
- package/src/skin/controls/progress.js +0 -407
- package/src/skin/controls/reload.js +0 -29
- package/src/skin/controls/replay.js +0 -56
- package/src/skin/controls/rotate.js +0 -29
- package/src/skin/controls/screenShot.js +0 -27
- package/src/skin/controls/start.js +0 -62
- package/src/skin/controls/textTrack.js +0 -113
- package/src/skin/controls/time.js +0 -40
- package/src/skin/controls/volume.js +0 -63
- package/src/skin/index.js +0 -63
- package/src/skin/style/common/animation.scss +0 -16
- package/src/skin/style/common/svg-url.scss +0 -70
- package/src/skin/style/controls/airplay.scss +0 -35
- package/src/skin/style/controls/controls.scss +0 -40
- package/src/skin/style/controls/cssfullscreen.scss +0 -103
- package/src/skin/style/controls/danmu.scss +0 -333
- package/src/skin/style/controls/definition.scss +0 -76
- package/src/skin/style/controls/download.scss +0 -45
- package/src/skin/style/controls/enter.scss +0 -55
- package/src/skin/style/controls/error.scss +0 -34
- package/src/skin/style/controls/fullscreen.scss +0 -60
- package/src/skin/style/controls/icon.scss +0 -12
- package/src/skin/style/controls/live.scss +0 -9
- package/src/skin/style/controls/loading.scss +0 -44
- package/src/skin/style/controls/memoryPlay.scss +0 -28
- package/src/skin/style/controls/miniplayer.scss +0 -104
- package/src/skin/style/controls/pip.scss +0 -42
- package/src/skin/style/controls/placeholder.scss +0 -7
- package/src/skin/style/controls/play.scss +0 -79
- package/src/skin/style/controls/playNext.scss +0 -44
- package/src/skin/style/controls/playbackRate.scss +0 -82
- package/src/skin/style/controls/poster.scss +0 -19
- package/src/skin/style/controls/progress.scss +0 -182
- package/src/skin/style/controls/reload.scss +0 -43
- package/src/skin/style/controls/replay.scss +0 -46
- package/src/skin/style/controls/rotate.scss +0 -41
- package/src/skin/style/controls/screenShot.scss +0 -42
- package/src/skin/style/controls/start.scss +0 -78
- package/src/skin/style/controls/textTrack.scss +0 -87
- package/src/skin/style/controls/time.scss +0 -24
- package/src/skin/style/controls/tips.scss +0 -24
- package/src/skin/style/controls/videoProxy.scss +0 -6
- package/src/skin/style/controls/volume.scss +0 -143
- package/src/skin/style/index.scss +0 -88
- package/src/utils/sniffer.js +0 -47
- package/src/utils/url.js +0 -10
- package/src/utils/util.js +0 -358
- package/src/utils/xgplayerTimeRange.js +0 -17
- package/src/version.js +0 -7
- package/version.json +0 -3
- package/webpack.config.js +0 -168
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { createDom } from '../../utils/util'
|
|
2
|
-
import AirplayIcon from '../assets/airplay.svg'
|
|
3
|
-
import '../style/controls/airplay.scss'
|
|
4
|
-
|
|
5
|
-
let s_airplay = function () {
|
|
6
|
-
let player = this
|
|
7
|
-
if(!player.config.airplay || !window.WebKitPlaybackTargetAvailabilityEvent) return
|
|
8
|
-
|
|
9
|
-
let btn = createDom('xg-airplay', `<xg-icon class="xgplayer-icon">
|
|
10
|
-
<div class="xgplayer-icon-airplay">${AirplayIcon}</div>
|
|
11
|
-
</xg-icon>`, {}, 'xgplayer-airplay')
|
|
12
|
-
|
|
13
|
-
let tips = createDom('xg-tips', `<span class="xgplayer-tip-airplay">${player.lang.AIRPLAY_TIPS}</span>`, {}, 'xgplayer-tips')
|
|
14
|
-
btn.appendChild(tips)
|
|
15
|
-
player.once('ready', () => {
|
|
16
|
-
player.controls.appendChild(btn)
|
|
17
|
-
player.video.addEventListener('webkitplaybacktargetavailabilitychanged',
|
|
18
|
-
event => {
|
|
19
|
-
switch (event.availability) {
|
|
20
|
-
case "available":
|
|
21
|
-
btn.hidden = false;
|
|
22
|
-
btn.disabled = false;
|
|
23
|
-
break;
|
|
24
|
-
case "not-available":
|
|
25
|
-
btn.hidden = true;
|
|
26
|
-
btn.disabled = true;
|
|
27
|
-
break;
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
['click', 'touchend'].forEach(item => {
|
|
33
|
-
btn.addEventListener(item, function (e) {
|
|
34
|
-
e.preventDefault()
|
|
35
|
-
e.stopPropagation()
|
|
36
|
-
player.userGestureTrigEvent('airplayBtnClick')
|
|
37
|
-
})
|
|
38
|
-
})
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
export default {
|
|
42
|
-
name: 's_airplay',
|
|
43
|
-
method: s_airplay
|
|
44
|
-
}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { createDom } from '../../utils/util'
|
|
2
|
-
import RequestCssFullIcon from '../assets/requestCssFull.svg'
|
|
3
|
-
import ExitCssFullIcon from '../assets/exitCssFull.svg'
|
|
4
|
-
import '../style/controls/cssfullscreen.scss'
|
|
5
|
-
|
|
6
|
-
let s_cssFullscreen = function () {
|
|
7
|
-
let player = this
|
|
8
|
-
if (!player.config.cssFullscreen) { return }
|
|
9
|
-
let btn = createDom('xg-cssfullscreen', `<xg-icon class="xgplayer-icon">
|
|
10
|
-
<div class="xgplayer-icon-requestfull">${RequestCssFullIcon}</div>
|
|
11
|
-
<div class="xgplayer-icon-exitfull">${ExitCssFullIcon}</div>
|
|
12
|
-
</xg-icon>`, {}, 'xgplayer-cssfullscreen')
|
|
13
|
-
|
|
14
|
-
let tipsText = {}
|
|
15
|
-
tipsText.requestfull = player.lang.CSSFULLSCREEN_TIPS
|
|
16
|
-
tipsText.exitfull = player.lang.EXITCSSFULLSCREEN_TIPS
|
|
17
|
-
let tips = createDom('xg-tips', `<span class="xgplayer-tip-requestfull">${tipsText.requestfull}</span>
|
|
18
|
-
<span class="xgplayer-tip-exitfull">${tipsText.exitfull}</span>`, {}, 'xgplayer-tips')
|
|
19
|
-
btn.appendChild(tips)
|
|
20
|
-
player.once('ready', () => {
|
|
21
|
-
player.controls.appendChild(btn)
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
['click', 'touchend'].forEach(item => {
|
|
25
|
-
btn.addEventListener(item, function (e) {
|
|
26
|
-
e.preventDefault()
|
|
27
|
-
e.stopPropagation()
|
|
28
|
-
player.userGestureTrigEvent('cssFullscreenBtnClick')
|
|
29
|
-
})
|
|
30
|
-
})
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
export default {
|
|
34
|
-
name: 's_cssFullscreen',
|
|
35
|
-
method: s_cssFullscreen
|
|
36
|
-
}
|
|
@@ -1,214 +0,0 @@
|
|
|
1
|
-
import { createDom, deepCopy, addClass, removeClass } from '../../utils/util'
|
|
2
|
-
import DanmuJs from 'danmu.js'
|
|
3
|
-
import PanelIcon from '../assets/panel.svg'
|
|
4
|
-
import '../style/controls/danmu.scss'
|
|
5
|
-
|
|
6
|
-
let s_danmu = function () {
|
|
7
|
-
let player = this
|
|
8
|
-
let root = player.root
|
|
9
|
-
if(!player.config.danmu) { return }
|
|
10
|
-
let container = createDom('xg-danmu', '', {}, 'xgplayer-danmu')
|
|
11
|
-
player.once('ready', () => {
|
|
12
|
-
root.appendChild(container)
|
|
13
|
-
})
|
|
14
|
-
let config = deepCopy({
|
|
15
|
-
container,
|
|
16
|
-
player: player.video,
|
|
17
|
-
comments: [],
|
|
18
|
-
area: {
|
|
19
|
-
start: 0,
|
|
20
|
-
end: 1
|
|
21
|
-
}
|
|
22
|
-
}, player.config.danmu)
|
|
23
|
-
let panelBtn
|
|
24
|
-
if (player.config.danmu.panel) {
|
|
25
|
-
panelBtn = createDom('xg-panel', `<xg-panel-icon class="xgplayer-panel-icon">
|
|
26
|
-
${PanelIcon}
|
|
27
|
-
</xg-panel-icon>
|
|
28
|
-
<xg-panel-slider class="xgplayer-panel-slider">
|
|
29
|
-
<xg-hidemode class="xgplayer-hidemode">
|
|
30
|
-
<p class="xgplayer-hidemode-font">屏蔽类型</p>
|
|
31
|
-
<ul class="xgplayer-hidemode-radio">
|
|
32
|
-
<li class="xgplayer-hidemode-scroll" id="false">滚动</li><li class="xgplayer-hidemode-top" id="false">顶部</li><li class="xgplayer-hidemode-bottom" id="false">底部</li><li class="xgplayer-hidemode-color" id="false">色彩</li>
|
|
33
|
-
</ul>
|
|
34
|
-
</xg-hidemode>
|
|
35
|
-
<xg-transparency class="xgplayer-transparency">
|
|
36
|
-
<span>不透明度</span>
|
|
37
|
-
<input class="xgplayer-transparency-line xgplayer-transparency-color xgplayer-transparency-bar xgplayer-transparency-gradient" type="range" min="0" max="100" step="0.1" value="50"></input>
|
|
38
|
-
</xg-transparency>
|
|
39
|
-
<xg-showarea class="xgplayer-showarea">
|
|
40
|
-
<div class="xgplayer-showarea-name">显示区域</div>
|
|
41
|
-
<div class="xgplayer-showarea-control">
|
|
42
|
-
<div class="xgplayer-showarea-control-up">
|
|
43
|
-
<span class="xgplayer-showarea-control-up-item xgplayer-showarea-onequarters">1/4</span>
|
|
44
|
-
<span class="xgplayer-showarea-control-up-item xgplayer-showarea-twoquarters selected-color">1/2</span>
|
|
45
|
-
<span class="xgplayer-showarea-control-up-item xgplayer-showarea-threequarters">3/4</span>
|
|
46
|
-
<span class="xgplayer-showarea-control-up-item xgplayer-showarea-full">1</span>
|
|
47
|
-
</div>
|
|
48
|
-
<div class="xgplayer-showarea-control-down">
|
|
49
|
-
<div class="xgplayer-showarea-control-down-dots">
|
|
50
|
-
<span class="xgplayer-showarea-onequarters-dot"></span>
|
|
51
|
-
<span class="xgplayer-showarea-twoquarters-dot"></span>
|
|
52
|
-
<span class="xgplayer-showarea-threequarters-dot"></span>
|
|
53
|
-
<span class="xgplayer-showarea-full-dot"></span>
|
|
54
|
-
</div>
|
|
55
|
-
<input class="xgplayer-showarea-line xgplayer-showarea-color xgplayer-showarea-bar xgplayer-gradient" type="range" min="1" max="4" step="1" value="1">
|
|
56
|
-
</div>
|
|
57
|
-
</div>
|
|
58
|
-
</xg-showarea>
|
|
59
|
-
<xg-danmuspeed class="xgplayer-danmuspeed">
|
|
60
|
-
<div class="xgplayer-danmuspeed-name">弹幕速度</div>
|
|
61
|
-
<div class="xgplayer-danmuspeed-control">
|
|
62
|
-
<div class="xgplayer-danmuspeed-control-up">
|
|
63
|
-
<span class="xgplayer-danmuspeed-control-up-item xgplayer-danmuspeed-small">慢</span>
|
|
64
|
-
<span class="xgplayer-danmuspeed-control-up-item xgplayer-danmuspeed-middle selected-color">中</span>
|
|
65
|
-
<span class="xgplayer-danmuspeed-control-up-item xgplayer-danmuspeed-large">快</span>
|
|
66
|
-
</div>
|
|
67
|
-
<div class="xgplayer-danmuspeed-control-down">
|
|
68
|
-
<div class="xgplayer-danmuspeed-control-down-dots">
|
|
69
|
-
<span class="xgplayer-danmuspeed-small-dot"></span>
|
|
70
|
-
<span class="xgplayer-danmuspeed-middle-dot"></span>
|
|
71
|
-
<span class="xgplayer-danmuspeed-large-dot"></span>
|
|
72
|
-
</div>
|
|
73
|
-
<input class="xgplayer-danmuspeed-line xgplayer-danmuspeed-color xgplayer-danmuspeed-bar xgplayer-gradient" type="range" min="50" max="150" step="50" value="100">
|
|
74
|
-
</div>
|
|
75
|
-
</div>
|
|
76
|
-
</xg-danmuspeed>
|
|
77
|
-
<xg-danmufont class="xgplayer-danmufont">
|
|
78
|
-
<div class="xgplayer-danmufont-name">字体大小</div>
|
|
79
|
-
<div class="xgplayer-danmufont-control">
|
|
80
|
-
<div class="xgplayer-danmufont-control-up">
|
|
81
|
-
<span class="xgplayer-danmufont-control-up-item xgplayer-danmufont-small">小</span>
|
|
82
|
-
<span class="xgplayer-danmufont-control-up-item xgplayer-danmufont-middle">中</span>
|
|
83
|
-
<span class="xgplayer-danmufont-control-up-item xgplayer-danmufont-large selected-color">大</span>
|
|
84
|
-
</div>
|
|
85
|
-
<div class="xgplayer-danmufont-control-down">
|
|
86
|
-
<div class="xgplayer-danmufont-control-down-dots">
|
|
87
|
-
<span class="xgplayer-danmufont-small-dot"></span>
|
|
88
|
-
<span class="xgplayer-danmufont-middle-dot"></span>
|
|
89
|
-
<span class="xgplayer-danmufont-large-dot"></span>
|
|
90
|
-
</div>
|
|
91
|
-
<input class="xgplayer-danmufont-line xgplayer-danmufont-color xgplayer-danmufont-bar xgplayer-gradient" type="range" min="20" max="30" step="5" value="25">
|
|
92
|
-
</div>
|
|
93
|
-
</div>
|
|
94
|
-
</xg-danmufont>
|
|
95
|
-
</xg-panel-slider>`, {tabindex: 7}, 'xgplayer-panel')
|
|
96
|
-
player.once('ready', () => {
|
|
97
|
-
player.controls.appendChild(panelBtn)
|
|
98
|
-
})
|
|
99
|
-
}
|
|
100
|
-
player.once('complete', () => {
|
|
101
|
-
let danmujs = new DanmuJs(config)
|
|
102
|
-
player.emit('initDefaultDanmu', danmujs)
|
|
103
|
-
player.danmu = danmujs
|
|
104
|
-
|
|
105
|
-
if (!player.config.danmu.panel) {
|
|
106
|
-
return
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
let slider = panelBtn.querySelector('.xgplayer-panel-slider')
|
|
110
|
-
let focusStatus
|
|
111
|
-
let focusarray = ['mouseenter', 'touchend', 'click']
|
|
112
|
-
focusarray.forEach(item => {
|
|
113
|
-
panelBtn.addEventListener(item, function (e) {
|
|
114
|
-
e.preventDefault()
|
|
115
|
-
e.stopPropagation()
|
|
116
|
-
addClass(slider, 'xgplayer-panel-active')
|
|
117
|
-
panelBtn.focus()
|
|
118
|
-
focusStatus = true
|
|
119
|
-
})
|
|
120
|
-
})
|
|
121
|
-
panelBtn.addEventListener('mouseleave', function (e) {
|
|
122
|
-
e.preventDefault()
|
|
123
|
-
e.stopPropagation()
|
|
124
|
-
removeClass(slider, 'xgplayer-panel-active')
|
|
125
|
-
focusStatus = false
|
|
126
|
-
})
|
|
127
|
-
slider.addEventListener('mouseleave', function (e) {
|
|
128
|
-
e.preventDefault()
|
|
129
|
-
e.stopPropagation()
|
|
130
|
-
if (focusStatus === false) {
|
|
131
|
-
removeClass(slider, 'xgplayer-panel-active')
|
|
132
|
-
}
|
|
133
|
-
})
|
|
134
|
-
|
|
135
|
-
let danmuConfig = player.config.danmu
|
|
136
|
-
let hidemodeScroll = panelBtn.querySelector('.xgplayer-hidemode-scroll')
|
|
137
|
-
let hidemodeTop = panelBtn.querySelector('.xgplayer-hidemode-top')
|
|
138
|
-
let hidemodeBottom = panelBtn.querySelector('.xgplayer-hidemode-bottom')
|
|
139
|
-
let hidemodeColor = panelBtn.querySelector('.xgplayer-hidemode-color')
|
|
140
|
-
let hidemodeArray = {
|
|
141
|
-
'scroll': hidemodeScroll,
|
|
142
|
-
'top': hidemodeTop,
|
|
143
|
-
'bottom': hidemodeBottom,
|
|
144
|
-
'color': hidemodeColor
|
|
145
|
-
}
|
|
146
|
-
for (let key in hidemodeArray) {
|
|
147
|
-
let keys = key
|
|
148
|
-
let ev = ['touchend', 'click']
|
|
149
|
-
ev.forEach(item => {
|
|
150
|
-
hidemodeArray[keys].addEventListener(item, function (e) {
|
|
151
|
-
if (hidemodeArray[keys].getAttribute('id') !== 'true') {
|
|
152
|
-
hidemodeArray[keys].style.color = '#f85959'
|
|
153
|
-
hidemodeArray[keys].setAttribute('id', 'true')
|
|
154
|
-
player.danmu.hide(keys)
|
|
155
|
-
} else {
|
|
156
|
-
hidemodeArray[keys].style.color = '#aaa'
|
|
157
|
-
hidemodeArray[keys].setAttribute('id', 'false')
|
|
158
|
-
player.danmu.show(keys)
|
|
159
|
-
}
|
|
160
|
-
})
|
|
161
|
-
})
|
|
162
|
-
}
|
|
163
|
-
let transparency = panelBtn.querySelector('.xgplayer-transparency-line')
|
|
164
|
-
let transparencyGradient = panelBtn.querySelector('.xgplayer-transparency-gradient')
|
|
165
|
-
let transparencyValue = 50
|
|
166
|
-
transparencyGradient.style.background = 'linear-gradient(to right, #f85959 0%, #f85959 ' + transparencyValue + '%, #aaa ' + transparencyValue + '%, #aaa)'
|
|
167
|
-
transparency.addEventListener('input', function (e) {
|
|
168
|
-
e.preventDefault()
|
|
169
|
-
e.stopPropagation()
|
|
170
|
-
transparencyValue = e.target.value
|
|
171
|
-
transparencyGradient.style.background = 'linear-gradient(to right, #f85959 0%, #f85959 ' + transparencyValue + '%, #aaa ' + transparencyValue + '%, #aaa)'
|
|
172
|
-
danmuConfig.comments.forEach(item => {
|
|
173
|
-
item.style.opacity = transparencyValue / 100
|
|
174
|
-
})
|
|
175
|
-
})
|
|
176
|
-
let showarea = panelBtn.querySelector('.xgplayer-showarea-line')
|
|
177
|
-
showarea.addEventListener('input', function (e) {
|
|
178
|
-
e.preventDefault()
|
|
179
|
-
e.stopPropagation()
|
|
180
|
-
let showareaValue = e.target.value
|
|
181
|
-
player.danmu.config.area.end = showareaValue / 100
|
|
182
|
-
player.config.danmu.area.end = showareaValue / 100
|
|
183
|
-
player.danmu.bulletBtn.main.channel.resize()
|
|
184
|
-
})
|
|
185
|
-
let danmuspeed = panelBtn.querySelector('.xgplayer-danmuspeed-line')
|
|
186
|
-
danmuspeed.addEventListener('input', function (e) {
|
|
187
|
-
e.preventDefault()
|
|
188
|
-
e.stopPropagation()
|
|
189
|
-
let danmuspeedValue = e.target.value
|
|
190
|
-
danmuConfig.comments.forEach(item => {
|
|
191
|
-
item.duration = (200 - danmuspeedValue) * 100
|
|
192
|
-
})
|
|
193
|
-
})
|
|
194
|
-
let danmufont = panelBtn.querySelector('.xgplayer-danmufont-line')
|
|
195
|
-
danmufont.addEventListener('input', function (e) {
|
|
196
|
-
e.preventDefault()
|
|
197
|
-
e.stopPropagation()
|
|
198
|
-
let danmufontValue = e.target.value
|
|
199
|
-
danmuConfig.comments.forEach(item => {
|
|
200
|
-
item.style.fontSize = danmufontValue + 'px'
|
|
201
|
-
})
|
|
202
|
-
})
|
|
203
|
-
if(navigator.userAgent.indexOf("Firefox") > -1) {
|
|
204
|
-
for (let i = 0; i < slider.querySelectorAll('input').length; i++) {
|
|
205
|
-
slider.querySelectorAll('input')[i].style.marginTop = '10px'
|
|
206
|
-
}
|
|
207
|
-
}
|
|
208
|
-
})
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
export default {
|
|
212
|
-
name: 's_danmu',
|
|
213
|
-
method: s_danmu
|
|
214
|
-
}
|
|
@@ -1,251 +0,0 @@
|
|
|
1
|
-
import { createDom, addClass, removeClass, hasClass, toggleClass } from '../../utils/util'
|
|
2
|
-
import sniffer from '../../utils/sniffer'
|
|
3
|
-
import '../style/controls/definition.scss'
|
|
4
|
-
|
|
5
|
-
let s_definition = function () {
|
|
6
|
-
let player = this
|
|
7
|
-
let root = player.root
|
|
8
|
-
let paused
|
|
9
|
-
let container = createDom('xg-definition', '', {tabindex: 3}, 'xgplayer-definition')
|
|
10
|
-
if (sniffer.device === 'mobile') {
|
|
11
|
-
player.config.definitionActive = 'click'
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
function onCanplayResourceReady () {
|
|
15
|
-
let list = player.definitionList
|
|
16
|
-
let tmp = ['<ul>'], src = player.config.url, a = document.createElement('a')
|
|
17
|
-
if (player.switchURL) {
|
|
18
|
-
['mp4', 'hls', '__flv__', 'dash'].every(item => {
|
|
19
|
-
if (player[item]) {
|
|
20
|
-
if(player[item].url) {
|
|
21
|
-
a.href = player[item].url
|
|
22
|
-
}
|
|
23
|
-
if(item === '__flv__') {
|
|
24
|
-
if(player[item]._options) {
|
|
25
|
-
a.href = player[item]._options.url
|
|
26
|
-
} else {
|
|
27
|
-
a.href = player[item]._mediaDataSource.url
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
if(item === 'hls') {
|
|
31
|
-
a.href = player[item].originUrl || player[item].url
|
|
32
|
-
src = a.href
|
|
33
|
-
}
|
|
34
|
-
src = a.href
|
|
35
|
-
return false
|
|
36
|
-
} else {
|
|
37
|
-
return true
|
|
38
|
-
}
|
|
39
|
-
})
|
|
40
|
-
} else {
|
|
41
|
-
src = player.currentSrc || player.src
|
|
42
|
-
}
|
|
43
|
-
list.forEach(item => {
|
|
44
|
-
a.href = item.url
|
|
45
|
-
if (player.dash) {
|
|
46
|
-
tmp.push(`<li url='${item.url}' cname='${item.name}' class='${item.selected ? 'selected' : ''}'>${item.name}</li>`)
|
|
47
|
-
} else {
|
|
48
|
-
tmp.push(`<li url='${item.url}' cname='${item.name}' class='${a.href === src ? 'selected' : ''}'>${item.name}</li>`)
|
|
49
|
-
}
|
|
50
|
-
})
|
|
51
|
-
let cursrc = list.filter(item => {
|
|
52
|
-
a.href = item.url
|
|
53
|
-
if (player.dash) {
|
|
54
|
-
return item.selected === true
|
|
55
|
-
} else {
|
|
56
|
-
return a.href === src
|
|
57
|
-
}
|
|
58
|
-
})
|
|
59
|
-
console.warn('cursrc:', cursrc, 'src:', src, 'list:', list)
|
|
60
|
-
tmp.push(`</ul><p class='name'>${(cursrc[0] || {name: ''}).name}</p>`)
|
|
61
|
-
let urlInRoot = root.querySelector('.xgplayer-definition')
|
|
62
|
-
if (urlInRoot) {
|
|
63
|
-
urlInRoot.innerHTML = tmp.join('')
|
|
64
|
-
let cur = urlInRoot.querySelector('.name')
|
|
65
|
-
if (!player.config.definitionActive || player.config.definitionActive === 'hover') {
|
|
66
|
-
cur.addEventListener('mouseenter', (e) => {
|
|
67
|
-
e.preventDefault()
|
|
68
|
-
e.stopPropagation()
|
|
69
|
-
addClass(player.root, 'xgplayer-definition-active')
|
|
70
|
-
urlInRoot.focus()
|
|
71
|
-
})
|
|
72
|
-
}
|
|
73
|
-
} else {
|
|
74
|
-
container.innerHTML = tmp.join('')
|
|
75
|
-
let cur = container.querySelector('.name')
|
|
76
|
-
if (!player.config.definitionActive || player.config.definitionActive === 'hover') {
|
|
77
|
-
cur.addEventListener('mouseenter', (e) => {
|
|
78
|
-
e.preventDefault()
|
|
79
|
-
e.stopPropagation()
|
|
80
|
-
addClass(player.root, 'xgplayer-definition-active')
|
|
81
|
-
container.focus()
|
|
82
|
-
})
|
|
83
|
-
}
|
|
84
|
-
player.controls.appendChild(container)
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
function onResourceReady (list) {
|
|
88
|
-
player.definitionList = list
|
|
89
|
-
if (list && list instanceof Array && list.length > 0) {
|
|
90
|
-
addClass(root, 'xgplayer-is-definition')
|
|
91
|
-
player.once('canplay', onCanplayResourceReady)
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
player.on('resourceReady', onResourceReady)
|
|
95
|
-
|
|
96
|
-
function onPlayingChangeDefinition () {
|
|
97
|
-
player.currentTime = player.curTime
|
|
98
|
-
if (paused) {
|
|
99
|
-
player.pause()
|
|
100
|
-
} else {
|
|
101
|
-
let playPromise = player.play()
|
|
102
|
-
if (playPromise !== undefined && playPromise) {
|
|
103
|
-
playPromise.catch(err => {})
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
};
|
|
107
|
-
function onTimeupdateChangeDefinition () {
|
|
108
|
-
player.once('timeupdate', onPlayingChangeDefinition)
|
|
109
|
-
};
|
|
110
|
-
['touchend', 'click'].forEach(item => {
|
|
111
|
-
container.addEventListener(item, function (e) {
|
|
112
|
-
e.preventDefault()
|
|
113
|
-
e.stopPropagation()
|
|
114
|
-
let list = player.definitionList
|
|
115
|
-
let li = e.target || e.srcElement, a = document.createElement('a')
|
|
116
|
-
if (li && li.tagName.toLocaleLowerCase() === 'li') {
|
|
117
|
-
let from, to
|
|
118
|
-
Array.prototype.forEach.call(li.parentNode.childNodes, item => {
|
|
119
|
-
if(hasClass(item, 'selected')) {
|
|
120
|
-
from = item.getAttribute('cname')
|
|
121
|
-
removeClass(item, 'selected')
|
|
122
|
-
player.emit('beforeDefinitionChange', item.getAttribute('url'))
|
|
123
|
-
}
|
|
124
|
-
})
|
|
125
|
-
if (player.dash) {
|
|
126
|
-
list.forEach(item => {
|
|
127
|
-
item.selected = false
|
|
128
|
-
if (item.name === li.innerHTML) {
|
|
129
|
-
item.selected = true
|
|
130
|
-
}
|
|
131
|
-
})
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
addClass(li, 'selected')
|
|
135
|
-
to = li.getAttribute('cname')
|
|
136
|
-
li.parentNode.nextSibling.innerHTML = `${li.getAttribute('cname')}`
|
|
137
|
-
a.href = li.getAttribute('url')
|
|
138
|
-
paused = player.paused
|
|
139
|
-
if (player.switchURL) {
|
|
140
|
-
let curRUL = document.createElement('a');
|
|
141
|
-
['mp4', 'hls', '__flv__', 'dash'].every(item => {
|
|
142
|
-
if (player[item]) {
|
|
143
|
-
if(player[item].url) {
|
|
144
|
-
curRUL.href = player[item].url
|
|
145
|
-
}
|
|
146
|
-
if(item === '__flv__') {
|
|
147
|
-
if(player[item]._options) {
|
|
148
|
-
curRUL.href = player[item]._options.url
|
|
149
|
-
} else {
|
|
150
|
-
curRUL.href = player[item]._mediaDataSource.url
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
if(item === 'hls') {
|
|
154
|
-
curRUL.href = player[item].originUrl || player[item].url
|
|
155
|
-
}
|
|
156
|
-
return false
|
|
157
|
-
} else {
|
|
158
|
-
return true
|
|
159
|
-
}
|
|
160
|
-
})
|
|
161
|
-
if (curRUL.href !== a.href && !player.ended) {
|
|
162
|
-
player.switchURL(a.href)
|
|
163
|
-
}
|
|
164
|
-
} else {
|
|
165
|
-
if (player['hls']) {
|
|
166
|
-
let curRUL = document.createElement('a')
|
|
167
|
-
curRUL = player['hls'].url
|
|
168
|
-
}
|
|
169
|
-
if (a.href !== player.currentSrc) {
|
|
170
|
-
player.curTime = player.currentTime
|
|
171
|
-
if (!player.ended) {
|
|
172
|
-
player.src = a.href
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
if(navigator.userAgent.toLowerCase().indexOf('android') > -1) {
|
|
177
|
-
player.once('timeupdate', onTimeupdateChangeDefinition)
|
|
178
|
-
} else {
|
|
179
|
-
player.once('loadedmetadata', onPlayingChangeDefinition)
|
|
180
|
-
}
|
|
181
|
-
player.emit('definitionChange', {from, to})
|
|
182
|
-
if (sniffer.device === 'mobile') {
|
|
183
|
-
removeClass(player.root, 'xgplayer-definition-active')
|
|
184
|
-
}
|
|
185
|
-
} else if (player.config.definitionActive === 'click' && li && (li.tagName.toLocaleLowerCase() === 'p' || li.tagName.toLocaleLowerCase() === 'em')) {
|
|
186
|
-
if(sniffer.device === 'mobile') {
|
|
187
|
-
toggleClass(player.root, 'xgplayer-definition-active')
|
|
188
|
-
} else {
|
|
189
|
-
addClass(player.root, 'xgplayer-definition-active')
|
|
190
|
-
}
|
|
191
|
-
container.focus()
|
|
192
|
-
}
|
|
193
|
-
player.emit('focus')
|
|
194
|
-
}, false)
|
|
195
|
-
})
|
|
196
|
-
|
|
197
|
-
container.addEventListener('mouseleave', e => {
|
|
198
|
-
e.preventDefault()
|
|
199
|
-
e.stopPropagation()
|
|
200
|
-
removeClass(root, 'xgplayer-definition-active')
|
|
201
|
-
})
|
|
202
|
-
|
|
203
|
-
function onBlur () {
|
|
204
|
-
removeClass(root, 'xgplayer-definition-active')
|
|
205
|
-
}
|
|
206
|
-
player.on('blur', onBlur)
|
|
207
|
-
|
|
208
|
-
function onDestroy () {
|
|
209
|
-
player.off('resourceReady', onResourceReady)
|
|
210
|
-
player.off('canplay', onCanplayResourceReady)
|
|
211
|
-
if(navigator.userAgent.toLowerCase().indexOf('android') > -1) {
|
|
212
|
-
player.off('timeupdate', onTimeupdateChangeDefinition)
|
|
213
|
-
player.off('timeupdate', onPlayingChangeDefinition)
|
|
214
|
-
} else {
|
|
215
|
-
player.off('loadedmetadata', onPlayingChangeDefinition)
|
|
216
|
-
}
|
|
217
|
-
player.off('blur', onBlur)
|
|
218
|
-
player.off('destroy', onDestroy)
|
|
219
|
-
}
|
|
220
|
-
player.once('destroy', onDestroy)
|
|
221
|
-
|
|
222
|
-
player.getCurrentDefinition = function () {
|
|
223
|
-
let liList = player.controls.querySelectorAll('.xgplayer-definition ul li')
|
|
224
|
-
for(let i = 0; i < liList.length; i++) {
|
|
225
|
-
if(liList[i].className && liList[i].className.indexOf('selected') > -1) {
|
|
226
|
-
return {
|
|
227
|
-
name: liList[i].getAttribute('cname'),
|
|
228
|
-
url: liList[i].getAttribute('url')
|
|
229
|
-
}
|
|
230
|
-
}
|
|
231
|
-
}
|
|
232
|
-
return {
|
|
233
|
-
name: liList[0].getAttribute('cname'),
|
|
234
|
-
url: liList[0].getAttribute('url')
|
|
235
|
-
}
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
player.switchDefinition = function (definitionObj = {}) {
|
|
239
|
-
let liList = player.controls.querySelectorAll('.xgplayer-definition ul li')
|
|
240
|
-
for(let i = 0; i < liList.length; i++) {
|
|
241
|
-
if(liList[i].getAttribute('cname') === definitionObj.name || liList[i].getAttribute('url') === definitionObj.url || i === definitionObj.index) {
|
|
242
|
-
liList[i].click()
|
|
243
|
-
}
|
|
244
|
-
}
|
|
245
|
-
}
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
export default {
|
|
249
|
-
name: 's_definition',
|
|
250
|
-
method: s_definition
|
|
251
|
-
}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import { createDom } from '../../utils/util'
|
|
2
|
-
import DownloadIcon from '../assets/download.svg'
|
|
3
|
-
import '../style/controls/download.scss'
|
|
4
|
-
|
|
5
|
-
let s_download = function () {
|
|
6
|
-
let player = this
|
|
7
|
-
if (!player.config.download) { return }
|
|
8
|
-
let btn = createDom('xg-download', `<xg-icon class="xgplayer-icon">${DownloadIcon}</xg-icon>`, {}, 'xgplayer-download')
|
|
9
|
-
|
|
10
|
-
let tipsText = player.lang.DOWNLOAD_TIPS
|
|
11
|
-
let tips = createDom('xg-tips', `<span class="xgplayer-tip-download">${tipsText}</span>`, {}, 'xgplayer-tips')
|
|
12
|
-
btn.appendChild(tips)
|
|
13
|
-
player.once('ready', () => {
|
|
14
|
-
player.controls.appendChild(btn)
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
['click', 'touchend'].forEach(item => {
|
|
18
|
-
btn.addEventListener(item, function (e) {
|
|
19
|
-
e.preventDefault()
|
|
20
|
-
e.stopPropagation()
|
|
21
|
-
player.userGestureTrigEvent('downloadBtnClick')
|
|
22
|
-
})
|
|
23
|
-
})
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
export default {
|
|
27
|
-
name: 's_download',
|
|
28
|
-
method: s_download
|
|
29
|
-
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { createDom } from '../../utils/util'
|
|
2
|
-
import '../style/controls/enter.scss'
|
|
3
|
-
|
|
4
|
-
let s_enter = function () {
|
|
5
|
-
let player = this
|
|
6
|
-
let root = player.root
|
|
7
|
-
|
|
8
|
-
let barStr = ''
|
|
9
|
-
for(let i = 1; i <= 12; i++) {
|
|
10
|
-
barStr += `<div class="xgplayer-enter-bar${i}"></div>`
|
|
11
|
-
}
|
|
12
|
-
let enter = createDom('xg-enter', `<div class="xgplayer-enter-spinner">
|
|
13
|
-
${barStr}
|
|
14
|
-
</div>`, {}, 'xgplayer-enter');
|
|
15
|
-
root.appendChild(enter)
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export default {
|
|
19
|
-
name: 's_enter',
|
|
20
|
-
method: s_enter
|
|
21
|
-
}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import { addClass, removeClass, createDom } from '../../utils/util'
|
|
2
|
-
import '../style/controls/error.scss'
|
|
3
|
-
|
|
4
|
-
let s_error = function () {
|
|
5
|
-
let player = this
|
|
6
|
-
let root = player.root
|
|
7
|
-
|
|
8
|
-
let error = createDom('xg-error', '<span class="xgplayer-error-text">请<span class="xgplayer-error-refresh">刷新</span>试试</span>', {}, 'xgplayer-error')
|
|
9
|
-
player.once('ready', () => {
|
|
10
|
-
root.appendChild(error)
|
|
11
|
-
});
|
|
12
|
-
|
|
13
|
-
let text = error.querySelector('.xgplayer-error-text')
|
|
14
|
-
if (player.config.lang && player.config.lang === 'zh-cn') {
|
|
15
|
-
text.innerHTML = player.config.errorTips || `请<span class="xgplayer-error-refresh">刷新</span>试试`
|
|
16
|
-
} else {
|
|
17
|
-
text.innerHTML = player.config.errorTips || `please try to <span class="xgplayer-error-refresh">refresh</span>`
|
|
18
|
-
}
|
|
19
|
-
let refresh = null
|
|
20
|
-
|
|
21
|
-
function onError () {
|
|
22
|
-
// player.controls.style.display = 'none'
|
|
23
|
-
// if (player.error) {
|
|
24
|
-
// text.innerHTML = player.error
|
|
25
|
-
// } else {
|
|
26
|
-
|
|
27
|
-
// }
|
|
28
|
-
addClass(player.root, 'xgplayer-is-error')
|
|
29
|
-
refresh = error.querySelector('.xgplayer-error-refresh')
|
|
30
|
-
if (refresh) {
|
|
31
|
-
['touchend', 'click'].forEach(item => {
|
|
32
|
-
refresh.addEventListener(item, function (e) {
|
|
33
|
-
e.preventDefault()
|
|
34
|
-
e.stopPropagation()
|
|
35
|
-
player.autoplay = true
|
|
36
|
-
let currentTime = player.currentTime
|
|
37
|
-
player.once('playing', () => {
|
|
38
|
-
player.currentTime = currentTime
|
|
39
|
-
removeClass(player.root, 'xgplayer-is-error')
|
|
40
|
-
})
|
|
41
|
-
player.src = player.config.url
|
|
42
|
-
})
|
|
43
|
-
})
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
player.on('error', onError)
|
|
47
|
-
function onDestroy () {
|
|
48
|
-
player.off('error', onError)
|
|
49
|
-
player.off('destroy', onDestroy)
|
|
50
|
-
}
|
|
51
|
-
player.once('destroy', onDestroy)
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
export default {
|
|
55
|
-
name: 's_error',
|
|
56
|
-
method: s_error
|
|
57
|
-
}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { createDom } from '../../utils/util'
|
|
2
|
-
import '../style/controls/placeholder.scss'
|
|
3
|
-
|
|
4
|
-
let s_flex = function () {
|
|
5
|
-
let player = this
|
|
6
|
-
let playceholder = createDom('xg-placeholder', '', {}, 'xgplayer-placeholder')
|
|
7
|
-
player.controls.appendChild(playceholder)
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export default {
|
|
11
|
-
name: 's_flex',
|
|
12
|
-
method: s_flex
|
|
13
|
-
}
|