diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..e7f0f8b --- /dev/null +++ b/Makefile @@ -0,0 +1,2 @@ +normalize: ./sounds/*.wav + for file in $^; do ffmpeg-normalize $${file} --force --normalization-type peak --target-level -1 --output $${file}; done \ No newline at end of file diff --git a/index.html b/index.html index f526b58..4a917c2 100644 --- a/index.html +++ b/index.html @@ -18,16 +18,45 @@

Startle Machine

+

Generates silence occasionally broken up by random sound effects.
Click the button below and leave this tab to start the prank.

+
- - - -
-
-
-   - -
+

Configuration

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
{{ minDelay }} minutes
{{ maxDelay }} minutes
{{ volume }}%
+ +
+ +
+

Sounds Select all - Unselect all

+
+

@klemek - Github Repository - 2024 diff --git a/main.js b/main.js index 08cb1c6..c9841bc 100644 --- a/main.js +++ b/main.js @@ -47,19 +47,32 @@ let app = { data() { return { sounds: [], + started: false, + minDelay: 15, + maxDelay: 45, + volume: 50, + randomPitch: true, + hidePrank: true, }; }, - computed: { - currentYear() { - return new Date().getFullYear(); + computed: {}, + watch: { + minDelay() { + this.maxDelay = Math.max(this.minDelay, this.maxDelay); + }, + maxDelay() { + this.minDelay = Math.min(this.minDelay, this.maxDelay); }, }, methods: { showApp() { document.getElementById("app").setAttribute("style", ""); }, + hideApp() { + document.getElementById("app").setAttribute("style", "display:none"); + document.body.setAttribute("style", "background: none"); + }, onBlur() { - // TODO document.getElementById("app").setAttribute("style", "display:none"); // TODO }, onFocus() { @@ -74,24 +87,30 @@ let app = { }); }, start() { - const audioCtx = new AudioContext(); - this.sounds.forEach(sound => { - const source = audioCtx.createMediaElementSource(sound.audio); - source.connect(audioCtx.destination); - }); - this.trigger(); + if (!this.started) { + const audioCtx = new AudioContext(); + this.sounds.forEach(sound => { + const source = audioCtx.createMediaElementSource(sound.audio); + source.connect(audioCtx.destination); + }); + this.trigger(); + if (this.hidePrank) { + this.hideApp(); + } + } }, trigger() { - const time = random.int(30, 300); - console.log(`Next in ${time} seconds`); - setTimeout(this.playRandomSound, time * 1000); + this.started = true; + const time = random.int(this.minDelay, this.maxDelay); + console.log(`Next in ${time} minutes`); + setTimeout(this.playRandomSound, time * 60 * 1000); }, selectAll() { this.sounds.forEach(sound => { sound.active = true; }); }, - deselectAll() { + unselectAll() { this.sounds.forEach(sound => { sound.active = false; }); @@ -100,7 +119,8 @@ let app = { const sound = random.element(this.sounds.filter(sound => sound.active)); if (sound !== null) { console.log(`Playing ${sound.id}`); - sound.audio.playbackRate = random.float(0.8, 1.2); + sound.audio.playbackRate = this.randomPitch ? random.float(0.8, 1.2) : 1; + sound.audio.volume = this.volume / 100; sound.audio.play(); } this.trigger(); diff --git a/sounds/baba_booey.wav b/sounds/baba_booey.wav index d935698..315ec51 100644 Binary files a/sounds/baba_booey.wav and b/sounds/baba_booey.wav differ diff --git a/sounds/bonk.wav b/sounds/bonk.wav index d9eab46..561c248 100644 Binary files a/sounds/bonk.wav and b/sounds/bonk.wav differ diff --git a/sounds/boo_womp.wav b/sounds/boo_womp.wav index 93f18e6..50d001d 100644 Binary files a/sounds/boo_womp.wav and b/sounds/boo_womp.wav differ diff --git a/sounds/bruh.wav b/sounds/bruh.wav index 8fdd251..e59e845 100644 Binary files a/sounds/bruh.wav and b/sounds/bruh.wav differ diff --git a/sounds/cash_register.wav b/sounds/cash_register.wav index e11bb41..9e41c93 100644 Binary files a/sounds/cash_register.wav and b/sounds/cash_register.wav differ diff --git a/sounds/censor_beep.wav b/sounds/censor_beep.wav index 1fe4dde..e2bc82c 100644 Binary files a/sounds/censor_beep.wav and b/sounds/censor_beep.wav differ diff --git a/sounds/confetti.wav b/sounds/confetti.wav index 39debfb..22523d3 100644 Binary files a/sounds/confetti.wav and b/sounds/confetti.wav differ diff --git a/sounds/fart_reverb.wav b/sounds/fart_reverb.wav index bcd6c2c..c30722e 100644 Binary files a/sounds/fart_reverb.wav and b/sounds/fart_reverb.wav differ diff --git a/sounds/fart_wet.wav b/sounds/fart_wet.wav index a58adb8..d3577c2 100644 Binary files a/sounds/fart_wet.wav and b/sounds/fart_wet.wav differ diff --git a/sounds/gnome.wav b/sounds/gnome.wav index 5f61cb5..933a0b7 100644 Binary files a/sounds/gnome.wav and b/sounds/gnome.wav differ diff --git a/sounds/huh.wav b/sounds/huh.wav index ba5d7d1..a4982de 100644 Binary files a/sounds/huh.wav and b/sounds/huh.wav differ diff --git a/sounds/mario_coin.wav b/sounds/mario_coin.wav index a728a05..7dd6dcb 100644 Binary files a/sounds/mario_coin.wav and b/sounds/mario_coin.wav differ diff --git a/sounds/mario_jump.wav b/sounds/mario_jump.wav index e273815..51807d6 100644 Binary files a/sounds/mario_jump.wav and b/sounds/mario_jump.wav differ diff --git a/sounds/metal_gear.wav b/sounds/metal_gear.wav index c03cbc1..1557e08 100644 Binary files a/sounds/metal_gear.wav and b/sounds/metal_gear.wav differ diff --git a/sounds/microsoft_error.wav b/sounds/microsoft_error.wav index 3e2bb6c..34a652b 100644 Binary files a/sounds/microsoft_error.wav and b/sounds/microsoft_error.wav differ diff --git a/sounds/minecraft_cave.wav b/sounds/minecraft_cave.wav index ec75e74..3d301e5 100644 Binary files a/sounds/minecraft_cave.wav and b/sounds/minecraft_cave.wav differ diff --git a/sounds/minecraft_door.wav b/sounds/minecraft_door.wav index 88b6363..6413b11 100644 Binary files a/sounds/minecraft_door.wav and b/sounds/minecraft_door.wav differ diff --git a/sounds/minecraft_eating.wav b/sounds/minecraft_eating.wav index bab5506..66323dc 100644 Binary files a/sounds/minecraft_eating.wav and b/sounds/minecraft_eating.wav differ diff --git a/sounds/minecraft_glass.wav b/sounds/minecraft_glass.wav index 914e7f7..e40875c 100644 Binary files a/sounds/minecraft_glass.wav and b/sounds/minecraft_glass.wav differ diff --git a/sounds/minecraft_hurt.wav b/sounds/minecraft_hurt.wav index 6241192..58b2ec8 100644 Binary files a/sounds/minecraft_hurt.wav and b/sounds/minecraft_hurt.wav differ diff --git a/sounds/nope.wav b/sounds/nope.wav index 4612d29..6339b82 100644 Binary files a/sounds/nope.wav and b/sounds/nope.wav differ diff --git a/sounds/quack.wav b/sounds/quack.wav index 2a76ca4..6614b13 100644 Binary files a/sounds/quack.wav and b/sounds/quack.wav differ diff --git a/sounds/roblox_death.wav b/sounds/roblox_death.wav index e8fa0de..4e3a6cb 100644 Binary files a/sounds/roblox_death.wav and b/sounds/roblox_death.wav differ diff --git a/sounds/wilhelm_scream.wav b/sounds/wilhelm_scream.wav index 355dec6..04d3d7d 100644 Binary files a/sounds/wilhelm_scream.wav and b/sounds/wilhelm_scream.wav differ diff --git a/sounds/wow.wav b/sounds/wow.wav index 0c6c493..ccb89af 100644 Binary files a/sounds/wow.wav and b/sounds/wow.wav differ diff --git a/sounds/wrong_buzzer.wav b/sounds/wrong_buzzer.wav index dee4485..a176bf7 100644 Binary files a/sounds/wrong_buzzer.wav and b/sounds/wrong_buzzer.wav differ diff --git a/style.css b/style.css index f9c1b60..d7dc9d9 100644 --- a/style.css +++ b/style.css @@ -85,8 +85,8 @@ CUSTOM STYLE :root { /* https://materialui.co/colors/ */ - --hue-primary: 65.52; - --sat-primary: 20%; + --hue-primary: 348.36; + --sat-primary: 100.00%; --background: hsl(var(--hue-primary), var(--sat-primary), 96.08%); --background-primary: hsl(var(--hue-primary), var(--sat-primary), 93.33%); --background-secondary: hsl(var(--hue-primary), var(--sat-primary), 90%); @@ -169,3 +169,90 @@ a { font-size: inherit; } } + +button.red { + --hue-primary: 4.11; + --sat-primary: 89.62%; +} + +button.green { + --hue-primary: 87.77; + --sat-primary: 50.21%; +} + +button.inactive { + --sat-primary: 25%; +} + +button:disabled { + --sat-primary: 5%; + cursor: no-drop; +} + +button { + border: 1px solid hsl(var(--hue-primary), var(--sat-primary), 50%); + background-color: hsl(var(--hue-primary), var(--sat-primary), 90%); + border-radius: 0.5em; + cursor: pointer; + padding: .25em .5em; +} + +button:hover { + background-color: hsl(var(--hue-primary), var(--sat-primary), 92%); +} + +button:active { + background-color: hsl(var(--hue-primary), var(--sat-primary), 94%); +} + +.sound-container { + display:flex; + flex-flow: row wrap; + gap: .5em; + align-items: stretch; + justify-content: center; +} + +.sound-container button { + flex-basis: 31%; + height: 4em; + width: 100%; + position:relative; + padding: .5em; +} + +.sound-container button::before { + content: '🔊'; + display: block; + position: absolute; + top: .25em; + left: .25em; +} + +.sound-container button.inactive::before { + content: '🔇'; +} + +h3 > a { + font-weight: normal; +} + +.start { + width: 100%; + font-weight: bold; + font-size: larger; + padding: .5em; +} + +table.config td:first-child { + text-align: right; +} + +table.config input { + width: 100%; +} + +table.config button { + width: 100%; + margin-top: .5em; +} \ No newline at end of file