Removed web application from the project
This commit is contained in:
jos
parent
ec2b9fffdf
commit
85100e9fb4
|
|
@ -1,4 +1,5 @@
|
|||
.idea
|
||||
build
|
||||
dist
|
||||
downloads
|
||||
node_modules
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
app
|
||||
bower.json
|
||||
build
|
||||
dist
|
||||
downloads
|
||||
jsoneditor
|
||||
misc
|
||||
|
|
|
|||
160
Jakefile.js
160
Jakefile.js
|
|
@ -2,7 +2,6 @@
|
|||
* Jake build script
|
||||
*/
|
||||
var jake = require('jake'),
|
||||
path = require('path'),
|
||||
CleanCSS = require('clean-css'),
|
||||
archiver = require('archiver'),
|
||||
fs = require('fs');
|
||||
|
|
@ -14,13 +13,13 @@ var JSONEDITOR = './jsoneditor.js',
|
|||
JSONEDITOR_CSS = './jsoneditor.css',
|
||||
JSONEDITOR_MIN = './jsoneditor-min.js',
|
||||
JSONEDITOR_CSS_MIN = './jsoneditor-min.css',
|
||||
BUILD = './build';
|
||||
DIST = './dist';
|
||||
|
||||
/**
|
||||
* default task
|
||||
*/
|
||||
desc('Execute all tasks');
|
||||
task('default', ['clear', 'build', 'minify', 'zip', 'webapp', 'chromeapp'], function () {
|
||||
task('default', ['clear', 'build', 'minify', 'zip'], function () {
|
||||
console.log('Done');
|
||||
});
|
||||
|
||||
|
|
@ -29,7 +28,7 @@ task('default', ['clear', 'build', 'minify', 'zip', 'webapp', 'chromeapp'], func
|
|||
*/
|
||||
desc('Clear the build directory');
|
||||
task('clear', function () {
|
||||
jake.rmRf(BUILD);
|
||||
jake.rmRf(DIST);
|
||||
});
|
||||
|
||||
/**
|
||||
|
|
@ -111,10 +110,9 @@ task('minify', ['build'], function () {
|
|||
*/
|
||||
desc('Zip the library');
|
||||
task('zip', ['build', 'minify'], {async: true}, function () {
|
||||
var zipfolder = BUILD + '/lib';
|
||||
var pkg = 'jsoneditor-' + version();
|
||||
var zipfile = zipfolder + '/' + pkg + '.zip';
|
||||
jake.mkdirP(zipfolder);
|
||||
var zipfile = DIST + '/' + pkg + '.zip';
|
||||
jake.mkdirP(DIST);
|
||||
|
||||
var output = fs.createWriteStream(zipfile);
|
||||
var archive = archiver('zip');
|
||||
|
|
@ -157,154 +155,6 @@ task('zip', ['build', 'minify'], {async: true}, function () {
|
|||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* build the web app
|
||||
*/
|
||||
desc('Build web app');
|
||||
task('webapp', ['build', 'minify'], function () {
|
||||
var webAppSrc = './app/web/';
|
||||
var libSrc = './lib/';
|
||||
var webApp = BUILD + '/app/web/';
|
||||
var webAppLib = webApp + 'lib/';
|
||||
var webAppAce = webAppLib + 'ace/';
|
||||
var webAppImg = webApp + 'img/';
|
||||
var appJs = webApp + 'app.js';
|
||||
var appCss = webApp + 'app.css';
|
||||
var appCssMin = webApp + 'app-min.css';
|
||||
var appJsMin = webApp + 'app-min.js';
|
||||
|
||||
// create directories
|
||||
// TODO: should be created automatically...
|
||||
jake.mkdirP(webApp);
|
||||
jake.mkdirP(webAppLib);
|
||||
jake.mkdirP(webAppLib + 'ace/');
|
||||
jake.mkdirP(webAppLib + 'jsoneditor/');
|
||||
jake.mkdirP(webAppLib + 'jsoneditor/img/');
|
||||
jake.mkdirP(webAppLib + 'jsonlint/');
|
||||
jake.mkdirP(webAppImg);
|
||||
|
||||
// concatenate the javascript files
|
||||
concat({
|
||||
src: [
|
||||
webAppSrc + 'queryparams.js',
|
||||
webAppSrc + 'ajax.js',
|
||||
webAppSrc + 'fileretriever.js',
|
||||
webAppSrc + 'notify.js',
|
||||
webAppSrc + 'splitter.js',
|
||||
webAppSrc + 'app.js'
|
||||
],
|
||||
dest: appJs,
|
||||
separator: '\n'
|
||||
});
|
||||
|
||||
// minify javascript
|
||||
minify({
|
||||
src: appJs,
|
||||
dest: appJsMin
|
||||
});
|
||||
|
||||
// concatenate the css files
|
||||
concat({
|
||||
src: [
|
||||
webAppSrc + 'fileretriever.css',
|
||||
webAppSrc + 'app.css'
|
||||
],
|
||||
dest: appCss,
|
||||
separator: '\n'
|
||||
});
|
||||
|
||||
// minify css file
|
||||
write(appCssMin, new CleanCSS().minify(String(read(appCss))));
|
||||
|
||||
// remove non minified javascript and css file
|
||||
fs.unlinkSync(appJs);
|
||||
fs.unlinkSync(appCss);
|
||||
|
||||
// copy files
|
||||
jake.cpR('./README.md', webApp);
|
||||
jake.cpR('./HISTORY.md', webApp);
|
||||
jake.cpR('./NOTICE', webApp);
|
||||
jake.cpR('./LICENSE', webApp);
|
||||
jake.cpR('./LICENSE', webApp);
|
||||
jake.cpR(webAppSrc + 'cache.manifest', webApp);
|
||||
jake.cpR(webAppSrc + 'robots.txt', webApp);
|
||||
jake.cpR(webAppSrc + 'datapolicy.txt', webApp);
|
||||
jake.cpR(webAppSrc + 'index.html', webApp);
|
||||
jake.cpR(webAppSrc + 'favicon.ico', webApp);
|
||||
jake.cpR(webAppSrc + 'fileretriever.php', webApp);
|
||||
jake.cpR(webAppSrc + 'googlea47c4a0b36d11021.html', webApp);
|
||||
jake.cpR(webAppSrc + 'img/logo.png', webAppImg);
|
||||
jake.cpR(webAppSrc + 'img/header_background.png', webAppImg);
|
||||
jake.cpR(webAppSrc + 'doc/', webApp);
|
||||
|
||||
// update date and verison in index.html
|
||||
replacePlaceholders(webApp + 'index.html');
|
||||
replacePlaceholders(webApp + 'index.html'); // TODO: fix bug in replace, should replace all occurrences
|
||||
replacePlaceholders(webApp + 'cache.manifest');
|
||||
|
||||
// concatenate and copy ace files
|
||||
concat({
|
||||
src: [
|
||||
libSrc + 'ace/ace.js',
|
||||
libSrc + 'ace/mode-json.js',
|
||||
libSrc + 'ace/theme-textmate.js',
|
||||
libSrc + 'ace/theme-jsoneditor.js',
|
||||
libSrc + 'ace/ext-searchbox.js'
|
||||
],
|
||||
dest: webAppAce + 'ace-min.js',
|
||||
separator: '\n'
|
||||
});
|
||||
jake.cpR(libSrc + 'ace/worker-json.js', webAppAce);
|
||||
|
||||
// copy json lint file
|
||||
jake.cpR(libSrc + 'jsonlint/jsonlint.js', webAppLib + 'jsonlint/')
|
||||
|
||||
// copy jsoneditor files
|
||||
jake.cpR(JSONEDITOR_MIN, webAppLib + 'jsoneditor/');
|
||||
jake.cpR(JSONEDITOR_CSS_MIN, webAppLib + 'jsoneditor/');
|
||||
jake.cpR('img', webAppLib + 'jsoneditor/');
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* build the chrome app
|
||||
*/
|
||||
desc('Build chrome app');
|
||||
task('chromeapp', {async: true}, function () {
|
||||
var folder = BUILD + '/app/';
|
||||
var file = folder + 'chrome.zip';
|
||||
jake.mkdirP(folder);
|
||||
|
||||
var output = fs.createWriteStream(file);
|
||||
var archive = archiver('zip');
|
||||
|
||||
archive.on('error', function(err) {
|
||||
throw err;
|
||||
});
|
||||
|
||||
// create a temporary manifest file with version number
|
||||
var manifestTmp = folder + 'manifest.json.tmp';
|
||||
jake.cpR('./app/chrome/manifest.json', manifestTmp);
|
||||
replacePlaceholders(manifestTmp);
|
||||
|
||||
archive.pipe(output);
|
||||
archive.append(fs.createReadStream(manifestTmp), {name: 'manifest.json'});
|
||||
archive.append(fs.createReadStream('./app/web/img/icon_16.png'), {name: 'icon_16.png'});
|
||||
archive.append(fs.createReadStream('./app/web/img/icon_128.png'), {name: 'icon_128.png'});
|
||||
|
||||
// cleanup temporary manifest file
|
||||
fs.unlinkSync(manifestTmp);
|
||||
|
||||
archive.finalize(function(err, written) {
|
||||
if (err) {
|
||||
throw err;
|
||||
}
|
||||
|
||||
console.log('Created chrome app ' + file);
|
||||
complete();
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* replace version, date, and name placeholders in the provided file
|
||||
* @param {String} filename
|
||||
|
|
|
|||
11
README.md
11
README.md
|
|
@ -13,15 +13,8 @@ can be loaded as CommonJS module, AMD module, or as a regular javascript file.
|
|||
|
||||
Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 9+.
|
||||
|
||||
### Screenshot
|
||||
|
||||
The web application shows two panels side by side: a code editor on the left,
|
||||
and a tree editor on the right. Files and urls can be loaded via the main menu.
|
||||
|
||||
<a href="http://jsoneditoronline.org">
|
||||
<img alt="jsoneditor"
|
||||
src="https://raw.github.com/josdejong/jsoneditor/master/misc/screenshots/jsoneditoronline.png">
|
||||
</a>
|
||||
<img alt="json editor" src="https://raw.github.com/josdejong/jsoneditor/master/misc/jsoneditor.png">
|
||||
<img alt="code editor" src="https://raw.github.com/josdejong/jsoneditor/master/misc/codeeditor.png">
|
||||
|
||||
|
||||
### Features
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
Chrome App
|
||||
|
||||
https://developers.google.com/chrome/web-store/articles/launching
|
||||
https://developers.google.com/chrome/web-store/articles/launching#pre-launch-checklist
|
||||
https://developers.google.com/chrome/web-store/docs/publish
|
||||
|
||||
http://developer.chrome.com/extensions/apps.html
|
||||
http://developer.chrome.com/trunk/extensions/apps/about_apps.html
|
||||
|
||||
Tutorial
|
||||
http://ohboard.com/blog/chrome-web-app-development-guide/
|
||||
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
{
|
||||
"manifest_version": 2,
|
||||
"name": "JSON Editor",
|
||||
"version": "@@version",
|
||||
"description": "JSON Editor is a tool to view, edit, and format JSON. It shows your data in an editable treeview and in a code editor.",
|
||||
"app": {
|
||||
"urls": [
|
||||
"http://jsoneditoronline.org/",
|
||||
"http://jsoneditoronline.org/index.html",
|
||||
"http://jsoneditoronline.org/changelog.txt",
|
||||
"http://jsoneditoronline.org/NOTICE"
|
||||
],
|
||||
"launch": {
|
||||
"web_url": "http://jsoneditoronline.org/index.html"
|
||||
}
|
||||
},
|
||||
"icons": {
|
||||
"16": "icon_16.png",
|
||||
"128": "icon_128.png"
|
||||
},
|
||||
"permissions": [
|
||||
"unlimitedStorage"
|
||||
],
|
||||
"offline_enabled": true
|
||||
}
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
/**
|
||||
* ajax
|
||||
* Utility to perform ajax get and post requests. Supported browsers:
|
||||
* Chrome, Firefox, Opera, Safari, Internet Explorer 7+.
|
||||
*/
|
||||
var ajax = (function () {
|
||||
function fetch (method, url, body, headers, callback) {
|
||||
try {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.onreadystatechange = function() {
|
||||
if (xhr.readyState == 4) {
|
||||
callback(xhr.responseText, xhr.status);
|
||||
}
|
||||
};
|
||||
xhr.open(method, url, true);
|
||||
if (headers) {
|
||||
for (var name in headers) {
|
||||
if (headers.hasOwnProperty(name)) {
|
||||
xhr.setRequestHeader(name, headers[name]);
|
||||
}
|
||||
}
|
||||
}
|
||||
xhr.send(body);
|
||||
}
|
||||
catch (err) {
|
||||
callback(err, 0);
|
||||
}
|
||||
}
|
||||
|
||||
function get (url, headers, callback) {
|
||||
fetch('GET', url, null, headers, callback);
|
||||
}
|
||||
|
||||
function post (url, body, headers, callback) {
|
||||
fetch('POST', url, body, headers, callback)
|
||||
}
|
||||
|
||||
return {
|
||||
'fetch': fetch,
|
||||
'get': get,
|
||||
'post': post
|
||||
}
|
||||
})();
|
||||
292
app/web/app.css
292
app/web/app.css
|
|
@ -1,292 +0,0 @@
|
|||
body, html {
|
||||
font-family: arial, sans-serif;
|
||||
font-size: 11pt;
|
||||
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
span.header-light {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
#header {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
/* TODO
|
||||
overflow: hidden;
|
||||
*/
|
||||
|
||||
background: #4D4D4D url('img/header_background.png');
|
||||
color: white;
|
||||
}
|
||||
|
||||
#logo {
|
||||
height: 32px;
|
||||
margin: 4px 10px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#menu {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 15px;
|
||||
font-size: 11pt;
|
||||
}
|
||||
|
||||
#menu ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#menu ul li {
|
||||
color: #e6e6e6;
|
||||
background: none;
|
||||
border: none;
|
||||
border-right: 1px solid #737373;
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
float: left;
|
||||
position: relative;
|
||||
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#menu ul li:first-child {
|
||||
border-left: 1px solid #737373;
|
||||
}
|
||||
|
||||
#menu ul li:hover {
|
||||
color: white;
|
||||
background-color: #737373;
|
||||
}
|
||||
|
||||
#menu ul li ul {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#menu ul li:hover > ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#menu ul li ul {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
|
||||
background: #f5f5f5;
|
||||
border: 1px solid lightgray;
|
||||
box-shadow: 0 0 15px rgba(128, 128, 128, 0.5);
|
||||
}
|
||||
|
||||
#menu ul li ul li {
|
||||
color: #737373;
|
||||
background: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#menu ul li ul li:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
#menu ul li ul li:hover {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
#menu a {
|
||||
padding: 6px 10px;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#menu ul li ul li a {
|
||||
color: #737373;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
|
||||
#openMenuButton {
|
||||
font-size: 75%;
|
||||
margin-left: 2px;
|
||||
}
|
||||
#menu #open {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/* TODO: enable the menu with keys (when openMenuButton is active) */
|
||||
|
||||
#auto {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
margin: -40px 0 -24px 0;
|
||||
padding: 40px 0 24px 0;
|
||||
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#contents {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#codeEditor, #treeEditor {
|
||||
height: 100%;
|
||||
width: 400px;
|
||||
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#codeEditor {
|
||||
float: left;
|
||||
padding: 15px 0 15px 15px;
|
||||
}
|
||||
|
||||
#treeEditor {
|
||||
float: left;
|
||||
padding: 15px 15px 15px 0;
|
||||
}
|
||||
|
||||
#splitter {
|
||||
text-align: center;
|
||||
float: left;
|
||||
height: 100%;
|
||||
padding: 15px;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#splitter #buttons {
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
|
||||
#splitter #toTree {
|
||||
margin: 40px 0 0 0 ;
|
||||
}
|
||||
|
||||
#splitter #toCode {
|
||||
margin: 20px 0 0 0 ;
|
||||
}
|
||||
|
||||
#splitter #drag {
|
||||
font-size: 32px;
|
||||
color: lightgray;
|
||||
border-radius: 3px;
|
||||
min-width: 24px;
|
||||
cursor: col-resize;
|
||||
}
|
||||
|
||||
#splitter #drag:hover,
|
||||
#splitter #drag.active {
|
||||
color: gray;
|
||||
background-color: #f5f5f5;
|
||||
|
||||
}
|
||||
|
||||
#footer {
|
||||
width: 100%;
|
||||
height: 23px;
|
||||
font-size: 10pt;
|
||||
|
||||
overflow: hidden;
|
||||
color: #BFBFBF;
|
||||
border-top: 1px solid lightgray;
|
||||
text-align: center;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
#footer-inner {
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
a.header {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
a.footer {
|
||||
color: #BFBFBF;
|
||||
text-decoration: none;
|
||||
}
|
||||
a.footer:hover {
|
||||
color: red;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#ad {
|
||||
float: right;
|
||||
right: 15px;
|
||||
padding: 15px 0 15px 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#chromeAppInfo {
|
||||
line-height: normal;
|
||||
padding: 0 5px 20px 5px;
|
||||
}
|
||||
|
||||
div.error, div.notification {
|
||||
border-radius: 2px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
box-shadow: 0 0 15px rgba(128, 128, 128, 0.5);
|
||||
|
||||
/* TODO: add some transition effect */
|
||||
}
|
||||
div.error {
|
||||
color: red;
|
||||
background-color: #FFC0CB;
|
||||
border: 1px solid red;
|
||||
}
|
||||
div.notification {
|
||||
color: #1a1a1a;
|
||||
background-color: #FFFFAB;
|
||||
border: 1px solid #e6d600;
|
||||
}
|
||||
pre.error {
|
||||
margin: 0 0 10px 0;
|
||||
white-space: pre-wrap;
|
||||
font-family: droid sans mono, monospace, courier new, courier, sans-serif;
|
||||
font-size: 10pt;
|
||||
}
|
||||
a.error {
|
||||
color: red;
|
||||
font-size: 8pt;
|
||||
}
|
||||
|
||||
button.convert {
|
||||
cursor: default;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
div.convert-right, div.convert-left {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div.convert-right {
|
||||
background: url('lib/jsoneditor/img/jsoneditor-icons.png') -0 -48px;
|
||||
}
|
||||
|
||||
div.convert-left {
|
||||
background: url('lib/jsoneditor/img/jsoneditor-icons.png') -24px -48px;
|
||||
}
|
||||
384
app/web/app.js
384
app/web/app.js
|
|
@ -1,384 +0,0 @@
|
|||
/*!
|
||||
* @file app.js
|
||||
*
|
||||
* @brief
|
||||
* JSONEditor is an editor to display and edit JSON data in a treeview.
|
||||
*
|
||||
* Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+
|
||||
*
|
||||
* @license
|
||||
* This json editor is open sourced with the intention to use the editor as
|
||||
* a component in your own application. Not to just copy and monetize the editor
|
||||
* as it is.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
* use this file except in compliance with the License. You may obtain a copy
|
||||
* of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
* License for the specific language governing permissions and limitations under
|
||||
* the License.
|
||||
*
|
||||
* Copyright (C) 2011-2013 Jos de Jong, http://jsoneditoronline.org
|
||||
*
|
||||
* @author Jos de Jong, <wjosdejong@gmail.com>
|
||||
* @date 2013-04-30
|
||||
*/
|
||||
|
||||
|
||||
var treeEditor = null;
|
||||
var codeEditor = null;
|
||||
|
||||
var app = {};
|
||||
|
||||
/**
|
||||
* Get the JSON from the code editor and load it in the tree editor
|
||||
*/
|
||||
app.CodeToTree = function() {
|
||||
try {
|
||||
treeEditor.set(codeEditor.get());
|
||||
}
|
||||
catch (err) {
|
||||
app.notify.showError(app.formatError(err));
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the JSON from the tree editor and load it into the code editor
|
||||
*/
|
||||
app.treeToCode = function () {
|
||||
try {
|
||||
codeEditor.set(treeEditor.get());
|
||||
}
|
||||
catch (err) {
|
||||
app.notify.showError(app.formatError(err));
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Load the interface (tree editor, code editor, splitter)
|
||||
*/
|
||||
// TODO: split the method load in multiple methods, it is too large
|
||||
app.load = function() {
|
||||
try {
|
||||
// notification handler
|
||||
app.notify = new Notify();
|
||||
|
||||
// retriever for loading/saving files
|
||||
app.retriever = new FileRetriever({
|
||||
scriptUrl: 'fileretriever.php',
|
||||
notify: app.notify
|
||||
});
|
||||
|
||||
// default json document
|
||||
var json = {
|
||||
"array": [1, 2, 3],
|
||||
"boolean": true,
|
||||
"null": null,
|
||||
"number": 123,
|
||||
"object": {"a": "b", "c": "d", "e": "f"},
|
||||
"string": "Hello World"
|
||||
};
|
||||
|
||||
// load url if query parameters contains a url
|
||||
if (window.QueryParams) {
|
||||
var qp = new QueryParams();
|
||||
var url = qp.getValue('url');
|
||||
if (url) {
|
||||
json = {};
|
||||
app.openUrl(url);
|
||||
}
|
||||
}
|
||||
|
||||
// Store whether tree editor or code editor is last changed
|
||||
app.lastChanged = undefined;
|
||||
|
||||
// code editor
|
||||
var container = document.getElementById("codeEditor");
|
||||
codeEditor = new jsoneditor.JSONEditor(container, {
|
||||
mode: 'code',
|
||||
change: function () {
|
||||
app.lastChanged = codeEditor;
|
||||
},
|
||||
error: function (err) {
|
||||
app.notify.showError(app.formatError(err));
|
||||
}
|
||||
});
|
||||
codeEditor.set(json);
|
||||
|
||||
// tree editor
|
||||
container = document.getElementById("treeEditor");
|
||||
treeEditor = new jsoneditor.JSONEditor(container, {
|
||||
mode: 'tree',
|
||||
change: function () {
|
||||
app.lastChanged = treeEditor;
|
||||
},
|
||||
error: function (err) {
|
||||
app.notify.showError(app.formatError(err));
|
||||
}
|
||||
});
|
||||
treeEditor.set(json);
|
||||
// TODO: automatically synchronize data of code and tree editor? (tree editor should keep its state though)
|
||||
|
||||
// splitter
|
||||
app.splitter = new Splitter({
|
||||
container: document.getElementById('drag'),
|
||||
change: function () {
|
||||
app.resize();
|
||||
}
|
||||
});
|
||||
|
||||
// button Code-to-Tree
|
||||
var toTree = document.getElementById('toTree');
|
||||
toTree.onclick = function () {
|
||||
this.focus();
|
||||
app.CodeToTree();
|
||||
};
|
||||
|
||||
// button Tree-to-Code
|
||||
var toCode = document.getElementById('toCode');
|
||||
toCode.onclick = function () {
|
||||
this.focus();
|
||||
app.treeToCode();
|
||||
};
|
||||
|
||||
// web page resize handler
|
||||
jsoneditor.util.addEventListener(window, 'resize', app.resize);
|
||||
|
||||
// clear button
|
||||
var domClear = document.getElementById('clear');
|
||||
domClear.onclick = app.clearFile;
|
||||
|
||||
/* TODO: enable clicking on open to execute the default, "open file"
|
||||
// open button
|
||||
var domOpen = document.getElementById('open');
|
||||
var domOpenMenuButton = document.getElementById('openMenuButton');
|
||||
domOpen.onclick = function (event) {
|
||||
var target = event.target || event.srcElement;
|
||||
if (target == domOpenMenuButton ||
|
||||
(event.offsetX > domOpen.offsetWidth - domOpenMenuButton.offsetWidth)) {
|
||||
// clicked on the menu button
|
||||
}
|
||||
else {
|
||||
app.openFile();
|
||||
}
|
||||
};
|
||||
*/
|
||||
|
||||
// menu button open file
|
||||
var domMenuOpenFile = document.getElementById('menuOpenFile');
|
||||
domMenuOpenFile.onclick = function (event) {
|
||||
app.openFile();
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
};
|
||||
|
||||
// menu button open url
|
||||
var domMenuOpenUrl = document.getElementById('menuOpenUrl');
|
||||
domMenuOpenUrl.onclick = function (event) {
|
||||
app.openUrl();
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
};
|
||||
|
||||
// save button
|
||||
var domSave = document.getElementById('save');
|
||||
domSave.onclick = app.saveFile;
|
||||
|
||||
// set focus on the code editor
|
||||
codeEditor.focus();
|
||||
|
||||
// enforce FireFox to not do spell checking on any input field
|
||||
document.body.spellcheck = false;
|
||||
} catch (err) {
|
||||
try {
|
||||
app.notify.showError(err);
|
||||
}
|
||||
catch (e) {
|
||||
if (console && console.log) {
|
||||
console.log(err);
|
||||
}
|
||||
alert(err);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Callback method called when a file or url is opened.
|
||||
* @param {Error} err
|
||||
* @param {String} data
|
||||
*/
|
||||
app.openCallback = function (err, data) {
|
||||
if (!err) {
|
||||
if (data != null) {
|
||||
codeEditor.setText(data);
|
||||
try {
|
||||
var json = jsoneditor.util.parse(data);
|
||||
treeEditor.set(json);
|
||||
}
|
||||
catch (err) {
|
||||
treeEditor.set({});
|
||||
app.notify.showError(app.formatError(err));
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
app.notify.showError(err);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Open a file explorer to select a file and open the file
|
||||
*/
|
||||
app.openFile = function() {
|
||||
app.retriever.loadFile(app.openCallback);
|
||||
};
|
||||
|
||||
/**
|
||||
* Open a url. If no url is provided as parameter, a dialog will be opened
|
||||
* to select a url.
|
||||
* @param {String} [url]
|
||||
*/
|
||||
app.openUrl = function (url) {
|
||||
if (!url) {
|
||||
app.retriever.loadUrlDialog(app.openCallback);
|
||||
}
|
||||
else {
|
||||
app.retriever.loadUrl(url, app.openCallback);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Open a file explorer to save the file.
|
||||
*/
|
||||
app.saveFile = function () {
|
||||
// first synchronize both editors contents
|
||||
if (app.lastChanged == treeEditor) {
|
||||
app.treeToCode();
|
||||
}
|
||||
/* TODO: also sync from code to tree editor? will clear the history ...
|
||||
if (app.lastChanged == codeEditor) {
|
||||
app.CodeToEditor();
|
||||
}
|
||||
*/
|
||||
app.lastChanged = undefined;
|
||||
|
||||
// save the text from the code editor
|
||||
// TODO: show a 'saving...' notification
|
||||
var data = codeEditor.getText();
|
||||
app.retriever.saveFile(data, function (err) {
|
||||
if (err) {
|
||||
app.notify.showError(err);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Format a JSON parse/stringify error as HTML
|
||||
* @param {Error} err
|
||||
* @returns {string}
|
||||
*/
|
||||
app.formatError = function (err) {
|
||||
var message = '<pre class="error">' + err.toString() + '</pre>';
|
||||
if (typeof(jsonlint) != 'undefined') {
|
||||
message +=
|
||||
'<a class="error" href="http://zaach.github.com/jsonlint/" target="_blank">' +
|
||||
'validated by jsonlint' +
|
||||
'</a>';
|
||||
}
|
||||
return message;
|
||||
};
|
||||
|
||||
/**
|
||||
* Clear the current file
|
||||
*/
|
||||
app.clearFile = function () {
|
||||
var json = {};
|
||||
codeEditor.set(json);
|
||||
treeEditor.set(json);
|
||||
};
|
||||
|
||||
app.resize = function() {
|
||||
var domMenu = document.getElementById('menu');
|
||||
var domTreeEditor = document.getElementById('treeEditor');
|
||||
var domCodeEditor = document.getElementById('codeEditor');
|
||||
var domSplitter = document.getElementById('splitter');
|
||||
var domSplitterButtons = document.getElementById('buttons');
|
||||
var domSplitterDrag = document.getElementById('drag');
|
||||
var domAd = document.getElementById('ad');
|
||||
|
||||
var margin = 15;
|
||||
var width = (window.innerWidth || document.body.offsetWidth ||
|
||||
document.documentElement.offsetWidth);
|
||||
var adWidth = domAd ? domAd.clientWidth : 0;
|
||||
if (adWidth) {
|
||||
width -= (adWidth + margin);
|
||||
}
|
||||
|
||||
if (app.splitter) {
|
||||
app.splitter.setWidth(width);
|
||||
|
||||
// calculate horizontal splitter position
|
||||
var value = app.splitter.getValue();
|
||||
var showCodeEditor = (value > 0);
|
||||
var showTreeEditor = (value < 1);
|
||||
var showButtons = showCodeEditor && showTreeEditor;
|
||||
domSplitterButtons.style.display = showButtons ? '' : 'none';
|
||||
|
||||
var splitterWidth = domSplitter.clientWidth;
|
||||
var splitterLeft;
|
||||
if (!showCodeEditor) {
|
||||
// code editor not visible
|
||||
splitterLeft = 0;
|
||||
domSplitterDrag.innerHTML = '›';
|
||||
domSplitterDrag.title = 'Drag right to show the code editor';
|
||||
}
|
||||
else if (!showTreeEditor) {
|
||||
// tree editor not visible
|
||||
splitterLeft = width * value - splitterWidth;
|
||||
domSplitterDrag.innerHTML = '‹';
|
||||
domSplitterDrag.title = 'Drag left to show the tree editor';
|
||||
}
|
||||
else {
|
||||
// both tree and code editor visible
|
||||
splitterLeft = width * value - splitterWidth / 2;
|
||||
|
||||
// TODO: find a character with vertical dots that works on IE8 too, or use an image
|
||||
var isIE8 = (jsoneditor.util.getInternetExplorerVersion() == 8);
|
||||
domSplitterDrag.innerHTML = (!isIE8) ? '⋮' : '|';
|
||||
domSplitterDrag.title = 'Drag left or right to change the width of the panels';
|
||||
}
|
||||
|
||||
// resize code editor
|
||||
domCodeEditor.style.display = (value == 0) ? 'none' : '';
|
||||
domCodeEditor.style.width = Math.max(Math.round(splitterLeft), 0) + 'px';
|
||||
codeEditor.resize();
|
||||
|
||||
// resize the splitter
|
||||
domSplitterDrag.style.height = (domSplitter.clientHeight -
|
||||
domSplitterButtons.clientHeight - 2 * margin -
|
||||
(showButtons ? margin : 0)) + 'px';
|
||||
domSplitterDrag.style.lineHeight = domSplitterDrag.style.height;
|
||||
|
||||
// resize tree editor
|
||||
// the width has a -1 to prevent the width from being just half a pixel
|
||||
// wider than the window, causing the content elements to wrap...
|
||||
domTreeEditor.style.display = (value == 1) ? 'none' : '';
|
||||
domTreeEditor.style.left = Math.round(splitterLeft + splitterWidth) + 'px';
|
||||
domTreeEditor.style.width = Math.max(Math.round(width - splitterLeft - splitterWidth - 2), 0) + 'px';
|
||||
}
|
||||
|
||||
// align main menu with ads
|
||||
if (domMenu) {
|
||||
if (adWidth) {
|
||||
domMenu.style.right = (margin + (adWidth + margin)) + 'px';
|
||||
}
|
||||
else {
|
||||
domMenu.style.right = margin + 'px';
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>JSON Editor Online - Beta</title>
|
||||
<link href="../doc/doc.css" type="text/css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<h1>JSON Editor Online - Beta</h1>
|
||||
<p>
|
||||
There is currently no beta version available.
|
||||
</p>
|
||||
<p>
|
||||
<a href="http://jsoneditoronline.org/">Go to the current version</a>
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
CACHE MANIFEST
|
||||
#Version @@version
|
||||
|
||||
CACHE:
|
||||
favicon.ico
|
||||
img/logo.png
|
||||
img/header_background.png
|
||||
app-min.js
|
||||
datapolicy.txt
|
||||
robots.txt
|
||||
lib/ace/ace-min.js
|
||||
lib/ace/worker-json.js
|
||||
lib/jsonlint/jsonlint.js
|
||||
lib/jsoneditor/img/jsoneditor-icons.png
|
||||
lib/jsoneditor/jsoneditor-min.css
|
||||
lib/jsoneditor/jsoneditor-min.js
|
||||
index.html
|
||||
app-min.css
|
||||
doc/img/actions_menu.png
|
||||
doc/img/button_actions_menu.png
|
||||
doc/img/button_dragarea.png
|
||||
doc/img/tree_editor.png
|
||||
doc/img/main_menu.png
|
||||
doc/img/code_editor.png
|
||||
doc/img/splitter.png
|
||||
doc/index.html
|
||||
doc/doc.css
|
||||
|
||||
# always load online resources like ads
|
||||
NETWORK:
|
||||
*
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
# JSON Editor online - Data policy
|
||||
|
||||
http://jsoneditoronline.org
|
||||
|
||||
|
||||
This file describes the data policy of JSON Editor Online. When using the
|
||||
open/save functionality of the editor, files may need to be downloaded via the
|
||||
server, therefore:
|
||||
|
||||
**DO NOT LOAD OR SAVE SENSITIVE DATA VIA THE EDITORS OPEN/SAVE FUNCTIONALITY.**
|
||||
|
||||
Files which are downloaded via the server are sent unsecured and unencrypted.
|
||||
|
||||
|
||||
## 1. Opening files
|
||||
|
||||
If the browser in use supports HTML5 FileReader, files are directly loaded
|
||||
from disk into the editor. The files are not send to the server.
|
||||
|
||||
If HTML5 is not supported, the files are first uploaded to the server and then
|
||||
downloaded by the editor. The files are deleted from the server as soon as
|
||||
they are downloaded once. If a file is not downloaded for some reason, it will
|
||||
be deleted from the server after one hour.
|
||||
|
||||
|
||||
## 2. Saving files
|
||||
|
||||
If the browser in use supports HTML5 a.download, files are directly saved
|
||||
from the browser to disk. The files are not send to the server.
|
||||
|
||||
If HTML5 is not supported, the files are first uploaded to the server and then
|
||||
downloaded to disk. The files are deleted from the server as soon as they are
|
||||
downloaded once. If a file is not downloaded for some reason, it will be
|
||||
deleted from the server after one hour.
|
||||
|
||||
|
||||
## 3. Opening urls
|
||||
|
||||
When opening an url, the editor first opens the url directly. If this fails
|
||||
due to cross-domain restrictions, the url will be retrieved via the server.
|
||||
In that case, the retrieved data is sent directly to the browser and is not
|
||||
stored on the server.
|
||||
|
||||
|
||||
## 4. Cutting/pasting clipboard data
|
||||
|
||||
When cutting and pasting text in the editor using the system clipboard, no
|
||||
data is sent via the server.
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
body, td, th {
|
||||
font-family: arial, sans-serif;
|
||||
font-size: 11pt;
|
||||
color: #4d4d4d;
|
||||
}
|
||||
|
||||
body, html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 20px 0 60px 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 14pt;
|
||||
color: #4d4d4d;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 11pt;
|
||||
color: #97B0F8;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
background-color: #e5e5e5;;
|
||||
|
||||
}
|
||||
|
||||
td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
th, td {
|
||||
border: 1px solid #e5e5e5;
|
||||
padding: 4px 4px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #4183C4;
|
||||
}
|
||||
a:hover {
|
||||
color: red;
|
||||
}
|
||||
|
||||
img.icon {
|
||||
vertical-align: middle;
|
||||
margin: 0 5px;
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 142 B |
Binary file not shown.
|
Before Width: | Height: | Size: 144 B |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.6 KiB |
|
|
@ -1,201 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>JSON Editor Online - Documentation</title>
|
||||
<link href="doc.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="container">
|
||||
<h1 id="documentation">JSON Editor Online - Documentation</h1>
|
||||
|
||||
<h2 id="introduction">Introduction</h2>
|
||||
<p>
|
||||
JSON Editor Online is a web-based tool to view, edit, and format JSON.
|
||||
It shows your data side by side in a clear, editable treeview and in
|
||||
a code editor.
|
||||
</p>
|
||||
<p>
|
||||
Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+.
|
||||
</p>
|
||||
<p>
|
||||
Website: <a href="http://jsoneditoronline.org" target="_blank">
|
||||
http://jsoneditoronline.org</a>.
|
||||
</p>
|
||||
<p>
|
||||
Contents:
|
||||
</p>
|
||||
<ul>
|
||||
<li><a href="#main_menu">Main menu</a></li>
|
||||
<li><a href="#panels">Panels</a></li>
|
||||
<li><a href="#code_editor">Code editor</a></li>
|
||||
<li><a href="#tree_editor">Tree editor</a></li>
|
||||
<li><a href="#shortcut_keys">Shortcut keys</a></li>
|
||||
</ul>
|
||||
|
||||
<h2 id="main_menu">Main menu</h2>
|
||||
<p>
|
||||
The applications main menu contains options to clear, load and save the
|
||||
JSON contents of the application. Files can be loaded from disk or url,
|
||||
and can be saved to disk. Please note that due to security restrictions,
|
||||
the application can only open files from public websites, not from an
|
||||
intranet. The data policy is described
|
||||
<a href="http://jsoneditoronline.org/datapolicy.txt">here</a>.
|
||||
</p>
|
||||
<img src="img/main_menu.png" alt="Main menu">
|
||||
|
||||
<h2 id="panels">Panels</h2>
|
||||
<p>
|
||||
The application contains two panels: a <b>code editor</b> on the left,
|
||||
and a <b>Tree Editor</b> on the right.
|
||||
</p>
|
||||
<p>
|
||||
There is a splitter between the two panels, allowing to change the
|
||||
width of both panels according to ones needs.
|
||||
To copy the contents from one panel to an other, the two copy buttons
|
||||
between the panels can be used.
|
||||
</p>
|
||||
<img src="img/splitter.png">
|
||||
|
||||
<h2 id="code_editor"> Code editor</h2>
|
||||
<p>
|
||||
The code editor displays JSON data in a code editor.
|
||||
The editor is capable of formatting, compacting, and inspecting JSON.
|
||||
</p>
|
||||
<img src="img/code_editor.png">
|
||||
<p>
|
||||
The menu of the code editor contains the following buttons:
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<b>Format</b>.
|
||||
Format the JSON data, make the data readable by applying indentation
|
||||
and returns.
|
||||
</li>
|
||||
<li>
|
||||
<b>Compact</b>.
|
||||
Compact the JSON data, remove all unnecessary characters like
|
||||
whitespaces and returns.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h2 id="tree_editor">Tree editor</h2>
|
||||
<p>
|
||||
The Tree editor displays the JSON data in an editable tree.
|
||||
The editor makes it easy to create, duplicate, remove fields,
|
||||
and to edit the contents of the fields.
|
||||
</p>
|
||||
<img src="img/tree_editor.png">
|
||||
<p>
|
||||
The menu of the tree editor contains the following functions:
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<b>Expand all</b>. Expand all fields in the editor.
|
||||
</li>
|
||||
<li>
|
||||
<b>Collapse all</b>. Collapse all fields in the editor.
|
||||
</li>
|
||||
<li>
|
||||
<b>Undo</b>. Undo last action.
|
||||
</li>
|
||||
<li>
|
||||
<b>Redo</b>. Redo last action.
|
||||
</li>
|
||||
<li>
|
||||
<b>Search</b>. Search for text in the tree editor.
|
||||
Search results will be highlighted, and can be iterated by
|
||||
repeatedly pressing Enter or Shift+Enter.
|
||||
The right side of the search box two buttons to go to the next or
|
||||
previous search result.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
The field values in the editor are editable input fields.
|
||||
The fields can be dragged up and down using the dragarea
|
||||
<img src="img/button_dragarea.png" class="icon">
|
||||
on the left side of the fields. When a field is the last item of the
|
||||
childs of an array or object, the field can also be dragged horizontally
|
||||
to move it in or out of the array or object.
|
||||
</p>
|
||||
<img src="img/actions_menu.png" align="right" style="padding-left: 20px;">
|
||||
<p>
|
||||
Right from the dragarea is a button
|
||||
<img src="img/button_actions_menu.png" class="icon">
|
||||
to open the <b>actions menu</b>.
|
||||
Depending on the type of field, the following functionality is
|
||||
available in the actions menu:
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<b>Type</b>. Change the type of the field. Choose from:
|
||||
<ul>
|
||||
<li>
|
||||
<b>auto</b> The field type is automatically determined from
|
||||
the value and can be a string, number, boolean, or null.
|
||||
</li>
|
||||
<li>
|
||||
<b>object</b> An unordered set of key/value pairs.
|
||||
</li>
|
||||
<li>
|
||||
<b>array</b> An ordered collection of values.
|
||||
</li>
|
||||
<li>
|
||||
<b>string</b> Field type is not determined from the value,
|
||||
but always returned as string.
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<b>Sort</b>. Sort the childs of an array or object.
|
||||
For an array, the values of the childs will be sorted. In case of
|
||||
an object, the childs will be sorted by key.
|
||||
Arrays and objects can be sorted ascending or descending.
|
||||
</li>
|
||||
<li>
|
||||
<b>Insert</b>. Insert a new field before current field.
|
||||
Available types are auto (default), object, array, and string.
|
||||
</li>
|
||||
<li>
|
||||
<b>Append</b>. Insert a new field after current field.
|
||||
Available types are the same as the insert action.
|
||||
</li>
|
||||
<li>
|
||||
<b>Duplicate</b>. Duplicate the field including all childs.
|
||||
</li>
|
||||
<li>
|
||||
<b>Remove</b>. Remove the field including all childs.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h2 id="shortcut_keys">Shortcut keys</h2>
|
||||
<p>
|
||||
The tree editor supports shortcut keys for all available actions.
|
||||
The editor can be used by just a keyboard.
|
||||
The following short cut keys are available:
|
||||
</p>
|
||||
|
||||
<table>
|
||||
<tr><th>Key</th><th>Description</th></tr>
|
||||
<tr><td>Alt+Arrows</td><td>Move the caret up/down/left/right between fields</td></tr>
|
||||
<tr><td>Shift+Alt+Arrows</td><td>Move field up/down/left/right</td></tr>
|
||||
|
||||
<tr><td>Ctrl+D</td><td>Duplicate field</td></tr>
|
||||
<tr><td>Ctrl+Del</td><td>Remove field</td></tr>
|
||||
<tr><td>Ctrl+Enter</td><td>Open link when on a field containing an url</td></tr>
|
||||
<tr><td>Ctrl+Ins</td><td>Insert a new field with type auto</td></tr>
|
||||
<tr><td>Ctrl+Shift+Ins</td><td>Append a new field with type auto</td></tr>
|
||||
<tr><td>Ctrl+E</td><td>Expand or collapse field</td></tr>
|
||||
<tr><td>Alt+End</td><td>Move the caret to the last field</td></tr>
|
||||
<tr><td>Ctrl+F</td><td>Find</td></tr>
|
||||
<tr><td>F3, Ctrl+G<br></td><td>Find next</td></tr>
|
||||
<tr><td>Shift+F3, Ctrl+Shift+G</td><td>Find previous</td></tr>
|
||||
<tr><td>Alt+Home</td><td>Move the caret to the first field</td></tr>
|
||||
<tr><td>Ctrl+M</td><td>Show actions menu</td></tr>
|
||||
<tr><td>Ctrl+Z</td><td>Undo last action</td></tr>
|
||||
<tr><td>Ctrl+Shift+Z</td><td>Redo</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
|
|
@ -1,63 +0,0 @@
|
|||
|
||||
div.fileretriever-overlay, div.fileretriever-background {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
div.fileretriever-overlay {
|
||||
background-color: gray;
|
||||
opacity: 0.2;
|
||||
filter: alpha(opacity = 20);
|
||||
}
|
||||
|
||||
div.fileretriever-border {
|
||||
width: 410px;
|
||||
margin: 100px auto;
|
||||
padding: 20px;
|
||||
background-color: white;
|
||||
border: 1px solid gray;
|
||||
border-radius: 2px;
|
||||
|
||||
-moz-box-shadow: 2px 2px 12px rgba(128, 128, 128, 0.3);
|
||||
-webkit-box-shadow: 2px 2px 12px rgba(128, 128, 128, 0.3);
|
||||
box-shadow: 2px 2px 12px rgba(128, 128, 128, 0.3);
|
||||
}
|
||||
|
||||
form.fileretriever-form {
|
||||
}
|
||||
|
||||
div.fileretriever-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div.fileretriever-description {
|
||||
color: gray;
|
||||
margin: 30px 0 0 0;
|
||||
}
|
||||
|
||||
div.fileretriever-contents {
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
div.fileretriever-buttons {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
input.fileretriever-field[type="file"] {
|
||||
width: 400px;
|
||||
padding: 3px;
|
||||
}
|
||||
input.fileretriever-field[type="text"] {
|
||||
width: 400px;
|
||||
border: 1px solid lightgray;
|
||||
border-radius: 2px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
input.fileretriever-submit, input.fileretriever-cancel {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
|
@ -1,575 +0,0 @@
|
|||
/**
|
||||
* @file fileretriever.js
|
||||
*
|
||||
* FileRetriever manages client side loading and saving of files.
|
||||
* It requires a server script (fileretriever.php). Loading and saving
|
||||
* files is done purely clientside using HTML5 techniques when supported
|
||||
* by the browser.
|
||||
*
|
||||
* Requires ajax.js.
|
||||
*
|
||||
* Supported browsers: Chrome, Firefox, Opera, Safari,
|
||||
* Internet Explorer 8+.
|
||||
*
|
||||
* Example usage:
|
||||
* var retriever = new FileRetriever({
|
||||
* 'serverUrl': 'fileretriever.php'
|
||||
* });
|
||||
* retriever.loadFile(function (err, data) {
|
||||
* console.log('file loaded:', data);
|
||||
* });
|
||||
* retriever.loadUrl(function (err, data) {
|
||||
* console.log('url loaded:', data);
|
||||
* });
|
||||
* retriever.saveFile("some text");
|
||||
*
|
||||
* @constructor FileRetriever
|
||||
* @param {String} options Available options:
|
||||
* {string} serverUrl Server side script for
|
||||
* handling files, for
|
||||
* example "fileretriever.php"
|
||||
* {Number} [maxSize] Maximum allowed file size
|
||||
* in bytes. (this should
|
||||
* be the same as maximum
|
||||
* size allowed by the server
|
||||
* side script). Default is
|
||||
* 1024 * 1024 bytes.
|
||||
* {Number} [timeout] Timeout in milliseconds.
|
||||
* 30000 ms by default.
|
||||
* {Boolean} [html5] Use HTML5 solutions
|
||||
* to load/save files when
|
||||
* supported by the browser.
|
||||
* True by default.
|
||||
* {Notify} [notify] A handler for notifications
|
||||
* If provided, messages like
|
||||
* "loading" and "saving" are created.
|
||||
*
|
||||
* @license
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
* use this file except in compliance with the License. You may obtain a copy
|
||||
* of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
* License for the specific language governing permissions and limitations under
|
||||
* the License.
|
||||
*
|
||||
* Copyright (c) 2013 Jos de Jong, http://jsoneditoronline.org
|
||||
*
|
||||
* @author Jos de Jong, <wjosdejong@gmail.com>
|
||||
* @date 2013-01-01
|
||||
*/
|
||||
var FileRetriever = function (options) {
|
||||
// set options and variables
|
||||
options = options || {};
|
||||
this.options = {
|
||||
maxSize: ((options.maxSize != undefined) ? options.maxSize : 1024 * 1024),
|
||||
html5: ((options.html5 != undefined) ? options.html5 : true)
|
||||
};
|
||||
this.timeout = Number(options.timeout) || 30000;
|
||||
this.headers = {'Accept': 'application/json'}; // headers for ajax requests
|
||||
this.scriptUrl = options.scriptUrl || 'fileretriever.php';
|
||||
this.notify = options.notify || undefined;
|
||||
this.defaultFilename = 'document.json';
|
||||
this.dom = {};
|
||||
};
|
||||
|
||||
/**
|
||||
* make an HTML DOM element invisible
|
||||
* @param {Element} elem
|
||||
* @private
|
||||
*/
|
||||
FileRetriever.prototype._hide = function (elem) {
|
||||
elem.style.visibility = 'hidden';
|
||||
elem.style.position = 'absolute';
|
||||
elem.style.left = '-1000px';
|
||||
elem.style.top = '-1000px';
|
||||
elem.style.width = '0';
|
||||
elem.style.height = '0';
|
||||
};
|
||||
|
||||
/**
|
||||
* Delete all HTML DOM elements created by the FileRetriever.
|
||||
* The FileRetriever cannot be used after its DOM elements are deleted.
|
||||
*/
|
||||
FileRetriever.prototype.remove = function () {
|
||||
var dom = this.dom;
|
||||
for (var prop in dom) {
|
||||
if (dom.hasOwnProperty(prop)) {
|
||||
var elem = dom[prop];
|
||||
if (elem.parentNode) {
|
||||
elem.parentNode.removeChild(elem);
|
||||
}
|
||||
}
|
||||
}
|
||||
this.dom = {};
|
||||
};
|
||||
|
||||
/**
|
||||
* get a filename from a path or url.
|
||||
* For example "http://site.com/files/example.json" will return "example.json"
|
||||
* @param {String} path A filename, path, or url
|
||||
* @return {String} filename
|
||||
* @private
|
||||
*/
|
||||
FileRetriever.prototype._getFilename = function (path) {
|
||||
// http://stackoverflow.com/a/423385/1262753
|
||||
return path ? path.replace(/^.*[\\\/]/, '') : '';
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the last url
|
||||
* @param {String} url
|
||||
*/
|
||||
FileRetriever.prototype.setUrl = function (url) {
|
||||
this.url = url;
|
||||
};
|
||||
|
||||
/**
|
||||
* Get last filename
|
||||
* @return {String} filename
|
||||
*/
|
||||
FileRetriever.prototype.getFilename = function () {
|
||||
return this.defaultFilename;
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the last url
|
||||
* @return {String | undefined} url
|
||||
*/
|
||||
FileRetriever.prototype.getUrl = function () {
|
||||
return this.url;
|
||||
};
|
||||
|
||||
/**
|
||||
* Load a url
|
||||
* @param {String} url The url to be retrieved
|
||||
* @param {function} callback Callback method, called with parameters:
|
||||
* {Error} error
|
||||
* {string} data
|
||||
*/
|
||||
FileRetriever.prototype.loadUrl = function (url, callback) {
|
||||
// set current filename (will be used when saving a file again)
|
||||
this.setUrl(url);
|
||||
|
||||
// loading notification
|
||||
var loading = undefined;
|
||||
if (this.notify) {
|
||||
loading = this.notify.showNotification('loading url...');
|
||||
}
|
||||
|
||||
// method to ensure the callback is only executed once
|
||||
var me = this;
|
||||
var callbackOnce = function (error, data) {
|
||||
if (callback) {
|
||||
callback(error, data);
|
||||
callback = undefined;
|
||||
}
|
||||
if (me.notify && loading) {
|
||||
me.notify.removeMessage(loading);
|
||||
loading = undefined;
|
||||
}
|
||||
};
|
||||
|
||||
// try to fetch to the url directly (may result in a cross-domain error)
|
||||
var scriptUrl = this.scriptUrl;
|
||||
ajax.get(url, me.headers, function(data, status) {
|
||||
if (status == 200) {
|
||||
// success. great. no cross-domain error
|
||||
callbackOnce(null, data);
|
||||
}
|
||||
else {
|
||||
// cross-domain error (or other). retrieve the url via the server
|
||||
var indirectUrl = scriptUrl + '?url=' + encodeURIComponent(url);
|
||||
var err;
|
||||
ajax.get(indirectUrl, me.headers, function(data, status) {
|
||||
if (status == 200) {
|
||||
callbackOnce(null, data);
|
||||
}
|
||||
else if (status == 404) {
|
||||
console.log('Error: url "' + url + '" not found', status, data);
|
||||
err = new Error('Error: url "' + url + '" not found');
|
||||
callbackOnce(err, null);
|
||||
}
|
||||
else {
|
||||
console.log('Error: failed to load url "' + url + '"', status, data);
|
||||
err = new Error('Error: failed to load url "' + url + '"');
|
||||
callbackOnce(err, null);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// safety mechanism: callback after a timeout
|
||||
setTimeout(function () {
|
||||
callbackOnce(new Error('Error loading url (time out)'));
|
||||
}, this.timeout);
|
||||
};
|
||||
|
||||
/**
|
||||
* Load a file from disk.
|
||||
* A file explorer will be opened to select a file and press ok.
|
||||
* In case of Internet Explorer, an upload form will be shown where the
|
||||
* user has to select a file via a file explorer after that click load.
|
||||
* @param {function} [callback] Callback method, called with parameters:
|
||||
* {Error} error
|
||||
* {string} data
|
||||
*/
|
||||
FileRetriever.prototype.loadFile = function (callback) {
|
||||
// loading notification
|
||||
var loading = undefined;
|
||||
var me = this;
|
||||
|
||||
var startLoading = function () {
|
||||
if (me.notify && !loading) {
|
||||
loading = me.notify.showNotification('loading file...');
|
||||
}
|
||||
|
||||
// safety mechanism: callback after a timeout
|
||||
setTimeout(function () {
|
||||
callbackOnce(new Error('Error loading url (time out)'));
|
||||
}, me.timeout);
|
||||
};
|
||||
|
||||
// method to ensure the callback is only executed once
|
||||
var callbackOnce = function (error, data) {
|
||||
if (callback) {
|
||||
callback(error, data);
|
||||
callback = undefined;
|
||||
}
|
||||
if (me.notify && loading) {
|
||||
me.notify.removeMessage(loading);
|
||||
loading = undefined;
|
||||
}
|
||||
};
|
||||
|
||||
// create a form to select a file and submit
|
||||
var useFileReader = (me.options.html5 && window.File && window.FileReader);
|
||||
|
||||
if (useFileReader) {
|
||||
this.prompt({
|
||||
title: 'Open file',
|
||||
titleSubmit: 'Open',
|
||||
description: 'Select a file on your computer.',
|
||||
inputType: 'file',
|
||||
inputName: 'file',
|
||||
callback: function (value, field) {
|
||||
if (value) {
|
||||
if (useFileReader) {
|
||||
// load file via HTML5 FileReader (no size limits)
|
||||
var file = field.files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function(event) {
|
||||
var data = event.target.result;
|
||||
callbackOnce(null, data);
|
||||
};
|
||||
|
||||
// Read in the image file as a data URL.
|
||||
reader.readAsText(file);
|
||||
}
|
||||
|
||||
startLoading();
|
||||
}
|
||||
}
|
||||
});
|
||||
// TODO: handle a cancel
|
||||
}
|
||||
else {
|
||||
// no html5 filereader available
|
||||
|
||||
// create an iframe for uploading files
|
||||
// the iframe must have an unique name, allowing multiple
|
||||
// FileRetrievers. The name is needed as target for the uploadForm
|
||||
var iframeName = 'fileretriever-upload-' + Math.round(Math.random() * 1E15);
|
||||
var iframe = document.createElement('iframe');
|
||||
iframe.name = iframeName;
|
||||
me._hide(iframe);
|
||||
iframe.onload = function () {
|
||||
// when a downloaded file is retrieved, send a callback with
|
||||
// the retrieved data
|
||||
var id = iframe.contentWindow.document.body.innerHTML;
|
||||
if (id) {
|
||||
var url = me.scriptUrl + '?id=' + id + '&filename=' + me.getFilename();
|
||||
ajax.get(url, me.headers, function (data, status) {
|
||||
if (status == 200) {
|
||||
callbackOnce(null, data);
|
||||
}
|
||||
else {
|
||||
var err = new Error('Error loading file ' + me.getFilename());
|
||||
callbackOnce(err, null);
|
||||
}
|
||||
|
||||
// cleanup the frame again
|
||||
if (iframe.parentNode === document.body) {
|
||||
document.body.removeChild(iframe);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
document.body.appendChild(iframe);
|
||||
|
||||
this.prompt({
|
||||
title: 'Open file',
|
||||
titleSubmit: 'Open',
|
||||
description: 'Select a file on your computer.',
|
||||
inputType: 'file',
|
||||
inputName: 'file',
|
||||
formAction: this.scriptUrl,
|
||||
formMethod: 'POST',
|
||||
formTarget: iframeName,
|
||||
callback: function (value) {
|
||||
if (value) {
|
||||
startLoading();
|
||||
}
|
||||
}
|
||||
});
|
||||
// TODO: handle a cancel
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Show a dialog to select and load an url.
|
||||
* @param {function} callback Callback method, called with parameters:
|
||||
* {Error} error
|
||||
* {String} data
|
||||
*/
|
||||
FileRetriever.prototype.loadUrlDialog = function (callback) {
|
||||
var me = this;
|
||||
this.prompt({
|
||||
title: 'Open url',
|
||||
titleSubmit: 'Open',
|
||||
description: 'Enter a public url. ' +
|
||||
'Urls which need authentication or are located on an intranet cannot be loaded.',
|
||||
inputType: 'text',
|
||||
inputName: 'url',
|
||||
inputDefault: this.getUrl(),
|
||||
callback: function (url) {
|
||||
if (url) {
|
||||
me.loadUrl(url, callback);
|
||||
}
|
||||
else {
|
||||
// cancel
|
||||
callback();
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Show a prompt.
|
||||
* The propmt can either:
|
||||
* - Post a form when formAction, and formMethod are provided.
|
||||
* Will call callback on submit.
|
||||
* - Call the callback method "callback" with the entered value as first parameter and the created DOM field as second.
|
||||
* This happens when a callback parameter is provided.
|
||||
* @param {Object} params Available parameters:
|
||||
* {String} title
|
||||
* {String} titleSubmit
|
||||
* {String} titleCancel
|
||||
* {String} description
|
||||
* {String} inputType
|
||||
* {String} inputName
|
||||
* {String} inputDefault
|
||||
* {String} formTarget
|
||||
* {String} formAction
|
||||
* {String} formMethod
|
||||
* {function} callback
|
||||
*/
|
||||
FileRetriever.prototype.prompt = function (params) {
|
||||
var removeDialog = function () {
|
||||
// remove the form
|
||||
if (background.parentNode) {
|
||||
background.parentNode.removeChild(background);
|
||||
}
|
||||
if (overlay.parentNode) {
|
||||
overlay.parentNode.removeChild(overlay);
|
||||
}
|
||||
|
||||
jsoneditor.util.removeEventListener(document, 'keydown', onKeyDown);
|
||||
};
|
||||
|
||||
var onCancel = function () {
|
||||
removeDialog();
|
||||
if(params.callback) {
|
||||
params.callback(null);
|
||||
}
|
||||
};
|
||||
|
||||
var onKeyDown = jsoneditor.util.addEventListener(document, 'keydown', function (event) {
|
||||
var keynum = event.which;
|
||||
if (keynum == 27) { // ESC
|
||||
onCancel();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
});
|
||||
|
||||
var overlay = document.createElement('div');
|
||||
overlay.className = 'fileretriever-overlay';
|
||||
document.body.appendChild(overlay);
|
||||
|
||||
var form = document.createElement('form');
|
||||
form.className = 'fileretriever-form';
|
||||
form.target = params.formTarget || '';
|
||||
form.action = params.formAction || '';
|
||||
form.method = params.formMethod || 'POST';
|
||||
form.enctype = 'multipart/form-data';
|
||||
form.encoding = 'multipart/form-data'; // needed for IE8 and older
|
||||
form.onsubmit = function () {
|
||||
if (field.value) {
|
||||
setTimeout(function () {
|
||||
// remove *after* the submit has taken place!
|
||||
removeDialog();
|
||||
}, 0);
|
||||
if (params.callback) {
|
||||
params.callback(field.value, field);
|
||||
}
|
||||
return (params.formAction != undefined && params.formMethod != undefined);
|
||||
}
|
||||
else {
|
||||
alert('Enter a ' + params.inputName + ' first...');
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
var title = document.createElement('div');
|
||||
title.className = 'fileretriever-title';
|
||||
title.appendChild(document.createTextNode(params.title || 'Dialog'));
|
||||
form.appendChild(title);
|
||||
|
||||
if (params.description) {
|
||||
var description = document.createElement('div');
|
||||
description.className = 'fileretriever-description';
|
||||
description.appendChild(document.createTextNode(params.description));
|
||||
form.appendChild(description);
|
||||
}
|
||||
|
||||
var field = document.createElement('input');
|
||||
field.className = 'fileretriever-field';
|
||||
field.type = params.inputType || 'text';
|
||||
field.name = params.inputName || 'text';
|
||||
field.value = params.inputDefault || '';
|
||||
|
||||
var contents = document.createElement('div');
|
||||
contents.className = 'fileretriever-contents';
|
||||
contents.appendChild(field);
|
||||
form.appendChild(contents);
|
||||
|
||||
var cancel = document.createElement('input');
|
||||
cancel.className = 'fileretriever-cancel';
|
||||
cancel.type = 'button';
|
||||
cancel.value = params.titleCancel || 'Cancel';
|
||||
cancel.onclick = onCancel;
|
||||
|
||||
var submit = document.createElement('input');
|
||||
submit.className = 'fileretriever-submit';
|
||||
submit.type = 'submit';
|
||||
submit.value = params.titleSubmit || 'Ok';
|
||||
|
||||
var buttons = document.createElement('div');
|
||||
buttons.className = 'fileretriever-buttons';
|
||||
buttons.appendChild(cancel);
|
||||
buttons.appendChild(submit);
|
||||
form.appendChild(buttons);
|
||||
|
||||
var border = document.createElement('div');
|
||||
border.className = 'fileretriever-border';
|
||||
border.appendChild(form);
|
||||
|
||||
var background = document.createElement('div');
|
||||
background.className = 'fileretriever-background';
|
||||
background.appendChild(border);
|
||||
background.onclick = function (event) {
|
||||
var target = event.target;
|
||||
if (target == background) {
|
||||
onCancel();
|
||||
}
|
||||
};
|
||||
document.body.appendChild(background);
|
||||
|
||||
field.focus();
|
||||
field.select();
|
||||
};
|
||||
|
||||
/**
|
||||
* Save data to disk
|
||||
* @param {String} data
|
||||
* @param {function} [callback] Callback when the file is saved, called
|
||||
* with parameter:
|
||||
* {Error} error
|
||||
*/
|
||||
FileRetriever.prototype.saveFile = function (data, callback) {
|
||||
// saving notification
|
||||
var saving = undefined;
|
||||
if (this.notify) {
|
||||
saving = this.notify.showNotification('saving file...');
|
||||
}
|
||||
|
||||
// method to ensure the callback is only executed once
|
||||
var me = this;
|
||||
var callbackOnce = function (error) {
|
||||
if (callback) {
|
||||
callback(error);
|
||||
callback = undefined;
|
||||
}
|
||||
if (me.notify && saving) {
|
||||
me.notify.removeMessage(saving);
|
||||
saving = undefined;
|
||||
}
|
||||
};
|
||||
|
||||
// create an anchor to save files to disk (if supported by the browser)
|
||||
// Note: save file using a.download is disabled in Firefox because of a
|
||||
// a bug in Firefox, which breaks the cut/paste functionality of
|
||||
// editable divs on the page.
|
||||
var a = document.createElement('a');
|
||||
if (this.options.html5 && a.download != undefined && !util.isFirefox()) {
|
||||
// save file directly using a data URL
|
||||
a.style.display = 'none';
|
||||
a.href = 'data:application/json;charset=utf-8,' + encodeURIComponent(data);
|
||||
a.download = this.getFilename();
|
||||
|
||||
// attach the element to the DOM, invoke a click action, and remove it again
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
document.body.removeChild(a);
|
||||
|
||||
callbackOnce();
|
||||
}
|
||||
else {
|
||||
// save file by uploading it to the server and then downloading
|
||||
// it via an iframe
|
||||
if (data.length < this.options.maxSize) {
|
||||
ajax.post(me.scriptUrl, data, me.headers, function(id, status) {
|
||||
if (status == 200) {
|
||||
var iframe = document.createElement('iframe');
|
||||
iframe.src = me.scriptUrl + '?id=' + id + '&filename=' + me.getFilename();
|
||||
me._hide(iframe);
|
||||
document.body.appendChild(iframe);
|
||||
/* TODO: send callback after the iframe is loaded. Problem: iframe.onload does not work on IE
|
||||
iframe.onload = function () {
|
||||
callbackOnce();
|
||||
};
|
||||
//*/
|
||||
callbackOnce();
|
||||
// TODO: cleanup the iframe after the file is saved. Problem: we cannot know when the save dialog is closed.
|
||||
}
|
||||
else {
|
||||
callbackOnce(new Error('Error saving file'));
|
||||
}
|
||||
});
|
||||
}
|
||||
else {
|
||||
callbackOnce(new Error('Maximum allowed file size exceeded (' +
|
||||
this.options.maxSize + ' bytes)'));
|
||||
}
|
||||
}
|
||||
|
||||
// safety mechanism: callback after a timeout
|
||||
setTimeout(function () {
|
||||
callbackOnce(new Error('Error saving file (time out)'));
|
||||
}, this.timeout);
|
||||
};
|
||||
|
|
@ -1,125 +0,0 @@
|
|||
<?php
|
||||
|
||||
/**
|
||||
* Script to load and save JSON files from the Javascript client to disk and url.
|
||||
*
|
||||
* Usage:
|
||||
*
|
||||
* POST file.php with a JSON document as body
|
||||
* Will store the JSON document on disk and return the id of the document.
|
||||
*
|
||||
* POST file.php with a JSON document with name "file" as body multipart/form-data
|
||||
* Will store the JSON document on disk and return the id of the document.
|
||||
*
|
||||
* GET file.php?url=....
|
||||
* Will fetch the url and return it (resolves cross-domain security issues)
|
||||
*
|
||||
* GET file.php?id=...
|
||||
* GET file.php?id=...&filename=...
|
||||
* Will return the file with the id, and remove the file from disk.
|
||||
* Optionally specify a filename for the download. Default is 'document.json'
|
||||
*/
|
||||
|
||||
// TODO: neatly handle exceeding of the max size
|
||||
$tmp = 'tmp'; // directory for temporarily storing the files
|
||||
|
||||
$method = $_SERVER['REQUEST_METHOD'];
|
||||
|
||||
// make temporary directory to store the file (if not existing)
|
||||
if (!is_dir(getcwd() . '/' . $tmp)) {
|
||||
mkdir(getcwd() . '/' . $tmp);
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a filename from given id
|
||||
* @param {String} id id of the file
|
||||
* @return {String} filename path to the file
|
||||
*/
|
||||
function getFilename($id) {
|
||||
global $tmp;
|
||||
return "$tmp/$id";
|
||||
}
|
||||
|
||||
if ($method == 'GET') {
|
||||
$filename = isset($_GET['filename']) ? $_GET['filename'] : 'document.json';
|
||||
if (isset($_GET['url'])) {
|
||||
// download a file from url and return the file
|
||||
$url = $_GET['url'];
|
||||
$context = stream_context_create(array(
|
||||
'http' => array(
|
||||
'method' => 'GET',
|
||||
'header' => "Accept: application/json\r\n"
|
||||
)
|
||||
));
|
||||
if (preg_match('/^https?:\/\//', $url)) { // only allow to fetch http:// and https:// urls
|
||||
$body = file_get_contents($url, false, $context);
|
||||
if ($body != false) {
|
||||
header("Content-Disposition: attachment; filename=\"$filename\"");
|
||||
header('Content-type: application/json');
|
||||
echo $body;
|
||||
}
|
||||
else {
|
||||
header('HTTP/1.1 404 Not Found');
|
||||
}
|
||||
}
|
||||
else {
|
||||
header('HTTP/1.1 403 Forbidden');
|
||||
}
|
||||
}
|
||||
else if (isset($_GET['id'])) {
|
||||
// retrieve the file with given id from disk, return it,
|
||||
// and remove it from disk
|
||||
$id = $_GET['id'];
|
||||
$body = file_get_contents(getFilename($id));
|
||||
if ($body !== false) {
|
||||
header("Content-Disposition: attachment; filename=\"$filename\"");
|
||||
header('Content-type: application/json');
|
||||
echo $body;
|
||||
unlink(getFilename($id));
|
||||
}
|
||||
else {
|
||||
header('HTTP/1.1 404 Not Found');
|
||||
}
|
||||
}
|
||||
else {
|
||||
// TODO: error
|
||||
}
|
||||
}
|
||||
else if ($method == 'POST') {
|
||||
// retrieve the data, save it on disk with a random id,
|
||||
// and return the id.
|
||||
|
||||
if (isset($_FILES['file'])) {
|
||||
// read body from uploaded form
|
||||
$file = $_FILES['file'];
|
||||
$id = uniqid();
|
||||
$filename = getFilename($id);
|
||||
move_uploaded_file($file['tmp_name'], $filename);
|
||||
echo $id;
|
||||
}
|
||||
else {
|
||||
// read raw body from post request
|
||||
$body = @file_get_contents('php://input');
|
||||
if ($body === false) {
|
||||
$body = '';
|
||||
}
|
||||
$id = uniqid();
|
||||
file_put_contents(getFilename($id), $body);
|
||||
echo $id;
|
||||
}
|
||||
}
|
||||
|
||||
// cleanup files older than 1 hour
|
||||
// http://stackoverflow.com/q/6411451/1262753
|
||||
if ($dir = opendir($tmp)) {
|
||||
$now = time();
|
||||
while (false !== ($file = readdir($dir))) {
|
||||
$filename = "$tmp/$file";
|
||||
if (is_file($filename) && filemtime($filename) <= ($now - 60 * 60) ) {
|
||||
unlink($filename);
|
||||
}
|
||||
}
|
||||
closedir($dir);
|
||||
}
|
||||
|
||||
?>
|
||||
|
|
@ -1 +0,0 @@
|
|||
google-site-verification: googlea47c4a0b36d11021.html
|
||||
133
app/web/hash.js
133
app/web/hash.js
|
|
@ -1,133 +0,0 @@
|
|||
|
||||
/**
|
||||
* @prototype Hash
|
||||
* This prototype contains methods to manipulate the hash of the web page
|
||||
*/
|
||||
function Hash() {}
|
||||
|
||||
/**
|
||||
* get an object value with all parameters in the hash
|
||||
* @return {Object} query object containing key/values
|
||||
*/
|
||||
Hash.prototype.getQuery = function () {
|
||||
var hash = window.location.hash.substring(1); // skip the # character
|
||||
var params = hash.split('&');
|
||||
var query = {};
|
||||
for (var i = 0, iMax = params.length; i < iMax; i++) {
|
||||
var keyvalue = params[i].split('=');
|
||||
if (keyvalue.length == 2) {
|
||||
var key = decodeURIComponent(keyvalue[0]);
|
||||
var value = decodeURIComponent(keyvalue[1]);
|
||||
query[key] = value;
|
||||
}
|
||||
}
|
||||
return query;
|
||||
};
|
||||
|
||||
/**
|
||||
* Register a callback function which will be called when the hash of the web
|
||||
* page changes.
|
||||
* @param {String} key
|
||||
* @param {function} callback Will be called with the new value as parameter
|
||||
*/
|
||||
Hash.prototype.onChange = function (key, callback) {
|
||||
this.prevHash = '';
|
||||
var me = this;
|
||||
if (!me.callbacks) {
|
||||
me.callbacks = [];
|
||||
}
|
||||
me.callbacks.push({
|
||||
'key': key,
|
||||
'value': undefined,
|
||||
'callback': callback
|
||||
});
|
||||
|
||||
function checkForChanges() {
|
||||
for (var i = 0; i < me.callbacks.length; i++) {
|
||||
var obj = me.callbacks[i];
|
||||
var value = me.getValue(obj.key);
|
||||
var changed = (value !== obj.value);
|
||||
obj.value = value;
|
||||
if (changed) {
|
||||
obj.callback(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// source: http://stackoverflow.com/questions/2161906/handle-url-anchor-change-event-in-js
|
||||
if ('onhashchange' in window) {
|
||||
window.onhashchange = function () {
|
||||
checkForChanges();
|
||||
}
|
||||
}
|
||||
else {
|
||||
// onhashchange event not supported
|
||||
me.prevHash = window.location.hash;
|
||||
window.setInterval(function () {
|
||||
var hash = window.location.hash;
|
||||
if (hash != me.prevHash) {
|
||||
me.prevHash = hash;
|
||||
checkForChanges();
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Set hash parameters
|
||||
* @param {Object} query object with strings
|
||||
*/
|
||||
Hash.prototype.setQuery = function (query) {
|
||||
var hash = '';
|
||||
|
||||
for (var key in query) {
|
||||
if (query.hasOwnProperty(key)) {
|
||||
var value = query[key];
|
||||
if (value != undefined) {
|
||||
if (hash.length) {
|
||||
hash += '&';
|
||||
}
|
||||
hash += encodeURIComponent(key);
|
||||
hash += '=';
|
||||
hash += encodeURIComponent(query[key]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.location.hash = (hash.length ? ('#' + hash) : '');
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Retrieve a parameter value from the hash
|
||||
* @param {String} key
|
||||
* @return {String | undefined} value undefined when the value is not found
|
||||
*/
|
||||
Hash.prototype.getValue = function (key) {
|
||||
var query = this.getQuery();
|
||||
return query[key];
|
||||
};
|
||||
|
||||
/**
|
||||
* Set an hash parameter
|
||||
* @param {String} key
|
||||
* @param {String} value
|
||||
*/
|
||||
Hash.prototype.setValue = function (key, value) {
|
||||
var query = this.getQuery();
|
||||
query[key] = value;
|
||||
this.setQuery(query);
|
||||
};
|
||||
|
||||
/**
|
||||
* Remove an hash parameter
|
||||
* @param {String} key
|
||||
*/
|
||||
Hash.prototype.removeValue = function (key) {
|
||||
var query = this.getQuery();
|
||||
if (query[key]) {
|
||||
delete query[key];
|
||||
this.setQuery(query);
|
||||
}
|
||||
};
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
JSON Editor Online Logo
|
||||
|
||||
font: Source Sans Pro, 19.2pt (24px)
|
||||
"JSON Editor" -> "Source Sans Pro"
|
||||
"Online" -> "Source Sans Pro Light"
|
||||
|
||||
color: white
|
||||
|
||||
logo size: 32x200 px
|
||||
|
||||
|
||||
JSON Editor Online Icon
|
||||
|
||||
Icon 128x128px
|
||||
background is 100x100px, color #4d4d4d, border radius 10px
|
||||
glass is white, opacity 10%
|
||||
text "{ }" is Arial, 78px, white
|
||||
|
||||
Icon 16x16px
|
||||
background full 16x16px. Scaled down from the 128x128px icon
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 187 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 601 B |
|
|
@ -1,151 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="128"
|
||||
height="128"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.3.1 r9886"
|
||||
sodipodi:docname="icon_gray.svg"
|
||||
inkscape:export-filename="/home/jos/jsoneditoronline/interface/img/jsoneditor_gray_128.png"
|
||||
inkscape:export-xdpi="90"
|
||||
inkscape:export-ydpi="90">
|
||||
<defs
|
||||
id="defs4">
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
id="linearGradient3873">
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3875" />
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3877" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3831">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3833" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3835" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3782">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3784" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3786" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3879"
|
||||
x1="-52.789062"
|
||||
y1="95.528737"
|
||||
x2="46.478516"
|
||||
y2="95.528737"
|
||||
gradientUnits="userSpaceOnUse" />
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3885"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-52.789062"
|
||||
y1="95.528737"
|
||||
x2="46.478516"
|
||||
y2="95.528737"
|
||||
gradientTransform="matrix(1.2781663,0,0,1.2781663,-0.56683723,-27.178371)" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="4"
|
||||
inkscape:cx="74.123"
|
||||
inkscape:cy="63.939559"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1600"
|
||||
inkscape:window-height="849"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
showguides="true"
|
||||
inkscape:guide-bbox="true">
|
||||
<sodipodi:guide
|
||||
orientation="0,1"
|
||||
position="62.57895,132.22897"
|
||||
id="guide3871" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(0,-924.36218)">
|
||||
<rect
|
||||
style="fill:#4d4d4d;fill-opacity:1;stroke:none"
|
||||
id="rect3004"
|
||||
width="100"
|
||||
height="100"
|
||||
x="14"
|
||||
y="938.36218"
|
||||
ry="10"
|
||||
rx="10" />
|
||||
<path
|
||||
style="opacity:0.1;fill:#ffffff;fill-opacity:1;stroke:none"
|
||||
d="M 14,50.875 14.03125,23 c 0.0926,-4.543321 4.895309,-8.941992 9.125,-9 l 81.96875,0 c 4.49471,0.0913 8.85437,5.039189 8.875,9.125 L 114,51 C 80.492943,56.594067 47.17385,55.936454 14,50.875 z"
|
||||
id="path3768"
|
||||
inkscape:connector-curvature="0"
|
||||
transform="translate(0,924.36218)"
|
||||
sodipodi:nodetypes="ccccccc" />
|
||||
<flowRoot
|
||||
xml:space="preserve"
|
||||
id="flowRoot3815"
|
||||
style="font-size:100px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Arial Bold"
|
||||
transform="matrix(0.78237078,0,0,0.78237078,65.80062,914.91146)"><flowRegion
|
||||
id="flowRegion3817"
|
||||
style="fill:url(#linearGradient3885);fill-opacity:1"><rect
|
||||
id="rect3819"
|
||||
width="208.57143"
|
||||
height="192.14285"
|
||||
x="-55.714287"
|
||||
y="23"
|
||||
style="font-size:100px;font-style:normal;fill:#ffffff;fill-opacity:1;-inkscape-font-specification:Arial Bold" /></flowRegion><flowPara
|
||||
id="flowPara3821"
|
||||
style="font-size:100px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#ffffff;fill-opacity:1;font-family:Arial;-inkscape-font-specification:Arial Bold">{ }</flowPara></flowRoot> </g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 5.0 KiB |
|
|
@ -1,150 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="16"
|
||||
height="16"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.3.1 r9886"
|
||||
sodipodi:docname="icon_gray_16.svg"
|
||||
inkscape:export-filename="/home/jos/jsoneditoronline/interface/img/icon_16.png"
|
||||
inkscape:export-xdpi="90"
|
||||
inkscape:export-ydpi="90">
|
||||
<defs
|
||||
id="defs4">
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
id="linearGradient3873">
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3875" />
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3877" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3831">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3833" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3835" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3782">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3784" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3786" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3879"
|
||||
x1="-52.789062"
|
||||
y1="95.52874"
|
||||
x2="46.478516"
|
||||
y2="95.52874"
|
||||
gradientUnits="userSpaceOnUse" />
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3885"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-52.789062"
|
||||
y1="95.52874"
|
||||
x2="46.478516"
|
||||
y2="95.52874"
|
||||
gradientTransform="matrix(7.98854,0,0,7.9885394,455.89837,-215.38857)" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="32"
|
||||
inkscape:cx="1.8526919"
|
||||
inkscape:cy="9.2265399"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1600"
|
||||
inkscape:window-height="849"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
showguides="true"
|
||||
inkscape:guide-bbox="true">
|
||||
<sodipodi:guide
|
||||
orientation="0,1"
|
||||
position="62.57895,132.22897"
|
||||
id="guide3871" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(0,-1036.3622)">
|
||||
<rect
|
||||
style="fill:#4d4d4d;fill-opacity:1;stroke:none"
|
||||
id="rect3004"
|
||||
width="15.999998"
|
||||
height="15.999999"
|
||||
x="0"
|
||||
y="1036.3622"
|
||||
ry="1.25"
|
||||
rx="1.25" />
|
||||
<path
|
||||
style="opacity:0.1;fill:#ffffff;fill-opacity:1;stroke:none"
|
||||
d="m 1.3156105e-7,1042.2621 0.004999998439,-4.46 c -0.0086175,-1.0941 0.3535625,-1.4385 1.45999997,-1.44 l 13.1149989,0 c 0.94181,-6e-4 1.428418,0.3571 1.42,1.46 l 0,4.46 c -5.361129,0.8951 -10.6921826,0.7899 -15.99999886843895,-0.02 z"
|
||||
id="path3768"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="ccccccc" />
|
||||
<flowRoot
|
||||
xml:space="preserve"
|
||||
id="flowRoot3815"
|
||||
style="font-size:100px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Arial Bold"
|
||||
transform="matrix(0.12517931,0,0,0.12517932,8.2880984,1032.61)"><flowRegion
|
||||
id="flowRegion3817"
|
||||
style="fill:url(#linearGradient3885);fill-opacity:1"><rect
|
||||
id="rect3819"
|
||||
width="208.57143"
|
||||
height="192.14285"
|
||||
x="-55.714287"
|
||||
y="23"
|
||||
style="font-size:100px;font-style:normal;fill:#ffffff;fill-opacity:1;-inkscape-font-specification:Arial Bold" /></flowRegion><flowPara
|
||||
id="flowPara3821"
|
||||
style="font-size:100px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#ffffff;fill-opacity:1;font-family:Arial;-inkscape-font-specification:Arial Bold">{ }</flowPara></flowRoot> </g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 5.0 KiB |
|
|
@ -1,151 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="128"
|
||||
height="128"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.3.1 r9886"
|
||||
sodipodi:docname="icon_orange.svg"
|
||||
inkscape:export-filename="/home/jos/jsoneditoronline/interface/img/jsoneditor_gray_128.png"
|
||||
inkscape:export-xdpi="90"
|
||||
inkscape:export-ydpi="90">
|
||||
<defs
|
||||
id="defs4">
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
id="linearGradient3873">
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3875" />
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3877" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3831">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3833" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3835" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="linearGradient3782">
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop3784" />
|
||||
<stop
|
||||
style="stop-color:#88a4f7;stop-opacity:0;"
|
||||
offset="1"
|
||||
id="stop3786" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3879"
|
||||
x1="-52.789062"
|
||||
y1="95.528737"
|
||||
x2="46.478516"
|
||||
y2="95.528737"
|
||||
gradientUnits="userSpaceOnUse" />
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient3873"
|
||||
id="linearGradient3885"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-52.789062"
|
||||
y1="95.528737"
|
||||
x2="46.478516"
|
||||
y2="95.528737"
|
||||
gradientTransform="matrix(1.2781663,0,0,1.2781663,-0.56683723,-27.178371)" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="4"
|
||||
inkscape:cx="26.373"
|
||||
inkscape:cy="63.939559"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1600"
|
||||
inkscape:window-height="849"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
showguides="true"
|
||||
inkscape:guide-bbox="true">
|
||||
<sodipodi:guide
|
||||
orientation="0,1"
|
||||
position="62.57895,132.22897"
|
||||
id="guide3871" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(0,-924.36218)">
|
||||
<rect
|
||||
style="fill:#ffcb00;fill-opacity:1;stroke:none"
|
||||
id="rect3004"
|
||||
width="100"
|
||||
height="100"
|
||||
x="14"
|
||||
y="938.36218"
|
||||
ry="10"
|
||||
rx="10" />
|
||||
<path
|
||||
style="opacity:0.2;fill:#ffffff;fill-opacity:1;stroke:none"
|
||||
d="M 14,50.875 14.03125,23 c 0.0926,-4.543321 4.895309,-8.941992 9.125,-9 l 81.96875,0 c 4.49471,0.0913 8.85437,5.039189 8.875,9.125 L 114,51 C 80.492943,56.594067 47.17385,55.936454 14,50.875 z"
|
||||
id="path3768"
|
||||
inkscape:connector-curvature="0"
|
||||
transform="translate(0,924.36218)"
|
||||
sodipodi:nodetypes="ccccccc" />
|
||||
<flowRoot
|
||||
xml:space="preserve"
|
||||
id="flowRoot3815"
|
||||
style="font-size:100px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Arial Bold"
|
||||
transform="matrix(0.78237078,0,0,0.78237078,65.80062,914.91146)"><flowRegion
|
||||
id="flowRegion3817"
|
||||
style="fill:url(#linearGradient3885);fill-opacity:1"><rect
|
||||
id="rect3819"
|
||||
width="208.57143"
|
||||
height="192.14285"
|
||||
x="-55.714287"
|
||||
y="23"
|
||||
style="font-size:100px;font-style:normal;fill:#ffffff;fill-opacity:1;-inkscape-font-specification:Arial Bold" /></flowRegion><flowPara
|
||||
id="flowPara3821"
|
||||
style="font-size:100px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#ffffff;fill-opacity:1;font-family:Arial;-inkscape-font-specification:Arial Bold">{ }</flowPara></flowRoot> </g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
|
@ -1,190 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
|
||||
<html manifest="/cache.manifest">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||
|
||||
<title>JSON Editor Online - view, edit and format JSON online</title>
|
||||
|
||||
<!--
|
||||
|
||||
@file index.html
|
||||
|
||||
@brief
|
||||
JSON Editor Online is a web-based tool to view, edit, and format JSON.
|
||||
It shows your data side by side in a clear, editable treeview and in
|
||||
a code editor.
|
||||
|
||||
Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+
|
||||
|
||||
@license
|
||||
This json editor is open sourced with the intention to use the editor as
|
||||
a component in your own application. Not to just copy and monetize the editor
|
||||
as it is.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
use this file except in compliance with the License. You may obtain a copy
|
||||
of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
License for the specific language governing permissions and limitations under
|
||||
the License.
|
||||
|
||||
Copyright (C) 2011-2013 Jos de Jong, http://jsoneditoronline.org
|
||||
|
||||
@author Jos de Jong, <wjosdejong@gmail.com>
|
||||
@version @@version
|
||||
@date @@date
|
||||
-->
|
||||
|
||||
<meta name="description" content="JSON Editor Online is a web-based tool to view, edit, and format JSON. It shows your data side by side in a clear, editable treeview and in a code editor.">
|
||||
<meta name="keywords" content="json, editor, formatter, online, format, parser, json editor, json editor online, online json editor, javascript, javascript object notation, tools, tool, json tools, treeview, open source, free, json parser, json parser online, json formatter, json formatter online, online json formatter, online json parser, format json online">
|
||||
<meta name="author" content="Jos de Jong">
|
||||
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="app-min.css">
|
||||
<link rel="stylesheet" type="text/css" href="lib/jsoneditor/jsoneditor-min.css">
|
||||
<!-- TODO: droid font
|
||||
<link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono' rel='stylesheet' type='text/css'>
|
||||
-->
|
||||
|
||||
<script type="text/javascript" src="lib/jsoneditor/jsoneditor-min.js"></script>
|
||||
<script type="text/javascript" src="lib/ace/ace-min.js"></script>
|
||||
<script type="text/javascript" src="app-min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="header">
|
||||
<a href="http://jsoneditoronline.org" class="header">
|
||||
<img alt="JSON Editor Online" title="JSON Editor Online" src="img/logo.png" id="logo">
|
||||
</a>
|
||||
|
||||
<div id="menu">
|
||||
<ul>
|
||||
<li>
|
||||
<a id="clear" title="Clear contents">Clear</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="open" title="Open file from disk">
|
||||
Open
|
||||
<span id="openMenuButton" title="Open file from disk or url">
|
||||
▼
|
||||
</span>
|
||||
</a>
|
||||
<ul id="openMenu">
|
||||
<li>
|
||||
<a id="menuOpenFile" title="Open file from disk">Open file</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="menuOpenUrl" title="Open file from url">Open url</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a id="save" title="Save file to disk">Save</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="help" title="Open documentation (opens in a new window)" href="doc/index.html" target="_blank">Help</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- TODO: info, links, faq -->
|
||||
<!--
|
||||
<div class="info" style="display:none;">
|
||||
JSON, or JavaScript Object Notation, is a lightweight text-based open standard
|
||||
designed for human-readable data interchange. It is derived from the JavaScript
|
||||
scripting language for representing simple data structures and associative arrays,
|
||||
called objects. Despite its relationship to JavaScript, it is language-independent,
|
||||
with parsers available for most languages.
|
||||
The JSON format was originally specified by Douglas Crockford, and is described
|
||||
in RFC 4627. The official Internet media type for JSON is application/json.
|
||||
The JSON filename extension is .json.
|
||||
The JSON format is often used for serializing and transmitting structured data
|
||||
over a network connection. It is used primarily to transmit data between a server
|
||||
and web application, serving as an alternative to XML.
|
||||
<br><br>
|
||||
From <a target="_blank" href="http://en.wikipedia.org/wiki/Json">Wikipedia</a>
|
||||
</div>
|
||||
|
||||
<div class="links" style="display:none;">
|
||||
<a target="_blank" href="http://json.org/">http://json.org/</a><br>
|
||||
<a target="_blank" href="http://en.wikipedia.org/wiki/Json">http://en.wikipedia.org/wiki/Json</a><br>
|
||||
</div>
|
||||
|
||||
<div class="faq" style="display:none;"></div>
|
||||
-->
|
||||
</div>
|
||||
|
||||
<div id="auto">
|
||||
<div id="contents">
|
||||
<div id="codeEditor"></div>
|
||||
|
||||
<div id="splitter">
|
||||
<div id="buttons">
|
||||
<div>
|
||||
<button id="toTree" class="convert" title="Copy code to tree editor">
|
||||
<div class="convert-right"></div>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button id="toCode" class="convert" title="Copy tree to code editor">
|
||||
<div class="convert-left"></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="drag">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="treeEditor"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
app.load();
|
||||
app.resize();
|
||||
</script>
|
||||
|
||||
<div id="ad">
|
||||
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
|
||||
<!-- jsoneditoronline_160x600 -->
|
||||
<ins class="adsbygoogle"
|
||||
style="display:inline-block;width:160px;height:600px"
|
||||
data-ad-client="ca-pub-7938810169574141"
|
||||
data-ad-slot="4671869937"></ins>
|
||||
<script>
|
||||
(adsbygoogle = window.adsbygoogle || []).push({});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<div id="footer-inner">
|
||||
<a href="http://jsoneditoronline.org" class="footer">JSON Editor Online @@version</a>
|
||||
•
|
||||
<a href="HISTORY.md" target="_blank" class="footer">History</a>
|
||||
•
|
||||
<a href="https://github.com/josdejong/jsoneditor/" target="_blank" class="footer">Sourcecode</a>
|
||||
•
|
||||
<a href="https://github.com/josdejong/jsoneditor/issues" target="_blank" class="footer">Report a bug</a>
|
||||
•
|
||||
<a href="datapolicy.txt" target="_blank" class="footer">Data policy</a>
|
||||
•
|
||||
<a href="NOTICE" target="_blank" class="footer">Copyright 2011-2013 Jos de Jong</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
app.resize();
|
||||
</script>
|
||||
|
||||
<script type="text/javascript" src="lib/jsonlint/jsonlint.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,149 +0,0 @@
|
|||
/**
|
||||
* Utility to display notifications and error messages.
|
||||
* The messages are displayed on the top center of the web page
|
||||
* @constructor Notify
|
||||
*/
|
||||
function Notify () {
|
||||
this.dom = {};
|
||||
|
||||
// TODO: attach the event as soon as there are one or multiple messages displayed,
|
||||
// remove it as soon as they are all gone
|
||||
var me = this;
|
||||
jsoneditor.util.addEventListener(document, 'keydown', function (event) {
|
||||
me.onKeyDown(event);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Show a notification
|
||||
* @param {String} message
|
||||
* @return {Element} messageObject
|
||||
*/
|
||||
Notify.prototype.showNotification = function (message) {
|
||||
return this.showMessage({
|
||||
type: 'notification',
|
||||
message: message,
|
||||
closeButton: false
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Show an error message
|
||||
* @param {Error} error
|
||||
* @return {Element} messageObject
|
||||
*/
|
||||
Notify.prototype.showError = function (error) {
|
||||
return this.showMessage({
|
||||
type: 'error',
|
||||
message: (error.message ? 'Error: ' + error.message : error.toString()),
|
||||
closeButton: true
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Show a message
|
||||
* @param {Object} params Available parameters:
|
||||
* {String} message
|
||||
* {String} type 'error', 'notification'
|
||||
* {Boolean} closeButton
|
||||
* @return {Element} messageObject
|
||||
*/
|
||||
Notify.prototype.showMessage = function (params) {
|
||||
var frame = this.dom.frame;
|
||||
if (!frame) {
|
||||
var width = 500;
|
||||
var top = 5;
|
||||
var windowWidth = document.body.offsetWidth || window.innerWidth;
|
||||
frame = document.createElement('div');
|
||||
frame.style.position = 'absolute';
|
||||
frame.style.left = (windowWidth - width) / 2 + 'px';
|
||||
frame.style.width = width + 'px';
|
||||
frame.style.top = top + 'px';
|
||||
frame.style.zIndex = '999';
|
||||
document.body.appendChild(frame);
|
||||
this.dom.frame = frame;
|
||||
}
|
||||
|
||||
var type = params.type || 'notification';
|
||||
var closeable = (params.closeButton !== false);
|
||||
var divMessage = document.createElement('div');
|
||||
divMessage.className = type;
|
||||
divMessage.type = type;
|
||||
divMessage.closeable = closeable;
|
||||
divMessage.style.position = 'relative';
|
||||
frame.appendChild(divMessage);
|
||||
|
||||
var table = document.createElement('table');
|
||||
table.style.width = '100%';
|
||||
divMessage.appendChild(table);
|
||||
var tbody = document.createElement('tbody');
|
||||
table.appendChild(tbody);
|
||||
var tr = document.createElement('tr');
|
||||
tbody.appendChild(tr);
|
||||
|
||||
var tdMessage = document.createElement('td');
|
||||
tdMessage.innerHTML = params.message || '';
|
||||
tr.appendChild(tdMessage);
|
||||
|
||||
if (closeable) {
|
||||
var tdClose = document.createElement('td');
|
||||
tdClose.style.textAlign = 'right';
|
||||
tdClose.style.verticalAlign = 'top';
|
||||
tr.appendChild(tdClose);
|
||||
|
||||
var closeDiv = document.createElement('button');
|
||||
closeDiv.innerHTML = '×';
|
||||
closeDiv.title = 'Close message (ESC)';
|
||||
tdClose.appendChild(closeDiv);
|
||||
var me = this;
|
||||
closeDiv.onclick = function () {
|
||||
me.removeMessage(divMessage);
|
||||
}
|
||||
}
|
||||
|
||||
return divMessage;
|
||||
};
|
||||
|
||||
/**
|
||||
* Remove a message from the list with messages
|
||||
* @param {Element} [message] The HTML DOM of a message
|
||||
* If undefined, the first closeable message will
|
||||
* closed.
|
||||
*/
|
||||
Notify.prototype.removeMessage = function (message) {
|
||||
var frame = this.dom.frame;
|
||||
if (!message && frame) {
|
||||
// find the first closable message in the list with displayed messages
|
||||
var child = frame.firstChild;
|
||||
while (child && !child.closeable) {
|
||||
child = child.nextSibling;
|
||||
}
|
||||
if (child && child.closeable) {
|
||||
message = child;
|
||||
}
|
||||
}
|
||||
|
||||
if (message && message.parentNode == frame) {
|
||||
message.parentNode.removeChild(message);
|
||||
}
|
||||
|
||||
if (frame && frame.childNodes.length == 0) {
|
||||
frame.parentNode.removeChild(frame);
|
||||
delete this.dom.frame;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle key down event.
|
||||
* @param {Event} event
|
||||
* @private
|
||||
*/
|
||||
Notify.prototype.onKeyDown = function (event) {
|
||||
var keynum = event.which;
|
||||
if (keynum == 27) { // ESC
|
||||
// remove the oldest open and closeable message
|
||||
this.removeMessage();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
};
|
||||
|
|
@ -1,71 +0,0 @@
|
|||
/**
|
||||
* @prototype QueryParams
|
||||
* This prototype contains methods to manipulate the query parameters of the
|
||||
* web pages url
|
||||
*/
|
||||
function QueryParams () {}
|
||||
|
||||
/**
|
||||
* get an object value with all parameters in the query params
|
||||
* @return {Object} query object containing key/values
|
||||
*/
|
||||
QueryParams.prototype.getQuery = function () {
|
||||
var search = window.location.search.substring(1); // skip the ? character
|
||||
var params = search.split('&');
|
||||
var query = {};
|
||||
for (var i = 0, iMax = params.length; i < iMax; i++) {
|
||||
var keyvalue = params[i].split('=');
|
||||
if (keyvalue.length == 2) {
|
||||
var key = decodeURIComponent(keyvalue[0]);
|
||||
var value = decodeURIComponent(keyvalue[1]);
|
||||
query[key] = value;
|
||||
}
|
||||
}
|
||||
return query;
|
||||
};
|
||||
|
||||
/**
|
||||
* Set query parameters parameters
|
||||
* @param {Object} query object with strings
|
||||
*/
|
||||
QueryParams.prototype.setQuery = function (query) {
|
||||
var search = '';
|
||||
|
||||
for (var key in query) {
|
||||
if (query.hasOwnProperty(key)) {
|
||||
var value = query[key];
|
||||
if (value != undefined) {
|
||||
if (search.length) {
|
||||
search += '&';
|
||||
}
|
||||
search += encodeURIComponent(key);
|
||||
search += '=';
|
||||
search += encodeURIComponent(query[key]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.location.search = (search.length ? ('#' + search) : '');
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Retrieve a parameter value from the query params
|
||||
* @param {String} key
|
||||
* @return {String} value undefined when the value is not found
|
||||
*/
|
||||
QueryParams.prototype.getValue = function (key) {
|
||||
var query = this.getQuery();
|
||||
return query[key];
|
||||
};
|
||||
|
||||
/**
|
||||
* Set an query parameter
|
||||
* @param {String} key
|
||||
* @param {String} value
|
||||
*/
|
||||
QueryParams.prototype.setValue = function (key, value) {
|
||||
var query = this.getQuery();
|
||||
query[key] = value;
|
||||
this.setQuery(query);
|
||||
};
|
||||
|
|
@ -1,181 +0,0 @@
|
|||
/**
|
||||
* A splitter control.
|
||||
* Turns an existing HTML element into an horizontal splitter control.
|
||||
* @constructor Splitter
|
||||
* @param {Object} params Available parameters:
|
||||
* {Element} container HTML container representing
|
||||
* the splitter
|
||||
* {Number} [snap] Number of pixels to snap to
|
||||
* the edges (0 or 1)
|
||||
* {function} [change] Callback method called when
|
||||
* the splitter value has changed.
|
||||
* The callback is called with
|
||||
* the new value as parameter
|
||||
*/
|
||||
function Splitter (params) {
|
||||
if (!params || !params.container) {
|
||||
throw new Error('params.container undefined in Splitter constructor');
|
||||
}
|
||||
|
||||
var me = this;
|
||||
jsoneditor.util.addEventListener(params.container, "mousedown", function (event) {
|
||||
me.onMouseDown(event);
|
||||
});
|
||||
|
||||
this.container = params.container;
|
||||
this.snap = Number(params.snap) || 200; // px
|
||||
this.width = undefined;
|
||||
this.value = undefined;
|
||||
this.onChange = (params.change) ? params.change : function () {};
|
||||
this.params = {};
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle mouse down event. Start dragging the splitter.
|
||||
* @param {Event} event
|
||||
* @private
|
||||
*/
|
||||
Splitter.prototype.onMouseDown = function (event) {
|
||||
var me = this;
|
||||
var leftButtonDown = event.which ? (event.which == 1) : (event.button == 1);
|
||||
if (!leftButtonDown) {
|
||||
return;
|
||||
}
|
||||
jsoneditor.util.addClassName(this.container, 'active');
|
||||
|
||||
if (!this.params.mousedown) {
|
||||
this.params.mousedown = true;
|
||||
this.params.mousemove =
|
||||
jsoneditor.util.addEventListener(document, 'mousemove', function (event) {
|
||||
me.onMouseMove(event);
|
||||
});
|
||||
this.params.mouseup =
|
||||
jsoneditor.util.addEventListener(document, 'mouseup', function (event) {
|
||||
me.onMouseUp(event);
|
||||
});
|
||||
this.params.screenX = event.screenX;
|
||||
this.params.changed = false;
|
||||
this.params.value = this.getValue();
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle on mouse move event. Used to drag the splitter
|
||||
* @param {Event} event
|
||||
* @private
|
||||
*/
|
||||
Splitter.prototype.onMouseMove = function (event) {
|
||||
if (this.width != undefined) {
|
||||
var diff = event.screenX - this.params.screenX;
|
||||
|
||||
var value = this.params.value + diff / this.width;
|
||||
value = this.setValue(value);
|
||||
|
||||
if (value != this.params.value) {
|
||||
// value has been changed
|
||||
this.params.changed = true;
|
||||
}
|
||||
|
||||
this.onChange(value);
|
||||
}
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle on mouse up event
|
||||
* @param {Event} event
|
||||
* @private
|
||||
*/
|
||||
Splitter.prototype.onMouseUp = function (event) {
|
||||
jsoneditor.util.removeClassName(this.container, 'active');
|
||||
|
||||
if (this.params.mousedown) {
|
||||
jsoneditor.util.removeEventListener(document, 'mousemove', this.params.mousemove);
|
||||
jsoneditor.util.removeEventListener(document, 'mouseup', this.params.mouseup);
|
||||
this.params.mousemove = undefined;
|
||||
this.params.mouseup = undefined;
|
||||
this.params.mousedown = false;
|
||||
|
||||
var value = this.getValue();
|
||||
if (!this.params.changed) {
|
||||
// value is unchanged -> unsnap when currently snapped
|
||||
if (value == 0) {
|
||||
value = this.setValue(0.2);
|
||||
this.onChange(value);
|
||||
}
|
||||
if (value == 1) {
|
||||
value = this.setValue(0.8);
|
||||
this.onChange(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the window width for the splitter
|
||||
* @param {Number} width
|
||||
*/
|
||||
Splitter.prototype.setWidth = function (width) {
|
||||
this.width = width;
|
||||
};
|
||||
|
||||
/**
|
||||
* Set a value for the splitter (UI is not adjusted)
|
||||
* @param {Number} value A number between 0 and 1
|
||||
* @return {Number} value The stored value
|
||||
*/
|
||||
Splitter.prototype.setValue = function (value) {
|
||||
value = Number(value);
|
||||
|
||||
// snap to 0 or 1 when close
|
||||
if (this.width != undefined && this.width > this.snap) {
|
||||
if (value < this.snap / this.width) {
|
||||
value = 0;
|
||||
}
|
||||
if (value > (this.width - this.snap) / this.width) {
|
||||
value = 1;
|
||||
}
|
||||
}
|
||||
|
||||
this.value = value;
|
||||
|
||||
try {
|
||||
localStorage['splitterValue'] = value;
|
||||
}
|
||||
catch (e) {
|
||||
if (console && console.log) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the splitter value from local storage
|
||||
* @return {Number} value A value between 0.1 and 0.9
|
||||
*/
|
||||
Splitter.prototype.getValue = function () {
|
||||
var value = this.value;
|
||||
if (value == undefined) {
|
||||
// read from localStorage once
|
||||
try {
|
||||
if (localStorage['splitterValue'] != undefined) {
|
||||
value = Number(localStorage['splitterValue']); // read
|
||||
value = this.setValue(value); // verify and store
|
||||
}
|
||||
}
|
||||
catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
if (value == undefined) {
|
||||
value = this.setValue(0.5);
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
|
@ -1,227 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||
|
||||
<title>JSON Editor Online - view, edit and format JSON online</title>
|
||||
|
||||
<!--
|
||||
|
||||
@file index_no_ads.html
|
||||
|
||||
@brief
|
||||
JSON Editor Online is a web-based tool to view, edit, and format JSON.
|
||||
It shows your data side by side in a clear, editable treeview and in
|
||||
a code editor.
|
||||
|
||||
Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+
|
||||
|
||||
@license
|
||||
This json editor is open sourced with the intention to use the editor as
|
||||
a component in your own application. Not to just copy and monetize the editor
|
||||
as it is.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
use this file except in compliance with the License. You may obtain a copy
|
||||
of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
License for the specific language governing permissions and limitations under
|
||||
the License.
|
||||
|
||||
Copyright (C) 2011-2013 Jos de Jong, http://jsoneditoronline.org
|
||||
|
||||
@author Jos de Jong, <wjosdejong@gmail.com>
|
||||
@version @@version
|
||||
@date @@date
|
||||
-->
|
||||
|
||||
<meta name="description" content="JSON Editor Online is a web-based tool to view, edit, and format JSON. It shows your data side by side in a clear, editable treeview and in a code editor.">
|
||||
<meta name="keywords" content="json, editor, formatter, online, format, parser, json editor, json editor online, online json editor, javascript, javascript object notation, tools, tool, json tools, treeview, open source, free, json parser, json parser online, json formatter, json formatter online, online json formatter, online json parser, format json online">
|
||||
<meta name="author" content="Jos de Jong">
|
||||
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
|
||||
<link href="app.css" rel="stylesheet" type="text/css">
|
||||
<link href="fileretriever.css" rel="stylesheet" type="text/css">
|
||||
<link href="../../jsoneditor/css/jsoneditor.css" rel="stylesheet" type="text/css">
|
||||
<link href="../../jsoneditor/css/menu.css" rel="stylesheet" type="text/css">
|
||||
<link href="../../jsoneditor/css/searchbox.css" rel="stylesheet" type="text/css">
|
||||
<link href="../../jsoneditor/css/contextmenu.css" rel="stylesheet" type="text/css">
|
||||
<!-- TODO: droid font
|
||||
<link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono' rel='stylesheet' type='text/css'>
|
||||
-->
|
||||
|
||||
<script type="text/javascript" src="../../jsoneditor/js/jsoneditor.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/treeeditor.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/texteditor.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/node.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/appendnode.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/contextmenu.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/history.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/searchbox.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/modebox.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/highlighter.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/util.js"></script>
|
||||
<script type="text/javascript" src="../../jsoneditor/js/module.js"></script>
|
||||
<script type="text/javascript" src="queryparams.js"></script>
|
||||
<script type="text/javascript" src="ajax.js"></script>
|
||||
<script type="text/javascript" src="fileretriever.js"></script>
|
||||
<script type="text/javascript" src="notify.js"></script>
|
||||
<script type="text/javascript" src="splitter.js"></script>
|
||||
<script type="text/javascript" src="app.js"></script>
|
||||
<script type="text/javascript" src="../../lib/jsonlint/jsonlint.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../lib/ace/ace.js"></script>
|
||||
<script type="text/javascript" src="../../lib/ace/mode-json.js"></script>
|
||||
<script type="text/javascript" src="../../lib/ace/theme-textmate.js"></script>
|
||||
<script type="text/javascript" src="../../lib/ace/theme-jsoneditor.js"></script>
|
||||
|
||||
<style type="text/css">
|
||||
div.convert-right {
|
||||
background: url('../../jsoneditor/css/img/jsoneditor-icons.png') -0 -48px;
|
||||
}
|
||||
div.convert-left {
|
||||
background: url('../../jsoneditor/css/img/jsoneditor-icons.png') -24px -48px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="header" >
|
||||
<a href="http://jsoneditoronline.org" class="header">
|
||||
<img alt="JSON Editor Online" title="JSON Editor Online" src="img/logo.png" id="logo">
|
||||
</a>
|
||||
|
||||
<div id="menu">
|
||||
<ul>
|
||||
<li>
|
||||
<a id="clear" title="Clear contents">Clear</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="open" title="Open file from disk">
|
||||
Open
|
||||
<span id="openMenuButton" title="Open file from disk or url">
|
||||
▼
|
||||
</span>
|
||||
</a>
|
||||
<ul id="openMenu">
|
||||
<li>
|
||||
<a id="menuOpenFile" title="Open file from disk">Open file</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="menuOpenUrl" title="Open file from url">Open url</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a id="save" title="Save file to disk">Save</a>
|
||||
</li>
|
||||
<li>
|
||||
<a id="help" title="Open documentation (opens in a new window)" href="doc/index.html" target="_blank">Help</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- TODO: info, links, faq -->
|
||||
<!--
|
||||
<div class="info" style="display:none;">
|
||||
JSON, or JavaScript Object Notation, is a lightweight text-based open standard
|
||||
designed for human-readable data interchange. It is derived from the JavaScript
|
||||
scripting language for representing simple data structures and associative arrays,
|
||||
called objects. Despite its relationship to JavaScript, it is language-independent,
|
||||
with parsers available for most languages.
|
||||
The JSON format was originally specified by Douglas Crockford, and is described
|
||||
in RFC 4627. The official Internet media type for JSON is application/json.
|
||||
The JSON filename extension is .json.
|
||||
The JSON format is often used for serializing and transmitting structured data
|
||||
over a network connection. It is used primarily to transmit data between a server
|
||||
and web application, serving as an alternative to XML.
|
||||
<br><br>
|
||||
From <a target="_blank" href="http://en.wikipedia.org/wiki/Json">Wikipedia</a>
|
||||
</div>
|
||||
|
||||
<div class="links" style="display:none;">
|
||||
<a target="_blank" href="http://json.org/">http://json.org/</a><br>
|
||||
<a target="_blank" href="http://en.wikipedia.org/wiki/Json">http://en.wikipedia.org/wiki/Json</a><br>
|
||||
</div>
|
||||
|
||||
<div class="faq" style="display:none;"></div>
|
||||
-->
|
||||
</div>
|
||||
|
||||
<div id="auto">
|
||||
<div id="contents">
|
||||
<div id="codeEditor"></div>
|
||||
|
||||
<div id="splitter">
|
||||
<div id="buttons">
|
||||
<div>
|
||||
<button id="toTree" class="convert" title="Copy code to tree editor">
|
||||
<div class="convert-right"></div>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button id="toCode" class="convert" title="Copy tree to code editor">
|
||||
<div class="convert-left"></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="drag">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="treeEditor"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
app.load();
|
||||
app.resize();
|
||||
</script>
|
||||
|
||||
<div id="ad" title="advertisement" >
|
||||
<script type="text/javascript"><!--
|
||||
google_ad_client = "ca-pub-7938810169574141";
|
||||
/* jsoneditoronline_160x600 */
|
||||
google_ad_slot = "4671869937";
|
||||
google_ad_width = 160;
|
||||
google_ad_height = 600;
|
||||
//-->
|
||||
</script>
|
||||
|
||||
<!--
|
||||
<script type="text/javascript"
|
||||
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
|
||||
</script>
|
||||
-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<div id="footer-inner">
|
||||
<a href="http://jsoneditoronline.org" class="footer">JSON Editor Online @@version</a>
|
||||
•
|
||||
<a href="../../HISTORY.md" target="_blank" class="footer">History</a>
|
||||
•
|
||||
<a href="https://github.com/josdejong/jsoneditor/" target="_blank" class="footer">Sourcecode</a>
|
||||
•
|
||||
<a href="https://github.com/josdejong/jsoneditor/issues" target="_blank" class="footer">Report a bug</a>
|
||||
•
|
||||
<a href="datapolicy.txt" target="_blank" class="footer">Data policy</a>
|
||||
•
|
||||
<a href="../../NOTICE" target="_blank" class="footer">Copyright 2011-2013 Jos de Jong</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
app.resize();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -8,10 +8,6 @@
|
|||
* Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+
|
||||
*
|
||||
* @license
|
||||
* This json editor is open sourced with the intention to use the editor as
|
||||
* a component in your own application. Not to just copy and monetize the editor
|
||||
* as it is.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
* use this file except in compliance with the License. You may obtain a copy
|
||||
* of the License at
|
||||
|
|
@ -27,8 +23,8 @@
|
|||
* Copyright (c) 2011-2013 Jos de Jong, http://jsoneditoronline.org
|
||||
*
|
||||
* @author Jos de Jong, <wjosdejong@gmail.com>
|
||||
* @version 2.3.6
|
||||
* @date 2014-01-03
|
||||
* @version 2.3.7-SNAPSHOT
|
||||
* @date 2014-05-29
|
||||
*/
|
||||
(function () {
|
||||
|
||||
|
|
@ -1010,7 +1006,7 @@ JSONEditor.modes.viewer = {
|
|||
* "text" (default)
|
||||
* or "code".
|
||||
* {Number} indentation Number of indentation
|
||||
* spaces. 4 by default.
|
||||
* spaces. 2 by default.
|
||||
* {function} change Callback method
|
||||
* triggered on change
|
||||
* @param {JSON | String} [json] initial contents of the formatter
|
||||
|
|
@ -1124,6 +1120,7 @@ TextEditor.prototype._create = function (container, options, json) {
|
|||
editor.setShowPrintMargin(false);
|
||||
editor.setFontSize(13);
|
||||
editor.getSession().setMode('ace/mode/json');
|
||||
editor.getSession().setTabSize(2);
|
||||
editor.getSession().setUseSoftTabs(true);
|
||||
editor.getSession().setUseWrapMode(true);
|
||||
this.editor = editor;
|
||||
|
|
|
|||
|
|
@ -8,10 +8,6 @@
|
|||
* Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 8+
|
||||
*
|
||||
* @license
|
||||
* This json editor is open sourced with the intention to use the editor as
|
||||
* a component in your own application. Not to just copy and monetize the editor
|
||||
* as it is.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
* use this file except in compliance with the License. You may obtain a copy
|
||||
* of the License at
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,163 +1 @@
|
|||
/* ***** BEGIN LICENSE BLOCK *****
|
||||
* Distributed under the BSD license:
|
||||
*
|
||||
* Copyright (c) 2010, Ajax.org B.V.
|
||||
* All rights reserved.
|
||||
*
|
||||
* Redistribution and use in source and binary forms, with or without
|
||||
* modification, are permitted provided that the following conditions are met:
|
||||
* * Redistributions of source code must retain the above copyright
|
||||
* notice, this list of conditions and the following disclaimer.
|
||||
* * Redistributions in binary form must reproduce the above copyright
|
||||
* notice, this list of conditions and the following disclaimer in the
|
||||
* documentation and/or other materials provided with the distribution.
|
||||
* * Neither the name of Ajax.org B.V. nor the
|
||||
* names of its contributors may be used to endorse or promote products
|
||||
* derived from this software without specific prior written permission.
|
||||
*
|
||||
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
|
||||
* ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
|
||||
* WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
||||
* DISCLAIMED. IN NO EVENT SHALL AJAX.ORG B.V. BE LIABLE FOR ANY
|
||||
* DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
|
||||
* (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
|
||||
* LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
|
||||
* ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
|
||||
* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||
*
|
||||
* ***** END LICENSE BLOCK ***** */
|
||||
|
||||
define('ace/theme/textmate', ['require', 'exports', 'module' , 'ace/lib/dom'], function(require, exports, module) {
|
||||
|
||||
|
||||
exports.isDark = false;
|
||||
exports.cssClass = "ace-tm";
|
||||
exports.cssText = ".ace-tm .ace_gutter {\
|
||||
background: #f0f0f0;\
|
||||
color: #333;\
|
||||
}\
|
||||
.ace-tm .ace_print-margin {\
|
||||
width: 1px;\
|
||||
background: #e8e8e8;\
|
||||
}\
|
||||
.ace-tm .ace_fold {\
|
||||
background-color: #6B72E6;\
|
||||
}\
|
||||
.ace-tm .ace_scroller {\
|
||||
background-color: #FFFFFF;\
|
||||
}\
|
||||
.ace-tm .ace_cursor {\
|
||||
border-left: 2px solid black;\
|
||||
}\
|
||||
.ace-tm .ace_overwrite-cursors .ace_cursor {\
|
||||
border-left: 0px;\
|
||||
border-bottom: 1px solid black;\
|
||||
}\
|
||||
.ace-tm .ace_invisible {\
|
||||
color: rgb(191, 191, 191);\
|
||||
}\
|
||||
.ace-tm .ace_storage,\
|
||||
.ace-tm .ace_keyword {\
|
||||
color: blue;\
|
||||
}\
|
||||
.ace-tm .ace_constant {\
|
||||
color: rgb(197, 6, 11);\
|
||||
}\
|
||||
.ace-tm .ace_constant.ace_buildin {\
|
||||
color: rgb(88, 72, 246);\
|
||||
}\
|
||||
.ace-tm .ace_constant.ace_language {\
|
||||
color: rgb(88, 92, 246);\
|
||||
}\
|
||||
.ace-tm .ace_constant.ace_library {\
|
||||
color: rgb(6, 150, 14);\
|
||||
}\
|
||||
.ace-tm .ace_invalid {\
|
||||
background-color: rgba(255, 0, 0, 0.1);\
|
||||
color: red;\
|
||||
}\
|
||||
.ace-tm .ace_support.ace_function {\
|
||||
color: rgb(60, 76, 114);\
|
||||
}\
|
||||
.ace-tm .ace_support.ace_constant {\
|
||||
color: rgb(6, 150, 14);\
|
||||
}\
|
||||
.ace-tm .ace_support.ace_type,\
|
||||
.ace-tm .ace_support.ace_class {\
|
||||
color: rgb(109, 121, 222);\
|
||||
}\
|
||||
.ace-tm .ace_keyword.ace_operator {\
|
||||
color: rgb(104, 118, 135);\
|
||||
}\
|
||||
.ace-tm .ace_string {\
|
||||
color: rgb(3, 106, 7);\
|
||||
}\
|
||||
.ace-tm .ace_comment {\
|
||||
color: rgb(76, 136, 107);\
|
||||
}\
|
||||
.ace-tm .ace_comment.ace_doc {\
|
||||
color: rgb(0, 102, 255);\
|
||||
}\
|
||||
.ace-tm .ace_comment.ace_doc.ace_tag {\
|
||||
color: rgb(128, 159, 191);\
|
||||
}\
|
||||
.ace-tm .ace_constant.ace_numeric {\
|
||||
color: rgb(0, 0, 205);\
|
||||
}\
|
||||
.ace-tm .ace_variable {\
|
||||
color: rgb(49, 132, 149);\
|
||||
}\
|
||||
.ace-tm .ace_xml-pe {\
|
||||
color: rgb(104, 104, 91);\
|
||||
}\
|
||||
.ace-tm .ace_entity.ace_name.ace_function {\
|
||||
color: #0000A2;\
|
||||
}\
|
||||
.ace-tm .ace_markup.ace_heading {\
|
||||
color: rgb(12, 7, 255);\
|
||||
}\
|
||||
.ace-tm .ace_markup.ace_list {\
|
||||
color:rgb(185, 6, 144);\
|
||||
}\
|
||||
.ace-tm .ace_meta.ace_tag {\
|
||||
color:rgb(0, 22, 142);\
|
||||
}\
|
||||
.ace-tm .ace_string.ace_regex {\
|
||||
color: rgb(255, 0, 0)\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_selection {\
|
||||
background: rgb(181, 213, 255);\
|
||||
}\
|
||||
.ace-tm.ace_multiselect .ace_selection.ace_start {\
|
||||
box-shadow: 0 0 3px 0px white;\
|
||||
border-radius: 2px;\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_step {\
|
||||
background: rgb(252, 255, 0);\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_stack {\
|
||||
background: rgb(164, 229, 101);\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_bracket {\
|
||||
margin: -1px 0 0 -1px;\
|
||||
border: 1px solid rgb(192, 192, 192);\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_active-line {\
|
||||
background: rgba(0, 0, 0, 0.07);\
|
||||
}\
|
||||
.ace-tm .ace_gutter-active-line {\
|
||||
background-color : #dcdcdc;\
|
||||
}\
|
||||
.ace-tm .ace_marker-layer .ace_selected-word {\
|
||||
background: rgb(250, 250, 255);\
|
||||
border: 1px solid rgb(200, 200, 250);\
|
||||
}\
|
||||
.ace-tm .ace_indent-guide {\
|
||||
background: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAE0lEQVQImWP4////f4bLly//BwAmVgd1/w11/gAAAABJRU5ErkJggg==\") right repeat-y;\
|
||||
}\
|
||||
";
|
||||
|
||||
var dom = require("../lib/dom");
|
||||
dom.importCssString(exports.cssText, exports.cssClass);
|
||||
});
|
||||
define("ace/theme/textmate",["require","exports","module","ace/lib/dom"],function(e,t,n){t.isDark=!1,t.cssClass="ace-tm",t.cssText='.ace-tm .ace_gutter {background: #f0f0f0;color: #333;}.ace-tm .ace_print-margin {width: 1px;background: #e8e8e8;}.ace-tm .ace_fold {background-color: #6B72E6;}.ace-tm {background-color: #FFFFFF;color: black;}.ace-tm .ace_cursor {color: black;}.ace-tm .ace_invisible {color: rgb(191, 191, 191);}.ace-tm .ace_storage,.ace-tm .ace_keyword {color: blue;}.ace-tm .ace_constant {color: rgb(197, 6, 11);}.ace-tm .ace_constant.ace_buildin {color: rgb(88, 72, 246);}.ace-tm .ace_constant.ace_language {color: rgb(88, 92, 246);}.ace-tm .ace_constant.ace_library {color: rgb(6, 150, 14);}.ace-tm .ace_invalid {background-color: rgba(255, 0, 0, 0.1);color: red;}.ace-tm .ace_support.ace_function {color: rgb(60, 76, 114);}.ace-tm .ace_support.ace_constant {color: rgb(6, 150, 14);}.ace-tm .ace_support.ace_type,.ace-tm .ace_support.ace_class {color: rgb(109, 121, 222);}.ace-tm .ace_keyword.ace_operator {color: rgb(104, 118, 135);}.ace-tm .ace_string {color: rgb(3, 106, 7);}.ace-tm .ace_comment {color: rgb(76, 136, 107);}.ace-tm .ace_comment.ace_doc {color: rgb(0, 102, 255);}.ace-tm .ace_comment.ace_doc.ace_tag {color: rgb(128, 159, 191);}.ace-tm .ace_constant.ace_numeric {color: rgb(0, 0, 205);}.ace-tm .ace_variable {color: rgb(49, 132, 149);}.ace-tm .ace_xml-pe {color: rgb(104, 104, 91);}.ace-tm .ace_entity.ace_name.ace_function {color: #0000A2;}.ace-tm .ace_heading {color: rgb(12, 7, 255);}.ace-tm .ace_list {color:rgb(185, 6, 144);}.ace-tm .ace_meta.ace_tag {color:rgb(0, 22, 142);}.ace-tm .ace_string.ace_regex {color: rgb(255, 0, 0)}.ace-tm .ace_marker-layer .ace_selection {background: rgb(181, 213, 255);}.ace-tm.ace_multiselect .ace_selection.ace_start {box-shadow: 0 0 3px 0px white;border-radius: 2px;}.ace-tm .ace_marker-layer .ace_step {background: rgb(252, 255, 0);}.ace-tm .ace_marker-layer .ace_stack {background: rgb(164, 229, 101);}.ace-tm .ace_marker-layer .ace_bracket {margin: -1px 0 0 -1px;border: 1px solid rgb(192, 192, 192);}.ace-tm .ace_marker-layer .ace_active-line {background: rgba(0, 0, 0, 0.07);}.ace-tm .ace_gutter-active-line {background-color : #dcdcdc;}.ace-tm .ace_marker-layer .ace_selected-word {background: rgb(250, 250, 255);border: 1px solid rgb(200, 200, 250);}.ace-tm .ace_indent-guide {background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAE0lEQVQImWP4////f4bLly//BwAmVgd1/w11/gAAAABJRU5ErkJggg==") right repeat-y;}';var r=e("../lib/dom");r.importCssString(t.cssText,t.cssClass)})
|
||||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 41 KiB |
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"Name": "JSON Editor Online",
|
||||
"Website": "http://jsoneditoronline.org",
|
||||
"Version": 2.0,
|
||||
"Free": true,
|
||||
"Description": "JSON Editor Online is a web-based tool to view, edit, and format JSON. It shows your data side by side in a clear, editable treeview and in a code editor.",
|
||||
"Features": [
|
||||
"View and edit JSON side by side in treeview and a code editor.",
|
||||
"Edit, add, move, remove, and duplicate fields and values.",
|
||||
"Change type of values.",
|
||||
"Colorized values, color depends of the value type.",
|
||||
"Search & highlight text in the treeview.",
|
||||
"Undo and redo all actions.",
|
||||
"Load and save file and urls.",
|
||||
"Format, compact, and inspect JSON in the code editor."
|
||||
]
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 123 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 42 KiB |
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB |
|
|
@ -1,5 +1,4 @@
|
|||
JSON EDITOR ONLINE TODO
|
||||
http://jsoneditoronline.org
|
||||
JSON EDITOR TODO
|
||||
|
||||
________________________________________________________________________
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
|
|
@ -1,113 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Test Bootstrap modal</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||
<link rel="stylesheet" type="text/css" href="../../jsoneditor-min.css">
|
||||
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
<script src="../../jsoneditor-min.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
width: 500px;
|
||||
margin: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="height: 100px;"></div>
|
||||
|
||||
<h1>Test Bootstrap Modal</h1>
|
||||
|
||||
<a class="btn" data-toggle="modal" href="#myModal1">Launch Modal 1</a>
|
||||
|
||||
|
||||
<div class="modal hide" id="myModal1"><!-- note the use of "hide" class -->
|
||||
<div class="modal-header">
|
||||
<button class="close" data-dismiss="modal">×</button>
|
||||
<h3>Modal header</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body...</p>
|
||||
<div id="jsoneditor1"></div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn" data-dismiss="modal">Close</a><!-- note the use of "data-dismiss" -->
|
||||
<a href="#" class="btn btn-primary">Save changes</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="btn" data-toggle="modal" href="#myModal2">Launch Modal 2</a>
|
||||
|
||||
<div class="modal hide" id="myModal2"><!-- note the use of "hide" class -->
|
||||
<div class="modal-header">
|
||||
<button class="close" data-dismiss="modal">×</button>
|
||||
<h3>Modal header</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body...</p>
|
||||
<div id="jsoneditor2" style="height: 300px;"></div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn" data-dismiss="modal">Close</a><!-- note the use of "data-dismiss" -->
|
||||
<a href="#" class="btn btn-primary">Save changes</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p></p>
|
||||
|
||||
<div id="jsoneditor3"></div>
|
||||
|
||||
<p></p>
|
||||
|
||||
<div id="jsoneditor4" style="height: 300px;"></div>
|
||||
|
||||
<p></p>
|
||||
|
||||
<div style="width:500px; height:300px; overflow: auto; background: lightgray;">
|
||||
<div style="width: 700px; height:200px;"></div>
|
||||
<div id="jsoneditor5" style="width: 300px; height: 300px; background: white; margin: 0 200px;"></div>
|
||||
<div style="height:200px;"></div>
|
||||
</div>
|
||||
|
||||
<div style="height: 400px;"></div>
|
||||
|
||||
<script>
|
||||
function createEditor (container) {
|
||||
|
||||
var options = {};
|
||||
|
||||
var json = {
|
||||
'array': [1, 2, 3],
|
||||
'boolean': true,
|
||||
'null': null,
|
||||
'number': 123,
|
||||
'object': {'a': 'b', 'c': 'd'},
|
||||
'string': 'Hello World'
|
||||
};
|
||||
|
||||
var editor = new jsoneditor.JSONEditor(container, options, json);
|
||||
}
|
||||
|
||||
setTimeout(function () {
|
||||
createEditor(document.getElementById('jsoneditor1'));
|
||||
createEditor(document.getElementById('jsoneditor2'));
|
||||
createEditor(document.getElementById('jsoneditor3'));
|
||||
createEditor(document.getElementById('jsoneditor4'));
|
||||
createEditor(document.getElementById('jsoneditor5'));
|
||||
document.getElementById('jsoneditor5').parentNode.scrollLeft = 100;
|
||||
document.getElementById('jsoneditor5').parentNode.scrollTop = 100;
|
||||
document.scrollTop = 100;
|
||||
}, 0);
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue