Skip to content

General JavaScript VGM player discussion

Technical discussion about the VGM format, and all the software you need to handle VGM files.

Moderator: Staff

  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

Hmm, what about this then. Register the vgz extension to an Android player. Detect if the app is installed with getInstalledRelatedApps on vgmrips.net. If so use offer the vgz to the native app. If not use mp3.

Post by vampirefrog »

That sounds good, niek.

The vgmrips specific app I am thinking of would be able to:
- play vgm/vgz
- have vgmplay settings like number of loops, number of fade-out seconds, select chip cores, mute channels (though I don't know how useful that is on mobile)
- have volume and perhaps playback speed
- allow you to login to your vgmrips account
- allow you to rate packs
- allow you to view/create/delete vgmrips playlists
- allow you to favorite tracks or add to playlists
- allow you to play vgmrips playlists
- allow you to cache files or packs you listen to
- allow you to download the entire vgmrips archive locally on your device and listen offline
- perhaps even allow you to comment (ie add a reply in the forum thread for the pack you're commenting on), or at least open the thread URL in the browser and possibly log you in automatically.

Basically everything you can do on the site, except with local emulation and possibility of offline data.

I guess it would require an API of sorts, which we don't have currently. Either way, it's not a high priority for now.
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

It's an option to build everything in the app, which is a long list, but if the app uses the website the list of the requirements is short; use native playback and offline storage.

I think adding some Javascript to the site to detect if it's running as part of a webview in a specific app in Android is close to enough. If that's the case the site shouldn't start the MP3 playback but it should offer the original vgz/vgm file.

I'll create a POC, no idea when however. :D
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

Is there any interest for this last idea? To have an Android app that gets detected by vgmrips.net so the vgz file will be used for playback instead of the mp3 file? Including local caching... I'll make it open source from the start. But it would be nice to have some testers at least, and maybe some other Android developer. Because it would be nice to have convenient playback and some additional features like AVRCP and lock screen controls.

Post by vampirefrog »

It sounds very nice, I can help test on a Motorola G6 Play (2:1 screen).

There's already a vgz download function, not sure what else the site could do. Do you want it to somehow capture the browser clicks or something like that?
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

In the top post from this page from a year back I was suggesting getInstalledRelatedApps, but some research now showed me that's still pretty bleeding edge.

This could work I'd say: https://stackoverflow.com/questions/276 ... -of-an-app

I think it's important to offer a nice player experience to the user, this would need a native display of all previously downloaded music, with all normal options for a decent player (which is a lot actually :| )

Just one more option is needed; a vgmrips.net pull down for downloading which opens the website when selected. It might be nice to then detect the player and just display a few of the pictograms on vgmrips.net for searching through the music, but a bit bigger; browse by soundchip, composer, company or system. One doesn't need to access the other options from a music player app. From there everything can behave the same for searching.

When the correct game is found on vgmrips, everything can keep the same, except it should offer the vgz file instead of the mp3 file when clicked. If the filename is in the cache, play it locally still, if not download it...

Or something like that?
Last edited by niekniek on 2019-04-21, 23:37:22, edited 1 time in total.

Post by vampirefrog »

then what

Post by vampirefrog »

you can capture clicks on vgm/vgz links from the android code?

Currently the links on the songs in the list go to the fragment url, for example 'https://vgmrips.net/packs/pack/virtua-c ... age-select'. You're saying that, if I detect that it's inside a webview, that href should go to the vgz? Can you inject a script into the page that takes the vgm/vgz URL from a data-* attribute and replaces the href? Cause then I don't have to do webview detection at all and you can just inject the script and I can just add a data- attribute.
  • ctr Offline
  • Posts: 492
  • Joined: 2013-07-17, 23:32:39

Post by ctr »

I think the way most applications with webviews handle it is by adding a custom protocol (i.e. "vgmrips://game name/01 song name.vgz") which can be registered by the app. The site can read the useragent or another request field and serve vgmrips protocol URIs instead if it detects a request from the webapp. This would work with electron and other similar frameworks too. Don't know the exact specifics though, maybe niekniek would know.

Post by vampirefrog »

I think if it can capture custom protocols it can capture urls by regexp, so it can just capture

Code: Select all

.vg[mz]$
or whatever. Afaik the youtube app can capture youtube.com urls.

Post by vampirefrog »

I've made it so if the user agent contains the word 'WebView', the href changes to the vgm/vgz file. There is also a data-vgmfile attribute on each row of the player table, if that helps any.

https://vgmrips.net/packs/js/player.js

Code: Select all

if(navigator.userAgent.match(/WebView/)) {
	$('table.playlist tr').each(function(i, el) {
		$(el).find('a.beginPlay').attr('href', $(el).data('vgmurl'));
	});
	return;
}
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

Nice!

I'll get started with the project on Github soon...
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

I've been messing with the Android Webview and vgmrips.net. I've checked with Chrome on my iMac simulating User Agent 'WebView', and your trick with that works fine, but the user agent string from the Webview on my phone does not contain it.

According to https://stackoverflow.com/questions/318 ... id-webview this is not a nice way to detect it anyway.

Maybe use after the url: ?browser=webview

Tested that, it could be done like that.

Post by vampirefrog »

ok try now with browser=webview:

Code: Select all

function isWebView() {
	if(navigator && navigator.userAgent && navigator.userAgent.match(/WebView/))
		return true;
	if(window.location && window.location.href && window.location.href.match(/browser=webview/))
		return true;
	return false;
}

jQuery(document).ready(function() {
	if(isWebView()) {
		$('table.playlist tr').each(function(i, el) {
			$(el).find('a.beginPlay').attr('href', $(el).data('vgmurl'));
		});
		return;
	}
.
.
.
  • User avatar
  • niekniek Offline
  • Posts: 71
  • Joined: 2017-07-17, 23:28:35

Post by niekniek »

Didn't work in my app, then I tried with https://vgmrips.net/packs/pack/bombaman ... er=webview with Chrome on my iMac, when clicking a track it starts playing instead of offering the vgz.

Looked at player.js, no browser=webview support:

Code: Select all

jQuery(document).ready(function() {
	if(navigator && navigator.userAgent && navigator.userAgent.match(/WebView/)) {
		$('table.playlist tr').each(function(i, el) {
			$(el).find('a.beginPlay').attr('href', $(el).data('vgmurl'));
		});
		return;
	}
Post Reply