Proof-of-Concept "Web Runtime" Demo (HTML5 / Flash 10)

deadsuperhero · Fri 14/01/2011 16:19:40

Quote from: tzachs on Fri 14/01/2011 13:43:49
That's pretty exciting!
Specifically the flash port would be most useful in order to get AGS game distributed to portals.

There would be a field day on a site such as Newgrounds, I'd imagine.

benco · Tue 18/01/2011 12:28:15

First of all, as everybody said: Congrats !

You were the fastest ha ha

... I was planning to make an adventure game engine in html5/js. I had begun collecting resources last year and AGS (that's still my favourite engine) was in my opinion the best candidate to analyse (api requirements ...) for my first experimentations.

I took a look at your js code. Indeed, it's a really incomplete engine but there are nice stuffs all the same (in my case, I wasn't planning to base all on canvas but also on imgs-areas-maps but it seems to rock anyway) !

Just about the music and sounds:

* On mobile safari, there is currently a bug that impede playing more than one sound file at the same time and I don't know when they plan to fix it

* I think when the new mozilla audio api will be popularised and used , it will allow playing more audio formats - a bit like new flash 10 stuffs allow now. And there are already experimentations done about Amiga MODs playing what is really awesome: you might take a look at the dynamicaudio.js library and the jsmodplayer project on github, it's really interesting

Good luck with it all!

Denzil Quixode · Tue 18/01/2011 17:00:33

Quote from: benco on Tue 18/01/2011 12:28:15
First of all, as everybody said: Congrats !

You were the fastest ha ha ... I was planning to make an adventure game engine in html5/js. I had begun collecting resources last year and AGS (that's still my favourite engine) was in my opinion the best candidate to analyse (api requirements ...) for my first experimentations.

I took a look at your js code. Indeed, it's a really incomplete engine but there are nice stuffs all the same (in my case, I wasn't planning to base all on canvas but also on imgs-areas-maps but it seems to rock anyway) !

I have been wondering about attempting a really retro-DHTML renderer that doesn't need Flash or HTML5, just works with absolutely-positioned <img>s and <div>s and stuff. It wouldn't be able to do everything, but for a particularly simple game it might be enough. It's hard to imagine there are really that many people left who would benefit from it, though...

QuoteJust about the music and sounds:

* On mobile safari, there is currently a bug that impede playing more than one sound file at the same time and I don't know when they plan to fix it

Crap, that is annoying. I suppose the solution is to do some (ugly) browser-sniffing and then ensure there's only ever one audio file playing at once...

Quote* I think when the new mozilla audio api will be popularised and used , it will allow playing more audio formats - a bit like new flash 10 stuffs allow now. And there are already experimentations done about Amiga MODs playing what is really awesome: you might take a look at the dynamicaudio.js library and the jsmodplayer project on github, it's really interesting

Cool, yeah, very interesting stuff. I am trying to make the audio system modular so it could potentially use several different ways of playing sound in the same game, depending on the formats the game uses and what plugins/features the player's browser has.

benco · Tue 18/01/2011 18:43:45

Quote from: Denzil Quixode on Tue 18/01/2011 17:00:33
I have been wondering about attempting a really retro-DHTML renderer that doesn't need Flash or HTML5, just works with absolutely-positioned <img>s and <div>s and stuff. It wouldn't be able to do everything, but for a particularly simple game it might be enough. It's hard to imagine there are really that many people left who would benefit from it, though...

Of course, for special effects... canvas/flash is the only way to go. But I think the advantage of dhtml can be found in managing hotspots and areas (walking, interactive ...). Those one should be simpler to implement. And the algorithm for path-finding could thus be simpler too - but knowing that I was thinking about a specific html5/flash editor too that would also generate some init data...

Quote from: Denzil Quixode
Crap, that is annoying. I suppose the solution is to do some (ugly) browser-sniffing and then ensure there's only ever one audio file playing at once...

I think the only solution would be in this case (and yep, you should snif the browser version/os version - not sure if it's inherent in webkit or iOS):
1) pause() the current sound
2) save the track position
3) put the position to the end
4) play the second sound
5) wait for the complete event
6) restore the position on the first track
7) play()

to test... (and knowing that it only works with two concurrent sound files only)

Cheers,

Benco

theo · Sun 23/01/2011 11:31:46

Insane yet highly impressive project!

Definitely interested in seeing where this leads. Keep up the good work!

Denzil Quixode · Sat 05/02/2011 18:51:21

I am experimenting with WebGL rendering. WebGL looks very cool but is only available in the bleeding-edge beta preview versions of Firefox 4 and Chrome 9 at the moment.

If you have one of those (you can get the Chrome 9 beta from http://www.google.com/landing/chrome/beta/ or Firefox 4 beta from http://www.mozilla.com/en-US/firefox/beta/), I'd appreciate it if you would try this page and tell me if you see two of exactly the same image, or if there are any graphical glitches/other problems:

http://octospherics.com/toolbox/webruntime/paltest.html

The left side is a normal image, the right side is a WebGL-rendered version using a shader to simulate 8-bit palette mode.

Edit: I have a second test page now with some simple palette effect buttons. I've no idea why but on Chrome you may need to click them a few times before they will work (Firefox doesn't seem to have this problem):

http://octospherics.com/toolbox/webruntime/paltest2.html

hedgefield · Sun 06/02/2011 12:49:55

I'm running the latest official release of Chrome 9 and both links work absolutely fine over here. I do need to press each of those buttons twice for it to work, but it works

