From 735f600c6680d08b9801bb04092e7fcae11593cf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Artur=20Ko=C5=82ecki?= Date: Thu, 23 Feb 2023 17:49:26 +0100 Subject: [PATCH] Created base of json formatter and validator. --- Frontend/assets/scripts/tools/json.js | 29 +++++++ Frontend/assets/scripts/tools/scripts.js | 4 + Frontend/index.html | 3 +- Frontend/tools/jsonFormatter.html | 79 +++++++++++++++++++ .../{formatter.html => xmlFormatter.html} | 0 5 files changed, 114 insertions(+), 1 deletion(-) create mode 100644 Frontend/assets/scripts/tools/json.js create mode 100644 Frontend/tools/jsonFormatter.html rename Frontend/tools/{formatter.html => xmlFormatter.html} (100%) diff --git a/Frontend/assets/scripts/tools/json.js b/Frontend/assets/scripts/tools/json.js new file mode 100644 index 0000000..5528adc --- /dev/null +++ b/Frontend/assets/scripts/tools/json.js @@ -0,0 +1,29 @@ +function formatAndValidateJson(errorElement) { + const input = document.querySelector('#jsonBlock'); + const errorOutput = document.getElementById(errorElement); + + try { + const obj = JSON.parse(input.textContent); + input.innerHTML = JSON.stringify(obj, null, 2); + errorOutput.innerText = ""; + hljs.highlightElement(input); + } catch (error) { + errorOutput.innerText = error; + console.error("Error: ", error) + } +} + +function minimizeJson(errorElement) { + const input = document.querySelector('#jsonBlock'); + const errorOutput = document.getElementById(errorElement); + + try { + const obj = JSON.parse(input.textContent); + input.innerHTML = JSON.stringify(obj); + errorOutput.innerText = ""; + hljs.highlightElement(input); + } catch (error) { + errorOutput.innerText = error; + console.error("Error: ", error) + } +} \ No newline at end of file diff --git a/Frontend/assets/scripts/tools/scripts.js b/Frontend/assets/scripts/tools/scripts.js index d464330..5b715bc 100644 --- a/Frontend/assets/scripts/tools/scripts.js +++ b/Frontend/assets/scripts/tools/scripts.js @@ -43,6 +43,10 @@ function setDefaultContent(element, text) { element.style.color = color_grey; element.value = text; } + if (id == "jsonArea") { + element.style.color = color_grey; + element.value = text; + } } } diff --git a/Frontend/index.html b/Frontend/index.html index d9d0cd2..725f072 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -25,7 +25,8 @@
  • XPath
  • XSLT
  • XSD
    • -
  • Formatter
    • +
  • XML Formatter
    • +
  • JSON Formatter
    • diff --git a/Frontend/tools/jsonFormatter.html b/Frontend/tools/jsonFormatter.html new file mode 100644 index 0000000..22f6bfa --- /dev/null +++ b/Frontend/tools/jsonFormatter.html @@ -0,0 +1,79 @@ + + + + + + + + + + + + + + + + + +
    +
    +
    +
    +

    Online JSON Formatter v0.0.1 BETA +

    +
    + +

    + + 
    +        {"enter": "your", "json": "here"}
+
    + + + + + + +
    +
    +
    +

    What is this?

    +

    This tool has 2 main functions: +

      +
    • Prettify JSON to make it human-readable (add indentation etc.)
      • +
    • Minimize JSON to make it more compact (exactly opposite to above)
      • +
    +

    +
    + +
    + + + + + + + + diff --git a/Frontend/tools/formatter.html b/Frontend/tools/xmlFormatter.html similarity index 100% rename from Frontend/tools/formatter.html rename to Frontend/tools/xmlFormatter.html