2 files changed, 13 insertions, 6 deletions
diff --git a/public/assets/js/lib/views/details/audio.js b/public/assets/js/lib/views/details/audio.js
index 1c2f6f0..4fd02aa 100644
--- a/public/assets/js/lib/views/details/audio.js
+++ b/public/assets/js/lib/views/details/audio.js
@@ -79,8 +79,11 @@ const audio = (function () {
   };
 
   audio.play = function (index) {
-    playing = true;
     current_index = (parseInt(index) + music.length) % music.length;
+    if (!music[current_index]) {
+      return;
+    }
+    playing = true;
     audio.el.src = music[current_index].href;
     audio.el.play();
     audio.set_cursor();
@@ -99,7 +102,7 @@ const audio = (function () {
   audio.toggle = function () {
     if (audio.el.paused) {
       audio.el.play();
-      if (ui) {
+      if (ui && music[current_index]) {
         ui.onPlay(music[current_index]);
       }
     } else {
@@ -139,6 +142,7 @@ const audio = (function () {
       return;
     }
     if (app.typing || event.ctrlKey || event.altKey || event.metaKey) return;
+    if (!music[current_index]) return;
     switch (event.keyCode) {
       case 37: // left
         if (event.shiftKey) {
diff --git a/public/assets/js/lib/views/details/audioPlayer.js b/public/assets/js/lib/views/details/audioPlayer.js
index f31a8b3..8075dc7 100644
--- a/public/assets/js/lib/views/details/audioPlayer.js
+++ b/public/assets/js/lib/views/details/audioPlayer.js
@@ -8,7 +8,7 @@ const AudioPlayer = View.extend({
   initialize: function () {
     this.$title = this.$(".title");
 
-    this.icon_el = this.$(".icon").get(0);
+    this.button_el = this.$(".icon").get(0);
     this.pos_el = this.$(".pos").get(0);
     this.track_el = this.$(".track").get(0);
     this.dot_el = this.$(".dot").get(0);
@@ -17,6 +17,7 @@ const AudioPlayer = View.extend({
     this.mousedown = this.mousedown.bind(this);
     this.mousemove = this.mousemove.bind(this);
     this.mouseup = this.mouseup.bind(this);
+    this.toggle = this.toggle.bind(this);
 
     if (is_mobile) {
       this.pos_el.addEventListener("touchstart", (e) =>
@@ -46,6 +47,8 @@ const AudioPlayer = View.extend({
     const track_left = this.pos_el.offsetLeft;
     this.down = true;
     this.mousex = (e.pageX - track_left) / this.track_el.offsetWidth;
+    this.dot_el.style.transform =
+      "translateX(" + this.mousex * this.track_el.offsetWidth + "px)";
   },
 
   mousemove: function (e, isTouch) {
@@ -82,8 +85,8 @@ const AudioPlayer = View.extend({
       this.$el.addClass("active");
     }
     // if (index === music.length) return stop();
-    if (!this.icon_el.classList.contains("active")) {
-      this.icon_el.classList.add("active");
+    if (!this.button_el.classList.contains("active")) {
+      this.button_el.classList.add("active");
     }
     this.onTimeUpdate();
 
@@ -93,7 +96,7 @@ const AudioPlayer = View.extend({
   },
 
   onPause: function () {
-    this.icon_el.classList.remove("active");
+    this.button_el.classList.remove("active");
   },
 
   onStop: function () {