Skip to content

Commit 9339b5f

Browse files
fadamiaofadamiao
committed
First release
0 parents  commit 9339b5f

File tree

4 files changed

+235
-0
lines changed

4 files changed

+235
-0
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
.DS_Store

‎LICENSE

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
Copyright (c) 2013, Fernando A. Damião
2+
All rights reserved.
3+
4+
Redistribution and use in source and binary forms, with or without modification,
5+
are permitted provided that the following conditions are met:
6+
7+
Redistributions of source code must retain the above copyright notice, this
8+
list of conditions and the following disclaimer.
9+
10+
Redistributions in binary form must reproduce the above copyright notice, this
11+
list of conditions and the following disclaimer in the documentation and/or
12+
other materials provided with the distribution.
13+
14+
Neither the name of the Fernando A. Damião nor the names of its
15+
contributors may be used to endorse or promote products derived from
16+
this software without specific prior written permission.
17+
18+
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
19+
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
20+
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
21+
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR
22+
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
23+
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
24+
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
25+
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
26+
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
27+
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

‎README.md

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# json-formatter.html
2+
3+
An offline tool to format JSON
4+
5+
6+
## Infos
7+
* Made in OS: Windows 7
8+
* Tested in Browser: Firefox 21+, Chrome 29+, IE 9, Opera 12.16, Safari 5.1.7 (Windows)
9+
* Language Used: JavaScript
10+
* License: BSD 3-Clause License
11+
12+
13+
## Problems
14+
* IE 9 - SCRIPT5009: 'Blob' is not defined
15+
* Opera 12.16 - Uncaught exception: TypeError: Cannot convert 'window.URL' to object
16+
* Safari 5.1.7 (Windows) - TypeError: '[object BlobConstructor]' is not a constructor (evaluating 'new Blob([json], {type: 'application/octet-stream'})')

‎index.html

+191
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>JSON Formatter</title>
6+
<meta author="Fernando A. Damião">
7+
<meta description="An offline tool to format JSON">
8+
<style>
9+
body{
10+
margin: 0px;
11+
padding: 0px;
12+
border-top: 4px solid #FC4F08;
13+
background-color: #E6E6E6;
14+
font-family: Verdana;
15+
}
16+
17+
a {
18+
text-decoration: none;
19+
color: #003366;
20+
}
21+
22+
a:hover {
23+
text-decoration: underline;
24+
}
25+
26+
.container {
27+
width: 960px;
28+
margin: 0px auto;
29+
}
30+
31+
.header {
32+
padding: 10px 20px 0px;
33+
margin-bottom: 10px;
34+
}
35+
36+
.header h1 {
37+
margin: 0px;
38+
padding: 0px;
39+
color: #fc4f08;
40+
border-bottom: solid 1px #000000;
41+
}
42+
43+
.header h1 span {
44+
color: #454545;
45+
font: bold 18px Verdana;
46+
}
47+
48+
.content {
49+
padding: 0px 20px 10px;
50+
min-height: 600px;
51+
font: bold 13px Verdana;
52+
text-align: justify;
53+
}
54+
55+
.content .bar {
56+
margin-bottom: 5px;
57+
}
58+
59+
.content textarea {
60+
height: 400px;
61+
width: 49%;
62+
background-color: #000000;
63+
color: #00FF00;
64+
}
65+
66+
.footer {
67+
padding: 0px 20px 10px;
68+
text-align: center;
69+
border-top: solid 1px #000000;
70+
}
71+
72+
.footer span {
73+
color: #003366;
74+
font: bold 13px Verdana;
75+
}
76+
</style>
77+
</head>
78+
<body onload="verify();">
79+
<a href="https://github.com/fadamiao/json-formatter"><img style="position: fixed; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
80+
<div class="container">
81+
<div class="header">
82+
<h1>JSON Formatter</h1>
83+
</div>
84+
<div class="content">
85+
<div class="bar">
86+
<input type="radio" name="json-option" value="compact"> Compact |
87+
<input type="radio" name="json-option" value="tab">Tab |
88+
<input type="radio" name="json-option" value="2">2 Spaces |
89+
<input type="radio" name="json-option" value="4">4 Spaces
90+
<button type="button" onclick="format();">Format</button>
91+
<a id="json-download" download="output.json">Download JSON</a>
92+
</div>
93+
<textarea id="json-input"></textarea>
94+
<textarea id="json-output"></textarea><br><br>
95+
<p>Sample:</p>
96+
<pre><code>{"foo":"lorem","bar":"ipsum"}</code></pre>
97+
</div>
98+
<div class="footer">
99+
<span>Made by <a href="https://github.com/fadamiao">Fernando A. Damião</a></span>
100+
</div>
101+
</div>
102+
<script>
103+
function verify() {
104+
if (!navigator.userAgent.match(/Chrome|Firefox/i)) {
105+
alert("Your browser have issues with 'Blob' function.\nYou may have issues to use JSON Formatter.");
106+
}
107+
}
108+
109+
/*
110+
* Format and Download JSON via Blob
111+
*
112+
* @author Fernando A. Damião <[email protected]>
113+
* @note Created At: 2013-09-04 13:55
114+
* @note Last Update: 2013-09-05 10:01
115+
*
116+
*/
117+
function format() {
118+
var input = document.getElementById("json-input");
119+
var output = document.getElementById("json-output");
120+
var option = document.getElementsByName("json-option");
121+
var link = document.getElementById("json-download");
122+
123+
for (var i = 0; i < option.length; i++) {
124+
if (option[i].checked) {
125+
option = option[i].value;
126+
break;
127+
}
128+
}
129+
130+
output.innerHTML = jsonFormatter(input.value, option);
131+
link.href = jsonDownload(input.value, option);
132+
alert('Done!');
133+
}
134+
135+
/*
136+
* Download JSON via Blob
137+
*
138+
* @author Fernando A. Damião <[email protected]>
139+
* @note Created At: 2013-08-12 08:55
140+
* @note Last Update: 2013-09-05 10:00
141+
* @return String Download URL via Blob
142+
*
143+
*/
144+
function jsonDownload(json, option) {
145+
window.URL = window.URL || window.webkitURL;
146+
var json = jsonFormatter(json, option);
147+
var blob = new Blob([json], {type: 'application/octet-stream'});
148+
return window.URL.createObjectURL(blob);
149+
}
150+
151+
/*
152+
* Format JSON
153+
*
154+
* @author Fernando A. Damião <[email protected]>
155+
* @note Created At: 2013-09-05 08:43
156+
* @note Last Update: 2013-09-05 09:59
157+
* @return String Formated JSON
158+
*
159+
*/
160+
function jsonFormatter(json, option) {
161+
var json = JSON.parse(json);
162+
163+
if (option == "compact") {
164+
if (typeof json === 'object') {
165+
json = JSON.stringify(json);
166+
}
167+
} else {
168+
if (option == "2" || option == "4") {
169+
option = parseInt(option);
170+
} else {
171+
option = '\t';
172+
}
173+
174+
if (typeof json === 'object') {
175+
json = JSON.stringify(json, null, option);
176+
}
177+
}
178+
179+
return json;
180+
}
181+
</script>
182+
<script>
183+
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
184+
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
185+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
186+
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
187+
ga('create', 'UA-42571831-2', 'fadamiao.github.io');
188+
ga('send', 'pageview');
189+
</script>
190+
</body>
191+
</html>

0 commit comments

Comments
 (0)