From ba4ecc39d6912e8cda52e0d16e03985b7dc823d9 Mon Sep 17 00:00:00 2001
From: 97saundersj <jacques_s@hotmail.co.uk>
Date: Sat, 19 Apr 2025 18:34:22 +0100
Subject: [PATCH 1/5] Firebase storage changes

---
 .firebaserc                                   |  5 ++
 Assets/Resources/Card/CardTextController.cs   |  2 +-
 .../WebGLTemplates/XRCardTemplate/index.html  | 60 ++++++++++++++++++-
 cors.json                                     |  8 +++
 firebase.json                                 |  5 ++
 storage.rules                                 | 12 ++++
 6 files changed, 90 insertions(+), 2 deletions(-)
 create mode 100644 .firebaserc
 create mode 100644 cors.json
 create mode 100644 firebase.json
 create mode 100644 storage.rules

diff --git a/.firebaserc b/.firebaserc
new file mode 100644
index 0000000..8801360
--- /dev/null
+++ b/.firebaserc
@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "default": "fir-test-d319a"
+  }
+}
diff --git a/Assets/Resources/Card/CardTextController.cs b/Assets/Resources/Card/CardTextController.cs
index 04939a7..e9bedd0 100644
--- a/Assets/Resources/Card/CardTextController.cs
+++ b/Assets/Resources/Card/CardTextController.cs
@@ -79,7 +79,7 @@ public void UpdateCardText(string jsonData)
 
     private IEnumerator LoadImageFromUrl(string url)
     {
-        string proxyUrl = $"https://cors-anywhere.herokuapp.com/{url}";
+        string proxyUrl = url;//$"https://cors-anywhere.herokuapp.com/{url}";
         Debug.Log($"Requesting image from: {proxyUrl}");
 
         using (UnityWebRequest uwr = UnityWebRequestTexture.GetTexture(proxyUrl))
diff --git a/Assets/WebGLTemplates/XRCardTemplate/index.html b/Assets/WebGLTemplates/XRCardTemplate/index.html
index 4eebf4e..cdecff2 100644
--- a/Assets/WebGLTemplates/XRCardTemplate/index.html
+++ b/Assets/WebGLTemplates/XRCardTemplate/index.html
@@ -9,6 +9,23 @@
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
 
+    <!-- Firebase SDKs -->
+    <script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-app-compat.js"></script>
+    <script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-storage-compat.js"></script>
+    <script>
+        const firebaseConfig = {
+          apiKey: "AIzaSyBIuTnTru0iILMqOyKRzu2mZtIBnxEhdug",
+          authDomain: "fir-test-d319a.firebaseapp.com",
+          projectId: "fir-test-d319a",
+          storageBucket: "fir-test-d319a.firebasestorage.app",
+          messagingSenderId: "913686234554",
+          appId: "1:913686234554:android:0b20d5d7e441a710"
+        };
+        firebase.initializeApp(firebaseConfig);
+        const storage = firebase.storage();
+    </script>
+
+
     <style>
         /* Override Bootstrap primary color to match navbar color */
         :root {
@@ -79,10 +96,18 @@ <h6 class="fw-bold">AR Card</h6>
                             <option value="custom">Custom</option>
                         </select>
                     </div>
+
                     <div class="mb-3" id="customImageUrlInput" style="display: none;">
-                        <label for="customImageUrl" class="form-label">Custom Image URL</label>
+                        <label for="customImageUrl" class="form-label">URL</label>
                         <input type="text" class="form-control" id="customImageUrl" placeholder="Enter image URL">
+                        
+                        <label class="form-label">Or</label>
+
+                        <label for="customImageFile" class="form-label">File</label>
+                        <input type="file" class="form-control" id="customImageFile" accept="image/*">
+                        <button class="btn btn-secondary mt-2" onclick="uploadImage()">Upload Image</button>
                     </div>
+
                     <div class="mb-3">
                         <label for="cardTopInput" class="form-label">Top Text</label>
                         <input type="text" class="form-control" id="cardTopInput" placeholder="Enter top text">
@@ -140,6 +165,39 @@ <h5 class="modal-title">Your Custom Card Link</h5>
     <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.min.js"></script>
     <script>
+        function uploadImage() {
+           const fileInput = document.getElementById('customImageFile');
+           const file = fileInput.files[0];
+           if (!file) {
+               alert('Please select an image file to upload.');
+               return;
+           }
+
+           const storageRef = storage.ref('images/' + file.name);
+           const uploadTask = storageRef.put(file);
+
+           uploadTask.on('state_changed', 
+               (snapshot) => {
+                   // Observe state change events such as progress, pause, and resume
+                   const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
+                   console.log('Upload is ' + progress + '% done');
+               }, 
+               (error) => {
+                   // Handle unsuccessful uploads
+                   console.error('Upload failed:', error);
+                   alert('Failed to upload image.');
+               }, 
+               () => {
+                   // Handle successful uploads on complete
+                   uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {
+                       console.log('File available at', downloadURL);
+                       document.getElementById('customImageUrl').value = downloadURL;
+                       alert('Image uploaded successfully!');
+                   });
+               }
+           );
+        }
+
         function toggleCustomImageInput() {
             const cardImageInput = document.getElementById('cardImageInput');
             const customImageUrlInput = document.getElementById('customImageUrlInput');
diff --git a/cors.json b/cors.json
new file mode 100644
index 0000000..14812af
--- /dev/null
+++ b/cors.json
@@ -0,0 +1,8 @@
+[
+    {
+      "origin": ["*"],
+      "method": ["GET"],
+      "maxAgeSeconds": 3600
+    }
+  ]
+  
\ No newline at end of file
diff --git a/firebase.json b/firebase.json
new file mode 100644
index 0000000..1bae8b3
--- /dev/null
+++ b/firebase.json
@@ -0,0 +1,5 @@
+{
+  "storage": {
+    "rules": "storage.rules"
+  }
+}
diff --git a/storage.rules b/storage.rules
new file mode 100644
index 0000000..f08744f
--- /dev/null
+++ b/storage.rules
@@ -0,0 +1,12 @@
+rules_version = '2';
+
+// Craft rules based on data in your Firestore database
+// allow write: if firestore.get(
+//    /databases/(default)/documents/users/$(request.auth.uid)).data.isAdmin;
+service firebase.storage {
+  match /b/{bucket}/o {
+    match /{allPaths=**} {
+      allow read, write: if false;
+    }
+  }
+}

From c3047b6f2e0a28c37fde6c0362ee9249d74052d1 Mon Sep 17 00:00:00 2001
From: 97saundersj <jacques_s@hotmail.co.uk>
Date: Sat, 19 Apr 2025 19:11:14 +0100
Subject: [PATCH 2/5] Tidied up changes

---
 .firebaserc                                 |  5 -----
 Assets/Resources/Card/CardTextController.cs |  5 ++---
 cors.json                                   |  8 --------
 firebase.json                               |  5 -----
 storage.rules                               | 12 ------------
 5 files changed, 2 insertions(+), 33 deletions(-)
 delete mode 100644 .firebaserc
 delete mode 100644 cors.json
 delete mode 100644 firebase.json
 delete mode 100644 storage.rules

diff --git a/.firebaserc b/.firebaserc
deleted file mode 100644
index 8801360..0000000
--- a/.firebaserc
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-  "projects": {
-    "default": "fir-test-d319a"
-  }
-}
diff --git a/Assets/Resources/Card/CardTextController.cs b/Assets/Resources/Card/CardTextController.cs
index e9bedd0..88bfd41 100644
--- a/Assets/Resources/Card/CardTextController.cs
+++ b/Assets/Resources/Card/CardTextController.cs
@@ -79,10 +79,9 @@ public void UpdateCardText(string jsonData)
 
     private IEnumerator LoadImageFromUrl(string url)
     {
-        string proxyUrl = url;//$"https://cors-anywhere.herokuapp.com/{url}";
-        Debug.Log($"Requesting image from: {proxyUrl}");
+        Debug.Log($"Requesting image from: {url}");
 
-        using (UnityWebRequest uwr = UnityWebRequestTexture.GetTexture(proxyUrl))
+        using (UnityWebRequest uwr = UnityWebRequestTexture.GetTexture(url))
         {
             // Add the required headers
             uwr.SetRequestHeader("Origin", "http://localhost");
diff --git a/cors.json b/cors.json
deleted file mode 100644
index 14812af..0000000
--- a/cors.json
+++ /dev/null
@@ -1,8 +0,0 @@
-[
-    {
-      "origin": ["*"],
-      "method": ["GET"],
-      "maxAgeSeconds": 3600
-    }
-  ]
-  
\ No newline at end of file
diff --git a/firebase.json b/firebase.json
deleted file mode 100644
index 1bae8b3..0000000
--- a/firebase.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-  "storage": {
-    "rules": "storage.rules"
-  }
-}
diff --git a/storage.rules b/storage.rules
deleted file mode 100644
index f08744f..0000000
--- a/storage.rules
+++ /dev/null
@@ -1,12 +0,0 @@
-rules_version = '2';
-
-// Craft rules based on data in your Firestore database
-// allow write: if firestore.get(
-//    /databases/(default)/documents/users/$(request.auth.uid)).data.isAdmin;
-service firebase.storage {
-  match /b/{bucket}/o {
-    match /{allPaths=**} {
-      allow read, write: if false;
-    }
-  }
-}

From 1bf21c89fa2b7a5c540bfe8a101fc1c670ff7c78 Mon Sep 17 00:00:00 2001
From: 97saundersj <jacques_s@hotmail.co.uk>
Date: Sat, 19 Apr 2025 19:27:48 +0100
Subject: [PATCH 3/5] Streamlined image uploads

---
 Assets/WebGLTemplates/XRCardTemplate/index.html | 14 +++++---------
 1 file changed, 5 insertions(+), 9 deletions(-)

diff --git a/Assets/WebGLTemplates/XRCardTemplate/index.html b/Assets/WebGLTemplates/XRCardTemplate/index.html
index cdecff2..080c116 100644
--- a/Assets/WebGLTemplates/XRCardTemplate/index.html
+++ b/Assets/WebGLTemplates/XRCardTemplate/index.html
@@ -98,14 +98,11 @@ <h6 class="fw-bold">AR Card</h6>
                     </div>
 
                     <div class="mb-3" id="customImageUrlInput" style="display: none;">
-                        <label for="customImageUrl" class="form-label">URL</label>
-                        <input type="text" class="form-control" id="customImageUrl" placeholder="Enter image URL">
-                        
-                        <label class="form-label">Or</label>
-
-                        <label for="customImageFile" class="form-label">File</label>
-                        <input type="file" class="form-control" id="customImageFile" accept="image/*">
-                        <button class="btn btn-secondary mt-2" onclick="uploadImage()">Upload Image</button>
+                        <label style="display: none;" for="customImageUrl" class="form-label">URL</label>
+                        <input style="display: none;" type="text" class="form-control" id="customImageUrl" placeholder="Enter image URL">
+
+                        <label for="customImageFile" class="form-label">Image</label>
+                        <input type="file" class="form-control" id="customImageFile" accept="image/*" onchange="uploadImage()">
                     </div>
 
                     <div class="mb-3">
@@ -192,7 +189,6 @@ <h5 class="modal-title">Your Custom Card Link</h5>
                    uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {
                        console.log('File available at', downloadURL);
                        document.getElementById('customImageUrl').value = downloadURL;
-                       alert('Image uploaded successfully!');
                    });
                }
            );

