var beeperBegun = false; var beepInterval = 0; var beepTimeCounter = 0; var intervalId = 0; var timeChangedWhileBegun = false; var lastSec = -1; var lastTimestampMs = 0; var showBeep = 0; var audioCtx = new (window.AudioContext || window.webkitAudioContext)(); function main() { timeChanged(); updateInvalidness(); document.getElementById("plus").onclick = () => changeSeconds(1); document.getElementById("minus").onclick = () => changeSeconds(-1); document.getElementById("time-input").onchange = () => { timeChanged(); updateInvalidness(); }; document.getElementById("begin").onclick = toggle; var audio = document.getElementById("audio"); let slider = document.getElementById("volume-slider"); document.getElementById("volume-slider").onchange = () => { audio.volume = (slider.value / 100); document.getElementById("volume").innerText = slider.value; }; document.getElementById("file").addEventListener('change', () => { var file = document.getElementById("file").files[0]; document.getElementById("audiosource").setAttribute("src", URL.createObjectURL(file)); document.getElementById("audio").load(); }); document.getElementById("audio").addEventListener("loadeddata", (event) => { document.getElementById("audiotext").innerText = "Loaded audio"; }); document.getElementById("audio").addEventListener("loadstart", (event) => { document.getElementById("audiotext").innerText = "Loading/Error"; }); console.log("Beeper initialized!"); } function isTimeValid() { value = document.getElementById("time-input").value; if (value != "" && (isNaN(value) || value < 1)) { return false; } return true; } function getTime() { if (!isTimeValid()) { return 1; } value = document.getElementById("time-input").value; if (value == "") { return 5; } return parseFloat(value); } function updateInvalidness() { input = document.getElementById("time-input"); if (!isTimeValid()) { input.classList = "invalid"; } else { input.classList = ""; } } function changeSeconds(diff) { value = document.getElementById("time-input").value; if (!isNaN(value)) { if (value == "") { value = 5; } value = parseFloat(value); if ((value + diff) >= 1 || diff > 0) { input.value = value + diff; updateInvalidness(); timeChanged(); } } } function timeChanged() { if (isTimeValid()) { if (beeperBegun) { timeChangedWhileBegun = true; return; } time = getTime(); sec = Math.floor(time); millis = Math.floor((time - sec) * 100) / 100; millis = Intl.NumberFormat("en-US", { minimumFractionDigits: 2 }).format(millis); millis = ("" + millis).slice(2); seconds = document.getElementById("seconds").innerText = sec; milliseconds = document.getElementById("milliseconds").innerText = millis; beepInterval = getTime(); beepTimeCounter = beepInterval; } } function toggle() { var button = document.getElementById("begin"); if (!beeperBegun && !isTimeValid()) { return; } beeperBegun = !beeperBegun; if (beeperBegun) { button.innerText = "Stop!"; lastTimestampMs = Date.now(); intervalId = setInterval(update, 10); } else { button.innerText = "Begin!"; clearInterval(intervalId); if (timeChangedWhileBegun) { timeChangedWhileBegun = false; timeChanged(); } lastSec = -1; showBeep = 0; document.title = "Beeper!"; document.getElementById("audio").pause() } } function update() { var seconds = document.getElementById("seconds"); var milliseconds = document.getElementById("milliseconds"); var currentTimestampMs = Date.now(); var delta = currentTimestampMs - lastTimestampMs; lastTimestampMs = currentTimestampMs; beepTimeCounter -= (delta / 1000); showBeep -= (delta / 1000); if (beepTimeCounter <= 0) { console.log(beepTimeCounter); beepTimeCounter = beepInterval; showBeep = 0.5; document.getElementById("audio").fastSeek(0) document.getElementById("audio").play() } var sec = Math.floor(beepTimeCounter); seconds.innerText = sec; var millis = Math.floor((beepTimeCounter - sec) * 100) / 100; millis = Intl.NumberFormat("en-US", { minimumFractionDigits: 2 }).format(millis); millis = ("" + millis).slice(2); milliseconds.innerText = millis; if (lastSec != sec) { lastSec = sec; if (showBeep > 0) { document.title = "Beeeep!"; } else { document.title = "Beeper | " + sec; } } }