HTML5 Curation

HTML5 games are not nearly as endangered as Flash games, and are in fact often cited as replacing the Flash medium. However, they still pose a risk of disappearing at some point in time, and therefore should be considered for curation just like other web game formats.

The following page is a tutorial on how to curate HTML5 games to add to Flashpoint.

Before You Start

This tutorial will assume you've read the standard Curation Tutorial, which is highly recommended to go through. Try curating a Flash game before moving on to HTML5.

Identifying HTML5 Games

If a web game doesn't ask to enable Adobe Flash Player and there's no sign or mention of any of the other Platforms, it is very likely an HTML5 game.

To confirm this, press F12 to open the Developer Tools of your browser and click the Network tab. Look for a .html file, likely with the filename "index.html". Copy the file's link and go to it. If it plays an unobstructed version of the game, you've found the source of your Launch Command.

Make sure to always use http:// instead of https:// to make sure Flashpoint grabs files from the fake Internet instead of the real one!

Grabbing The Game From The Internet

Some games have one or more image files that act as sprite sheets, others will have each unique texture as an individual file, so make sure to get them all.

Create a new curation in the Curate tab of Flashpoint Core and fill it out with as much information as you can, including the Launch Command you found earlier. The Platform should be HTML5, and the Application Path should be FPSoftware\Basilisk-Portable\Basilisk-Portable.exe, referring to the Basilisk browser used for HTML5 games.

After inputting the launch command, use Run with MAD4FP, and start playing the game. MAD4FP will download any assets automatically as you play and make progress.

REMEMBER, ALWAYS TEST THE GAME 100%, NO MATTER HOW BIG OR SMALL This is true for all games, but especially HTML5, as nearly none are single-asset, you are almost guaranteed to find a multi-asset. Because of how it works, most games will only call assets when needed, so make sure to navigate all the menus, click all the buttons, and play the game as turoughly as possible. This may include hidden collectibles, unique voice lines, downloadables, completion bonuses, etc.

Wayback will not save these missing assets on a normal capture, and computers/browsers tend to clear cache much more frequently for optimization, making cache dumps unlikely to yield anything, so once it's gone, it's likely gone for good. Better to catch everything first try and make sure it's not lost. for more information on multi-assets in general, go here.

After making sure you got the whole game, test it again, this time without using MAD4FP pressing the Run button.

Responsive Design Mode and Mobile Elements

Some games will have mobile controls, loading different assets.

Unlike traditional plugins, HTML5 allows games to be played on both Desktop and Mobile. This means that some games will implement Responsive Design elements so games work better on mobile platforms. This can load new assets such as the pages, scripts, elements, images, etc.

To check wether a game has these elements, play the game both in desktop and Responsive mode. On Basilisk in the developer console, enable Responsive Design Mode, then on the Responsive menu enable Touch Events, and make sure to reload the page as these elements might not have been loaded on Desktop mode. Use the Rotate button to test, as some games do not allow you to play in a certain orientation and will load warning messages.

Make sure to skim trough the entire game where these elements might show up, like parts with game controlls or menus.

Troubleshooting

https removal

, because there are an extremely low number of HTML5 games that are single-asset. Your curation is almost guaranteed to be multi-asset. From here, you have two main options, both of which are described here

Don't be surprised if it doesn't work at first, HTML5 games are realively stable and mostly work, but a common occurence is the game refusing to load assets. This most likely is because of https requests inside the code of the game calling for files on the live web and failing, instead of http which calls local files. You will need to find and replace all instances of https with http in the game files. You might need to repeat this step multiple times for different parts of the game. This is a really common form of hacking for HTML5 games, so much so that games with altered https requests don't really need to me marked as Hacked.

Missing assets

Alternatively, if MAD4FP isn't able to download a certain file, or Basilisk is having trouble running the application, you can Use cURLsDownloader. Simply copy & paste the URLs you wish to download, open cURLsDownloader, paste in the URL, and hit Enter.

Copy the contents of the Downloads folder outputted by cURLsDownloader, select the Open Folder button on your curation in the Curate tab, and paste the folder into the content folder of your curation.

Cleanup of junk Files

Since MAD4FP downloads every file requested by the game that still exists on the live web, you can get a lot of files that are unnecessary for the game to work. Be careful not to enter pages outside of the game as it will download them too, best way to prevent this is by knowing where this happens inside the game.

Even with these precautions, you will download junk form other services the website uses outside of the game. After deleting them, make sure the games still work without them.

Broken or non-functional games

Some games might require a certain browser we do not support, or newer versions/features still not available on Basilisk. Make sure to ask staff if this is really the problem.

If yes, altough unable to be played on the current version of Flashpoint being used, it should still be saved, as these features are likely to be supported in the future and the game work as a result.

For this, the best option is to run the game on the live web with the network tab open, and playing the game as if you were curating it as normal. After finishing, copy all cURLs, create a .txt file, paste and save. Next, drag & drop the file onto cURLsDownloader.bat

Copy the contents of the Downloads folder outputted by cURLsDownloader, select the Open Folder button on your curation in the Curate tab, and paste the folder into the content folder of your curation.

Make sure to write a note explaining that the game does not currently run in flashpoint;

 Game does not currently work as of Flashpoint version X.X, please test once a new version is released and remove this sentence if it's working.

Wrapping It Up

Follow the proper Curation Format, just like with any curation.

Pack everything into a single .7z or .zip file and submit it to the #other-game-curations channel of the Flashpoint Discord. Use the HTML5 emoji when submitting.