diff options
| -rw-r--r-- | mediagoblin/static/js/audio.js | 14 | ||||
| -rw-r--r-- | mediagoblin/templates/mediagoblin/media_displays/audio.html | 6 |
2 files changed, 10 insertions, 10 deletions
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" /> |