HTML5 Showcase / Alpha discussion

hgy29

Hi everyone!

Now that the HTML5 kickstarter is funded, €50+ backers will soon receive access to alpha/wip version of the HTML5 version of Gideros. This thread has two purposes:
1°) Allow people to show off what they did with Gideros/HTML5
2°) Discuss issues with the current version so that it become perfect in the end!

I'll start with two nice additions from @SinisterSoft:

Space invaders: http://apps.giderosmobile.com/invaders/
GUI WIP: http://apps.giderosmobile.com/gui/

The web is starting to look very nice!

MikeHart

Great idea. For a showcase, it needs some little screenshots. How about one per app?

SinisterSoft

No link, but here is a pic of Dungeons running at FULL SPEED in a browser...

MikeHart

Both are running great!

Ninjadoodle

Hi @hgy29

Awesome, really exited about this

PS. I'm having trouble running the game in Safari on Mac desktop and iPhone.

The games seem to go to the game screen (shows the invaders), but seem to freeze / not respond after that. This is the error I get from the console ...

invaders:113[post-exception status] Exception thrown, see JavaScript console
gideros.js:1:176578TypeError: null is not an object (evaluating 'entry.buffer.duration')

Also, the game seems to load sideways on desktop - even tho its a portrait game (not sure if this is intended).

SinisterSoft

@Ninjadoodle, re 'Invaders'...

1) the crash: That is because I didn't know that audio on Safari has to be 22khz or above. I know Nico is on the case. If he can't make a solution then I'll make another version with the samples fixed.

For now, reload in chrome or something.

2) properties.bin isn't being loaded, yet... so it doesn't know it's a sideways game. I can either add a line of code to change the orientation or you can make the actual window narrower.

For now, make the window so the width is less than the height then you will see it makes it vertical. Then reload the page (as there is a slight bug with resizing at present).

pie

Hi, I just tried exporting a couple of apps, but something goes wrong sooner or later , one sticks to the first menu scene, the other is stuck at hte end of the first game scene.

is there a list of known bugs/missing features to compare before bothering you?
Both apps run fine in player and other devices.

Is it possible to read some debug information from the GApp in browser?
[edit: Ok I found that firebug on firefox is able to display some output with script console, it just slows down everything a lot. Do you know any faster alternative?]

Thank you

SinisterSoft

Yes, in Edge or Chrome press F12 in the browser and look at the 'Console' tab.

pie

Thanks, the worst thing is that on chrome both apps won't even start. there is a blank page after the spinning loader and these errors:

XMLHttpRequest cannot load file:///C:/test/html5/gideros.html.mem.
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.Browser.xhrLoad @ gideros.js:1

gideros.js:24 Uncaught could not load memory initializer gideros.html.mem

hope this helps thank you

hgy29

Yes, you can't test the app just by double clicking on the .html file, it has to be served by a web served, i.e. accessed through http protocol. You may want to install Apache or wamp package to test locally. This is a limitation of JavaScript xmlhttprequest object.

ar2rsawseen

For Chrome to test locally you can try this:
http://stackoverflow.com/a/18587027

I think it is possible with IE too, changing settings in Internet Options.

But all in all suggested way is to use a webserver (even if it is simply for serving files)

