Created json formatter and validator. (#82)
Co-authored-by: mikolaj widla <mikolaj.widla@gmail.com> Co-authored-by: Adam Bem <adam.bem@zoho.eu> Co-authored-by: Adam Bem <bema@noreply.example.com> Co-authored-by: Artur Kołecki <koleckiartur@icloud.com> Reviewed-on: R11/release11-tools-web#82
This commit is contained in:
53
Frontend/tools/jsonFormatter.html
Normal file
53
Frontend/tools/jsonFormatter.html
Normal file
@@ -0,0 +1,53 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="utf-8" />
|
||||
|
||||
<link rel="stylesheet" href="../assets/css/tools/r11form.css">
|
||||
<link rel="stylesheet" href="../assets/css/json.css">
|
||||
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/default.min.css">
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
|
||||
<script src="../assets/scripts/tools/scripts.js"></script>
|
||||
<script src="../assets/scripts/tools/json.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<div id="tool" class="tool rwd-expandable">
|
||||
<div class="tool-context">
|
||||
<div class="headline">
|
||||
<h1>Online JSON Formatter</h1>
|
||||
</div>
|
||||
|
||||
<p style="color: red" id="error"></p>
|
||||
|
||||
<pre>
|
||||
<code class="hightlight-json json-block" id="jsonBlock" contenteditable="True">{"enter": "your", "json": "here"}</code>
|
||||
</pre>
|
||||
|
||||
<button style="margin-top: 20px"
|
||||
class="max-width block-label action-button active"
|
||||
onclick="formatAndValidateJson('error')"
|
||||
>Prettify JSON</button>
|
||||
|
||||
<button class="max-width block-label action-button active"
|
||||
onclick="minimizeJson('error')"
|
||||
>Minimize JSON</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tooltip-window rwd-hideable">
|
||||
<h2>What is this?</h2>
|
||||
<p>This tool has 2 main functions:
|
||||
<ul>
|
||||
<li><strong>Prettify JSON</strong> to make it human-readable (add indentation etc.)</li>
|
||||
<li><strong>Minimize JSON</strong> to make it more compact (exactly opposite to above)</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user