Update devDependencies; Fix volume api bug
This commit is contained in:
DIYgod
parent
943019e9b0
commit
f9750a6a3e
|
|
@ -73,7 +73,6 @@
|
|||
maximum: 3000
|
||||
}
|
||||
});
|
||||
// dp.init();
|
||||
|
||||
// stats.js: JavaScript Performance Monitor
|
||||
var stats = new Stats();
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -24,18 +24,18 @@
|
|||
},
|
||||
"homepage": "https://github.com/DIYgod/DPlayer#readme",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^6.3.7",
|
||||
"autoprefixer": "^6.4.0",
|
||||
"babel-loader": "^6.2.4",
|
||||
"babel-preset-es2015": "^6.9.0",
|
||||
"babel-preset-es2015": "^6.13.2",
|
||||
"css-loader": "^0.23.1",
|
||||
"exports-loader": "^0.6.3",
|
||||
"file-loader": "^0.9.0",
|
||||
"node-sass": "^3.8.0",
|
||||
"postcss-loader": "^0.9.1",
|
||||
"postcss-loader": "^0.10.0",
|
||||
"sass-loader": "^4.0.0",
|
||||
"style-loader": "^0.13.1",
|
||||
"url-loader": "^0.5.7",
|
||||
"webpack": "^1.13.1",
|
||||
"webpack-dev-server": "^1.9.0"
|
||||
"webpack-dev-server": "^1.14.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -119,7 +119,9 @@ class DPlayer {
|
|||
<video class="dplayer-video" ${option.video.pic ? `poster="${option.video.pic}"` : ``} ${option.screenshot ? `crossorigin="anonymous"` : ``}>
|
||||
<source src="${option.video.url}">
|
||||
</video>
|
||||
<div class="dplayer-danmaku"></div>
|
||||
<div class="dplayer-danmaku">
|
||||
<div class="dplayer-danmaku-item dplayer-danmaku-item--demo"></div>
|
||||
</div>
|
||||
<div class="dplayer-bezel">
|
||||
<span class="dplayer-bezel-icon"></span>
|
||||
${option.danmaku ? `<span class="dplayer-danloading">${getTran('Danmaku is loading')}</span>` : ``}
|
||||
|
|
@ -687,7 +689,7 @@ class DPlayer {
|
|||
showdan = false;
|
||||
if (option.danmaku) {
|
||||
clearInterval(danmakuTime);
|
||||
danContainer.innerHTML = '';
|
||||
danContainer.innerHTML = `<div class="dplayer-danmaku-item dplayer-danmaku-item--demo"></div>`;
|
||||
}
|
||||
}
|
||||
closeSetting();
|
||||
|
|
@ -860,6 +862,8 @@ class DPlayer {
|
|||
}
|
||||
};
|
||||
|
||||
const itemDemo = this.element.getElementsByClassName('dplayer-danmaku-item')[0];
|
||||
|
||||
const danmakuIn = (text, color, type) => {
|
||||
danWidth = danContainer.offsetWidth;
|
||||
danHeight = danContainer.offsetHeight;
|
||||
|
|
@ -870,11 +874,13 @@ class DPlayer {
|
|||
item.innerHTML = text;
|
||||
item.style.opacity = danOpacity;
|
||||
item.style.color = color;
|
||||
item.addEventListener('animationend', () => {
|
||||
danContainer.removeChild(item);
|
||||
});
|
||||
|
||||
// insert
|
||||
danContainer.appendChild(item);
|
||||
|
||||
let itemWidth = item.offsetWidth;
|
||||
// measure
|
||||
itemDemo.innerHTML = text;
|
||||
let itemWidth = itemDemo.offsetWidth;
|
||||
|
||||
// adjust
|
||||
switch (type) {
|
||||
|
|
@ -882,26 +888,20 @@ class DPlayer {
|
|||
item.style.top = itemHeight * getTunnel(item, type, itemWidth) + 'px';
|
||||
item.style.width = (itemWidth + 1) + 'px';
|
||||
item.style.transform = `translateX(-${danWidth}px)`;
|
||||
item.addEventListener('animationend', () => {
|
||||
danContainer.removeChild(item);
|
||||
});
|
||||
break;
|
||||
case 'top':
|
||||
item.style.top = itemHeight * getTunnel(item, type) + 'px';
|
||||
item.addEventListener('animationend', () => {
|
||||
danContainer.removeChild(item);
|
||||
});
|
||||
break;
|
||||
case 'bottom':
|
||||
item.style.bottom = itemHeight * getTunnel(item, type) + 'px';
|
||||
item.addEventListener('animationend', () => {
|
||||
danContainer.removeChild(item);
|
||||
});
|
||||
break;
|
||||
default:
|
||||
console.error(`Can't handled danmaku type: ${type}`);
|
||||
}
|
||||
|
||||
// insert
|
||||
danContainer.appendChild(item);
|
||||
|
||||
// move
|
||||
item.classList.add(`dplayer-danmaku-move`);
|
||||
};
|
||||
|
|
@ -1100,12 +1100,15 @@ class DPlayer {
|
|||
|
||||
this.element.addEventListener('fullscreenchange', () => {
|
||||
resetAnimation();
|
||||
console.log(danContainer.offsetHeight);
|
||||
});
|
||||
this.element.addEventListener('mozfullscreenchange', () => {
|
||||
resetAnimation();
|
||||
console.log(danContainer.offsetHeight);
|
||||
});
|
||||
this.element.addEventListener('webkitfullscreenchange', () => {
|
||||
resetAnimation();
|
||||
console.log(danContainer.offsetHeight);
|
||||
});
|
||||
this.element.getElementsByClassName('dplayer-full-icon')[0].addEventListener('click', () => {
|
||||
if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement) {
|
||||
|
|
@ -1254,10 +1257,10 @@ class DPlayer {
|
|||
volume(percentage) {
|
||||
percentage = percentage > 0 ? percentage : 0;
|
||||
percentage = percentage < 1 ? percentage : 1;
|
||||
this.updateBar('volume', percentage, 'height');
|
||||
this.audio.volume = percentage;
|
||||
if (this.audio.muted) {
|
||||
this.audio.muted = false;
|
||||
this.updateBar('volume', percentage, 'width');
|
||||
this.video.volume = percentage;
|
||||
if (this.video.muted) {
|
||||
this.video.muted = false;
|
||||
}
|
||||
this.switchVolumeIcon();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -139,6 +139,11 @@
|
|||
white-space: nowrap;
|
||||
font-weight: bolder;
|
||||
text-shadow: .5px .5px .5px rgba(0,0,0,.5);
|
||||
|
||||
&--demo {
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-danmaku-right {
|
||||
|
|
|
|||
Loading…
Reference in New Issue