DEV Community

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

 
jpuls profile image
Jeff Puls

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

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