Forums

Sega Master System / Mark III / Game Gear
SG-1000 / SC-3000 / SF-7000 / OMV
Home - Forums - Games - Scans - Maps - Cheats - Credits
Music - Videos - Development - Hacks - Translations - Homebrew

View topic - JavaScript VGM Player

Reply to topic
Author Message
  • Joined: 06 Mar 2002
  • Posts: 49
Reply with quote
JavaScript VGM Player
Post Posted: Sat Feb 18, 2012 2:58 pm
Hi, guys. It's been a while since I was around these parts. Looks to be something like 10 years (!) since I last posted anything here.

I don't know if any of you remember that I wrote a Java-based VGM player in 2002 or so. Since then, I've written a few more VGM players - a couple of Linux-based players, a Dreamcast version, and a testbed for a YM2612 emulator I was writing for a Dreamcast MegaDrive emulator. So, when I was playing around with Firefox 4's Audio Data API last year, I wrote yet another VGM player.

It was kind of incomplete, but it worked. It's been languishing on my hard drive ever since, until I dusted it off a couple of weeks ago. I fixed it up so it works on current browsers, added support for Chrome's Web Audio API (adding stereo output and arbitrary sample rate to make it work there), and stuck a very basic GUI on it.

It works in Firefox 10 and Chrome 17. I don't think it works on anything else.

Features:
  • Supports VGM 1.50
  • Supports the SN76489
  • Stereo output, at arbitrary sample rate (uses 44100Hz on Firefox, 48000Hz on Chrome)
  • Looping
  • Reading tags
  • Enough UI to select a song
And that's about it. The missing features list is more extensive:
  • Doesn't support compressed VGMs - they have to be decompressed
  • Doesn't support any other sound chip
  • When playing a looping file, it will loop forever
  • Doesn't support the GameGear's stereo register
  • The UI doesn't display tags
  • While we're at it, the UI doesn't display anything at all - no status, no errors, no nothing


The forum software apparently won't let me post links, so I've attached the source code, with the music from Sonic the Hedgehog. It works as-is from Firefox (just open index.html), but it won't work in Chrome without a web server.

Rather than just let this thing lie dormant on my hard drive for the next eternity, I was wondering if anyone might have a use for this?
VgmPlayer.zip (41.39 KB)
JavaScript VGM Player

  View user's profile Send private message
  • Site Admin
  • Joined: 19 Oct 1999
  • Posts: 12334
  • Location: London
Reply with quote
Post Posted: Sat Feb 18, 2012 8:49 pm
I hooked you up with your old forum posts, which also means you're free to post links now. There's a Javascript SMS emulator somewhere which probably does something similar..? I think there may also be some JS libraries that abstract away the different browsers' audio APIs.
  View user's profile Send private message Visit poster's website
  • Joined: 25 Jul 2007
  • Posts: 544
  • Location: Melbourne, Australia
Reply with quote
Post Posted: Sun Feb 19, 2012 6:16 am
There have been a couple of attempts in the past but I am yet to see one that works as described.

neologix had a few projects on the burner but doesn't look like he's done much with them:
http://www.smspower.org/forums/viewtopic.php?t=13310
http://www.smspower.org/forums/viewtopic.php?t=13148
http://www.smspower.org/forums/viewtopic.php?t=13234

There was also this one, but I've tried it in every browser and can't get it to make a sound:
http://blargg.parodius.com/gme_java/


What I would love to see actually is an android VGM player, at the moment I get around it by transcoding them into mp3's.
  View user's profile Send private message
  • Site Admin
  • Joined: 19 Oct 1999
  • Posts: 12334
  • Location: London
Reply with quote
Post Posted: Sun Feb 19, 2012 8:40 am
(OT) I use DeaDBeeF on Android, it works reasonably well for PSG.

SMS emulator in JavaScript:

http://gmarty.github.com/jsSMS/
  View user's profile Send private message Visit poster's website
  • Joined: 15 Sep 2009
  • Posts: 370
Reply with quote
Post Posted: Sun Feb 19, 2012 1:04 pm
It's nice to see an in-browser VGM player.
It works very well on Firefox and doesn't seem to be CPU-heavy, but for some reason the audio stops for a short moment every second when you're viewing another tab. But I don't know if you can do something against that.
  View user's profile Send private message
  • Joined: 25 Jul 2007
  • Posts: 544
  • Location: Melbourne, Australia
