Full browser WebGL unity3d template

Posted by admin on January 1, 2015 in Unity3d, webgl |

The Unity 5 WebGL player build pipeline – as of time of writing this – comes with one embedding layout option only, and lacks template customizaton options acompannying the webplayer pipeline. In order to add some customization to that you have just to modify the automatically generated index.html file. (Now you can skip reading this and go to updated version of this postupdated on 2015-07-13).
The commonly used layouts include the full browser WebGL layout. The essential element of full browser window layout is a javascript function capable of measuring the browser window size and adjusting the canvass size to that. This will be the OnLoaded() function in this case. Here is the link fo a basic full browser WebGL layout.

In order to sustain the functionalities of the default Unity layout I have moved the fullscreen button to the inside of the WebGL player. The necessary editions to adapt this to your project are just updating the names of WebGL players as marked marked with red frames on yellow on the picture below.
full browser window WebGL index file layout

You should absolutely remember to update the page title and might like to add some customization in the places also marked with green. This could include the loading logo and bar customisation. You can also customize the color of the WebGL player canvas before it gets started. In the more customized example here I have added a sort of splashscreen to the page background. In order for this splashscreen to appear I have set the initial canvas size to zero and delayed the start of the OnLoaded() function by firing that from the Start() function from inside the WebGL player using Application.ExternalCall(“OnLoaded”); . To prevent overwriting the index file with the new one when tweaking the WebGL build in Unity Editor, I would suggest using default.html or index.htm or index.php instead of index.html.

Here is the download link for the default.html file:

3297 Downloads

(Please go to the download in the updated version of this postupdated on 2015-07-13).

Facing the announced  full npapi deprecacion due to come in the course of this year, we have to move from WebPlayer to WebGL player. Just for comparison – this is a link to the webplayer version of the build. You can also have a look at the post on the full browser webplayer on this site.

10 Comments

Leave a Reply

Copyright © 2011-2024 virtualPlayground All rights reserved.
VP based on Desk Mess Mirrored v1.8.3 theme from BuyNowShop.com.