DEV Community

loading...

Discussion on: How to Destroy a Web Page - (Digital Ocean Hackathon Blog: Part 3 - Finale)

Collapse
szhabolcs profile image
Nagy Szabolcs

Really nice! How did you manage to pull it off?

Thread Thread
jpuls profile image
Jeff Puls Author

It actually ended up being a very simple solution.

So Howler includes built-in spatial audio features (for both 2D and 3D). For basic 2D which is obviously what this project uses, when instantiating the Howl object, there is an optional parameter stereo that takes a value of -1 to 1 (-1 being full left, 1 being full right) that controls the stereo-channel bias for the sound.

When the weapon fires and generates a particle, this bias value is calculated based on the relative position of the cursor from the center of the viewport (so the left half of the screen gives a value between 0 and -1, the right half gives 0 to 1). Pass this value to the Howl object's stereo property, and you get basic 2D spatial audio!

I might actually write up a quick post explaining the code behind it...

Thread Thread
szhabolcs profile image
Nagy Szabolcs

Oh nice! Good to know, thank you :)

Thread Thread
jpuls profile image
Jeff Puls Author

I made a more detailed post on the subject if you would like to learn more 😎