Reply with quote
Post Posted: Sun Feb 19, 2012 1:39 pm
Maxim wrote
(OT) I use DeaDBeeF on Android, it works reasonably well for PSG.


Cheers, actually I found an IMO better one called Droidsound.
  View user's profile Send private message
  • Site Admin
  • Joined: 19 Oct 1999
  • Posts: 12334
  • Location: London
Reply with quote
Post Posted: Sun Feb 19, 2012 3:17 pm
(Still OT) That seems to be multi-track-file oriented and doesn't seem to progress to the next track for me.
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Wed Apr 25, 2012 11:21 pm
HOLY CRAP; i'm gone for a few months, and not only is there a new site for non-sega vgms there's a JAVASCRIPT VGM PLAYER. NICE!

re my projects - it seems my site is down at the moment, but the github projects still exist and except for vgm.js are relatively complete; the ym2612 and psg js cores do work, however, and can be attached to audio generators to actually play stuff. since i can't rely on my host to keep my site working properly and i haven't gotten a response from steinberg re my js port of vst, i'm gonna put my vst.js stuff on github, which includes sample pages for testing the ym2612 and psg.

re my vgm.js project specifically - i wanted to make it platform-agnostic so not only could ppl use it in webpages, but i could also use it in game engines w/js scripting like sphere and unity. a bit of ambition also led me to add built-in capabilities to extend its functionality to allow, say, running custom functions during vgm instructions like conversion to midi. since this js vgmplayer looks to work, i think i'm gonna adapt its output methods (properly credited, of course) and see what happens.

great stuff, BTW!
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Sun Jul 15, 2012 2:31 am
double-post update:

I've succeeded in changing the audio sink to Grant Galitz's XAudioJS, so now I got the thing to play in Chrome.

http://www.luxatom.com/VgmPlayer/

I need some help debugging, tho. Using BlackAura's existing PSG works, but I want to use my PSG.js to see how easily a "drop-in" chip solution can work; if you toggle "Use Drop-In core?" you'll hear the results, that is to say...static. It's the same PSG core I put into my VST.js PSG demo (ie, my JS SN76489) but something is wrong w/the way I pass its output to the audio buffer.

(edit - you can now mute PSG channels if my drop-in core is selected; solo the noise channel and you'll hear it sounds like a square instead; please help me fix this!)

Please help! Once this is resolved I can drop in YM2612.js and then finally start work on YM2413.js!
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Tue Jul 17, 2012 11:15 pm
triple-post update:

the noise issue is fixed thanks to valleybell's help :) now i must fix a pitch issue before i can consider completely replacing the built-in psg code w/a "drop-in" solution for "integration;" my frequency counter code is wrong (among other things it seems i cast one of the affecting values incorrectly as int).

once this is resolved, then on to the ym2612!
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Fri Jul 20, 2012 7:26 pm
4X POST COMBO!!!!

Drop-in PSG now works properly :) The PSG github repo is now updated to reflect the fixes; many thanks to ValleyBell for the considerable amt of help I apparently needed on my JS SN76489 core. I will put my fork of the JS VGM Player on github after I do some visual cleanup, then I'll work on dropping in my JS YM2612 core; the repo will still contain BlackAura's PSG core (in case someone else wants to study his code) but it's disabled by default if my core is sourced properly on the web page.

After YM2612 is integrated, then I'll finally get around to YM2413.js (doesn't help that my posts are the majority of page 1 of Google search results for "YM2413 javascript") and this site can use it as a fully functional web-based VGM player :D
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Fri Aug 02, 2013 11:56 pm
5x post "Wiiiise fwom yoh gwave" combo!!!!!

I haven't worked on fixing the YM2612 code in a while, but I did feel the player itself could look a hell of a lot better than it does now so I cleaned it up.



It's also responsive!



I'll upload the update as soon as it's finished
  View user's profile Send private message Visit poster's website
  • Joined: 25 Feb 2013
  • Posts: 219
  • Location: Osaka
Reply with quote
Post Posted: Sun Aug 04, 2013 9:18 pm
This is great!
I just noticed that in chrome (24.0.1312.52, Linux x64) when the tab is not in the foreground the music becomes extremely slow.
  View user's profile Send private message
  • Site Admin
  • Joined: 19 Oct 1999
  • Posts: 12334
  • Location: London
