Skip to main content ↑ ↓
Topic: VGM web player in JavaScript (Read 92474 times) previous topic - next topic
0 Members and 3 Guests are viewing this topic.

VGM web player in JavaScript

After almost two years of work (at least one year of which was a sabbatical from personal projects) and almost 10 years of research, I've finally completed a working VGM player in JavaScript! I've also successfully implemented gzcompressed VGM handling in it using zlib.js, officially bringing the player's capability to VGM v1.50 spec.

SN76489, YM2413, and YM2612 cores are ported from the Genesis Plus GX emulator; YM2151 core is slightly modified from Kuma's MDX player. The player itself is my hand-rolled "NPlay" script (yep, "N" branded ;) ) to attach audio output to the XAudioJS library by Grant Galitz using jQuery. Many thanks to the SpritesMind Forums community for the massive amount of info on the YM2612, Grant Galitz for making XAudioJS so I didn't have to, GitHub user imaya for the zlib.js that powers the VGZ decompression, VGM maintainer ValleyBell for the massive amounts of direct help with the development of the various cores, vgmrips webmaster vampirefrog for various suggestions, support, and other web VGM playback development, and the vgmrips community for advancing the VGM format beyond the SMS, Game Gear, and Genesis.

The sound chip scripts should be platform-agnostic and therefore usable in Sphere, but there may be an errant web-only line or two and there are a lot of console.log calls that would need to be commented out. The point is JavaScript-only playback of the VGM format is entirely possible and my player is currently the proof-of-concept of such. One day either myself or someone else will port the player to Sphere APIs.

Re: VGM web player in JavaScript

Reply #1 –
I tried out the songs and wow it is amazing. The very fact it may work in Sphere (I say may since Sphere would need to use it's raw file support and some other methods for reading binary data), is awesome. But, I wonder is Sphere's JS fast enough? Fast enough to run the song on top of other logic?

I'll have to try that someday.
If you use code to help you code you can use less code to code. Also, I have approximate knowledge of many things.

Sphere-sfml here
Sphere Studio editor here

Re: VGM web player in JavaScript

Reply #2 –
Quote from: Radnen – on

(snip) But, I wonder is Sphere's JS fast enough? Fast enough to run the song on top of other logic?

I'll have to try that someday.


Considering the web version NEO linked skipped for me quite badly at a few points, with an i7 and Firefox 30, I'm going to guess probably not. :(

Also, out of curiosity, how does this output the sound?  If there's a completely portable way to do that with JS's standard library, I don't know about it.

Re: VGM web player in JavaScript

Reply #4 –
Quote from: Lord English – on
Considering the web version NEO linked skipped for me quite badly at a few points, with an i7 and Firefox 30, I'm going to guess probably not. :(

Also, out of curiosity, how does this output the sound?  If there's a completely portable way to do that with JS's standard library, I don't know about it.


The skipping is almost certainly entirely my fault for not buffering the output properly; a properly written player with properly written buffering would likely have no problem. Play one of the Street Fighter II or Sonic The Hedgehog SMS songs and have the tab focused to hear what butter-smooth output on this player is supposed to sound like. The tab not being the foreground tab will contribute to stuttering. I don't currently have Firefox installed on this laptop and have been using Chrome to do everything, so I wouldn't be surprised if there are Chrome vs. Firefox discrepancies.

Sound is output via Grant Galitz's XAudioJS library, a wrapper for Web Audio APIs with a Flash fallback for browsers lacking Web Audio. The array of samples is generated in VGM.js and NPlay attaches VgmFile.fillSamples to XAudioJS's buffer request callback (which is on a 16ms interval when not paused).
 

Re: VGM web player in JavaScript

Reply #5 –
This is pretty freakin' sweet, though the music seems to be playing mainly through the right speaker for me. (Chrome stable, 64-bit Xubuntu 14.04)

Re: VGM web player in JavaScript

Reply #6 –
Quote from: Flying Jester – on

@Lord English: Y U No Use Fx32?


Well, it looks like my Firefox just updated itself to v31 at any rate, didn't realize there was a new version out.  Honestly, I stopped keeping tabs on new Firefox versions once they went to rapid-release and just let the auto-updater do its thing.  As for Fx 32, I assume that would require me to switch to the beta channel.  Unless v32 has some awesome feature that 31 doesn't, I see no reason to switch over to a potentially less stable update channel.

Re: VGM web player in JavaScript

Reply #7 –
Imagine 31 as '4.31'. That's what I do. We've moved to version 4, and for simplicity's sake we just don't bother saying 'four' first.

Than it all makes sense.

Re: VGM web player in JavaScript

Reply #8 –
Quote from: DaVince – on
the music seems to be playing mainly through the right speaker for me. (Chrome stable, 64-bit Xubuntu 14.04)


I'll take a look. Which song(s) did this happen on?