immutable · andrew-yangy · Oct 17, 2024 · Oct 16, 2024 · Oct 16, 2024
diff --git a/WebGL.md b/WebGL.md
@@ -11,13 +11,12 @@ Live example can be found at https://immutable.github.io/unity-immutable-sdk/sam
 
 WebGL template is a configuration setting that lets you control the appearance of the HTML page, so that you can: test, demonstrate, and preview your WebGL application in a browser.
 
-A WebGL Template is always needed for creating a WebGL application and it will always be stored within **Assets > WebGL Templates** to be used. You can refer to [Unity: WebGL Templates](https://docs.unity3d.com/Manual/webgl-templates.html) for more information.
+1. Create a custom WebGL template:
+   - Navigate to **Assets > WebGLTemplates** in your Unity project.
+   - Copy one of the built-in templates (Default or Minimal) from **[Unity Installation] > PlaybackEngines > WebGLSupport > BuildTools > WebGLTemplates**.
+   - Rename the copied template to something meaningful for your project.
 
-A Custom WebGL Template is required to implement the Immutable Unity SDK in WebGL projects. The easiest way to create a new custom WebGL template is to make a copy of the built-in Default or Minimal templates, which are stored in corresponding subfolders under <Unity Installation> > PlaybackEngines > WebGLSupport > BuildTools > WebGLTemplates.
-
-Every Unity Project includes these templates by default. Copy a template and place it in your own **Assets > WebGLTemplates** folder, and rename it to something meaningful so you can identify your template later.
-
-Once you have created your own template, copy the following files from Passport package into the **Assets > WebGLTemplates** folder:
+2. Copy the following files from the Passport package into your **Assets > WebGLTemplates** folder:
    - `Packages/Immutable Passport/WebGLTemplates~/unity-webview.js`
    - `Packages/Immutable Passport/WebGLTemplates~/callback.html`
    - `Packages/Immutable Passport/WebGLTemplates~/logout.html`
@@ -35,6 +34,7 @@ Once you have created your own template, copy the following files from Passport
 Follow these steps for implementation:
 > [!NOTE]
 > You can rename `callback.html` and `logout.html` to suit your project needs.
+> For local testing with WebGL builds, note the random port number assigned (e.g., http://localhost:60750). You may need to update the Hub Passport config each time you start a new local WebGL build, as the port number may change.
 1. Define a deep link scheme for your game:
    - Redirect URL: https://game.domain.com/callback.html
    - Logout URL: https://game.domain.com/logout.html

diff --git a/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/callback.html b/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/callback.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-    <title>Unity WebGL Player | Immutable SDK Sample App</title>
+    <title>Unity WebGL Player | {{{ PRODUCT_NAME }}}</title>
     <link rel="shortcut icon" href="TemplateData/favicon.ico">
     <link rel="stylesheet" href="TemplateData/style.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

diff --git a/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/index.html b/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-    <title>Unity WebGL Player | Immutable SDK Sample App</title>
+    <title>Unity WebGL Player | {{{ PRODUCT_NAME }}}</title>
     <link rel="shortcut icon" href="TemplateData/favicon.ico">
     <link rel="stylesheet" href="TemplateData/style.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
@@ -21,36 +21,36 @@
       <div id="unity-footer">
         <div id="unity-webgl-logo"></div>
         <div id="unity-fullscreen-button"></div>
-        <div id="unity-build-title">Immutable SDK Sample App</div>
+        <div id="unity-build-title">{{{ PRODUCT_NAME }}}</div>
       </div>
     </div>
     <script>
       var buildUrl = "Build";
-      var loaderUrl = buildUrl + "/webgl.loader.js";
+      var loaderUrl = buildUrl + "/{{{ LOADER_FILENAME }}}";
       var config = {
-        dataUrl: buildUrl + "/webgl.data",
-        frameworkUrl: buildUrl + "/webgl.framework.js",
-        codeUrl: buildUrl + "/webgl.wasm",
+        dataUrl: buildUrl + "/{{{ DATA_FILENAME }}}",
+        frameworkUrl: buildUrl + "/{{{ FRAMEWORK_FILENAME }}}",
+        codeUrl: buildUrl + "/{{{ CODE_FILENAME }}}",
         streamingAssetsUrl: "StreamingAssets",
-        companyName: "Immutable",
-        productName: "Immutable SDK Sample App",
-        productVersion: "0.1.0",
+        companyName: "{{{ COMPANY_NAME }}}",
+        productName: "{{{ PRODUCT_NAME }}}",
+        productVersion: "{{{ PRODUCT_VERSION }}}",
       };
 
       var container = document.querySelector("#unity-container");
       var canvas = document.querySelector("#unity-canvas");
       var loadingBar = document.querySelector("#unity-loading-bar");
       var progressBarFull = document.querySelector("#unity-progress-bar-full");
       var fullscreenButton = document.querySelector("#unity-fullscreen-button");
-      var width0 = "960px";
-      var height0 = "600px";
+      var width0 = "{{{ WIDTH }}}px";
+      var height0 = "{{{ HEIGHT }}}px";
 
       if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
         container.className = "unity-mobile";
         config.devicePixelRatio = 1;
       } else {
-        canvas.style.width = "960px";
-        canvas.style.height = "600px";
+        canvas.style.width = "{{{ WIDTH }}}px";
+        canvas.style.height = "{{{ HEIGHT }}}px";
       }
       loadingBar.style.display = "block";
 

diff --git a/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/logout.html b/src/Packages/Passport/Samples~/sample/Assets/WebGLTemplates/unity-webview/logout.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-    <title>Unity WebGL Player | Immutable SDK Sample App</title>
+    <title>Unity WebGL Player | {{{ PRODUCT_NAME }}}</title>
     <link rel="shortcut icon" href="TemplateData/favicon.ico">
     <link rel="stylesheet" href="TemplateData/style.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

diff --git a/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.data b/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.data
diff --git a/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.framework.js b/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.framework.js
diff --git a/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.loader.js b/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.loader.js
diff --git a/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.wasm b/src/Packages/Passport/Samples~/sample/webgl/Build/webgl.wasm