separate UI play/pause with audio

paladio · Mar 20, 2018 · 5c9456b · 5c9456b
1 parent 4af7cab
commit 5c9456b
Showing 1 changed file with 24 additions and 15 deletions.
diff --git a/src/js/player.js b/src/js/player.js
@@ -113,13 +113,13 @@ class APlayer {
 
  this.on('play', () => {
  if (this.paused) {
- this.play();
+ this.setUIPlaying();
  }
  });
 
  this.on('pause', () => {
  if (!this.paused) {
- this.pause();
+ this.setUIPaused();
  }
  });
 
@@ -302,7 +302,7 @@ class APlayer {
  this.template.ptime.innerHTML = utils.secondToTime(time);
  }
 
- play () {
+ setUIPlaying () {
  if (this.paused) {
  this.paused = false;
  this.template.button.classList.remove('aplayer-play');
@@ -313,15 +313,6 @@ class APlayer {
  }, 100);
  }
 
- const playPromise = this.audio.play();
- if (playPromise) {
- playPromise.catch((e) => {
- if (e.name === 'NotAllowedError') {
- this.pause();
- }
- });
- }
-
  this.timer.enable('loading');
 
  if (this.options.mutex) {
@@ -333,7 +324,22 @@ class APlayer {
  }
  }
 
- pause () {
+ play () {
+ this.setUIPlaying();
+
+ const playPromise = this.audio.play();
+ if (playPromise) {
+ playPromise.catch((e) => {
+ console.error(e);
+ if (e.name === 'NotAllowedError' ||
+ e.name === 'NotSupportedError') {
+ this.setUIPaused();
+ }
+ });
+ }
+ }
+
+ setUIPaused () {
  if (!this.paused) {
  this.paused = true;
 
@@ -345,12 +351,15 @@ class APlayer {
  }, 100);
  }
 
- this.audio.pause();
-
  this.container.classList.remove('aplayer-loading');
  this.timer.disable('loading');
  }
 
+ pause () {
+ this.setUIPaused();
+ this.audio.pause();
+ }
+
  switchVolumeIcon () {
  if (this.volume() >= 0.95) {
  this.template.volumeButton.innerHTML = Icons.volumeUp;