From: Boris Bobrov <breton@cynicmansion.ru>
Date: Sun, 2 Apr 2017 17:50:33 +0000 (+0300)
Subject: Move audio html out of js
X-Git-Url: https://vcs.fsf.org/?a=commitdiff_plain;h=638ea75648c28e1df988677412271b86b673db89;p=mediagoblin.git

Move audio html out of js
---

diff --git a/mediagoblin/static/js/audio.js b/mediagoblin/static/js/audio.js
index 50d58cd9..909307f6 100644
--- a/mediagoblin/static/js/audio.js
+++ b/mediagoblin/static/js/audio.js
@@ -116,6 +116,10 @@ var audioPlayer = new Object();
         var im = audioPlayer.imageElement;
         var pos = (e.offsetX || e.originalEvent.layerX) / im.width();
 
+	console.log('pos', (e.offsetX || e.originalEvent.layerX) / im.width())
+	console.log('setting current time to',
+			pos * audioPlayer.audioElement.duration)
+
         audioPlayer.audioElement.currentTime = pos * audioPlayer.audioElement.duration;
         audioPlayer.audioElement.play();
         audioPlayer.setState(audioPlayer.PLAYING);
@@ -200,19 +204,9 @@ var audioPlayer = new Object();
          * Attach the player to an image element
          */
         console.log(imageElement);
-
         var im = $(imageElement);
-
         audioPlayer.imageElement = im;
 
-        $('<div class="playhead"></div>').appendTo(im.parent());
-        $('<div class="buffered-indicators"></div>').appendTo(im.parent());
-        $('<div class="seekbar"></div>').appendTo(im.parent());
-        $('<div class="audio-control-play-pause paused">▶</div>').appendTo(im.parent());
-        $('<div class="audio-currentTime">00:00</div>').appendTo(im.parent());
-        $('<input type="range" class="audio-volume"'
-                +'value="1" min="0" max="1" step="0.001" />').appendTo(im.parent());
-        $('.audio-spectrogram').trigger('attachedControls');
     };
 })(audioPlayer);
 
diff --git a/mediagoblin/templates/mediagoblin/media_displays/audio.html b/mediagoblin/templates/mediagoblin/media_displays/audio.html
index 7571f863..4e7f9f82 100644
--- a/mediagoblin/templates/mediagoblin/media_displays/audio.html
+++ b/mediagoblin/templates/mediagoblin/media_displays/audio.html
@@ -30,6 +30,12 @@
     <div class="audio-media">
       {% if 'spectrogram' in media.media_files %}
         <div class="audio-spectrogram">
+          <div class="playhead"></div>
+          <div class="buffered-indicators"></div>
+          <div class="seekbar"></div>
+          <div class="audio-control-play-pause paused">▶</div>
+          <div class="audio-currentTime">00:00</div>
+          <input type="range" class="audio-volume" value="1" min="0" max="1" step="0.001" />
 	  <img src="{{ request.app.public_store.file_url(
 		        media.media_files.spectrogram) }}"
 	       alt="Spectrogram" />