From d13a447a859d8552ad98d3e550cc4cc909630ccd Mon Sep 17 00:00:00 2001
From: Sam Davies <sam@kodeco.com>
Date: Fri, 16 Aug 2024 14:35:21 +0100
Subject: [PATCH] WEB-7285: Remove headers from transcripts

And rename some JS files
---
 .../javascript/{highlight.pack.js => highlight.min.js}   | 0
 .../public/javascript/{timestamps.js => transcripts.js}  | 9 +++++++++
 app/server/views/books/layout.html.erb                   | 2 +-
 app/server/views/content_modules/layout.html.erb         | 4 ++--
 app/server/views/videos/layout.html.erb                  | 4 ++--
 5 files changed, 14 insertions(+), 5 deletions(-)
 rename app/server/public/javascript/{highlight.pack.js => highlight.min.js} (100%)
 rename app/server/public/javascript/{timestamps.js => transcripts.js} (71%)

diff --git a/app/server/public/javascript/highlight.pack.js b/app/server/public/javascript/highlight.min.js
similarity index 100%
rename from app/server/public/javascript/highlight.pack.js
rename to app/server/public/javascript/highlight.min.js
diff --git a/app/server/public/javascript/timestamps.js b/app/server/public/javascript/transcripts.js
similarity index 71%
rename from app/server/public/javascript/timestamps.js
rename to app/server/public/javascript/transcripts.js
index 659c13b..9cf30f0 100644
--- a/app/server/public/javascript/timestamps.js
+++ b/app/server/public/javascript/transcripts.js
@@ -20,4 +20,13 @@ window.addEventListener('DOMContentLoaded', (event) => {
     element.classList.add('video-timestamp');
     element.innerHTML = displayTime(element.dataset.videoTimestamp);
   });
+
+  // Remove all headers(titles) in DOM
+  const transcriptContainer = document.querySelector('.transcript-segment');
+  const headers = transcriptContainer.querySelectorAll('h1, h2, h3, h4, h5, h6');
+  [...headers].forEach((hd) => {
+    if (!hd.classList.contains('segment-header')) {
+      hd.remove();
+    }
+  });
 });
diff --git a/app/server/views/books/layout.html.erb b/app/server/views/books/layout.html.erb
index f9d9e63..c81db28 100644
--- a/app/server/views/books/layout.html.erb
+++ b/app/server/views/books/layout.html.erb
@@ -9,7 +9,7 @@
 
     <link rel="stylesheet" href="/styles.css">
     <script src="/javascript/dark-mode-toggle.js"></script>
-    <script src="/javascript/highlight.pack.js"></script>
+    <script src="/javascript/highlight.min.js"></script>
     <script>hljs.initHighlightingOnLoad();</script>
   </head>
 
diff --git a/app/server/views/content_modules/layout.html.erb b/app/server/views/content_modules/layout.html.erb
index 30fc796..22aafbd 100644
--- a/app/server/views/content_modules/layout.html.erb
+++ b/app/server/views/content_modules/layout.html.erb
@@ -8,8 +8,8 @@
     <meta name="description" content="robles Local Rendering engine">
 
     <link rel="stylesheet" href="/styles.css">
-    <script src="/javascript/timestamps.js"></script>
-    <script src="/javascript/highlight.pack.js"></script>
+    <script src="/javascript/transcripts.js"></script>
+    <script src="/javascript/highlight.min.js"></script>
     <script>hljs.initHighlightingOnLoad();</script>
   </head>
 
diff --git a/app/server/views/videos/layout.html.erb b/app/server/views/videos/layout.html.erb
index 30fc796..22aafbd 100644
--- a/app/server/views/videos/layout.html.erb
+++ b/app/server/views/videos/layout.html.erb
@@ -8,8 +8,8 @@
     <meta name="description" content="robles Local Rendering engine">
 
     <link rel="stylesheet" href="/styles.css">
-    <script src="/javascript/timestamps.js"></script>
-    <script src="/javascript/highlight.pack.js"></script>
+    <script src="/javascript/transcripts.js"></script>
+    <script src="/javascript/highlight.min.js"></script>
     <script>hljs.initHighlightingOnLoad();</script>
   </head>