From 64c597bdbb14d065e53d381995e7331a05e85e9a Mon Sep 17 00:00:00 2001
From: 97saundersj <jacques_s@hotmail.co.uk>
Date: Sat, 19 Apr 2025 20:56:55 +0100
Subject: [PATCH 4/5] Updated loading

---
 Assets/WebGLTemplates/XRCardTemplate/index.html  | 14 +++++++++++++-
 .../WebGLTemplates/XRCardTemplate/viewCard.html  |  3 ++-
 ProjectSettings/ProjectSettings.asset            |  2 +-
 ProjectSettings/TimelineSettings.asset           | 16 ++++++++++++++++
 4 files changed, 32 insertions(+), 3 deletions(-)
 create mode 100644 ProjectSettings/TimelineSettings.asset

diff --git a/Assets/WebGLTemplates/XRCardTemplate/index.html b/Assets/WebGLTemplates/XRCardTemplate/index.html
index 080c116..7fe2dc6 100644
--- a/Assets/WebGLTemplates/XRCardTemplate/index.html
+++ b/Assets/WebGLTemplates/XRCardTemplate/index.html
@@ -102,7 +102,10 @@ <h6 class="fw-bold">AR Card</h6>
                         <input style="display: none;" type="text" class="form-control" id="customImageUrl" placeholder="Enter image URL">
 
                         <label for="customImageFile" class="form-label">Image</label>
