Html5 generation

Hello,

I’d like to bundle html5 version of my game.

I’ve tried from the bundle menu of the editor (1.2.189, linux version), and with bob (java -jar ~/defold/tools/bob_1.2.189.jar --archive --platform js-web --architectures wasm-web resolve distclean build bundle ).

Both are building without errors, but when i try and run them from the browser, i only see the defold splash screen, the progression bar which shows loading.

When the loading is finished, the splash screen doesn’t disappear, and soon firefox tell me that the page is using too much resources. Same issue with Chrome. I’ve tried to use the debugger , but nothing is shown.

Of course, the files are served from a web server.

I can generate linux x86_64 (my platform) without any problems, and it works very well.

Is there a way to get debug informations from web versions ? I cannot even see what files are loaded , with the browser debugger.

Thank you.

1 Like

First step is to enable debug info by adding ”—variant debug” to the command line. Then you can get output in the developer console.

1 Like

How do you run html5 build? It sounds like you just double tap index.html.
HTML5 bundle needs http server, please read FAQ here: Defold development for the HTML5 platform

UPD:
Ah, sorry, now I see.

Of course, the files are served from a web server.

What if you run html5 from the editor: Project->Build HTML5 ?

2 Likes

This should always be visible in the browser developer tools. No special build options needed for that.

Ok , i must have done something wrong yesterday, now i see the files loaded. So everything is loaded.

I’ve added the --variant debug to bob, now i see the error in the console. It’s a repeated crash in the dmloader.js.

So looking at line 512 in dmloader.js , it seems to be something in the transpiled native code (i see emscripten mentioned).

Please find the very first crash message in your log. The problem isn’t related to dmloader.js:512, this is just a hook for logs there.

1 Like

Ok i understand, there were so many repeating errors than the beginning of the logs had been thrashed.

By defining an empty function at line 512 (printErr function), i could seen the interesting part.

Running... [dmloader.js:514:41](http://mysite.com/project_debug/dmloader.js)

<empty string> [dmloader.js:514:41](http://mysite.com/project_debug/dmloader.js)

INFO:ENGINE: Defold Engine 1.2.189 (8894457) [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

Made with Defold -=[ https://www.defold.com ]=- [ line 144 > injectedScript:1:15023](http://mysite.com/project_debug/ line 144 > injectedScript)

INFO:ENGINE: Loading data from: dmanif:game.dmanifest [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

INFO:ENGINE: Initialised sound device 'default' [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

WARNING:RESOURCE: Unable to create resource: /scripts/scrolling.fpc: FORMAT_ERROR [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

WARNING:RESOURCE: Unable to create resource: /scripts/scrolling.materialc: FORMAT_ERROR [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

WARNING:RESOURCE: Unable to create resource: /main/background.spritec: FORMAT_ERROR [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

WARNING:RESOURCE: Unable to create resource: /_generated_7388588174a65a0e.goc: FORMAT_ERROR [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

WARNING:RESOURCE: Unable to create resource: /main/main.collectionc: FORMAT_ERROR [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

INFO:CRASH: Successfully wrote Crashdump to file: /data/.Defold/_crash [dmloader.js:511:37](http://mysite.com/project_debug/dmloader.js)

Ah ! there is a crashlog ! But where is it ?
A find ~ -iname "*_crash*" | grep -i defold returns nothing. I did the search on the client side, of course :slight_smile:

Something is wrong with your shader ppbly /scripts/scrolling.fpc, if you can share it I’ll take a look.

1 Like

The latest version of Defold shouldn’t repeatedly spam with a crash like that by the way.

1 Like

Isn’t it the latest version? :thinking:

I think this fix is in 1.2.190-alpha https://github.com/defold/defold/pull/6156

1 Like

@AGulev , thank you for offering.

Of course i can share, here here the scrolling.fpc .
I’ve just removed some binaries information. I guess the first block is the translation to GLES of the second part, which is the one i wrote.

Must be something incompatible with GLES, or maybe some variable which is not used and should be removed ? How can you debug something like this without bothering a good soul ? I will have for sure other bugs in the future.

#version 300 es
precision mediump float;

out vec4 _DMENGINE_GENERATED_gl_FragColor;
#line 0
in mediump vec4 position; 
in mediump vec2 var_texcoord0;

uniform lowp sampler2D texture_sampler;
uniform lowp sampler2D decor_sampler;
uniform lowp vec4 tint;
uniform lowp vec4 time;
uniform lowp vec4 move; 

void main()
{
	
  vec2 texcoord = var_texcoord0;
  if (var_texcoord0.y > .75) {
    texcoord.x = texcoord.x/2+time.x/64; 
  }
  else if (move.x != 0) {
    texcoord.x = texcoord.x+move.z+move.x/64; 

  }
  
    _DMENGINE_GENERATED_gl_FragColor = texture(decor_sampler, texcoord.xy); 
  
}

precision mediump float;
#line 0
varying mediump vec4 position; 
varying mediump vec2 var_texcoord0;

uniform lowp sampler2D texture_sampler;
uniform lowp sampler2D decor_sampler;
uniform lowp vec4 tint;
uniform lowp vec4 time;
uniform lowp vec4 move; 

void main()
{
  vec2 texcoord = var_texcoord0;
  if (var_texcoord0.y > .75) {
    texcoord.x = texcoord.x/2+time.x/64;
  }
  else if (move.x != 0) {
    texcoord.x = texcoord.x+move.z+move.x/64;

  }
 
  gl_FragColor = texture2D(decor_sampler, texcoord.xy); // - floor(texcoord.xy) );
}
1 Like

My guess is that you’re mixing types int and float:

  if (var_texcoord0.y > .75) {
    texcoord.x = texcoord.x/2.0+time.x/64.0;
  }
  else if (move.x != 0.0) {
    texcoord.x = texcoord.x+move.z+move.x/64.0;
  }
2 Likes

Yes, you are right. Every scalars have to be written with decimal point.

In GLSL desktop, conversion must be done automatically behind the curtains.

Now, browser exports works perfectly ! Thank you !

2 Likes