benco · Tue 08/02/2011 09:29:05

works great on my FF 4 beta 10 (win32)...

Denzil Quixode · Tue 08/02/2011 09:42:48

Great to hear, thanks guys.

arj0n · Tue 08/02/2011 12:04:25

Firfox 4 Beta 10 results:

Denzil Quixode · Tue 08/02/2011 20:46:48

Thanks for the report. I have modified the technique, could you try again and let me know if it is any better now?

Wyz · Tue 08/02/2011 22:01:16

It worked great for me (Chrome 9) but the new technique looks just like Arj0n's.

Denzil Quixode · Tue 08/02/2011 22:17:59

Really? Damn... I can't reproduce that, it looks OK to me on the latest Chrome 9 (I just updated, no difference) in both 32-bit and 16-bit color mode. It's probably unlikely to be this but could you try a Ctrl-F5 hard refresh? Just in case...

arj0n · Wed 09/02/2011 13:11:31

Tested again in Firefox 4.0 Beta 10, don't know why but the result looks good/better now:

*Also tested in Firefox 4.0 Beta 11 [latest beta at this moment] but no go: "Could not initialise WebGL, sorry :-("
Tried to reactivate WebGL using 'about:config';: no result.

Denzil Quixode · Wed 09/02/2011 19:42:01

Quote from: iCyborg on Wed 09/02/2011 13:11:31
Tested again in Firefox 4.0 Beta 10, don't know why but the result looks good/better now:

Because I changed it

I switched Windows into 16-bit colour mode and started getting the same result you did, realised what was going on and altered the code to work around it. (However, Wyz reports that doing that has broken it in Chrome for him, but I still haven't managed to reproduce this...)

Quote from: iCyborg on Wed 09/02/2011 13:11:31
*Also tested in Firefox 4.0 Beta 11 [latest beta at this moment] but no go: "Could not initialise WebGL, sorry :-("
Tried to reactivate WebGL using 'about:config';: no result.

Hmm, can you see if you can run any WebGL things? Possibly I'm trying to initialize it wrong or something.

Kyari · Sun 06/03/2011 20:14:12

I know it's been almost a month since there was an update here, but I just figured I'd post a reply anyway to confirm that it runs on both iPhone and Android 1.6 (sort of)

Using the default Safari browser for iOS 3.1.2 on an iPhone 3G, the game runs at about half speed. You need to turn off automatic screen turning off, otherwise the game won't progress after it automatically dims. On the plus side, assuming you do nothing that causes your virtual memory to spike and the iPhone to clear your Safari cache, you can close and reopen the browser and it will still be where you left off:

On my Android 1.6 tablet however it went less well, all of the non-background assets (text, characters and objects) were partially see-through, and I don't know if this was due to my low spec tablet, or a limitation of the OS.

Monsieur OUXX · Mon 07/03/2011 10:51:43

Are you planning on releasing the source code? Maybe I read too fast but I didn't see if you already did. Or maybe it's just in the page's source?

Denzil Quixode · Mon 07/03/2011 11:12:46

Kyari: Thanks very much for that! It's hard to know whether the slowness or transparency weirdness is something I can reasonably fix without having my own device to experiment with, but it's good to know at least that the game runs at all.

Ouxxey: I haven't formally released any source code yet. The demo JS code is probably easy to find but it's minified, which makes it harder to read as the whitespace is stripped out and the variable names are replaced with letters etc., but that was just in an attempt to make the demo as small as possible rather than a serious attempt at protecting the code. If I manage to make a releaseable version of the converter and JS engine (still working on it) I am currently thinking of releasing it under an MIT/BSD type license.

Monsieur OUXX · Mon 07/03/2011 11:53:36

Quote from: Denzil Quixode on Mon 07/03/2011 11:12:46
If I manage to make a releaseable version of the converter and JS engine (still working on it) I am currently thinking of releasing it under an MIT/BSD type license.

I'm always scared by those "if" (not specifically you, but in general). I'm happy to see you're still working on it, but don't let your project disappear in the void just because it's "not ready".

(I'm saying this not in a patronizing way, but just because I'm excited about it)

Kyari · Mon 07/03/2011 14:51:48

Quote from: Denzil Quixode on Mon 07/03/2011 11:12:46
Kyari: Thanks very much for that! It's hard to know whether the slowness or transparency weirdness is something I can reasonably fix without having my own device to experiment with, but it's good to know at least that the game runs at all.

I think it's largely down to the comically low specs of my tablet (400Mhz CPU, 128mb RAM) rather than a failing of the Android OS, I can get access to another Android device and try it out for certain (mostly because of my own curiosity than anything else).

As far as the iPhone goes, there is a slight problem that I think is just because of the way Safari processes things, in that whenever you tap the screen it registers your touch as a click before it moves the cursor to that position you just touched. Also, holding a tap results in it trying to select/copy the game. Just figured I'd let anyone know who had aspirations of creating a game with the intention of porting to browsers for iOS.
Unfortuanately, because of Apple's rules around javascript and whatnot, all alternative iOS browsers are built using the same webkit, so there would likely be little or no change in performance in from any alternatives. The exception to this is Opera Mini, but since it basically only gives a compressed screenshot of what you SHOULD be seeing, it doesn't run or refresh java correctly.

I imagine running it on a 3GS or an iPhone 4 would have much more favourable results, but unfortuanately I don't have access to either of those to try it on.