Upcoming SGDK2 Implements Rules in HTML5

[bluemonkmn]

The sample project that I used to demonstrate HTML5 support (with the slime splotches and the platform) was a simple project that I had made before implementing support for HTML 5.  With the initial HTML5-supporting release of SGDK2 (2.2.0), I had to manually modify the generated HTML5 code to make the player react to inputs and make the map scroll.  Basically all the rules were ignored and I had to edit the JavaScript directly to make them work.

However, with the work I did this weekend for version 2.2.1, I have managed to make that project work entirely on its own.  Just generate the HTML5 code and all the rules are now generated and working in a browser.  I think this is very exciting.  The best part is that the project itself did not have to change at all.  All the necessary conversions were taken care of during the HTML5 code generation process.  So with the code currently checked into source control (not yet released), fully functional simple projects can be entirely developed and generated to HTML5 code.  A basic set of functions have been implemented as JavaScript, and there are more to come.  And I am exposing the JavaScript code in the code editor too, very much like the C# code, so you can still add custom functions so long as you provide both a C# implementation and a JavaScript implementation (if your project is used to generate HTML5 -- if not, all you need is C#).

So I still have a little work to do, implementing more of the rule functions in JavaScript and documenting what things work and (hopefully only a few minor things that) don't work, but a release should be on its way soon.  Very much looking forward to fully functional HTML5 support in SGDK2!

[tprime]

Awesome! 

[v6v]

How exactly will sound be handled, loading a file with HTML5 Audio?

And on top of that, since it seems like the HTML5 Output will eventually reflect an actual game, which would you honestly reccomend people to output to- Browser games or Standalone Binaries?

[Vincent]

Wow!  Great stuff! 

[bluemonkmn]

How exactly will sound be handled, loading a file with HTML5 Audio?

Sound will probably not be part of the standard supported features with 2.2.1.  It was kind of an add-on even with the C# projects being the FMOD-based "custom object" that it is.  However, I was thinking sound would eventually use HTML5 Audio.  It's unfortunate that HTML5 Audio does not support MOD files, though.  That's one of the reasons I chose FMOD.  Anyway, even without "standard" sound support in 2.2.1, I think it will be possible to write functions into a project that support sound.  And if I have the patience and good-fortune to find a good solution before releasing, I may include some support for sound delivered with 2.2.1.  If you have any better suggestions over HTML5 audio, I'm open.

And on top of that, since it seems like the HTML5 Output will eventually reflect an actual game, which would you honestly reccomend people to output to- Browser games or Standalone Binaries?