-                        <input type="file" class="form-control" id="customImageFile" accept="image/*" onchange="uploadImage()">
+                        <div style="display: flex; align-items: center;">
+                            <input type="file" class="form-control" id="customImageFile" accept="image/*" onchange="uploadImage()">
+                            <i id="loadingIcon" class="fas fa-spinner fa-spin" style="display: none; margin-left: 10px;"></i>
+                        </div>
                     </div>
 
                     <div class="mb-3">
@@ -165,11 +168,16 @@ <h5 class="modal-title">Your Custom Card Link</h5>
         function uploadImage() {
            const fileInput = document.getElementById('customImageFile');
            const file = fileInput.files[0];
+           const generateCardButton = document.querySelector('.btn-primary');
+           const loadingIcon = document.getElementById('loadingIcon');
            if (!file) {
                alert('Please select an image file to upload.');
                return;
            }
 
+           generateCardButton.disabled = true; // Disable the button
+           loadingIcon.style.display = 'inline-block'; // Show loading icon
+
            const storageRef = storage.ref('images/' + file.name);
            const uploadTask = storageRef.put(file);
 
@@ -183,12 +191,16 @@ <h5 class="modal-title">Your Custom Card Link</h5>
                    // Handle unsuccessful uploads
                    console.error('Upload failed:', error);
                    alert('Failed to upload image.');
+                   generateCardButton.disabled = false; // Re-enable the button on failure
+                   loadingIcon.style.display = 'none'; // Hide loading icon
                }, 
                () => {
                    // Handle successful uploads on complete
                    uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {
                        console.log('File available at', downloadURL);
                        document.getElementById('customImageUrl').value = downloadURL;
+                       generateCardButton.disabled = false; // Re-enable the button on success
+                       loadingIcon.style.display = 'none'; // Hide loading icon
                    });
                }
            );
