x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-25 08:01:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

update danmuku demo

Browse Source
This commit is contained in:
Harvey committed 2022-05-13 17:01:29 +08:00
1 parent a3889236be
commit fd40fa71f6
8 files changed
+305 -13
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer-plugin-danmuku/src/danmuku.js
+1 -1
View File
@@ -47,7 +47,7 @@ export default class Danmuku {
return {
danmuku: [],
speed: 5,
margin: [10, 100],
margin: ['2%', '25%'],
opacity: 1,
fontSize: 25,
filter: () => true,
packages/artplayer-plugin-danmuku/src/setting.js
+139 -2
View File
@@ -2,7 +2,7 @@ import danmuOn from 'bundle-text:./img/danmu-on.svg';
import danmuOff from 'bundle-text:./img/danmu-off.svg';
export default function setting(art, danmuku) {
const { addClass, append, setStyle } = art.constructor.utils;
const { addClass, append, setStyle, tooltip } = art.constructor.utils;
function getIcon(svg, key) {
const icon = document.createElement('i');
@@ -37,6 +37,7 @@ export default function setting(art, danmuku) {
mounted($ref) {
append($ref, $danmuOn);
append($ref, $danmuOff);
tooltip($ref, '弹幕开关');
setStyle($danmuOff, 'display', 'none');
},
});
@@ -57,7 +58,7 @@ export default function setting(art, danmuku) {
},
},
{
html: '同步播放速度',
html: '同步视频速度',
icon: '',
switch: danmuku.option.synchronousPlayback,
onSwitch(item) {
@@ -67,6 +68,142 @@ export default function setting(art, danmuku) {
return !item.switch;
},
},
{
width: 200,
html: '播放速度',
icon: '',
tooltip: '适中',
selector: [
{
html: '极慢',
time: 10,
},
{
html: '较慢',
time: 7.5,
},
{
default: true,
html: '适中',
time: 5,
},
{
html: '较快',
time: 2.5,
},
{
html: '极快',
time: 1,
},
],
onSelect: function (item) {
danmuku.config({
speed: item.time,
});
return item.html;
},
},
{
width: 200,
html: '字体大小',
icon: '',
tooltip: '适中',
selector: [
{
html: '极慢',
fontSize: 12,
},
{
html: '较慢',
fontSize: 7.5,
},
{
default: true,
html: '适中',
fontSize: 5,
},
{
html: '较快',
fontSize: 2.5,
},
{
html: '极快',
fontSize: 1,
},
],
onSelect: function (item) {
danmuku.config({
speed: item.time,
});
return item.html;
},
},
{
width: 200,
html: '不透明度',
icon: '',
tooltip: '100%',
selector: [
{
default: true,
opacity: 1,
html: '100%',
},
{
opacity: 0.75,
html: '75%',
},
{
opacity: 0.5,
html: '50%',
},
{
opacity: 0.25,
html: '25%',
},
{
opacity: 0,
html: '0%',
},
],
onSelect: function (item) {
danmuku.config({
opacity: item.opacity,
});
return item.html;
},
},
{
width: 200,
html: '显示范围',
icon: '',
tooltip: '3/4',
selector: [
{
html: '1/4',
margin: ['2%', '75%'],
},
{
html: '半屏',
margin: ['2%', '50%'],
},
{
default: true,
html: '3/4',
margin: ['2%', '75%'],
},
{
html: '满屏',
margin: ['2%', '2%'],
},
],
onSelect: function (item) {
danmuku.config({
margin: item.margin,
});
return item.html;
},
},
],
});
});
packages/artplayer/src/setting/index.js
+5 -1
View File
@@ -154,7 +154,11 @@ export default class Setting extends Component {
append($icon, isHtmlType(item.icon) ? item.icon : icons.config);
break;
case 'selector':
append($icon, item.selector && item.selector.length ? item.icon || icons.config : icons.check);
if (item.selector && item.selector.length) {
append($icon, isHtmlType(item.icon) ? item.icon : icons.config);
} else {
append($icon, icons.check);
}
break;
default:
break;