Also if something fishy is happening, like froze on some screen, etc. This usually means there was an error (usually lua error, and sometimes it makes some parts still work, while others don't)

In this case check console output (I think every browser has it now, some where in developer options), you should be able to see an error there

keszegh

if you run from Brackets then i think it emulates a server for you.

Ninjadoodle

You can also get Mongoose ... Mongoose-https://code.google.com/archive/p/mongoose/ ... it's REALLY easy to use

pie

Thank you guys I didn't know that

I just tried with your suggestion, and it seems that Arturs' chrome trick works! however, just to be sure I tried the app loading files on an online server: same errors came out from both "versions".

The apps start, but I still have them hanging at a certain point with these errors in chrome console:

WebGL: INVALID_OPERATION: framebufferRenderbuffer: no framebuffer bound gideros.html:101 Canvas:1034,619 0 URL:/localhost/test/gideros.html gideros.js:1 WebGL: INVALID_ENUM: renderbufferStorage: invalid internalformat 2gideros.js:1 WebGL: INVALID_OPERATION: framebufferRenderbuffer: no framebuffer bound gideros.js:1 'webkitMovementY' is deprecated. Please use 'movementY' instead. gideros.js:1 'webkitMovementX' is deprecated. Please use 'movementX' instead. gideros.js:1 WebGL: INVALID_ENUM: renderbufferStorage: invalid internalformat 2gideros.js:1 WebGL: INVALID_OPERATION: framebufferRenderbuffer: no framebuffer bound

What else did I do wrong?
Do I have to enable some specific service on my server?

Thank you

ar2rsawseen

@pie I think all of them are warnings and can be ignored.
If you uploaded to online service, you can provide link here, or if you don't want to disclose it publicly, you can pm to @hgy29 to get more info

pie

I didn't want to bother hgy29 if it's something trivial, but of course I will if it's needed
thank you

hgy29

@pie, you won't bother me but as @ar2rsawseen said, the messages you see in the log can be considered as warning, so nothing much I can tell from that.

Xman

show a blank screen when opened by chrome on iPhone 5s.
on safari the game invaders just show a screen and it seems frozen.
on Mac works fine.

hgy29

Well, it is not really supposed to work on mobile phones, though it may, depending on the phone browser and performance. All in all, prefer native apps on phone, since Gideros enable them.

For invaders/safri: look at SinisterSoft comment above.

Ninjadoodle

Hi @hgy29

I think that trying to get html5 games working on mobiles phones is extremely important.

Many sponsors will expect this, if you are selling licenses + more and more people are replacing their desktops to surf the web on Tablets. Of course the performance won't be up to par (yet), and there will be some bugs / inconsistencies - mainly because of the browser fragmentation, but games should work across the board nonetheless.

I've developed a couple of html5 games recently and made sure that things were working on as many devices as possible. The frame work I've used was Panda Engine, but there are others such as the extremely popular Phaser and Construct 2.

I've tested them all, and html5 games made using these tools run at a pretty decent fps, even on an obsolete iPhone 4s. As new devices come in over the next couple of years, the speed on mobiles will get even better.

I'm very happy to help bug-test, as I'm sure are all the people here, in order to make this thing work the best it can

simwhi

@hgy29 I agree with @Ninjadoodle. It's very important to get HTML5 games working in as many browsers as possible. We can also provide some help in this area too. We have a few games made using HTML5 that perform well on tablets/phones.

SinisterSoft

I think that it's working pretty much as fast as it can right now, normally you would write your game in javascript and handle the canvas directly, but because the original game is in Lua it isn't done this way.

Simple games, eg the Invaders and Save the Martians examples I submitted seem to work fine on my HTC M8 though.

If you have them on your own website (not a licencee's site) then you should run the game in a iframe or something and on the outside have links to the play, apple and microsoft stores.

Maybe someone could make a html template for this so it's easier for those who don't know html that well?

Don't forget too that mobile phones are getting 2x faster every 6 months...

hgy29

@Ninjadoodle, I agree and I will do my best to handle all browsers, mobiles or not. I did not mean that I won't support them, but rather that you can't expect them to work smoothly due to inherent lack of power of mobile platforms.

The other issue we could have is the lack of support for some required API in browsers, and this is also true for desktop.

For example, we need WebGL support, but not all browsers actually support it: http://caniuse.com/#feat=webgl

The aim was to support major browsers: FF, Chrome, Safari and Edge. Even IE11 miss some features Gideros need!

I shall compile a list of supported browsers/version at some time. And of course any help is much appreciated making it work on the broadest range of device/browser possible.

Ninjadoodle

Hi @hgy29

Thank you for the reply!

I was pretty sure that's what you meant, but just wanted to mention how expected it is these days, to have to things working across the board.

Sometimes sponsors can be unrealistic, and don't realise that some of the bugs / issues are out of our control.

Also, you're right about the speed, as of this will be much less of an issue in a few years, when the support gets even better, and new devices are released.

Im super exited about Gideros and Html5 and happy to help in any way I can!

Than you for the awesome work!

pie

Is there any known issue with json parser? Something like ANSI/UTF-8 file support only?

I got this error in chrome console:

dataSaver.lua:100: Expected (null) but found (null) at character 0

which I believe it is similar to:
http://giderosmobile.com/forum/discussion/5463/render-special-characters-e-e-i-o-u-from-jsondatasaver-solved/p1

Thank you

totebo

Can I just say, that error handler should look itself in the mirror and think "Am I SURE this is going to help the programmer?" before it spits that out.

uzubari

Hello ,
Thank you for the great job.
here is my notes from my first trial,
I could see at least the start screen of my application,
https://www.dropbox.com/s/iyfaa18ett180wm/Screenshot 2015-10-30 00.42.12.png?dl=0


I got an error when trying to load url

XMLHttpRequest cannot load [url] Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Google tells me: To be able to load urls from a client code ,I need to modify the server side code with HTTP CORS access control,
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

I have found one issue, I had to disable the input and alert dialogs:
InputDialog and AlertDialog cause exception,
exception thrown: TypeError: Cannot read property 'apply' of undefined,TypeError: Cannot read property 'apply' of undefined
at Array._gui_createTextInputDialog (http://192.168.2.213:8080/gideros.js:1:179993)
at Object.ftCall_iiiiiiiii [as dynCall_iiiiiiiii] (http://192.168.2.213:8080/gideros.js:1:717852)
at invoke_iiiiiiiii (http://192.168.2.213:8080/gideros.js:1:717101)
at Array.Cja (http://192.168.2.213:8080/gideros.js:6:452437)
at ftCall_ii (http://192.168.2.213:8080/gideros.js:1:678601)
at ACa (http://192.168.2.213:8080/gideros.js:10:492034)
at eBa (http://192.168.2.213:8080/gideros.js:10:436491)
at dBa (http://192.168.2.213:8080/gideros.js:10:435639)
at Array.Ava (http://192.168.2.213:8080/gideros.js:10:211882)
at ftCall_ii (http://192.168.2.213:8080/gideros.js:1:678601)


the relevant code at gideros.js
...{return Module["_gui_createTextInputDialog"].apply(null,arguments)}...

ar2rsawseen

Yes, to be able to query from browser query side, your server would need to accept the origin (or basically respond with origin * for any or your specific domain)

and I think dialogs are not yet implemented

SinisterSoft

@hgy29 maybe dialogs could fail gracefully until/if implemented - eg - just let the call return false. That way existing programs would still work (if they check to make sure that the setup worked).

hgy29

Yes, or better implement them actually should be able to use alert(), confirm() and prompt() JS functions...

hgy29

Ok it is implemented now, although JS native functions doesn't allow to customize title and button labels. I'll try to come up with something better later, but for now the I've updated the package.