There isn't one right answer there.  If you want all the flexibility and power of .NET (and FMOD) and don't mind restricting the portability of your project to computers with .NET Framework installed, then a standalone binary is best.  If you are willing to give up some of the flexibility and power of .NET in exchange for the portability of JavaScript and HTML5, then a browser game is the answer.  In case it's not clear, though, when you create a game within the restrictions of SGDK'2 HTML5 support, you can build to *both* browser *and* stand-alone binary without making any changes to the project (it's just a build option).  So if you can live within those restrictions, you can give end users the choice of which format they'd like to have the game in.  It's easy to build both.

[v6v]

Well I honestly don't know any other way of playing audio without having to download a plugin- but I've also never compared performance between all known methods.

Hey, if it's not too much, is there any way for us to make our own rules for the HTML5 in the IDE, say an Editor that allows you to create a rule and paste the Javascript code that follows?

I tried deciphering the page source to the HTML5 output but it seems fairly difficult in terms of adding more complex rules.

[bluemonkmn]

Hey, if it's not too much, is there any way for us to make our own rules for the HTML5 in the IDE, say an Editor that allows you to create a rule and paste the Javascript code that follows?

And I am exposing the JavaScript code in the code editor too, very much like the C# code, so you can still add custom functions so long as you provide both a C# implementation and a JavaScript implementation (if your project is used to generate HTML5 -- if not, all you need is C#).

You mean like that?

[v6v]

Curse my selective comprehension 

Heck, I wonder what I could possibly do with Ajax and a bunch of PHP files

Wow, I'm extremely excited for this! I really wanted to finish my game before I go to college, maybe this may finally be the thing that keeps me motivated throughout the process!

Oh, one final question, if you've reached that rule: how will SaveGame Files work, in the same file format as the Desktop edition?

Can't contain... excitement

[bluemonkmn]

Actually SaveGame was one of the first rules I had to implement because the simple test project I was using relied on SaveGame to reset the game when you die.  And just yesterday I implemented the ability to distinguish between temporary and permanent slots, but I haven't tested it yet.  I think it'll work, though.

The format is very different.  Saved games will not be portable between desktop and web games.  The web version uses JSON.stringify to store much of the information about the state of the game because .NET binary serialization is not available, and the data maintained by the JavaScript engine is very different than that maintained by the .NET engine anyway.  Another difference (at the moment at least) is that saving and loading games does not (yet) construct new instances of layers or maps, only sprites.  Rather than de-serializing saved game data to a new instance of a layer or a map, it simply resets the existing layer or map to the state stored in the saved game.  This may change somewhat because I just encountered a possible problem when switching maps.  There's no way to automatically reset a map to its initial state to simulate the .NET behavior of unloading and re-loading a map if you choose to unload a map when switching to another.  So I might be forced to at least make a map and its layers reset-able if not 100% serializable.  Sure I could simulate this by internally saving the initial state of a map and its layers for use with the reset feature of SwitchToMap, but that seems like cheating.  Then you'd have 2 copies of the initial state of the map in memory -- one in the code and one in the serialized copy.

And the saved games will not be saved in normal files, of course.  Temporary saves will still be in memory only, but permanent saves will be in HTML5 "Local Storage" using localStorage.setItem.  It's a beautiful thing, and as I was working more on the saved games yesterday I was very pleased with how well it fit right into what HTML5 provided.  I'm glad I didn't do this earlier when it could have been much messier.

I know the feeling of "can't contain... excitement" .  What they hey, I might as well post what I've got so far: http://sgdk2.enigmadream.com/ben/BenJ.html

[v6v]

Ohoho, I see Sprite Collisions and Use of inputs rather than "Any other Key"
This is incredibly impressive, It appears from the looks of things I may be able to make a Perfect Replica of my Game (With all the functionality)
The game runs smoothly, no framerate issues whatsoever! It actually runs as noticeably nice as a desktop game would.

I bet there's plenty of ActionScript Developers that would blow their lids upon seeing this!
So SGDK2 will officially also be a browser game development engine? Prepare to see the forums grow exponentially!

Hey, I wonder who controls the Wikipedia page- they might need to do some updating.

[Vincent]

Very nice!  Inputs, collision, reloading after death, etc.  It's definitely improving.  Good job!

[bluemonkmn]

Ohhh... I forgot about sprite collisions.  Right now it's only the function for landing on a platform that is checking if the rectangles overlap.  That will be an interesting challenge.  I wonder if it'll be worthwhile or even practical to try to implement pixel-perfect collision detection again.  I'm tempted to only implement rectangular collision detection for the web.  I suspect players are rarely discerning enough to tell (or care about) the difference.  And generating and maintaining those collision masks can get expensive.  Probably won't be in 2.2.1 at least... maybe something for later, though.

As for the wikipedia page, I updated it in November.  And I don't usually update it until after I release.  It even mentions HTML.  And "who controls it" is perhaps a rhetorical question?  Anybody can edit Wikipedia pages of course, but probably nobody else will, so it usually falls to me.

[durnurd]

You may want to consider some simple collisions, like circles, or rectangles that are not the same size as the sprite.  Not sure where that would go in the IDE though.

[v6v]

http://www.nihilogic.dk/labs/pocket_full_of_html5/

*Leaves this here*

[bluemonkmn]

You may want to consider some simple collisions, like circles, or rectangles that are not the same size as the sprite.  Not sure where that would go in the IDE though.

It could simply be a separate collision detection function: "isSpriteWithinRadius"