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 Zack committed 2018-11-22 16:09:56 +08:00
1 parent 88533c1023
commit 8619fa1b8b
22 files changed
+553 -392
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/setting/flip.js
+34 -42
View File
@@ -1,46 +1,38 @@
import { append, inverseClass } from '../utils';
import { inverseClass } from '../utils';
export default class Flip {
constructor(option) {
this.option = option;
}
apply(art, $setting) {
const {
i18n,
events: { proxy },
player,
} = art;
this.$header = $setting.querySelector('.art-setting-header');
this.$body = $setting.querySelector('.art-setting-body');
this.$btns = append(
this.$body,
`
<div class="art-setting-btns">
<div class="art-setting-btn current">
<span data-flip="normal">${i18n.get('Normal')}</span>
export default function flip(settingOption) {
return art => {
const { i18n, player } = art;
return {
...settingOption,
html: `
<div class="art-setting-btns">
<div class="art-setting-btn current">
<span data-flip="normal">${i18n.get('Normal')}</span>
</div>
<div class="art-setting-btn">
<span data-flip="horizontal">${i18n.get('Horizontal')}</span>
</div>
<div class="art-setting-btn">
<span data-flip="vertical">${i18n.get('Vertical')}</span>
</div>
</div>
<div class="art-setting-btn">
<span data-flip="horizontal">${i18n.get('Horizontal')}</span>
</div>
<div class="art-setting-btn">
<span data-flip="vertical">${i18n.get('Vertical')}</span>
</div>
</div>
`,
);
proxy(this.$btns, 'click', event => {
const { target } = event;
const { flip } = target.dataset;
if (flip) {
player.flip(flip);
}
});
art.on('flipChange', flip => {
const $current = Array.from(this.$btns.querySelectorAll('span')).find(item => item.dataset.flip === flip);
inverseClass($current.parentElement, 'current');
});
}
click: event => {
const { target } = event;
const { flip } = target.dataset;
if (flip) {
player.flip(flip);
}
},
mounted: $setting => {
art.on('flipChange', flip => {
const $current = Array.from($setting.querySelectorAll('span')).find(
item => item.dataset.flip === flip,
);
inverseClass($current.parentElement, 'current');
});
},
};
};
}