Reply with quote
Post Posted: Sun Aug 04, 2013 9:30 pm
So how far are we from some js we can embed here that will download a zip and play the files in it?
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Tue Aug 06, 2013 9:37 pm
kamillebidan wrote
This is great!
I just noticed that in chrome (24.0.1312.52, Linux x64) when the tab is not in the foreground the music becomes extremely slow.


I need to update the version of XAudioJS that I use as the audio sink, and hopefully that will take care of most if not all of the audio problems. I wouldn't be surprised if the slowdown is caused by use of requestAnimationFrame instead of a setInterval call.

Maxim wrote
So how far are we from some js we can embed here that will download a zip and play the files in it?


Don't know about the "download a zip and play" functionality yet, but once I upload the updates and commit to GitHub it should be relatively easy to set it up as is in a standalone folder. It still doesn't read gzipped VGMs yet and requires the VGMs to be already unzipped, but once I put in the JS unzip functionality I was planning to it'd likely be trivial to add the ability to temp-unzip a VGM (compressed or uncompressed) and play it in the player.

Given the choice I'd still rather offload the gzip and most other file processing functionalities to a server-side script, but making the thing all client-side definitely has its advantages.
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Sun Apr 13, 2014 1:58 am
UPDATE!!!

I've implemented the visual refresh of my all-JavaScript web VGM player!

http://www.luxatom.com/VgmPlayer/

There may be a visual bug or two to stomp out, especially regarding its responsive/mobile behavior and the playlist; for example, I just found that I don't highlight the currently loaded song or album when the album list or songlist is expanded on smallest view.

Visual Updates

  • Responsive! Reflows itself for different browser widths and better overall layout on smartphone and tablet
  • Color scheme is muted blues for now until I can work out styling the player settings


Playback Updates

  • Working play/pause button :)
  • Removed YM2612 until I can fix it
  • Player code is cleaner and more flexible


Now that the visual refresh is online, I can work on fixing my JS YM2612 core. A reduced todo list is on the bottom of the page, though the style for "crossed off item" seems to have been lost in the transition. :/

It is now also easier to pack and distribute independent of my own site's code, though its functionality is still currently heavily tied to jQuery and XAudioJS. I need to change the directory structure for the music data but otherwise it should be a simple unzip-into-web-folder-and-play affair.

If anyone here wants to test locally let me know and I'll send you a zip until I can commit to a repository.
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Sun Jul 06, 2014 1:29 am
Update: re-enabled YM2612 because IT FINALLY WORKS!!!! ^____^

Now to actually finish YM2413.js, do the sampler for data blocks, and finally call VGM v1.50 complete in this player.
  View user's profile Send private message Visit poster's website
  • Joined: 12 Jul 2014
  • Posts: 1
Reply with quote
Post Posted: Sat Jul 12, 2014 5:42 pm
djbass wrote
Maxim wrote
(OT) I use DeaDBeeF on Android, it works reasonably well for PSG.


Cheers, actually I found an IMO better one called Droidsound.


There is a new version of droidsound available in my project page at github, just search for droidmjt, it's worth of checking.
  View user's profile Send private message Visit poster's website
  • Joined: 26 Apr 2014
  • Posts: 28
Reply with quote
Post Posted: Tue Aug 19, 2014 4:35 pm
Neo gets so excited when JS VGM players are brought into the discussion ^^
  View user's profile Send private message Visit poster's website
  • Joined: 27 Apr 2014
  • Posts: 281
  • Location: Where ever the TARDIS takes me
Reply with quote
Post Posted: Tue Aug 19, 2014 6:04 pm
It's a little slow on my laptop.
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Tue Aug 19, 2014 8:20 pm
Capt. 2110 wrote
It's a little slow on my laptop.

Probably one of the YM2612 VGMs with PCM; the web version is a little behind my local copy (which removes support for some older browsers to take better advantage of the current Web Audio API).

I know of one person definitively (Dj.TuBig/MaliceX) who has one of my possible fixes, and since I gave the link to it out in the vgmrips IRC channel it's possible others may have tried it out as well. Eventually I'll run a poll asking if y'all don't mind me removing support for older browsers, as that's one of the barriers to overall optimization.
  View user's profile Send private message Visit poster's website
  • Joined: 16 May 2002
  • Posts: 1107
  • Location: italy
Reply with quote
Post Posted: Tue Aug 19, 2014 8:30 pm
Define "older browsers". I also assume there is an absolute lower bound which can't be crossed in any case (e.g. IE4 lol).

