Merged json.js to jsonFormatter.js

Frontend/assets/scripts/tools/json.js

@@ -1,72 +0,0 @@
-function formatAndValidateJson(errorElement) {
-  const input = document.querySelector('#jsonBlock');
-  const processInfo = document.getElementById(errorElement);
-
-  const address = window.location.protocol + "//" + window.location.hostname + ":" + 8081 + "/json/formatting"
-
-  fetch(address, {
-    method: 'POST',
-    body: input.textContent
-  })
-  .then(async (response) => {
-    const promise = response.json();
-    if (!response.ok) {
-      throw Error(await promise);
-    }
-
-    return promise;
-  })
-  .then((data) => {
-    input.innerText = data.data;
-    processInfo.innerText = "";
-    hljs.highlightElement(input);
-
-    processInfo.innerHTML = "<b style='color: green'>Computed in </b> <span style='color: green'>" + data.time + "ms</span>";
-  })
-  .catch((error) => {
-    processInfo.innerHTML = "<b style='color: red'>" + error.data + "</b>";
-    console.error('Error:', error);
-  });
-}
-
-function minimizeJson(errorElement) {
-  const input = document.querySelector('#jsonBlock');
-  const processInfo = document.getElementById(errorElement);
-
-  const address = window.location.protocol + "//" + window.location.hostname + ":" + 8081 + "/json/minimize"
-
-  fetch(address, {
-    method: 'POST',
-    body: input.textContent
-  })
-  .then(async (response) => {
-    const promise = response.json();
-    if (!response.ok) {
-      throw Error(await promise);
-    }
-
-    return promise;
-  })
-  .then((data) => {
-    input.innerText = data.data;
-    processInfo.innerText = "";
-    hljs.highlightElement(input);
-
-    processInfo.innerHTML = "<b style='color: green'>Computed in </b> <span style='color: green'>" + data.time + "ms</span>";
-  })
-  .catch((error) => {
-    processInfo.innerHTML = "<b style='color: red'>" + error.data + "</b>";
-    console.error('Error:', error);
-  });
-}
-
-function clearJsonData() {
-  const input = document.querySelector('#jsonBlock');
-  input.textContent = "";
-}
-
-function insertDefaultJson() {
-  const input = document.querySelector('#jsonBlock');
-  input.textContent = "{\"enter\": \"your\", \"json\": \"here\"}";
-  hljs.highlightElement(input);
-}

Frontend/assets/scripts/tools/jsonFormatter.js

@@ -1,8 +1,24 @@
+
+
 const mergeHTMLPlugin = (function () {
     'use strict';
 
     var originalStream;
 
+    /**
+     * @param {string} value
+     * @returns {string}
+     */
+    function escapeHTML(value) {
+        return value
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#x27;');
+    }
+      
+
     /* plugin itself */
 
     /** @type {HLJSPlugin} */
@@ -158,4 +174,77 @@ function init() {
     configurePastingInElement("jsonBlock");
 
     hljs.addPlugin(mergeHTMLPlugin);
-}
+}
+
+function formatAndValidateJson(errorElement) {
+    const input = document.querySelector('#jsonBlock');
+    const processInfo = document.getElementById(errorElement);
+  
+    const address = window.location.protocol + "//" + window.location.hostname + ":" + 8081 + "/json/formatting"
+  
+    fetch(address, {
+      method: 'POST',
+      body: input.textContent
+    })
+    .then(async (response) => {
+      const promise = response.json();
+      if (!response.ok) {
+        throw Error(await promise);
+      }
+  
+      return promise;
+    })
+    .then((data) => {
+      input.innerText = data.data;
+      processInfo.innerText = "";
+      hljs.highlightElement(input);
+  
+      processInfo.innerHTML = "<b style='color: green'>Computed in </b> <span style='color: green'>" + data.time + "ms</span>";
+    })
+    .catch((error) => {
+      processInfo.innerHTML = "<b style='color: red'>" + error.data + "</b>";
+      console.error('Error:', error);
+    });
+  }
+  
+  function minimizeJson(errorElement) {
+    const input = document.querySelector('#jsonBlock');
+    const processInfo = document.getElementById(errorElement);
+  
+    const address = window.location.protocol + "//" + window.location.hostname + ":" + 8081 + "/json/minimize"
+  
+    fetch(address, {
+      method: 'POST',
+      body: input.textContent
+    })
+    .then(async (response) => {
+      const promise = response.json();
+      if (!response.ok) {
+        throw Error(await promise);
+      }
+  
+      return promise;
+    })
+    .then((data) => {
+      input.innerText = data.data;
+      processInfo.innerText = "";
+      hljs.highlightElement(input);
+  
+      processInfo.innerHTML = "<b style='color: green'>Computed in </b> <span style='color: green'>" + data.time + "ms</span>";
+    })
+    .catch((error) => {
+      processInfo.innerHTML = "<b style='color: red'>" + error.data + "</b>";
+      console.error('Error:', error);
+    });
+  }
+  
+  function clearJsonData() {
+    const input = document.querySelector('#jsonBlock');
+    input.textContent = "";
+  }
+  
+  function insertDefaultJson() {
+    const input = document.querySelector('#jsonBlock');
+    input.textContent = "{\"enter\": \"your\", \"json\": \"here\"}";
+    hljs.highlightElement(input);
+  }

Frontend/tools/jsonFormatter.html

@@ -10,7 +10,6 @@
     <script src="../assets/scripts/common/hljs.min.js"></script>
     <script src="../assets/scripts/tools/jsonFormatter.js"></script>
     <script src="../assets/scripts/tools/highlight.js"></script>
-    <script src="../assets/scripts/tools/json.js"></script>
     <script>hljs.highlightAll();</script>
   </head>