mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-27 09:41:20 -08:00
Refactor Artplayer class to update video URLs with query parameters
This commit is contained in:
1 parent
945ff841d5
commit
395747f88f
7 files changed
+52
-60
No files matched your search
@@ -15,7 +15,7 @@ function uniqBy(array, property) {
|
||||
export default function artplayerPluginHlsControl(option = {}) {
|
||||
return (art) => {
|
||||
const { $video } = art.template;
|
||||
const { errorHandle, query, queryAll, inverseClass } = art.constructor.utils;
|
||||
const { errorHandle } = art.constructor.utils;
|
||||
|
||||
function updateQuality(hls) {
|
||||
if (!hls.levels.length) return;
|
||||
@@ -59,13 +59,9 @@ export default function artplayerPluginHlsControl(option = {}) {
|
||||
style: { padding: '0 10px' },
|
||||
selector: selector,
|
||||
onSelect: onSelect,
|
||||
mounted: ($control) => {
|
||||
mounted: () => {
|
||||
art.on('artplayerPluginHlsControl:quality', (item) => {
|
||||
const $value = query('.art-selector-value', $control);
|
||||
const $items = queryAll('.art-selector-item', $control);
|
||||
$value.innerHTML = item.html;
|
||||
const $item = $items.find((element) => Number(element.dataset.value) === item.value);
|
||||
inverseClass($item, 'art-current');
|
||||
art.controls.check(item);
|
||||
});
|
||||
},
|
||||
});
|
||||
@@ -126,13 +122,9 @@ export default function artplayerPluginHlsControl(option = {}) {
|
||||
style: { padding: '0 10px' },
|
||||
selector: selector,
|
||||
onSelect: onSelect,
|
||||
mounted: ($control) => {
|
||||
mounted: () => {
|
||||
art.on('artplayerPluginHlsControl:audio', (item) => {
|
||||
const $value = query('.art-selector-value', $control);
|
||||
const $items = queryAll('.art-selector-item', $control);
|
||||
$value.innerHTML = item.html;
|
||||
const $item = $items.find((element) => Number(element.dataset.value) === item.value);
|
||||
inverseClass($item, 'art-current');
|
||||
art.controls.check(item);
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
@@ -218,8 +218,15 @@ export default class Control extends Component {
|
||||
super.add(option);
|
||||
}
|
||||
|
||||
check(item) {
|
||||
//
|
||||
check(target) {
|
||||
target.$value.innerHTML = target.html;
|
||||
for (let index = 0; index < target.$option.length; index++) {
|
||||
const item = target.$option[index];
|
||||
item.default = item === target;
|
||||
if (item.default) {
|
||||
inverseClass(item.$ref, 'art-current');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
selector(option, $ref, events) {
|
||||
@@ -246,7 +253,14 @@ export default class Control extends Component {
|
||||
$item.innerHTML = item.html;
|
||||
append($list, $item);
|
||||
|
||||
def(item, '$item', {
|
||||
def(item, '$option', {
|
||||
configurable: true,
|
||||
get() {
|
||||
return option.selector;
|
||||
},
|
||||
});
|
||||
|
||||
def(item, '$ref', {
|
||||
configurable: true,
|
||||
get() {
|
||||
return $item;
|
||||
@@ -259,13 +273,6 @@ export default class Control extends Component {
|
||||
return $value;
|
||||
},
|
||||
});
|
||||
|
||||
def(item, '$list', {
|
||||
configurable: true,
|
||||
get() {
|
||||
return $list;
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const setLeft = () => {
|
||||
@@ -281,10 +288,8 @@ export default class Control extends Component {
|
||||
const path = event.composedPath() || [];
|
||||
const $item = path.find((item) => hasClass(item, 'art-selector-item'));
|
||||
if (!$item) return;
|
||||
inverseClass($item, 'art-current');
|
||||
const index = Number($item.dataset.index);
|
||||
const find = option.selector[index] || {};
|
||||
$value.innerText = $item.innerText;
|
||||
const find = option.selector[$item.dataset.index];
|
||||
this.check(find);
|
||||
if (option.onSelect) {
|
||||
$value.innerHTML = await option.onSelect.call(this.art, find, $item, event);
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user