Show HN: Boing
boing.greg.technology
boing.greg.technology
setInterval(()=>{const canvas=document.getElementById('canvas');const startX=266;const startY=198;const rect=canvas.getBoundingClientRect();const startClientX=rect.left+startX;const startClientY=rect.top+startY;let endClientX,endClientY,distance;do{endClientX=Math.random()*window.innerWidth;endClientY=Math.random()*window.innerHeight;const dx=endClientX-startClientX;const dy=endClientY-startClientY;distance=Math.sqrt(dx*dx+dy*dy)}while(distance<25);const dispatchMouseEvent=(type,target,clientX,clientY)=>{const event=new MouseEvent(type,{view:window,bubbles:true,cancelable:true,clientX:clientX,clientY:clientY,screenX:clientX+window.screenX,screenY:clientY+window.screenY,buttons:type==='mouseup'?0:1,button:0});target.dispatchEvent(event)};dispatchMouseEvent('mousedown',canvas,startClientX,startClientY);setTimeout(()=>{dispatchMouseEvent('mousemove',window,endClientX,endClientY);setTimeout(()=>{dispatchMouseEvent('mouseup',window,endClientX,endClientY)},1);},1);},1);(function () { function rateToDistance(rate) { const minR = 0.09; const maxR = 4.65; if (rate < minR) rate = minR; if (rate > maxR) rate = maxR; const t = (rate - minR) / (maxR - minR); return 400 * t; } function dispatchMouseEvent(type, target, clientX, clientY) { const event = new MouseEvent(type, { view: window, bubbles: true, cancelable: true, clientX, clientY, screenX: clientX + window.screenX, screenY: clientY + window.screenY, buttons: type === "mouseup" ? 0 : 1, button: 0, }); target.dispatchEvent(event); } const canvas = document.getElementById("canvas"); function triggerPull(distance) { const rect = canvas.getBoundingClientRect(); const startX = 266; const startY = 198; const startClientX = rect.left + startX; const startClientY = rect.top + startY; const endClientX = startClientX + distance; const endClientY = startClientY; return new Promise(resolve => { dispatchMouseEvent("mousedown", canvas, startClientX, startClientY); setTimeout(() => { dispatchMouseEvent("mousemove", canvas, endClientX, endClientY); setTimeout(() => { dispatchMouseEvent("mouseup", canvas, endClientX, endClientY); resolve(); }, 50); }, 50); }); } const semitones = 12; const notes = { G: Math.pow(4, -9 / semitones), A: Math.pow(4, -7 / semitones), B: Math.pow(4, -5 / semitones), C2: Math.pow(4, -4 / semitones), D2: Math.pow(4, -2 / semitones), E2: Math.pow(4, -0 / semitones), F2: Math.pow(4, 2 / semitones), G2: Math.pow(4, 4 / semitones), }; async function playWithPitch(rate) { const r = rateToDistance(rate); await triggerPull(r); } async function playScale() { const qrt = 200; const hlf = 400; const fll = 800; const pause = 15; const playNote = async (note, dur) => { await playWithPitch(note); await new Promise(res => setTimeout(res, dur)); }; const loop = async () => { await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.C2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G2, qrt); await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.C2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G2, qrt); await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await new Promise(res => setTimeout(res, pause)); await new Promise(res => setTimeout(res, pause)); }; await loop(); await loop(); await loop(); } playScale(); })();
cheers, 3d is glorious.
(function () { function rateToDistance(rate) { const minR = 0.09; const maxR = 4.65; if (rate < minR) rate = minR; if (rate > maxR) rate = maxR; const t = (rate - minR) / (maxR - minR); return 400 * t; } function dispatchMouseEvent(type, target, clientX, clientY) { const event = new MouseEvent(type, { view: window, bubbles: true, cancelable: true, clientX, clientY, screenX: clientX + window.screenX, screenY: clientY + window.screenY, buttons: type === "mouseup" ? 0 : 1, button: 0, }); target.dispatchEvent(event); } const canvas = document.getElementById("canvas"); function triggerPull(distance) { const rect = canvas.getBoundingClientRect(); const startX = 266; const startY = 198; const startClientX = rect.left + startX; const startClientY = rect.top + startY; const endClientX = startClientX + distance; const endClientY = startClientY; return new Promise(resolve => { dispatchMouseEvent("mousedown", canvas, startClientX, startClientY); setTimeout(() => { dispatchMouseEvent("mousemove", window, endClientX, endClientY); setTimeout(() => { dispatchMouseEvent("mouseup", window, endClientX, endClientY); resolve(); }, 50); }, 50); }); } const semitones = 12; const notes = { G: Math.pow(4, -9 / semitones), A: Math.pow(4, -7 / semitones), B: Math.pow(4, -5 / semitones), C2: Math.pow(4, -4 / semitones), D2: Math.pow(4, -2 / semitones), E2: Math.pow(4, -0 / semitones), F2: Math.pow(4, 2 / semitones), G2: Math.pow(4, 4 / semitones), }; async function playWithPitch(rate) { const r = rateToDistance(rate); await triggerPull(r); } async function playScale() { const qrt = 200; const hlf = 400; const fll = 800; const pause = 15; const playNote = async (note, dur) => { await playWithPitch(note); await new Promise(res => setTimeout(res, dur)); }; const loop = async () => { await playNote(notes.C2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.D2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G, hlf); await new Promise(res => setTimeout(res, pause)); await playNote(notes.D2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.E2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G2, qrt); await playNote(notes.F2, qrt); await playNote(notes.E2, qrt); await new Promise(res => setTimeout(res, pause)); await playNote(notes.C2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.D2, fll); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G, fll); await new Promise(res => setTimeout(res, pause)); await new Promise(res => setTimeout(res, pause)); await playNote(notes.G, qrt); await playNote(notes.G, qrt); await playNote(notes.A, qrt); await playNote(notes.C2, qrt); await new Promise(res => setTimeout(res, pause)); await playNote(notes.C2, qrt); await new Promise(res => setTimeout(res, pause)); }; await loop(); await loop(); await loop(); } playScale(); })();
while true; do curl -X POST -Ss https://respected-accordion-31461.ondis.co/boing &; sleep 0.1; doneIt’s basically controlled sloppiness.
Confused. Perfect physics means perfectly simulating reality, not perfectly simulating an unreal idealized formula. Are you saying Hooke's law doesn't feel realistic or are you saying a simulator for a realistic spring doesn't feel realistic?
This leads to what GP was saying: many just cut things off at "Hooke's law simulates a spring, so I'll use that, but the rest is a bit too much to fit so I won't do it" but "Hooke's law simulates a spring but adding a bit of not-physics based fluff approximates all the rest" actually gives far superior results even though it doesn't only use perfect physics equations as the former did.
To get somewhat more realistic model of a spring, you a damping term, which turns it into an ODE[1].
There's something therapeutic about door springs, that you just have to stop and play with it.
* I recall when Cheryl had her first baby while at University. I also recall when she had her second.
~ https://en.wikipedia.org/wiki/Cheryl_Praeger
Maybe work on making more insightful and considered comments: https://news.ycombinator.com/threads?id=brcmthrowaway
Time to recreate the classic: https://www.youtube.com/shorts/pTgJaJYHIAs
If I bend it right round to one side so the spring is curved I expect it to bounce round to the other side.
thanks!
In-memory ip address rate limiting.
Hosted and deployed on a ~$20 EC2 server using the open source tool I've been working on, https://disco.cloud/
We were at ~120 requests/second earlier and it took it on, no sweat.
EDIT: done! deploying.
wow ok that was a really good idea.
Ideal springs are a common, simple element in this field, but this kind of spring is very much not that.
You're probably better off improving the sample-based version by fading out the audio when necessary and using different samples based on the way it's triggered. If you have "ultra-dry" samples (maybe taken with a contact mic), you can add a convolution effect with a well-chosen impulse response, this will allow you to sharply cut off or adjust the audio and still have a natural-sounding tail.
If you don't mind humoring me (I'm quite the novice in this field), if I automated the recording of "all" possible positions for a spring (say I had a motor positioned in a way that would let me pull the spring in any polar direction), would that make modeling potentially easier?
There might be a "train an AI, here's 1000 recordings" angle, but I'm not necessarily interested in/asking about that.
Just strictly for modeling, would it help the R&D phase to have a lot of high sample rate recordings? Thanks a lot!
P.S. Also, if you have a good intro to DSP class/book, I'd love to hear it. I know about a few, but a recc is always appreciated
I don't think that recording a large number of starting positions would help that much with creating a (non-ML) model, and I doubt a high sample rate would provide much useful information either. A more common approach would be to try getting separate sounds for the impulse and the resonant body, though they may be impossible to really separate, and the actual model may end up more complex than that.
You probably have a good starting point already with your code for the animated model. I think the sound mostly comes from the collision between coils (collisions not visible in your animated model), and almost entirely from the lowest couple of windings that are against the wall. This is your impulse. The resonant body might be in 2 parts: the wall and the long end of the spring. Your existing model can tell you when to trigger the impulses, and how much force to put into them.
For resources, one of my favorite intros to DSP is the one by Sean Luke: https://cs.gmu.edu/~sean/book/synthesis/
I wrote my own intro to physical modeling, though it focuses on different instruments: https://www.osar.fr/notes/waveguides/
Julius O. Smith has an encyclopedic amount of content on the topic, though it's often condensed into math that can be hard to apply: https://ccrma.stanford.edu/~jos/
That, or Settings -> Sounds & Haptics -> Silent Mode ?
Safari, Mac.
When wiggle the spring, keep the mouse inside the white area until it is at rest, press CTRL+u to see the source code, move the mouse to close the source code tab and close it - for some magical reason the spring is moving again for a little bit.
Just fixed, should be live soon.
There will also be no sound there if your phone is in Silence mode. However if Learning Synths works but not mine, then something else is happening.
Thanks!
Probably because I have Lockdown mode enabled, and/or NextDNS
three.js, audio generating.
try reloading again?
https://www.decisionproblem.com/paperclips/
You can hate me and/or close the window at any point, friend...
This is not an ad, there's no affiliate link... but the physics & drawing code were one shot by the recently released Gemini 3 Pro. It was pretty incredible to see. Additional tweaks & boing counter server by Claude Code.
but I agree - I have some other mono-site-ideas like these in mind, and I think that the accelerator could be very fun. thanks for the suggestion!
This might have to wait for the native app versions ha.