bezel module

This commit is contained in:
DIYgod 2017-12-24 02:35:38 +08:00
parent 49535a9fb2
commit 7ac02c8303
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
4 changed files with 34 additions and 24 deletions

2
dist/DPlayer.min.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -13,6 +13,7 @@ import User from './user';
import Subtitle from './subtitle';
import Bar from './bar';
import Time from './time';
import Bezel from './bezel';
let index = 0;
const instances = [];
@ -48,6 +49,10 @@ class DPlayer {
if (isMobile) {
this.container.classList.add('dplayer-mobile');
}
this.arrow = this.container.offsetWidth <= 500;
if (this.arrow) {
this.container.classList.add('dplayer-arrow');
}
this.template = new Template({
container: this.container,
@ -57,20 +62,11 @@ class DPlayer {
icons: this.icons
});
this.video = this.template.video;
this.bar = new Bar(this.template);
document.addEventListener('click', () => {
this.focus = false;
}, true);
this.container.addEventListener('click', () => {
this.focus = true;
}, true);
// arrow style
this.arrow = this.container.offsetWidth <= 500;
if (this.arrow) {
this.container.classList.add('dplayer-arrow');
}
this.bezel = new Bezel(this.template.bezel);
if (this.options.danmaku) {
this.danmaku = new Danmaku({
@ -109,12 +105,12 @@ class DPlayer {
});
}
// get this video manager
this.video = this.template.video;
this.template.bezel.addEventListener('animationend', () => {
this.template.bezel.classList.remove('dplayer-bezel-transition');
});
document.addEventListener('click', () => {
this.focus = false;
}, true);
this.container.addEventListener('click', () => {
this.focus = true;
}, true);
// play and pause button
this.paused = true;
@ -691,8 +687,7 @@ class DPlayer {
play () {
this.paused = false;
if (this.video.paused) {
this.template.bezel.innerHTML = this.icons.get('play');
this.template.bezel.classList.add('dplayer-bezel-transition');
this.bezel.switch(this.icons.get('play'));
}
this.template.playButton.innerHTML = this.icons.get('pause');
@ -720,8 +715,7 @@ class DPlayer {
this.container.classList.remove('dplayer-loading');
if (!this.video.paused) {
this.template.bezel.innerHTML = this.icons.get('pause');
this.template.bezel.classList.add('dplayer-bezel-transition');
this.bezel.switch(this.icons.get('pause'));
}
this.ended = false;

16
src/bezel.js Normal file
View File

@ -0,0 +1,16 @@
class Bezel {
constructor (container) {
this.container = container;
this.container.addEventListener('animationend', () => {
this.container.classList.remove('dplayer-bezel-transition');
});
}
switch (icon) {
this.container.innerHTML = icon;
this.container.classList.add('dplayer-bezel-transition');
}
}
module.exports = Bezel;