From 00ba7d52936bf6c05790ba0f5f2d6acf81fea7ea Mon Sep 17 00:00:00 2001 From: ElementalAlchemist Date: Thu, 14 Oct 2021 20:50:09 -0500 Subject: [PATCH] Run Prettier on all the files --- thrimbletrimmer/beta/edit.html | 87 +++++-- thrimbletrimmer/beta/index.html | 24 +- thrimbletrimmer/beta/scripts/common.js | 17 +- thrimbletrimmer/beta/scripts/edit.js | 217 ++++++++++++------ .../beta/scripts/keyboard-shortcuts.js | 6 +- thrimbletrimmer/beta/scripts/stream.js | 26 ++- .../beta/styles/thrimbletrimmer.css | 10 +- 7 files changed, 277 insertions(+), 110 deletions(-) diff --git a/thrimbletrimmer/beta/edit.html b/thrimbletrimmer/beta/edit.html index f377a2a..2b19aab 100644 --- a/thrimbletrimmer/beta/edit.html +++ b/thrimbletrimmer/beta/edit.html @@ -13,7 +13,10 @@ - + @@ -35,7 +38,7 @@
- Waveform for the video + Waveform for the video
Help @@ -52,35 +55,63 @@
  • Period (.): Forward 1 frame
  • Equals (=): Increase playback speed one step
  • Hyphen (-): Decrease playback speed one step
    • -
  • Left bracket ([): Set start point for current range (indicated by arrow) to current video time
    • +
  • + Left bracket ([): Set start point for current range (indicated by arrow) to current + video time +
  • Right bracket (]): Send end point for current range to current video time
  • O: Switch the current range up one
    • -
  • P: Switch the current range down one, adding a new range if the current range was the last one
    • +
  • + P: Switch the current range down one, adding a new range if the current range was the + last one +

    • Transition Types

    -

    A visual explanation of the different transition types can be found on the FFMpeg website.

    +

    + A visual explanation of the different transition types can be found + on the FFMpeg website. +

    - - Set range start point to current video time + + Set range start point to current video time
    - - Set range end point to current video time + + Set range end point to current video time
    - Range affected by keyboard shortcuts + Range affected by keyboard shortcuts
    - Add range + Add range
    - +
    @@ -89,7 +120,7 @@
    - +
    - + - + - +
    @@ -64,4 +80,4 @@
    Download Video - \ No newline at end of file + diff --git a/thrimbletrimmer/beta/scripts/common.js b/thrimbletrimmer/beta/scripts/common.js index 41055ba..4d4a5a5 100644 --- a/thrimbletrimmer/beta/scripts/common.js +++ b/thrimbletrimmer/beta/scripts/common.js @@ -57,9 +57,9 @@ async function loadVideoPlayer(playlistURL) { controlBar: { fullscreenToggle: true, volumePanel: { - inline: false - } - } + inline: false, + }, + }, }; const player = videojs("video", defaultOptions); @@ -111,7 +111,7 @@ function getWubloaderTimeFromDateWithMilliseconds(date) { function assembleVideoPlaylistURL(basePlaylistURL) { let playlistURL = basePlaylistURL; - + const queryStringParts = startAndEndTimeQueryStringParts(); if (queryStringParts) { playlistURL += "?" + queryStringParts.join("&"); @@ -137,8 +137,13 @@ function generateDownloadURL(startTime, endTime, downloadType, allowHoles, quali const startURLTime = getWubloaderTimeFromDate(startTime); const endURLTime = getWubloaderTimeFromDate(endTime); - const queryParts = [`start=${startURLTime}`, `end=${endURLTime}`, `type=${downloadType}`, `allow_holes=${allowHoles}`]; + const queryParts = [ + `start=${startURLTime}`, + `end=${endURLTime}`, + `type=${downloadType}`, + `allow_holes=${allowHoles}`, + ]; const downloadURL = `/cut/${globalStreamName}/${quality}.ts?${queryParts.join("&")}`; return downloadURL; -} \ No newline at end of file +} diff --git a/thrimbletrimmer/beta/scripts/edit.js b/thrimbletrimmer/beta/scripts/edit.js index 9a70eb2..e343beb 100644 --- a/thrimbletrimmer/beta/scripts/edit.js +++ b/thrimbletrimmer/beta/scripts/edit.js @@ -9,7 +9,9 @@ window.addEventListener("DOMContentLoaded", async (event) => { updateDownloadLink(); const addRangeIcon = document.getElementById("add-range-definition"); - addRangeIcon.addEventListener("click", (_event) => { addRangeDefinition(); }); + addRangeIcon.addEventListener("click", (_event) => { + addRangeDefinition(); + }); addRangeIcon.addEventListener("keypress", (event) => { if (event.key === "Enter") { addRangeDefinition(); @@ -23,42 +25,70 @@ window.addEventListener("DOMContentLoaded", async (event) => { rangeEndSet.addEventListener("click", getRangeSetClickHandler("end")); } for (const rangeStart of document.getElementsByClassName("range-definition-start")) { - rangeStart.addEventListener("change", (_event) => { rangeDataUpdated(); }); + rangeStart.addEventListener("change", (_event) => { + rangeDataUpdated(); + }); } for (const rangeEnd of document.getElementsByClassName("range-definition-end")) { - rangeEnd.addEventListener("change", (_event) => { rangeDataUpdated(); }); + rangeEnd.addEventListener("change", (_event) => { + rangeDataUpdated(); + }); } - document.getElementById("submit-button").addEventListener("click", (_event) => { submitVideo(); }); - document.getElementById("save-button").addEventListener("click", (_event) => { saveVideoDraft(); }); + document.getElementById("submit-button").addEventListener("click", (_event) => { + submitVideo(); + }); + document.getElementById("save-button").addEventListener("click", (_event) => { + saveVideoDraft(); + }); document.getElementById("advanced-submission").addEventListener("click", (_event) => { const advancedOptionsContainer = document.getElementById("advanced-submission-options"); advancedOptionsContainer.classList.toggle("hidden"); }); - document.getElementById("advanced-submission-option-allow-holes").addEventListener("change", () => { updateDownloadLink(); }); - document.getElementById("download-type-select").addEventListener("change", () => { updateDownloadLink(); }); + document + .getElementById("advanced-submission-option-allow-holes") + .addEventListener("change", () => { + updateDownloadLink(); + }); + document.getElementById("download-type-select").addEventListener("change", () => { + updateDownloadLink(); + }); document.getElementById("manual-link-update").addEventListener("click", (_event) => { const manualLinkDataContainer = document.getElementById("data-correction-manual-link"); manualLinkDataContainer.classList.toggle("hidden"); }); - document.getElementById("data-correction-manual-link-submit").addEventListener("click", (_event) => { setManualVideoLink(); }); + document + .getElementById("data-correction-manual-link-submit") + .addEventListener("click", (_event) => { + setManualVideoLink(); + }); - document.getElementById("cancel-video-upload").addEventListener("click", (_event) => { cancelVideoUpload(); }); + document.getElementById("cancel-video-upload").addEventListener("click", (_event) => { + cancelVideoUpload(); + }); document.getElementById("reset-entire-video").addEventListener("click", (_event) => { - const forceResetConfirmationContainer = document.getElementById("data-correction-force-reset-confirm"); + const forceResetConfirmationContainer = document.getElementById( + "data-correction-force-reset-confirm" + ); forceResetConfirmationContainer.classList.remove("hidden"); }); - document.getElementById("data-correction-force-reset-yes").addEventListener("click", (_event) => { resetVideoRow(); }); + document.getElementById("data-correction-force-reset-yes").addEventListener("click", (_event) => { + resetVideoRow(); + }); document.getElementById("data-correction-force-reset-no").addEventListener("click", (_event) => { - const forceResetConfirmationContainer = document.getElementById("data-correction-force-reset-confirm"); + const forceResetConfirmationContainer = document.getElementById( + "data-correction-force-reset-confirm" + ); forceResetConfirmationContainer.classList.add("hidden"); }); - document.getElementById("google-auth-sign-out").addEventListener("click", (_event) => { googleSignOut(); }); + document.getElementById("google-auth-sign-out").addEventListener("click", (_event) => { + googleSignOut(); + }); }); async function loadVideoInfo() { @@ -70,7 +100,9 @@ async function loadVideoInfo() { const videoID = queryParams.get("id"); const dataResponse = await fetch("/thrimshim/" + videoID); if (!dataResponse.ok) { - addError("Failed to load video data. This probably means that the URL is out of date (video ID changed) or that everything is broken (or that the Wubloader host is down)."); + addError( + "Failed to load video data. This probably means that the URL is out of date (video ID changed) or that everything is broken (or that the Wubloader host is down)." + ); return; } videoInfo = await dataResponse.json(); @@ -84,8 +116,10 @@ async function initializeVideoInfo() { globalBusStartTime = new Date(videoInfo.bustime_start); document.getElementById("stream-time-setting-stream").innerText = globalStreamName; - document.getElementById("stream-time-setting-start").innerText = getBusTimeFromTimeString(globalStartTimeString); - document.getElementById("stream-time-setting-end").innerText = getBusTimeFromTimeString(globalEndTimeString); + document.getElementById("stream-time-setting-start").innerText = + getBusTimeFromTimeString(globalStartTimeString); + document.getElementById("stream-time-setting-end").innerText = + getBusTimeFromTimeString(globalEndTimeString); updateWaveform(); @@ -128,7 +162,9 @@ async function initializeVideoInfo() { modifiedAdvancedOptions = true; } - const uploadLocationSelection = document.getElementById("advanced-submission-option-upload-location"); + const uploadLocationSelection = document.getElementById( + "advanced-submission-option-upload-location" + ); for (locationName of videoInfo.upload_locations) { const option = document.createElement("option"); option.value = locationName; @@ -144,7 +180,9 @@ async function initializeVideoInfo() { if (videoInfo.uploader_whitelist) { modifiedAdvancedOptions = true; - const uploaderAllowlistBox = document.getElementById("advanced-submission-option-uploader-allow"); + const uploaderAllowlistBox = document.getElementById( + "advanced-submission-option-uploader-allow" + ); uploaderAllowlistBox.value = videoInfo.uploader_whitelist.join(","); } @@ -160,10 +198,16 @@ async function initializeVideoInfo() { // For now, there's only one range in the data we receive from thrimshim, so we'll populate that as-is here. // This will need to be updated when thrimshim supports multiple video ranges. const rangeDefinitionsContainer = document.getElementById("range-definitions"); - const rangeDefinitionStart = rangeDefinitionsContainer.getElementsByClassName("range-definition-start")[0]; - const rangeDefinitionEnd = rangeDefinitionsContainer.getElementsByClassName("range-definition-end")[0]; - rangeDefinitionStart.addEventListener("change", (_event) => { rangeDataUpdated(); }); - rangeDefinitionEnd.addEventListener("change", (_event) => { rangeDataUpdated(); }); + const rangeDefinitionStart = + rangeDefinitionsContainer.getElementsByClassName("range-definition-start")[0]; + const rangeDefinitionEnd = + rangeDefinitionsContainer.getElementsByClassName("range-definition-end")[0]; + rangeDefinitionStart.addEventListener("change", (_event) => { + rangeDataUpdated(); + }); + rangeDefinitionEnd.addEventListener("change", (_event) => { + rangeDataUpdated(); + }); if (videoInfo.video_start) { rangeDefinitionStart.value = videoHumanTimeFromWubloaderTime(videoInfo.video_start); } @@ -283,7 +327,9 @@ async function sendVideoData(edited, overrideChanges) { } let transitionType = rangeContainer.getElementsByClassName("range-definition-transition-type"); - let transitionDuration = rangeContainer.getElementsByClassName("range-definition-transition-duration"); + let transitionDuration = rangeContainer.getElementsByClassName( + "range-definition-transition-duration" + ); if (transitionType.length > 0 && transitionDuration.length > 0) { transitionType = transitionType[0].value; transitionDuration = transitionDuration[0].value; @@ -302,7 +348,7 @@ async function sendVideoData(edited, overrideChanges) { start: rangeStartSubmit, end: rangeEndSubmit, transition: transitionType, - duration: transitionDuration + duration: transitionDuration, }); } @@ -313,11 +359,15 @@ async function sendVideoData(edited, overrideChanges) { const videoDescription = document.getElementById("video-info-description").value; const videoTags = document.getElementById("video-info-tags").value.split(","); const allowHoles = document.getElementById("advanced-submission-option-allow-holes").checked; - const uploadLocation = document.getElementById("advanced-submission-option-upload-location").value; - const uploaderAllowlistValue = document.getElementById("advanced-submission-option-uploader-allow").value; - const uploaderAllowlist = (uploaderAllowlistValue) ? uploaderAllowlistValue.split(",") : null; - const state = (edited) ? "EDITED" : "UNEDITED"; - + const uploadLocation = document.getElementById( + "advanced-submission-option-upload-location" + ).value; + const uploaderAllowlistValue = document.getElementById( + "advanced-submission-option-uploader-allow" + ).value; + const uploaderAllowlist = uploaderAllowlistValue ? uploaderAllowlistValue.split(",") : null; + const state = edited ? "EDITED" : "UNEDITED"; + const editData = { video_start: videoStart, video_end: videoEnd, @@ -338,7 +388,7 @@ async function sendVideoData(edited, overrideChanges) { category: videoInfo.category, description: videoInfo.description, notes: videoInfo.notes, - tags: videoInfo.tags + tags: videoInfo.tags, }; if (googleUser) { editData.token = googleUser.getAuthResponse().id_token; @@ -351,9 +401,9 @@ async function sendVideoData(edited, overrideChanges) { method: "POST", headers: { Accept: "application/json", - "Content-Type": "application/json" + "Content-Type": "application/json", }, - body: JSON.stringify(editData) + body: JSON.stringify(editData), }); if (submitResponse.ok) { @@ -369,12 +419,16 @@ async function sendVideoData(edited, overrideChanges) { const serverErrorNode = document.createTextNode(await submitResponse.text()); const submitButton = document.createElement("button"); submitButton.text = "Submit Anyway"; - submitButton.addEventListener("click", (_event) => { sendVideoData(edited, true); }); + submitButton.addEventListener("click", (_event) => { + sendVideoData(edited, true); + }); submissionResponseElem.innerHTML = ""; submissionResponseElem.appendChild(serverErrorNode); submissionResponseElem.appendChild(submitButton); } else { - submissionResponseElem.innerText = `${submitResponse.statusText}: ${await submitResponse.text()}`; + submissionResponseElem.innerText = `${ + submitResponse.statusText + }: ${await submitResponse.text()}`; } } } @@ -383,14 +437,24 @@ function updateDownloadLink() { // Currently this only supports one range. When download links can download multiple ranges, this should be updated. const firstRangeStartField = document.getElementsByClassName("range-definition-start")[0]; const firstRangeEndField = document.getElementsByClassName("range-definition-end")[0]; - - const startTime = (firstRangeStartField.value) ? wubloaderTimeFromVideoHumanTime(firstRangeStartField.value) : getStartTime(); - const endTime = (firstRangeEndField.value) ? wubloaderTimeFromVideoHumanTime(firstRangeEndField.value) : getEndTime(); + + const startTime = firstRangeStartField.value + ? wubloaderTimeFromVideoHumanTime(firstRangeStartField.value) + : getStartTime(); + const endTime = firstRangeEndField.value + ? wubloaderTimeFromVideoHumanTime(firstRangeEndField.value) + : getEndTime(); const downloadType = document.getElementById("download-type-select").value; const allowHoles = document.getElementById("advanced-submission-option-allow-holes").checked; - const downloadURL = generateDownloadURL(startTime, endTime, downloadType, allowHoles, videoInfo.video_quality); + const downloadURL = generateDownloadURL( + startTime, + endTime, + downloadType, + allowHoles, + videoInfo.video_quality + ); document.getElementById("download-link").href = downloadURL; } @@ -406,7 +470,7 @@ async function setManualVideoLink() { const request = { link: link, - upload_location: uploadLocation + upload_location: uploadLocation, }; if (googleUser) { request.token = googleUser.getAuthResponse().id_token; @@ -419,9 +483,9 @@ async function setManualVideoLink() { method: "POST", headers: { Accept: "application/json", - "Content-Type": "application/json" + "Content-Type": "application/json", }, - body: JSON.stringify(request) + body: JSON.stringify(request), }); if (response.ok) { @@ -444,14 +508,16 @@ async function cancelVideoUpload() { method: "POST", headers: { Accept: "application/json", - "Content-Type": "application/json" + "Content-Type": "application/json", }, - body: JSON.stringify(request) + body: JSON.stringify(request), }); if (response.ok) { responseElem.innerText = "Row has been cancelled. Reloading..."; - setTimeout(() => { window.location.reload(); }, 1000); + setTimeout(() => { + window.location.reload(); + }, 1000); } else { responseElem.innerText = `${response.statusText}: ${await response.text()}`; } @@ -470,14 +536,16 @@ async function resetVideoRow() { method: "POST", headers: { Accept: "application/json", - "Content-Type": "application/json" + "Content-Type": "application/json", }, - body: JSON.stringify(request) + body: JSON.stringify(request), }); if (response.ok) { responseElem.innerText = "Row has been reset. Reloading..."; - setTimeout(() => { window.location.reload(); }, 1000); + setTimeout(() => { + window.location.reload(); + }, 1000); } else { responseElem.innerText = `${response.statusText}: ${await response.text()}`; } @@ -532,16 +600,16 @@ const RANGE_TRANSITION_TYPES = [ "wipebl", "wipebr", "squeezeh", - "squeezev" + "squeezev", ]; function rangeDefinitionDOM() { const container = document.createElement("div"); container.classList.add("range-definition-removable"); - + const transitionContainer = document.createElement("div"); transitionContainer.classList.add("range-definition-transition"); - + const transitionSelection = document.createElement("select"); transitionSelection.classList.add("range-definition-transition-type"); const noTransitionOption = document.createElement("option"); @@ -554,7 +622,9 @@ function rangeDefinitionDOM() { transitionOption.innerText = transitionType; transitionSelection.appendChild(transitionOption); } - transitionSelection.addEventListener("change", (_event) => { rangeDataUpdated(); }); + transitionSelection.addEventListener("change", (_event) => { + rangeDataUpdated(); + }); transitionContainer.appendChild(transitionSelection); const transitionDurationInput = document.createElement("input"); @@ -574,7 +644,7 @@ function rangeDefinitionDOM() { rangeStart.classList.add("range-definition-start"); const rangeStartSet = document.createElement("img"); rangeStartSet.src = "images/pencil.png"; - rangeStartSet.alt = "Set range start point to current video time" + rangeStartSet.alt = "Set range start point to current video time"; rangeStartSet.classList.add("range-definition-set-start"); rangeStartSet.classList.add("click"); const rangeEnd = document.createElement("input"); @@ -604,7 +674,8 @@ function rangeDefinitionDOM() { const rangeParent = rangeContainer.parentNode; for (let rangeNum = 0; rangeNum < rangeParent.children.length; rangeNum++) { if (rangeContainer === rangeParent.children[rangeNum]) { - if (rangeNum + 1 <= currentRange) { // currentRange is 1-indexed to index into DOM with querySelector + if (rangeNum + 1 <= currentRange) { + // currentRange is 1-indexed to index into DOM with querySelector currentRange--; break; } @@ -636,9 +707,11 @@ function rangeDefinitionDOM() { } function getRangeSetClickHandler(startOrEnd) { - return function(event) { + return function (event) { const setButton = event.currentTarget; - const setField = setButton.parentElement.getElementsByClassName(`range-definition-${startOrEnd}`)[0]; + const setField = setButton.parentElement.getElementsByClassName( + `range-definition-${startOrEnd}` + )[0]; const player = getVideoJS(); const videoPlayerTime = player.currentTime(); @@ -668,7 +741,9 @@ function updateCurrentRangeIndicator() { for (let arrowElem of document.getElementsByClassName("range-definition-current")) { arrowElem.classList.add("hidden"); } - document.querySelector(`#range-definitions > div:nth-child(${currentRange}) .range-definition-current`).classList.remove("hidden"); + document + .querySelector(`#range-definitions > div:nth-child(${currentRange}) .range-definition-current`) + .classList.remove("hidden"); } function rangeDataUpdated() { @@ -688,8 +763,8 @@ function rangeDataUpdated() { continue; } - const rangeStartPercentage = rangeStart / videoDuration * 100; - const rangeEndPercentage = rangeEnd / videoDuration * 100; + const rangeStartPercentage = (rangeStart / videoDuration) * 100; + const rangeEndPercentage = (rangeEnd / videoDuration) * 100; const widthPercentage = rangeEndPercentage - rangeStartPercentage; const marker = document.createElement("div"); @@ -701,14 +776,18 @@ function rangeDataUpdated() { } function setCurrentRangeStartToVideoTime() { - const rangeStartField = document.querySelector(`#range-definitions > div:nth-child(${currentRange}) .range-definition-start`); + const rangeStartField = document.querySelector( + `#range-definitions > div:nth-child(${currentRange}) .range-definition-start` + ); const player = getVideoJS(); rangeStartField.value = videoHumanTimeFromVideoPlayerTime(player.currentTime()); rangeDataUpdated(); } function setCurrentRangeEndToVideoTime() { - const rangeEndField = document.querySelector(`#range-definitions > div:nth-child(${currentRange}) .range-definition-end`); + const rangeEndField = document.querySelector( + `#range-definitions > div:nth-child(${currentRange}) .range-definition-end` + ); const player = getVideoJS(); rangeEndField.value = videoHumanTimeFromVideoPlayerTime(player.currentTime()); rangeDataUpdated(); @@ -720,7 +799,11 @@ function videoPlayerTimeFromWubloaderTime(wubloaderTime) { let highestDiscontinuitySegmentBefore = 0; for (start of videoPlaylist.discontinuityStarts) { const discontinuityStartSegment = videoPlaylist.segments[start]; - if (discontinuityStartSegment.dateTimeObject < wubloaderDateObj && discontinuityStartSegment.dateTimeObject > videoPlaylist.segments[highestDiscontinuitySegmentBefore].dateTimeObject) { + if ( + discontinuityStartSegment.dateTimeObject < wubloaderDateObj && + discontinuityStartSegment.dateTimeObject > + videoPlaylist.segments[highestDiscontinuitySegmentBefore].dateTimeObject + ) { highestDiscontinuitySegmentBefore = start; } } @@ -729,7 +812,13 @@ function videoPlayerTimeFromWubloaderTime(wubloaderTime) { for (let segment = 0; segment < highestDiscontinuitySegmentBefore; segment++) { highestDiscontinuitySegmentStart += videoPlaylist.segments[segment].duration; } - return highestDiscontinuitySegmentStart + secondsDifference(videoPlaylist.segments[highestDiscontinuitySegmentBefore].dateTimeObject, wubloaderDateObj); + return ( + highestDiscontinuitySegmentStart + + secondsDifference( + videoPlaylist.segments[highestDiscontinuitySegmentBefore].dateTimeObject, + wubloaderDateObj + ) + ); } function wubloaderTimeFromVideoPlayerTime(videoPlayerTime) { @@ -760,7 +849,7 @@ function videoHumanTimeFromVideoPlayerTime(videoPlayerTime) { const minutes = Math.floor(videoPlayerTime / 60); let seconds = Math.floor(videoPlayerTime % 60); let milliseconds = Math.floor((videoPlayerTime * 1000) % 1000); - + while (seconds.toString().length < 2) { seconds = `0${seconds}`; } @@ -816,4 +905,4 @@ function secondsDifference(date1, date2) { return (date2 - date1) / 1000; } return (date1 - date2) / 1000; -} \ No newline at end of file +} diff --git a/thrimbletrimmer/beta/scripts/keyboard-shortcuts.js b/thrimbletrimmer/beta/scripts/keyboard-shortcuts.js index 03c5d88..c631e9f 100644 --- a/thrimbletrimmer/beta/scripts/keyboard-shortcuts.js +++ b/thrimbletrimmer/beta/scripts/keyboard-shortcuts.js @@ -77,10 +77,10 @@ document.addEventListener("keypress", (event) => { player.currentTime(player.currentTime() + 5); break; case ",": - player.currentTime(player.currentTime() - (1 / VIDEO_FRAMES_PER_SECOND)); + player.currentTime(player.currentTime() - 1 / VIDEO_FRAMES_PER_SECOND); break; case ".": - player.currentTime(player.currentTime() + (1 / VIDEO_FRAMES_PER_SECOND)); + player.currentTime(player.currentTime() + 1 / VIDEO_FRAMES_PER_SECOND); break; case "=": increaseSpeed(player); @@ -130,4 +130,4 @@ document.addEventListener("keydown", (event) => { default: break; } -}); \ No newline at end of file +}); diff --git a/thrimbletrimmer/beta/scripts/stream.js b/thrimbletrimmer/beta/scripts/stream.js index 238cd08..561a4ef 100644 --- a/thrimbletrimmer/beta/scripts/stream.js +++ b/thrimbletrimmer/beta/scripts/stream.js @@ -19,7 +19,9 @@ window.addEventListener("DOMContentLoaded", async (event) => { async function loadDefaults() { const defaultDataResponse = await fetch("/thrimshim/defaults"); if (!defaultDataResponse.ok) { - addError("Failed to load Thrimbletrimmer data. This probably means that everything is broken (or, possibly, just that the Wubloader host is down). Please sound the alarm."); + addError( + "Failed to load Thrimbletrimmer data. This probably means that everything is broken (or, possibly, just that the Wubloader host is down). Please sound the alarm." + ); return; } const defaultData = await defaultDataResponse.json(); @@ -36,9 +38,13 @@ function getStartTime() { case 1: return new Date(globalStartTimeString + "Z"); case 2: - return new Date(globalBusStartTime.getTime() + (1000 * parseInputTimeAsNumberOfSeconds(globalStartTimeString))); + return new Date( + globalBusStartTime.getTime() + 1000 * parseInputTimeAsNumberOfSeconds(globalStartTimeString) + ); case 3: - return new Date(new Date().getTime() - (1000 * parseInputTimeAsNumberOfSeconds(globalStartTimeString))); + return new Date( + new Date().getTime() - 1000 * parseInputTimeAsNumberOfSeconds(globalStartTimeString) + ); } } @@ -51,9 +57,13 @@ function getEndTime() { case 1: return new Date(globalEndTimeString + "Z"); case 2: - return new Date(globalBusStartTime.getTime() + (1000 * parseInputTimeAsNumberOfSeconds(globalEndTimeString))); + return new Date( + globalBusStartTime.getTime() + 1000 * parseInputTimeAsNumberOfSeconds(globalEndTimeString) + ); case 3: - return new Date(new Date().getTime() - (1000 * parseInputTimeAsNumberOfSeconds(globalEndTimeString))); + return new Date( + new Date().getTime() - 1000 * parseInputTimeAsNumberOfSeconds(globalEndTimeString) + ); } } @@ -69,7 +79,9 @@ function updateTimeSettings() { updateDownloadLink(); if (getEndTime() < getStartTime()) { - addError("End time is before the start time. This will prevent video loading and cause other problems."); + addError( + "End time is before the start time. This will prevent video loading and cause other problems." + ); } } @@ -96,4 +108,4 @@ function updateStoredTimeSettings() { break; } } -} \ No newline at end of file +} diff --git a/thrimbletrimmer/beta/styles/thrimbletrimmer.css b/thrimbletrimmer/beta/styles/thrimbletrimmer.css index 2230527..7b22af9 100644 --- a/thrimbletrimmer/beta/styles/thrimbletrimmer.css +++ b/thrimbletrimmer/beta/styles/thrimbletrimmer.css @@ -1,4 +1,5 @@ -a, .click { +a, +.click { cursor: pointer; } @@ -46,7 +47,7 @@ a, .click { display: block; /* We want to display these */ } -#video .vjs-control-bar .vjs-progress-control { +#video .vjs-control-bar .vjs-progress-control { position: absolute; bottom: 26px; /* Aligns the bar to the top of the control bar */ left: 0; @@ -118,7 +119,8 @@ a, .click { gap: 4px; } -.range-definition-start, .range-definition-end { +.range-definition-start, +.range-definition-end { width: 100px; } @@ -193,4 +195,4 @@ a, .click { #data-correction-force-reset-confirm p { margin: 5px 0; -} \ No newline at end of file +}