Besides, how hard would it be to detect the browser and seamlessly run the appropriate code in any scenario? Would that require that much of a fork in the code?
  View user's profile Send private message Visit poster's website
  • Joined: 27 Apr 2014
  • Posts: 281
  • Location: Where ever the TARDIS takes me
Reply with quote
Post Posted: Tue Aug 19, 2014 11:43 pm
Does Netscape 4.1 count as old? How about IE 4.5? What about Firefox 1.1? I have three computers, one browser on each.
  View user's profile Send private message Visit poster's website
  • Site Admin
  • Joined: 08 Jul 2001
  • Posts: 7888
  • Location: Paris, France
Reply with quote
Post Posted: Wed Aug 20, 2014 9:15 am
This must a joke, are you using those browsers? The javascript wouldn't work on them anyway.
If your feedback is that it is slow please clarify your cpu/os/browser configuration so that BlackAura can hear the feedback and see if there's something he'd like or can do about it.
  View user's profile Send private message Visit poster's website
  • Joined: 25 Dec 2005
  • Posts: 521
  • Location: São Paulo - Brazil
Reply with quote
Post Posted: Wed Aug 20, 2014 4:39 pm
I would stick to HTML5 support.
  View user's profile Send private message
  • Joined: 27 Apr 2014
  • Posts: 281
  • Location: Where ever the TARDIS takes me
Reply with quote
Post Posted: Wed Aug 20, 2014 5:57 pm
Yes, Bock, it's a joke. But it feels like I'm using those browsers. It's that messed up, especially if I change pages.

It's an Asus S400C(A), with a Core i5, running Windows 8, with Firefox 31(I wish it were 3.1).

I would like to make a request though. Soundtrack for the Game Gear version of Star Wars.
  View user's profile Send private message Visit poster's website
  • Joined: 13 Nov 2007
  • Posts: 93
  • Location: New York, NY, USA
Reply with quote
Post Posted: Wed Aug 20, 2014 7:01 pm
@Bock - While it'd be nice if BlackAura continued his original version of the player, I'm pretty sure comments after a certain point are directed towards my fork.

@All - Comments about my fork should be posted on my official topic from now on, unless BlackAura folds in my massive amount of changes somehow and releases an update to his.

@Tom - Re switching audio sink on browser detection: That's actually something I've been playing around with, and that's the ultimate goal of the preliminary code I originally gave to MaliceX to try out. XAudioJS and the modern Web Audio API have enough differences that I essentially have to write two different sets of audio processing code, though.

@Niloct - If the above browser detection methods don't pan out I'll likely stick to the modern API, yes.

@Capt. 2110 - I don't actually have Firefox on this laptop anymore to try directly, so I rely on secondhand reports about its quality. XAudioJS on current versions of Firefox is a thing I have to ask Grant Galitz about since it's his project and he's actively using it in his all-JavaScript GBA emulator, IodineGBA.

With regards to playlists on my "public beta," the page I host myself is intended as a public beta and therefore only has a certain subset of VGMs in order to test out implementations of particular things in a live setting (which reminds me, I still have to put up the Bare Knuckle/Streets of Rage album for YM2612 CSM mode testing). SN76489 emulation, though needing performance optimizations, is solid and technically doesn't require anymore VGMs for testing. Once I can confirm YM2413 emulation is solid (MaliceX and ValleyBell have reported it's not) and/or once Bock and/or Maxim give the OK the code will be provided to SMS Power for use in an embedded player for this site (which should theoretically be able to play everything we currently have).

Future updates to my player will include dual chip support once I increase the supported VGM version, though none of the VGMs for licensed games on SMS Power require it. Once dual chip support development begins I'll look into adding more SN76489 VGMs to the beta's playlist.
  View user's profile Send private message Visit poster's website
  • Joined: 27 Apr 2014
  • Posts: 281
  • Location: Where ever the TARDIS takes me
Reply with quote
Post Posted: Wed Aug 20, 2014 7:13 pm
Ok, I'll try to give reports after every update, and thanks for replying.
  View user's profile Send private message Visit poster's website
  • Joined: 26 Apr 2014
  • Posts: 28
Reply with quote
Post Posted: Mon Nov 17, 2014 3:49 pm
For anyone interested in a live, but slightly modified demo, you can go here http://chiptune.ninja/dev/vgmplayer/

I've removed the stink-lite requirement, and just use AudioContext. It works in latest FF and Chrome.
  View user's profile Send private message Visit poster's website
Reply to topic



Back to the top of this page

Back to SMS Power!