revert play promise

This commit is contained in:
DIYgod 2018-03-20 00:27:54 +08:00
parent ddcf4612c2
commit 6b06032c16
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
2 changed files with 99 additions and 111 deletions

View File

@ -43,6 +43,7 @@
font-size: 18px;
}
</style>
<script src="https://cdn.jsdelivr.net/npm/vconsole/dist/vconsole.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/hls.js/dist/hls.min.js"></script>
<script src="APlayer.js"></script>
<script src="https://cdn.jsdelivr.net/npm/color-thief-don@2.0.2/src/color-thief.js"></script>
@ -96,6 +97,9 @@
<div id="player6" class="aplayer"></div>
<div id="player7" class="aplayer"></div>
</div>
<script>
var vConsole = new VConsole();
</script>
<script src="demo.js"></script>
</body>
</html>

View File

@ -195,91 +195,83 @@ class APlayer {
}
switchAudio (index) {
this.handlePlayPromise(() => {
this.events.trigger('switchaudio', index);
if (typeof index !== 'undefined') {
this.playIndex = index;
}
this.events.trigger('switchaudio', index);
if (typeof index !== 'undefined') {
this.playIndex = index;
}
const audio = this.options.audio[this.playIndex];
// set html
if (audio.cover) {
this.template.pic.style.backgroundImage = `url('${audio.cover}')`;
const audio = this.options.audio[this.playIndex];
// set html
if (audio.cover) {
this.template.pic.style.backgroundImage = `url('${audio.cover}')`;
}
else {
this.template.pic.style.backgroundImage = '';
}
this.theme();
this.template.title.innerHTML = audio.name;
this.template.author.innerHTML = audio.artist ? ' - ' + audio.artist : '';
const light = this.container.getElementsByClassName('aplayer-list-light')[0];
if (light) {
light.classList.remove('aplayer-list-light');
}
this.container.querySelectorAll('.aplayer-list li')[this.playIndex].classList.add('aplayer-list-light');
this.template.list.scrollTop = this.playIndex * 33;
// mse
if (this.hls) {
this.hls.destroy();
this.hls = null;
}
let type = audio.type;
if (this.options.customAudioType && this.options.customAudioType[type]) {
if (Object.prototype.toString.call(this.options.customAudioType[type]) === '[object Function]') {
this.options.customAudioType[type](this.audio, audio, this);
}
else {
this.template.pic.style.backgroundImage = '';
console.error(`Illegal customType: ${type}`);
}
this.theme();
this.template.title.innerHTML = audio.name;
this.template.author.innerHTML = audio.artist ? ' - ' + audio.artist : '';
const light = this.container.getElementsByClassName('aplayer-list-light')[0];
if (light) {
light.classList.remove('aplayer-list-light');
}
this.container.querySelectorAll('.aplayer-list li')[this.playIndex].classList.add('aplayer-list-light');
this.template.list.scrollTop = this.playIndex * 33;
// mse
if (this.hls) {
this.hls.destroy();
this.hls = null;
}
let type = audio.type;
if (this.options.customAudioType && this.options.customAudioType[type]) {
if (Object.prototype.toString.call(this.options.customAudioType[type]) === '[object Function]') {
this.options.customAudioType[type](this.audio, audio, this);
}
else {
if (!type || type === 'auto') {
if (/m3u8(#|\?|$)/i.exec(audio.url)) {
type = 'hls';
}
else {
console.error(`Illegal customType: ${type}`);
type = 'normal';
}
}
else {
if (!type || type === 'auto') {
if (/m3u8(#|\?|$)/i.exec(audio.url)) {
type = 'hls';
}
else {
type = 'normal';
}
if (type === 'hls') {
if (Hls.isSupported()) {
this.hls = new Hls();
this.hls.loadSource(audio.url);
this.hls.attachMedia(this.audio);
}
if (type === 'hls') {
if (Hls.isSupported()) {
this.hls = new Hls();
this.hls.loadSource(audio.url);
this.hls.attachMedia(this.audio);
}
else if (this.audio.canPlayType('application/x-mpegURL') || this.audio.canPlayType('application/vnd.apple.mpegURL')) {
this.audio.src = audio.url;
}
else {
this.notice('Error: HLS is not supported.');
}
}
else if (type === 'normal') {
else if (this.audio.canPlayType('application/x-mpegURL') || this.audio.canPlayType('application/vnd.apple.mpegURL')) {
this.audio.src = audio.url;
}
else {
this.notice('Error: HLS is not supported.');
}
}
this.seek(0);
let playPromise;
if (!this.paused) {
playPromise = Promise.resolve(this.audio.play()).catch((err) => {
console.error(err);
this.pause();
});
else if (type === 'normal') {
this.audio.src = audio.url;
}
}
this.lrc && this.lrc.switch(this.playIndex);
this.seek(0);
// set duration time
if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first
this.template.dtime.innerHTML = this.audio.duration ? utils.secondToTime(this.audio.duration) : '00:00';
}
if (!this.paused) {
this.audio.play();
}
return playPromise;
});
this.lrc && this.lrc.switch(this.playIndex);
// set duration time
if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first
this.template.dtime.innerHTML = this.audio.duration ? utils.secondToTime(this.audio.duration) : '00:00';
}
}
theme (color = this.options.audio[this.playIndex].theme, index = this.playIndex) {
@ -311,54 +303,52 @@ class APlayer {
}
play () {
this.handlePlayPromise(() => {
if (this.paused) {
this.paused = false;
this.template.button.classList.remove('aplayer-play');
this.template.button.classList.add('aplayer-pause');
this.template.button.innerHTML = '';
setTimeout(() => {
this.template.button.innerHTML = Icons.pause;
}, 100);
}
if (this.paused) {
this.paused = false;
this.template.button.classList.remove('aplayer-play');
this.template.button.classList.add('aplayer-pause');
this.template.button.innerHTML = '';
setTimeout(() => {
this.template.button.innerHTML = Icons.pause;
}, 100);
}
const playPromise = Promise.resolve(this.audio.play()).catch((err) => {
console.error(err);
this.pause();
const playPromise = this.audio.play();
if (playPromise) {
playPromise.catch((e) => {
if (e.name === 'NotAllowedError') {
this.pause();
}
});
}
this.timer.enable('loading');
this.timer.enable('loading');
if (this.options.mutex) {
for (let i = 0; i < instances.length; i++) {
if (this !== instances[i]) {
instances[i].pause();
}
if (this.options.mutex) {
for (let i = 0; i < instances.length; i++) {
if (this !== instances[i]) {
instances[i].pause();
}
}
return playPromise;
});
}
}
pause () {
this.handlePlayPromise(() => {
if (!this.paused) {
this.paused = true;
if (!this.paused) {
this.paused = true;
this.template.button.classList.remove('aplayer-pause');
this.template.button.classList.add('aplayer-play');
this.template.button.innerHTML = '';
setTimeout(() => {
this.template.button.innerHTML = Icons.play;
}, 100);
}
this.template.button.classList.remove('aplayer-pause');
this.template.button.classList.add('aplayer-play');
this.template.button.innerHTML = '';
setTimeout(() => {
this.template.button.innerHTML = Icons.play;
}, 100);
}
this.audio.pause();
this.audio.pause();
this.container.classList.remove('aplayer-loading');
this.timer.disable('loading');
});
this.container.classList.remove('aplayer-loading');
this.timer.disable('loading');
}
switchVolumeIcon () {
@ -541,12 +531,6 @@ class APlayer {
}
}
handlePlayPromise (callback) {
this.playedPromise = this.playedPromise.then(callback).catch((err) => {
console.error(err);
});
}
static get version () {
/* global APLAYER_VERSION */
return APLAYER_VERSION;