diff --git a/Assets/WebGLTemplates/XRCardTemplate/viewCard.html b/Assets/WebGLTemplates/XRCardTemplate/viewCard.html
index 0703a18..99732d7 100644
--- a/Assets/WebGLTemplates/XRCardTemplate/viewCard.html
+++ b/Assets/WebGLTemplates/XRCardTemplate/viewCard.html
@@ -24,7 +24,7 @@ <h1 id="landingPageHeader">Happy Birthday!</h1>
     <div class="decorative-element"></div>
     <div class="decorative-element"></div>
 
-    <button id="viewCardButton" class="mt-4">View Card</button>
+    <button id="viewCardButton" class="mt-4" disabled>View Card</button>
 
     <div class="modal fade" id="instructionsModal" tabindex="-1" aria-labelledby="instructionsModalLabel" aria-hidden="true">
       <div class="modal-dialog modal-dialog-centered">
@@ -110,6 +110,7 @@ <h5 class="modal-title" id="instructionsModalLabel">How to Use the AR Card</h5>
         unityInstance = instance;
         loadingBar.style.display = "none";
         sendCardTextToUnity();
+        viewCardButton.disabled = false;
         if (fullscreenButton) {
           fullscreenButton.onclick = () => {
             unityInstance.SetFullscreen(1);
diff --git a/ProjectSettings/ProjectSettings.asset b/ProjectSettings/ProjectSettings.asset
index 6e93fda..b3db87d 100644
--- a/ProjectSettings/ProjectSettings.asset
+++ b/ProjectSettings/ProjectSettings.asset
@@ -735,7 +735,7 @@ PlayerSettings:
   allowUnsafeCode: 0
   useDeterministicCompilation: 1
   enableRoslynAnalyzers: 1
-  selectedPlatform: 3
+  selectedPlatform: 2
   additionalIl2CppArgs: 
   scriptingRuntimeVersion: 1
   gcIncremental: 1
diff --git a/ProjectSettings/TimelineSettings.asset b/ProjectSettings/TimelineSettings.asset
new file mode 100644
index 0000000..cfaebd7
--- /dev/null
+++ b/ProjectSettings/TimelineSettings.asset
@@ -0,0 +1,16 @@
+%YAML 1.1
+%TAG !u! tag:unity3d.com,2011:
+--- !u!114 &1
+MonoBehaviour:
+  m_ObjectHideFlags: 61
+  m_CorrespondingSourceObject: {fileID: 0}
+  m_PrefabInstance: {fileID: 0}
+  m_PrefabAsset: {fileID: 0}
+  m_GameObject: {fileID: 0}
+  m_Enabled: 1
+  m_EditorHideFlags: 0
+  m_Script: {fileID: 11500000, guid: a287be6c49135cd4f9b2b8666c39d999, type: 3}
+  m_Name: 
+  m_EditorClassIdentifier: 
+  assetDefaultFramerate: 60
+  m_DefaultFrameRate: 60

From 2e3581068386b695abd21236ae1750bdd8eb9168 Mon Sep 17 00:00:00 2001
From: 97saundersj <jacques_s@hotmail.co.uk>
Date: Sat, 18 Oct 2025 15:53:55 +0100
Subject: [PATCH 5/5] Updated readme instuctions

---
 ProjectSettings/ProjectSettings.asset |  4 ++--
 README.md                             | 24 +++++++++++++++++++++++-
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/ProjectSettings/ProjectSettings.asset b/ProjectSettings/ProjectSettings.asset
index b3db87d..7d8318e 100644
--- a/ProjectSettings/ProjectSettings.asset
+++ b/ProjectSettings/ProjectSettings.asset
@@ -702,7 +702,7 @@ PlayerSettings:
   webGLDebugSymbols: 0
   webGLEmscriptenArgs: 
   webGLModulesDirectory: 
-  webGLTemplate: PROJECT:XRCardTemplate
+  webGLTemplate: APPLICATION:Minimal
   webGLAnalyzeBuildSize: 0
   webGLUseEmbeddedResources: 0
   webGLCompressionFormat: 1
@@ -735,7 +735,7 @@ PlayerSettings:
   allowUnsafeCode: 0
   useDeterministicCompilation: 1
   enableRoslynAnalyzers: 1
-  selectedPlatform: 2
+  selectedPlatform: 3
   additionalIl2CppArgs: 
   scriptingRuntimeVersion: 1
   gcIncremental: 1
diff --git a/README.md b/README.md
index 00da1e5..29f7252 100644
--- a/README.md
+++ b/README.md
@@ -21,6 +21,28 @@ After customizing your AR greeting card, you can generate a shareable link. Clic
 - WebGL
 - HTML/CSS/JavaScript
 
+## Development
+
+### Running the Unity WebGL Build Locally
+
+To serve the Unity WebGL build locally without CORS issues:
+
+1. Navigate to your Unity build location:
+
+```powershell
+cd <your-unity-build-folder>
+```
+
+2. Run the http-server with CORS enabled:
+
+```powershell
+npx http-server -p 8000 --cors
+```
+
+3. Access at: `http://localhost:8000`
+
+**Note:** The `--cors` flag ensures proper CORS headers are sent, which is essential for Unity WebGL builds to work correctly when loaded from different origins.
+
 ## Features
 
 - Customizable landing page and greeting card themes
@@ -30,4 +52,4 @@ After customizing your AR greeting card, you can generate a shareable link. Clic
 
 ## Contributing
 
-Contributions are welcome! Please feel free to submit a pull request or open an issue with suggestions for improvements or new features.
\ No newline at end of file
+Contributions are welcome! Please feel free to submit a pull request or open an issue with suggestions for improvements or new features.