chore: add webgl template

Author: andrew-yangy

sample/Assets/Scripts/SelectAuthMethodScript.cs

@@ -12,20 +12,22 @@ public class SelectAuthMethodScript : MonoBehaviour
     [SerializeField] private Text Output;
     [SerializeField] private Button UseDeviceCodeAuthButton;
     [SerializeField] private Button UsePKCEButton;
-    string REDIRECT_URI = null;
-    string LOGOUT_REIDIRECT_URI = "https://www.immutable.com";
+    string redirectUri = null;
+    string logoutRedirectUri = "https://www.immutable.com";
+    string clientId = "ZJL7JvetcDFBNDlgRs5oJoxuAUUl6uQj";
 #pragma warning restore CS8618
     void Start()
     {
 #if UNITY_WEBGL
-    string url = Application.absoluteURL;
-    Uri uri = new Uri(url);
-    string scheme = uri.Scheme;
-    string hostWithPort = uri.IsDefaultPort ? uri.Host : $"{uri.Host}:{uri.Port}";
-    string fullPath = uri.AbsolutePath.EndsWith("/") ? uri.AbsolutePath : uri.AbsolutePath.Substring(0, uri.AbsolutePath.LastIndexOf('/') + 1);
+        string url = Application.absoluteURL;
+        Uri uri = new Uri(url);
+        string scheme = uri.Scheme;
+        string hostWithPort = uri.IsDefaultPort ? uri.Host : $"{uri.Host}:{uri.Port}";
+        string fullPath = uri.AbsolutePath.EndsWith("/") ? uri.AbsolutePath : uri.AbsolutePath.Substring(0, uri.AbsolutePath.LastIndexOf('/') + 1);
 
-    REDIRECT_URI = $"{scheme}://{hostWithPort}{fullPath}callback.html";
-    LOGOUT_REIDIRECT_URI = $"{scheme}://{hostWithPort}{fullPath}logout.html";
+        redirectUri = $"{scheme}://{hostWithPort}{fullPath}callback.html";
+        logoutRedirectUri = $"{scheme}://{hostWithPort}{fullPath}logout.html";
+        clientId = "UnB98ngnXIZIEJWGJOjVe1BpCx5ix7qc";
 #endif
 
         // Determine if PKCE is supported based on the platform
@@ -34,7 +36,7 @@ void Start()
         // If PKCE is not supported, initialise Passport to use Device Code Auth
         if (!SampleAppManager.SupportsPKCE)
         {
-            InitialisePassport(redirectUri: REDIRECT_URI, logoutRedirectUri: LOGOUT_REIDIRECT_URI);
+            InitialisePassport();
         }
     }
 
@@ -56,7 +58,7 @@ private bool IsPKCESupported()
     public void UseDeviceCodeAuth()
     {
         SampleAppManager.UsePKCE = false;
-        InitialisePassport(redirectUri: REDIRECT_URI, logoutRedirectUri: LOGOUT_REIDIRECT_URI);
+        InitialisePassport();
     }
 
     /// <summary>
@@ -65,17 +67,13 @@ public void UseDeviceCodeAuth()
     public void UsePKCE()
     {
         SampleAppManager.UsePKCE = true;
-        InitialisePassport(redirectUri: REDIRECT_URI, logoutRedirectUri: LOGOUT_REIDIRECT_URI);
+        InitialisePassport();
     }
 
     /// <summary>
     /// Initialises Passport.
     /// </summary>
-    /// <param name="redirectUri">(Android, iOS and macOS only) The URL to which auth will redirect the browser after 
-    /// authorisation has been granted by the user</param>
-    /// <param name="logoutRedirectUri">The URL to which auth will redirect the browser
-    /// after log out is complete</param>
-    private async void InitialisePassport(string redirectUri = null, string logoutRedirectUri = null)
+    private async void InitialisePassport()
     {
         ShowOutput("Initialising Passport...");
 
@@ -85,7 +83,6 @@ private async void InitialisePassport(string redirectUri = null, string logoutRe
             Passport.LogLevel = LogLevel.Info;
 
             // Initialise Passport
-            string clientId = "ZJL7JvetcDFBNDlgRs5oJoxuAUUl6uQj";
             string environment = Immutable.Passport.Model.Environment.SANDBOX;
 
             Passport passport = await Passport.Init(clientId, environment, redirectUri, logoutRedirectUri);

sample/Assets/WebGLTemplates/unity-webview/Passport/index.html

@@ -0,0 +1,16 @@
+body { padding: 0; margin: 0 }
+#unity-container { position: absolute }
+#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
+#unity-container.unity-mobile { position: fixed; width: 100%; height: 100% }
+#unity-canvas { background: {{{ BACKGROUND_COLOR }}} }
+.unity-mobile #unity-canvas { width: 100%; height: 100% }
+#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
+#unity-logo { width: 154px; height: 130px; background: url('unity-logo-{{{ SPLASH_SCREEN_STYLE.toLowerCase() }}}.png') no-repeat center }
+#unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-{{{ SPLASH_SCREEN_STYLE.toLowerCase() }}}.png') no-repeat center }
+#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-{{{ SPLASH_SCREEN_STYLE.toLowerCase() }}}.png') no-repeat center }
+#unity-footer { position: relative }
+.unity-mobile #unity-footer { display: none }
+#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
+#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
+#unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
+#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }