Kawiesh

Untitled

Sep 21st, 2020
1,123
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var music = document.getElementById('music'); // id for audio element
  2. var duration = music.duration; // Duration of audio clip, calculated here for embedding purposes
  3. var pButton = document.getElementById('pButton'); // play button
  4. var playhead = document.getElementById('playhead'); // playhead
  5. var timeline = document.getElementById('timeline'); // timeline
  6.  
  7. // timeline width adjusted for playhead
  8. var timelineWidth = timeline.offsetWidth - playhead.offsetWidth;
  9.  
  10. // play button event listenter
  11. pButton.addEventListener("click", play);
  12.  
  13. // timeupdate event listener
  14. music.addEventListener("timeupdate", timeUpdate, false);
  15.  
  16. // makes timeline clickable
  17. timeline.addEventListener("click", function(event) {
  18.     moveplayhead(event);
  19.     music.currentTime = duration * clickPercent(event);
  20. }, false);
  21.  
  22. // returns click as decimal (.77) of the total timelineWidth
  23. function clickPercent(event) {
  24.     return (event.clientX - getPosition(timeline)) / timelineWidth;
  25. }
  26.  
  27. // makes playhead draggable
  28. playhead.addEventListener('mousedown', mouseDown, false);
RAW Paste Data