Tweak chapter display

2 files changed, 3 insertions, 2 deletions

diff --git a/local.css b/local.css
index 7f5b59f7..7d714bac 100644
--- a/local.css
+++ b/local.css
@@ -84,3 +84,4 @@ summary h1 { display: inline-block }
 
 .vid .resources { margin-bottom: -1em; }
  ol.chapters { list-style-type: none; padding: 0; }
+ .vid figure { margin: 0 }
diff --git a/templates/page.tmpl b/templates/page.tmpl
index 6647f03a..ceaa1049 100644
--- a/templates/page.tmpl
+++ b/templates/page.tmpl
@@ -317,7 +317,6 @@ transcriptDiv.appendChild(transcriptLink)
  // Copyright (c) 2021 Sacha Chua
  // Based on http://thenewcode.com/977/Create-Interactive-HTML5-Video-with-WebVTT-Chapters
  function displayChapters(trackElement){
-   console.log(trackElement);
    if ((trackElement) && (textTrack = trackElement.track)){
      if (textTrack.kind === "chapters"){
        textTrack.mode = 'hidden';
@@ -343,7 +342,7 @@ transcriptDiv.appendChild(transcriptLink)
        textTrack.addEventListener("cuechange",
                                   function() {
                                     var currentLocation = this.activeCues[0].startTime;
-                                    if (chapter = chapterList.querySelector('data-start=[' + currentLocation + ']')) {
+                                    if (chapter = chapterList.querySelector('data-start=["' + currentLocation + '"]')) {
                                       var locations = [].slice.call(chapterList.querySelectorAll("li"));
                                       for (var i = 0; i < locations.length; ++i) { 
                                         locations[i].classList.remove("current");
@@ -354,6 +353,7 @@ transcriptDiv.appendChild(transcriptLink)
      }
    }
  }
+document.querySelectorAll('track[kind=chapters]').forEach(function(e) { displayChapters(e); });
  // @license-end
 </script>
 </body>