Merge branch 'CHN' of https://github.com/asesidaa/TaikoLocalServer in…

…to CHN
asesidaa · Nov 6, 2023 · f8378e5 · f8378e5
2 parents 7ec3513 + e30b7a7
commit f8378e5
Show file tree

Hide file tree

Showing 17 changed files with 170 additions and 52 deletions.
diff --git a/TaikoWebUI/Pages/Profile.razor b/TaikoWebUI/Pages/Profile.razor
diff --git a/TaikoWebUI/Pages/Profile.razor.cs b/TaikoWebUI/Pages/Profile.razor.cs
@@ -35,20 +35,15 @@ public partial class Profile
         "masks/body-bodymask-0070", "masks/body-bodymask-0092", "masks/body-bodymask-0121",
         "masks/body-bodymask-0123", "masks/body-bodymask-0127", "masks/body-bodymask-0136",
         "masks/body-bodymask-0153",
-
         "masks/body-facemask-0005", "masks/body-facemask-0015", "masks/body-facemask-0030",
         "masks/body-facemask-0064", "masks/body-facemask-0065", "masks/body-facemask-0069",
         "masks/body-facemask-0090", "masks/body-facemask-0092", "masks/body-facemask-0136",
         "masks/body-facemask-0151", "masks/body-facemask-0152", "masks/body-facemask-0153",
-
         "masks/head-bodymask-0113", "masks/head-bodymask-0138",
-
         "masks/head-facemask-0003", "masks/head-facemask-0113", "masks/head-facemask-0137", 
         "masks/head-facemask-0138",
-
         "masks/kigurumi-bodymask-0052", "masks/kigurumi-bodymask-0109", "masks/kigurumi-bodymask-0110",
         "masks/kigurumi-bodymask-0115", "masks/kigurumi-bodymask-0123",
-
         "masks/kigurumi-facemask-0052", "masks/kigurumi-facemask-0109", "masks/kigurumi-facemask-0110",
         "masks/kigurumi-facemask-0115", "masks/kigurumi-facemask-0123",
     };

diff --git a/TaikoWebUI/wwwroot/css/Nijiiro.woff2 b/TaikoWebUI/wwwroot/css/Nijiiro.woff2
diff --git a/TaikoWebUI/wwwroot/css/app.css b/TaikoWebUI/wwwroot/css/app.css
@@ -1,5 +1,10 @@
 @import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
 
+@font-face {
+    font-family: 'Nijiiro';
+    src: url('Nijiiro.woff2') format('woff2')
+}
+
 html, body {
     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }

diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_1.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_1.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_2.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_2.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_3.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_3.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_4.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_AI_4.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_dan.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_dan.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_gold.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_gold.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_purple.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_purple.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_rainbow.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_rainbow.png
diff --git a/TaikoWebUI/wwwroot/images/Nameplates/nameplate_wood.png b/TaikoWebUI/wwwroot/images/Nameplates/nameplate_wood.png
diff --git a/TaikoWebUI/wwwroot/index.html b/TaikoWebUI/wwwroot/index.html
@@ -16,8 +16,8 @@
 <body>
     <div id="app">
         <svg class="loading-progress">
-            <circle r="40%" cx="50%" cy="50%"/>
-            <circle r="40%" cx="50%" cy="50%"/>
+            <circle r="40%" cx="50%" cy="50%" />
+            <circle r="40%" cx="50%" cy="50%" />
         </svg>
         <div class="loading-progress-text"></div>
     </div>
@@ -29,6 +29,8 @@
     </div>
     <script src="_framework/blazor.webassembly.js"></script>
     <script src="_content/MudBlazor/MudBlazor.min.js"></script>
+    <script src="js/textFit.min.js"></script>
+    <script src="js/updateTextFit.js"></script>
 </body>
 
 </html>
diff --git a/TaikoWebUI/wwwroot/js/textFit.min.js b/TaikoWebUI/wwwroot/js/textFit.min.js
diff --git a/TaikoWebUI/wwwroot/js/updateTextFit.js b/TaikoWebUI/wwwroot/js/updateTextFit.js
@@ -0,0 +1,81 @@
+// Function to be called when the viewfinder size changes
+var title;
+var myDonName;
+var myDonNameOutline;
+var init = false
+const observer = new ResizeObserver(handleResize);
+function handleResize() {
+    updateFit()
+}
+
+function waitForElm(selector) {
+    return new Promise(resolve => {
+        if (document.querySelector(selector)) {
+            return resolve(document.querySelector(selector));
+        }
+
+        const observer = new MutationObserver(mutations => {
+            if (document.querySelector(selector)) {
+                observer.disconnect();
+                resolve(document.querySelector(selector));
+            }
+        });
+
+        observer.observe(document.body, {
+            childList: true,
+            subtree: true
+        });
+    });
+}
+
+// This is a monkey hack to detect when the page has changed (to stop the observer events)
+var pushState = history.pushState;
+history.pushState = function () {
+    pushState.apply(history, arguments);
+    init = false;
+    observer.disconnect();
+};
+
+// Fetches all the relevant objects on the page so updateFit can reference them later
+function initNameplate() {
+    if (window.location.href.indexOf("Profile") > -1) {
+        waitForElm('#nameplate-title').then((elm) => {
+            title = elm
+                waitForElm('#nameplate-name').then((elm) => {
+                    myDonName = elm
+                    waitForElm('#nameplate-name-outline').then((elm) => {
+                        myDonNameOutline = elm
+                        observer.observe(document.getElementById('nameplate'));
+                        init = true
+                    });
+                });
+        });
+    }
+}
+
+function updateFit() {
+    textFit(title, { alignHoriz: true, alignVert: true });
+    textFit(myDonName, { alignHoriz: true, alignVert: true });
+    textFit(myDonNameOutline, { alignHoriz: true, alignVert: true });
+}
+
+
+// Used to individually update texts on the nameplate
+function updateMyDonName(elm) {
+    if (init) {
+        myDonName.textContent = elm
+        myDonNameOutline.textContent = elm
+        updateFit()
+    }
+}
+function updateTitle(elm) {
+    if (init) {
+        title.textContent = elm
+        updateFit()
+    }
+}
+
+// Called by html onload when the image of the nameplate is loaded (this ensures the first fit is properly done)
+function nameplateLoaded() {
+    initNameplate()
+}