reisnudel/index.html
2026-08-05 14:02:17 +02:00

116 lines
3.2 KiB
HTML

<title> reisnudel </title>
<style>
* {
margin: 0;
padding: 0;
border: 0;
box-sizing: border-box;
}
iframe {
width: 100%;
height: 100%;
}
tr, td {
width: 100vw;
}
table {
height: 100vh;
width: 100vw;
position: absolute;
top: 0;
left: 0;
}
.mantra {
height: 1.7em;
background-color: #ffb3de;
}
.mantra div.next {
display: inline-block;
width: 90vw;
}
</style>
<table>
<tr><td class=mantra><marquee class=mantra>
write new mantras
<div class=next></div>
do it
<div class=next></div>
fuck off ai music 💖
<div class=next></div>
make noise
<div class=next></div>
write old mantras
</marquee></td></tr>
<!-- change the room when it's old enough to lag strudel -->
<tr><td><iframe allow="autoplay" src="https://flok.cc/s/reisnudel5"></iframe></td></tr>
</table>
<!-- this does nothing 💖
because it doesn't affect the ifrsme
and also flok has fft built in already
so it's not needed
-->
<script type="text/javascript">
// Blatantly stolen from nudel for reisnudel
// Enables Hydra to use Strudel frequency data
// with `.scrollX(() => fft(1,0)` it will influence the x-axis, according to the fft data
// first number is the index of the bucket, second is the number of buckets to aggregate the number too
window.fft = (
...args
// index, //: number,
// buckets = 8, //: number = 8,
// optionsArg, //: string | { min?: number; max?: number; scale?: number; analyzerId?: string; },
) => {
let index = 1;
let buckets = 8;
let optionsArg = {};
// if (typeof args[0] === 'string') {
// optionsArg = { analyzerId: args[0] };
// } else {
index = args[0] ?? 0;
buckets = args[1] ?? 1;
optionsArg = args[2] ?? {};
// }
const options = typeof optionsArg === 'string' ? { analyzerId: optionsArg } : optionsArg;
const analyzerId = options?.analyzerId ?? 'flok-master';
const min = options?.min ?? -150;
const scale = options?.scale ?? 1;
const max = options?.max ?? 0;
const strudel = window.parent?.strudel;
// Strudel is not initialized yet, so we just return a default value
if (strudel?.webaudio?.analysers == undefined) return 0.5;
// If display settings are not enabled, we just return a default value
// if (!(this._displaySettings.enableFft ?? true)) return 0.5;
// Enable auto-analyze
strudel.enableAutoAnalyze = true;
// kill coments
strudel.enableComments = false;
// If the analyzerId is not defined, we just return a default value
if (strudel.webaudio.analysers[analyzerId] == undefined) {
return 0.5;
}
const freq = strudel.webaudio.getAnalyzerData('frequency', analyzerId); // as Array<number>;
const bucketSize = freq.length / buckets;
// inspired from https://github.com/tidalcycles/strudel/blob/a7728e3d81fb7a0a2dff9f2f4bd9e313ddf138cd/packages/webaudio/scope.mjs#L53
const normalized = freq.map((it /*: number*/) => {
const norm = clamp((it - min) / (max - min), 0, 1);
return norm * scale;
});
return normalized.slice(bucketSize * index, bucketSize * (index + 1)).reduce((a, b) => a + b, 0) / bucketSize;
};
</script>