Move visualizer above delete items

This commit is contained in:
TwistedUmbrellaX 2024-03-05 23:32:51 -05:00
parent 79c834cf08
commit 05541b9db0
2 changed files with 32 additions and 25 deletions

View File

@ -454,33 +454,17 @@
<input style="width:4em" type="number" min="0" id="editRightEpisodeStart"> to <input style="width:4em" type="number" min="0" id="editRightEpisodeStart"> to
<input style="width:4em;margin-bottom:10px" type="number" min="0" id="editRightEpisodeEnd"> <input style="width:4em;margin-bottom:10px" type="number" min="0" id="editRightEpisodeEnd">
<br /> <br />
<br />
<button id="btnUpdateTimestamps" type="button"> <button id="btnUpdateTimestamps" type="button">
Update timestamps Update timestamps
</button> </button>
<br /> <br />
<br />
</div> </div>
<textarea id="timestampError" style="display:none;" rows="2" cols="75" readonly></textarea> <textarea id="timestampError" style="display:none;" rows="2" cols="75" readonly></textarea>
<br /> <br />
<button id="btnEraseSeasonTimestamps" type="button" style="display:none;">
Erase all timestamps for this season
</button>
<hr />
<button id="btnEraseIntroTimestamps">
Erase all introduction timestamps (globally)
</button>
<br />
<button id="btnEraseCreditTimestamps">
Erase all end credits timestamps (globally)
</button>
<br />
<br />
<h3>Fingerprint Visualizer</h3> <h3>Fingerprint Visualizer</h3>
<p> <p>
Interactively compare the audio fingerprints of two episodes. <br /> Interactively compare the audio fingerprints of two episodes. <br />
@ -526,11 +510,27 @@
<br /> <br />
<br /> <br />
<canvas id="troubleshooter"></canvas> <canvas id="troubleshooter" style="display:none;"></canvas>
<span id="timestampContainer"> <span id="timestampContainer">
<span id="timestamps"></span> <br /> <span id="timestamps"></span> <br />
<span id="intros"></span> <span id="intros"></span>
</span> </span>
<br />
<br />
<button id="btnEraseSeasonTimestamps" type="button" style="display:none;">
Erase all timestamps for this season
</button>
<hr />
<button id="btnEraseIntroTimestamps">
Erase all introduction timestamps (globally)
</button>
<br />
<button id="btnEraseCreditTimestamps">
Erase all end credits timestamps (globally)
</button>
</details> </details>
</fieldset> </fieldset>
</div> </div>
@ -602,6 +602,7 @@
var txtSuggested = document.querySelector("span#suggestedShifts"); var txtSuggested = document.querySelector("span#suggestedShifts");
var btnSeasonEraseTimestamps = document.querySelector("button#btnEraseSeasonTimestamps"); var btnSeasonEraseTimestamps = document.querySelector("button#btnEraseSeasonTimestamps");
var timestampError = document.querySelector("textarea#timestampError"); var timestampError = document.querySelector("textarea#timestampError");
var timestampEditor = document.querySelector("#timestampEditor");
var btnUpdateTimestamps = document.querySelector("button#btnUpdateTimestamps"); var btnUpdateTimestamps = document.querySelector("button#btnUpdateTimestamps");
var timeContainer = document.querySelector("span#timestampContainer"); var timeContainer = document.querySelector("span#timestampContainer");
@ -613,8 +614,8 @@
async function autoSkipChanged() { async function autoSkipChanged() {
if (autoSkip.checked) { if (autoSkip.checked) {
skipFirstEpisode.style.display = 'block'; skipFirstEpisode.style.display = 'unset';
autoSkipNotificationText.style.display = 'block'; autoSkipNotificationText.style.display = 'unset';
} else { } else {
skipFirstEpisode.style.display = 'none'; skipFirstEpisode.style.display = 'none';
autoSkipNotificationText.style.display = 'none'; autoSkipNotificationText.style.display = 'none';
@ -633,8 +634,8 @@
showAdjustment.style.display = 'none'; showAdjustment.style.display = 'none';
hideAdjustment.style.display = 'none'; hideAdjustment.style.display = 'none';
} else { } else {
showAdjustment.style.display = 'block'; showAdjustment.style.display = 'unset';
hideAdjustment.style.display = 'block'; hideAdjustment.style.display = 'unset';
} }
} }
@ -716,7 +717,7 @@
clearSelect(selectEpisode1); clearSelect(selectEpisode1);
clearSelect(selectEpisode2); clearSelect(selectEpisode2);
btnSeasonEraseTimestamps.style.display = "block"; btnSeasonEraseTimestamps.style.display = "unset";
let i = 1; let i = 1;
for (let episode of episodes) { for (let episode of episodes) {
@ -742,6 +743,7 @@
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
timestampError.value = ""; timestampError.value = "";
canvas.style.display = "none";
lhs = await getJson("Intros/Episode/" + selectEpisode1.value + "/Chromaprint"); lhs = await getJson("Intros/Episode/" + selectEpisode1.value + "/Chromaprint");
rhs = await getJson("Intros/Episode/" + selectEpisode2.value + "/Chromaprint"); rhs = await getJson("Intros/Episode/" + selectEpisode2.value + "/Chromaprint");
@ -763,7 +765,7 @@
if (timestampError.value == "") { if (timestampError.value == "") {
timestampError.style.display = "none"; timestampError.style.display = "none";
} else { } else {
timestampError.style.display = "block"; timestampError.style.display = "unset";
} }
Dashboard.hideLoadingMsg(); Dashboard.hideLoadingMsg();
@ -793,7 +795,7 @@
} }
// Update the editor for the first and second episodes // Update the editor for the first and second episodes
document.querySelector("#timestampEditor").style.display = "unset"; timestampEditor.style.display = "unset";
document.querySelector("#editLeftEpisodeTitle").textContent = leftEpisode.text; document.querySelector("#editLeftEpisodeTitle").textContent = leftEpisode.text;
document.querySelector("#editLeftEpisodeStart").value = Math.round(leftEpisodeIntro.IntroStart); document.querySelector("#editLeftEpisodeStart").value = Math.round(leftEpisodeIntro.IntroStart);
document.querySelector("#editLeftEpisodeEnd").value = Math.round(leftEpisodeIntro.IntroEnd); document.querySelector("#editLeftEpisodeEnd").value = Math.round(leftEpisodeIntro.IntroEnd);
@ -813,6 +815,9 @@
function clearSelect(select) { function clearSelect(select) {
timestampError.value = ""; timestampError.value = "";
timestampError.style.display = "none"; timestampError.style.display = "none";
timestampEditor.style.display = "none";
timeContainer.style.display = "none";
canvas.style.display = "none";
let i, L = select.options.length - 1; let i, L = select.options.length - 1;
for (i = L; i >= 0; i--) { for (i = L; i >= 0; i--) {
select.remove(i); select.remove(i);

View File

@ -169,6 +169,8 @@ function paintFingerprintDiff(canvas, fp1, fp2, offset) {
return; return;
} }
canvas.style.display = "unset";
let leftOffset = 0, rightOffset = 0; let leftOffset = 0, rightOffset = 0;
if (offset < 0) { if (offset < 0) {
leftOffset -= offset; leftOffset -= offset;