customcommands: align frontend length display with backend validation (…

…#1710)
botlabs-gg · Jul 30, 2024 · 2fb3cfb · 2fb3cfb
1 parent 7c3e293
commit 2fb3cfb
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 4 deletions.
diff --git a/customcommands/assets/customcommands-editcmd.html b/customcommands/assets/customcommands-editcmd.html
@@ -731,17 +731,25 @@ <h2 class="card-title">Custom Command Information</h2>
 
     function updateCCLength() {
         const textAreas = document.querySelectorAll('#cc-responses > textarea');
-        const totalLength = Array.from(textAreas).reduce((len, el) => {
+        const totalLength = Array.from(textAreas).reduce((acc, el) => {
+            let len = countCodePoints(el.value);
             // The data received on the backend contains "\r\n" while it is simply "\n" on the JS side.
             // Adjust for this discrepancy by double-counting newline characters.
             const newlines = el.value.match(/\n/g);
-            return len + el.value.length + (newlines ? newlines.length : 0);
+            if (newlines) len += newlines.length;
+
+            return acc + len;
         }, 0);
 
         $('.cc-length-counter')
             .text(totalLength)
             .toggleClass('text-danger', totalLength > {{.MaxCCLength}});
     }
+
+    function countCodePoints(str) {
+        return [...str].length;
+    }
+
     function onCCChanged(textArea) {
        updateCCLength();
     }

diff --git a/customcommands/assets/customcommands-public.html b/customcommands/assets/customcommands-public.html
@@ -324,11 +324,13 @@ <h2 class="card-title">WARNING: IMPORTING A CUSTOM COMMAND</h2>
     var textAreas = document.querySelectorAll("#cc-responses > textarea")
     var combinedLength = 0;
     textAreas.forEach(function (elem) {
-      combinedLength += elem.value.length;
+      let len = countCodePoints(elem.value);
       // The data received on the backend contains "\r\n" while it is simply "\n" on the JS side.
       // Adjust for this discrepancy by double-counting newline characters.
       const newlines = elem.value.match(/\n/g);
-      if (newlines) combinedLength += newlines.length;
+      if (newlines) len += newlines.length;
+
+      combinedLength += len;
     })
 
     var display = document.querySelector(".cc-length-counter")
@@ -340,6 +342,11 @@ <h2 class="card-title">WARNING: IMPORTING A CUSTOM COMMAND</h2>
       premiumOnlyImport.classList.add("text-danger");
     }
   }
+
+  function countCodePoints(str) {
+    return [...str].length;
+  }
+
   function isTextTrigger(t) {
     return t === "cmd" ||
       t === "prefix" ||