From 0f1d1254133f814ed673070a1dc1416059eea6c2 Mon Sep 17 00:00:00 2001
From: ElementalAlchemist <ElementAlchemist7@gmail.com>
Date: Tue, 14 Nov 2023 19:26:12 -0600
Subject: [PATCH] Fix jumping to the first chapter marker location (#363)

---
 thrimbletrimmer/edit.html       |  1 +
 thrimbletrimmer/scripts/edit.js | 34 ++++++++++++++++++++++-----------
 2 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/thrimbletrimmer/edit.html b/thrimbletrimmer/edit.html
index c59aa40..13966fe 100644
--- a/thrimbletrimmer/edit.html
+++ b/thrimbletrimmer/edit.html
@@ -179,6 +179,7 @@
 										alt="Play from chapter start time"
 										title="Play from chapter start time"
 										class="range-definition-chapter-marker-play-start click"
+										id="range-definition-chapter-marker-first-play-start"
 									/>
 								</div>
 								<input
diff --git a/thrimbletrimmer/scripts/edit.js b/thrimbletrimmer/scripts/edit.js
index 437cfff..245915e 100644
--- a/thrimbletrimmer/scripts/edit.js
+++ b/thrimbletrimmer/scripts/edit.js
@@ -689,6 +689,16 @@ async function initializeVideoInfo() {
 				rangeEndField.value = videoHumanTimeFromWubloaderTime(globalEndTimeString);
 			}
 		}
+
+		const firstChapterPlayFromStartTime = document.getElementById(
+			"range-definition-chapter-marker-first-play-start",
+		);
+		if (canEditMetadata()) {
+			firstChapterPlayFromStartTime.addEventListener("click", chapterMarkerPlayStartTimeHandler);
+		} else {
+			firstChapterPlayFromStartTime.classList.add("hidden");
+		}
+
 		rangeDataUpdated();
 		videoElement.removeEventListener("loadedmetadata", handleInitialSetupForDuration);
 	};
@@ -1581,17 +1591,7 @@ function chapterMarkerDefinitionDOM() {
 	playFromStartTime.classList.add("click");
 
 	if (canEditMetadata()) {
-		playFromStartTime.addEventListener("click", (event) => {
-			const chapterContainer = event.currentTarget.parentElement;
-			const startTimeField = chapterContainer.getElementsByClassName(
-				"range-definition-chapter-marker-start",
-			)[0];
-			const newVideoTime = videoPlayerTimeFromVideoHumanTime(startTimeField.value);
-			if (newVideoTime !== null) {
-				const videoElement = document.getElementById("video");
-				videoElement.currentTime = newVideoTime;
-			}
-		});
+		playFromStartTime.addEventListener("click", chapterMarkerPlayStartTimeHandler);
 	} else {
 		playFromStartTime.classList.add("hidden");
 	}
@@ -1640,6 +1640,18 @@ function addChapterMarkerHandler(event) {
 	}
 }
 
+function chapterMarkerPlayStartTimeHandler(event) {
+	const chapterContainer = event.currentTarget.parentElement;
+	const startTimeField = chapterContainer.getElementsByClassName(
+		"range-definition-chapter-marker-start",
+	)[0];
+	const newVideoTime = videoPlayerTimeFromVideoHumanTime(startTimeField.value);
+	if (newVideoTime !== null) {
+		const videoElement = document.getElementById("video");
+		videoElement.currentTime = newVideoTime;
+	}
+}
+
 async function rangeDataUpdated() {
 	const clipBar = document.getElementById("clip-bar");
 	clipBar.innerHTML = "";