My LaserDefender

Hi there, here is my LaserDefender as it stand as I move on to the next section, I could do much more on it, but I am eager to move on in the course.

Please note that the Start scene is narrower than the rest when I build for WebGL, but not when building for PC, so if anyone know why that happens please leave a message.

Have fun.

Controls:
WASD + SPACE and ESC to quit.

http://www.thegreens.dk/laserdefender/index.html

EDIT: I just changed this post to ASK, as I would really like to figure out why the Start scene is narrower than the rest, but ONLY when building to WebGL, when building to PC Standalone, it is the correct width.

3 Likes

Love the ship art and SFX.

I had a similar problem with the scene aspect ratio - if the correct aspect ratio is set at the top of unity, look at the canvas settings. These ones seem to work for me, particularly moving the slider from ‘Width’ to ‘Height’

unity aspect

Hi Tony

Thank you for your feedback, that is exactly how I set it already. The weird thing is it only happens when I build for OpenGL - if I build for PC with the exact same settings it does not happen. And it happens only for one scene, the first, in OpenGL.

I was thinking that it might be something in the Player Settings when building for OpenGL, maybe…

Hi Karsten,

Do you mean OpenGL or WebGL? It might well be that you get different results for different platforms. For this reason, it might make sense to duplicate the project and fix certain platform specific issues in the respective project.

Which version of Unity do you use? Perhaps you could update Unity.

Hi Nina.

I meant to say WebGL, I am using version 2019.4.1f1 which should be the newest version.

Please follow the instructions in this thread. Maybe there is an interesting error message in your browser console.

Hi Nina

Dossn’t look like errors to me:

UnityLoader.js:4 [UnityCache] 'http://www.thegreens.dk/laserdefender/Build/Laser%20Defender%20WebGL.wasm.code.unityweb' successfully revalidated and served from the indexedDB cache
UnityLoader.js:4 [UnityCache] 'http://www.thegreens.dk/laserdefender/Build/Laser%20Defender%20WebGL.wasm.framework.unityweb' successfully revalidated and served from the indexedDB cache
UnityLoader.js:4 [UnityCache] 'http://www.thegreens.dk/laserdefender/Build/Laser%20Defender%20WebGL.data.unityweb' successfully revalidated and served from the indexedDB cache
29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 PlayerConnection initialized from  (debug = 0)

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 PlayerConnection disabled  - listening mode not supported

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Started listening to [0.0.0.0:0]

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 PlayerConnection already initialized - listening to [0.0.0.0:0]

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Loading player data from data.unity3d

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Initialize engine version: 2019.4.1f1 (e6c045e14e4e)

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 [Subsystems] Discovering subsystems at path UnitySubsystems

UnityLoader.js:4 Creating WebGL 2.0 context.
29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Renderer: WebKit WebGL

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Vendor:   WebKit

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Version:  OpenGL ES 3.0 (WebGL 2.0 (OpenGL ES 3.0 Chromium))

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 GLES:     3

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445  EXT_color_buffer_float GL_EXT_color_buffer_float EXT_disjoint_timer_query_webgl2 GL_EXT_disjoint_timer_query_webgl2 EXT_float_blend GL_EXT_float_blend EXT_texture_compression_bptc GL_EXT_texture_compression_bptc EXT_texture_compression_rgtc GL_EXT_texture_compression_rgtc EXT_texture_filter_anisotropic GL_EXT_texture_filter_anisotropic KHR_parallel_shader_compile GL_KHR_parallel_shader_compile OES_texture_float_linear GL_OES_texture_float_linear WEBGL_compressed_texture_s3tc GL_WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb GL_WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info GL_WEBGL_debug_renderer_info WEBGL_debug_shaders GL_WEBGL_debug_shaders WEBGL_lose_context GL_WEBGL_lose_context OVR_multiview2 GL_OVR_multiview2

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 OPENGL LOG: Creating OpenGL ES 3.0 graphics device ; Context level  <OpenGL ES 3.0> ; Context handle 14261064

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 UnloadTime: 0.320001 ms

29fa1a91-c2e9-40c9-96d0-d4a793748f79:3445 Input Manager initialize...

I just noticed, that when the Start Scene is loaded the first time (When initially launching the game) it is too narrow. If I start the game and then quit back to the Start Scene, it is OK.

I’m wondering if there is an issue in your Start scene. Are there any differences between the Canvas game objects or is the background narrower? See its scale values.

Hi Nina.

As part of my troubleshooting, I deleted the start scene, and remade it from the prefabs that the other two scenes use, just in case, that did not solve the issue.

What baffles me is that if I do a PC build, there is no problem, that to me indicates that is WebGL build related, because surely, if there was a general problem with the scene, it would show up in both build types.

Sometimes the Build Settings list is fairly buggy. I would suggest to remove all scenes from the list and to readd them.

Which version of Unity do you use? Maybe you could try to update to the latest stable version.

I deleted the all Scenes from the Build settings, and readded them, that did NOT fix the issue.

I am using version 2019.4.1f1 which should be the newest version of Unity.

Fantastic. :slight_smile:

Next time, your game doesn’t work as expected and you cannot spot any issue, try to remove and to re-add the scenes. That’s often fixing certain issues related to scenes and scene loading.


See also:

Hi Nina.

Made a major typo in my previous post, I missed out a NOT :open_mouth:

Just edited it.

So it did not fix the issue, sorry for the confusion.

Oops. :wink:

Could you please upload your project to GitHub without the Temp and Library folder and share a link to the public repository here? I’d like to take a look into this issue.

Here is a tutorial video by Brackeys:

Did my best to follow my speed talking countryman in that video, let me know if it worked.

Thank you. I checked your game with 2019.3.6f1 and found this:

image

The entire list must be emptied. Then the scenes must be readded. That’s what I meant when I asked you to remove all scenes from the list and to readd them. See here:

image


In the Build Settings, we need to set a reasonable resolution.

image


And remove the Camera Apect component from the Main Camera game object in the Start Game scene.


Then I built the game, and it worked.


See also:

Hi Nina

Thank you for your tireless assistance, its highly appreciated.

Your input did fix the issue of width in the start scene, thanks a lot for that, but in the process it moved the game to the far left of the browser, is there any way to center the game again?

Did you upload the game on your own website? If so, edit the html/css, and center the #canvas container inside the #unityContainer.

Goodmorning Nina.

I have been wondering about why your fixes worked, and would like to learn from my mistakes

Obviously the “Deleted” scene in the build was a mistake, but I assumed it was Deleted - lol

The Camera Aspect script was put in there to stop the player moving off the game screen, so clearly its not needed in the start scene.

In build settings:
Why resolution 500*900?
Why Minimal and not default?

With regards to htms/css, are you talking about the index.html file?

Thanks

Karsten

Unfortunately, these “deleted” entries often cause issues. Usually, they prevent you from building your game at all.

How large is the average player’s screen? Ideally, you opt for a relative small height/width so as many people as possible will be able to play your game. My screen height is 1200 (minus the header of the browser and the task bar and maybe the header of a website).

The fullscreen button can cause issues in your game when your game depends on a specific aspect ratio and doesn’t recalculate certain values when the screen size changes. That’s why I usually recommend to select the “default” template.

According to your link in your initial post, it’s the index.html. Open your browser console and edit the html there to see what happens. Once you got the desired result, you could edit the actual index.html (or css?) file and upload it.

Privacy & Terms