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

提取共用方法

Browse Source
This commit is contained in:
Harvey committed 2019-11-14 10:11:03 +08:00
1 parent 48ade99047
commit 7a84c262da
45 files changed
+242 -257
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/setting/aspectRatio.js
+7 -7
View File
@@ -1,10 +1,10 @@
import { inverseClass } from '../utils';
import { inverseClass, queryAll } from '../utils';
export default function aspectRatio(settingOption) {
export default function aspectRatio(option) {
return art => {
const { i18n, player } = art;
return {
...settingOption,
...option,
html: `
<div class="art-setting-header">${i18n.get('Aspect ratio')}</div>
<div class="art-setting-radio">
@@ -27,10 +27,10 @@ export default function aspectRatio(settingOption) {
},
mounted: $setting => {
art.on('aspectRatioChange', ratio => {
const $current = Array.from($setting.querySelectorAll('button')).find(
item => item.dataset.value === ratio,
);
inverseClass($current.parentElement, 'current');
const $current = queryAll('button', $setting).find(item => item.dataset.value === ratio);
if ($current) {
inverseClass($current.parentElement, 'current');
}
});
},
};
packages/artplayer/src/setting/flip.js
+7 -7
View File
@@ -1,10 +1,10 @@
import { inverseClass } from '../utils';
import { inverseClass, queryAll } from '../utils';
export default function flip(settingOption) {
export default function flip(option) {
return art => {
const { i18n, player } = art;
return {
...settingOption,
...option,
html: `
<div class="art-setting-header">${i18n.get('Flip')}</div>
<div class="art-setting-radio">
@@ -27,10 +27,10 @@ export default function flip(settingOption) {
},
mounted: $setting => {
art.on('flipChange', flip => {
const $current = Array.from($setting.querySelectorAll('button')).find(
item => item.dataset.value === flip,
);
inverseClass($current.parentElement, 'current');
const $current = queryAll('button', $setting).find(item => item.dataset.value === flip);
if ($current) {
inverseClass($current.parentElement, 'current');
}
});
},
};
packages/artplayer/src/setting/index.js
+3 -2
View File
@@ -1,3 +1,4 @@
import { addClass, removeClass } from '../utils';
import component from '../utils/component';
import flip from './flip';
import aspectRatio from './aspectRatio';
@@ -64,11 +65,11 @@ export default class Setting {
const { $player } = this.art.template;
if (value) {
this.state = true;
$player.classList.add('artplayer-setting-show');
addClass($player, 'artplayer-setting-show');
this.art.emit('setting:show');
} else {
this.state = false;
$player.classList.remove('artplayer-setting-show');
removeClass($player, 'artplayer-setting-show');
this.art.emit('setting:hide');
}
}
packages/artplayer/src/setting/playbackRate.js
+6 -4
View File
@@ -1,4 +1,6 @@
export default function playbackRate(settingOption) {
import { query } from '../utils';
export default function playbackRate(option) {
return art => {
const {
i18n,
@@ -6,7 +8,7 @@ export default function playbackRate(settingOption) {
events: { proxy },
} = art;
return {
...settingOption,
...option,
html: `
<div class="art-setting-header">
${i18n.get('Play speed')}: <span class="art-subtitle-value">1.0</span>x
@@ -16,8 +18,8 @@ export default function playbackRate(settingOption) {
</div>
`,
mounted: $setting => {
const $range = $setting.querySelector('.art-setting-range input');
const $value = $setting.querySelector('.art-subtitle-value');
const $range = query('.art-setting-range input', $setting);
const $value = query('.art-subtitle-value', $setting);
proxy($range, 'change', () => {
const { value } = $range;
$value.innerText = value;