timestamps.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536
  1. /*jshint esversion: 6 */
  2. (function() {
  3. 'use strict';
  4. function init_timestamps() {
  5. document.querySelectorAll('.video-with-timestamps').forEach(loc => {
  6. if (loc.dataset.inited === 'true') return;
  7. loc.dataset.inited = 'true';
  8. const container_id = loc.id;
  9. const dl = loc.querySelector('dl');
  10. dl.querySelectorAll('dt').forEach(dt => {
  11. dt.innerHTML = '<a href="javascript:void(0)" style="text-decoration: none"><time>' + dt.innerHTML + '</time></a>';
  12. dt.style.display = 'inline';
  13. });
  14. dl.addEventListener('click', handle_timestamp_click.bind(null, container_id));
  15. });
  16. }
  17. function handle_timestamp_click(container_id, e) {
  18. if (e.target.tagName.toUpperCase() === 'TIME') {
  19. const timestamp = e.target.textContent;
  20. if (timestamp) {
  21. const [minutes, seconds] = timestamp.split(':');
  22. const total_seconds = parseInt(minutes) * 60 + parseInt(seconds);
  23. const video = document.querySelector('#' + container_id + ' video');
  24. video.currentTime = total_seconds;
  25. video.play();
  26. }
  27. }
  28. }
  29. init_timestamps();
  30. document.addEventListener('DOMContentloaded', init_timestamps);
  31. })();