<!DOCTYPE html>
<html>
<head>
<title>Podcast chapter converter</title>
<style>
#container {
display: flex;
align-items: center;
}
.hidden {
display: none;
}
</style>
</head>
<body>
<script src="/bundle.js"></script>
<script>
function convert() {
output.value = window.encoders[to.value](
shift_timestamps(
window.parsers[from.value](input.value),
parseInt(offset.value)
)
);
}
function download(data, filename, type) {
var file = new Blob([data], { type: type });
var a = document.createElement("a"),
url = URL.createObjectURL(file);
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
setTimeout(function () {
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
}, 0);
}
function download_output() {
download(
output.value,
"chapters." + to.value,
"application/json"
);
}
function fromchange() {
offset.value = 0;
if (from.value == "youtube") {
offset_container.classList.remove("hidden");
} else {
offset_container.classList.add("hidden");
}
}
</script>
<h1>Convert podcast chapters</h1>
<div id="container">
<div>
<label>
From:
<select id="from" onchange="fromchange()">
<option value="audacity">Audacity labels export</option>
<option value="youtube">
Youtube plaintext timestamps
</option>
</select>
</label>
<div id="offset_container" class="hidden">
<label>
Offset (to compensate for video intro not present on
audio):<br />
<input type="number" id="offset" size="6" />s
</label>
</div>
<div>
<textarea rows="40" cols="60" id="input"></textarea>
</div>
</div>
<div>
<button onClick="convert()">Convert→</button>
</div>
<div>
<label>
To:
<select id="to" onchange="convert()">
<option value="json">
JSON Chapters (for Castapod)
</option>
<option value="youtube">
Youtube plaintext timestamps
</option>
</select>
</label>
<button onclick="download_output()">download</button>
<div>
<textarea rows="40" cols="60" id="output"></textarea>
</div>
</div>
</div>
<script>
fromchange();
</script>
</body>
</html>