diff --git a/thrimbletrimmer/scripts/common.js b/thrimbletrimmer/scripts/common.js index c8ff59a..852da85 100644 --- a/thrimbletrimmer/scripts/common.js +++ b/thrimbletrimmer/scripts/common.js @@ -445,25 +445,25 @@ function videoHumanTimeFromDateTime(dateTime) { function assembleVideoPlaylistURL(basePlaylistURL) { let playlistURL = basePlaylistURL; - const queryStringParts = startAndEndTimeQueryStringParts(); - if (queryStringParts) { - playlistURL += "?" + queryStringParts.join("&"); + const query = startAndEndTimeQuery(); + if (query.toString() !== "") { + playlistURL += "?" + query.toString(); } return playlistURL; } -function startAndEndTimeQueryStringParts() { +function startAndEndTimeQuery() { const startTime = getStartTime(); const endTime = getEndTime(); - let queryStringParts = []; + const query = new URLSearchParams(); if (startTime) { - queryStringParts.push(`start=${wubloaderTimeFromDateTime(startTime)}`); + query.append("start", wubloaderTimeFromDateTime(startTime)); } if (endTime) { - queryStringParts.push(`end=${wubloaderTimeFromDateTime(endTime)}`); + query.append("end", wubloaderTimeFromDateTime(endTime)); } - return queryStringParts; + return query; } function getSegmentList() { diff --git a/thrimbletrimmer/scripts/edit.js b/thrimbletrimmer/scripts/edit.js index 473e12c..93ee0b7 100644 --- a/thrimbletrimmer/scripts/edit.js +++ b/thrimbletrimmer/scripts/edit.js @@ -272,13 +272,13 @@ window.addEventListener("DOMContentLoaded", async (event) => { } const imageTemplate = document.getElementById("video-info-thumbnail-template").value; const [crop, loc] = getTemplatePosition(); - const queryParts = [ - `timestamp=${imageTime}`, - `template=${imageTemplate}`, - `crop=${crop.join(",")}`, - `location=${loc.join(",")}`, - ]; - imageElement.src = `/thumbnail/${globalStreamName}/source.png?${queryParts.join("&")}`; + const query = new URLSearchParams({ + timestamp: imageTime, + template: imageTemplate, + crop: crop.join(","), + location: loc.join(","), + }); + imageElement.src = `/thumbnail/${globalStreamName}/source.png?${query}`; imageElement.classList.remove("hidden"); }); @@ -831,8 +831,8 @@ function updateWaveform() { let waveformURL = "/waveform/" + globalStreamName + "/" + videoInfo.video_quality + ".png?size=1920x125&"; - const queryStringParts = startAndEndTimeQueryStringParts(); - waveformURL += queryStringParts.join("&"); + const query = startAndEndTimeQuery(); + waveformURL += query.toString(); const waveformElem = document.getElementById("waveform"); waveformElem.src = waveformURL; @@ -1374,7 +1374,10 @@ function handleLeavePage(event) { } function generateDownloadURL(timeRanges, transitions, downloadType, allowHoles, quality) { - const queryParts = [`type=${downloadType}`, `allow_holes=${allowHoles}`]; + const query = new URLSearchParams({ + type: downloadType, + allow_holes: allowHoles, + }); for (const range of timeRanges) { let timeRangeString = ""; if (range.hasOwnProperty("start")) { @@ -1384,13 +1387,13 @@ function generateDownloadURL(timeRanges, transitions, downloadType, allowHoles, if (range.hasOwnProperty("end")) { timeRangeString += range.end; } - queryParts.push(`range=${timeRangeString}`); + query.append("range", timeRangeString); } for (const transition of transitions) { - queryParts.push(`transition=${transition}`); + query.append("transition", transition); } - const downloadURL = `/cut/${globalStreamName}/${quality}.ts?${queryParts.join("&")}`; + const downloadURL = `/cut/${globalStreamName}/${quality}.ts?${query.toString()}`; return downloadURL; } diff --git a/thrimbletrimmer/scripts/stream.js b/thrimbletrimmer/scripts/stream.js index c322ff8..e71e502 100644 --- a/thrimbletrimmer/scripts/stream.js +++ b/thrimbletrimmer/scripts/stream.js @@ -121,28 +121,32 @@ async function updateTimeSettings() { const startTime = getStartTime(); const endTime = getEndTime(); - const queryParts = []; - queryParts.push(`stream=${globalStreamName}`); - queryParts.push(`start=${wubloaderTimeFromDateTime(startTime)}`); + const query = new URLSearchParams({ + stream: globalStreamName, + start: wubloaderTimeFromDateTime(startTime), + }); if (endTime) { - queryParts.push(`end=${wubloaderTimeFromDateTime(endTime)}`); + query.append("end", wubloaderTimeFromDateTime(endTime)); } - document.getElementById("stream-time-link").href = `?${queryParts.join("&")}`; + document.getElementById("stream-time-link").href = `?${query}`; } function generateDownloadURL(startTime, endTime, downloadType, allowHoles, quality) { const startURLTime = wubloaderTimeFromDateTime(startTime); const endURLTime = wubloaderTimeFromDateTime(endTime); - const queryParts = [`type=${downloadType}`, `allow_holes=${allowHoles}`]; + const query = new URLSearchParams({ + type: downloadType, + allow_holes: allowHoles + }); if (startURLTime) { - queryParts.push(`start=${startURLTime}`); + query.append("start", startURLTime); } if (endURLTime) { - queryParts.push(`end=${endURLTime}`); + query.append("end", endURLTime); } - const downloadURL = `/cut/${globalStreamName}/${quality}.ts?${queryParts.join("&")}`; + const downloadURL = `/cut/${globalStreamName}/${quality}.ts?${query}`; return downloadURL; }