Dropped support for bower (don't commit bundles anymore)
This commit is contained in:
parent
3b1a5c2d24
commit
30aa73d3a3
31
README.md
31
README.md
|
@ -47,16 +47,37 @@ Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 9+.
|
||||||
|
|
||||||
## Install
|
## Install
|
||||||
|
|
||||||
with npm (recommended):
|
Install via npm:
|
||||||
|
|
||||||
npm install jsoneditor
|
npm install jsoneditor
|
||||||
|
|
||||||
with bower:
|
### Versions
|
||||||
|
|
||||||
bower install jsoneditor
|
There are two versions of jsoneditor available: a full version and
|
||||||
|
a minimalist version.
|
||||||
|
|
||||||
|
#### Full version
|
||||||
|
|
||||||
|
If you're not sure which version to use, use the full version: jsoneditor.js.
|
||||||
|
|
||||||
|
#### Minimalist version
|
||||||
|
|
||||||
|
The minimalist version, jsoneditor-minimalist.js, has excluded the following libraries:
|
||||||
|
|
||||||
|
- `ace` (via `brace`), used for the code editor.
|
||||||
|
- `ajv`, used for JSON schema validation.
|
||||||
|
|
||||||
|
This reduces the the size of the minified and gzipped JavaScript considerably.
|
||||||
|
|
||||||
|
When to use the minimalist version?
|
||||||
|
|
||||||
|
- If you don't need the mode "code" and don't need JSON schema validation.
|
||||||
|
- Or if you want to provide `ace` and/or `ajv` yourself via the configuration
|
||||||
|
options, for example when you already use Ace in other parts of your
|
||||||
|
web application too and don't want to bundle the library twice.
|
||||||
|
|
||||||
|
|
||||||
#### More
|
### More
|
||||||
|
|
||||||
There is a directive available for using `jsoneditor` in Angular.js:
|
There is a directive available for using `jsoneditor` in Angular.js:
|
||||||
|
|
||||||
|
@ -79,7 +100,7 @@ There is a directive available for using `jsoneditor` in Angular.js:
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// create the editor
|
// create the editor
|
||||||
var container = document.getElementById("jsoneditor");
|
var container = document.getElementById('jsoneditor');
|
||||||
var options = {};
|
var options = {};
|
||||||
var editor = jsoneditor(container, options);
|
var editor = jsoneditor(container, options);
|
||||||
|
|
||||||
|
|
32
bower.json
32
bower.json
|
@ -1,32 +0,0 @@
|
||||||
{
|
|
||||||
"name": "jsoneditor",
|
|
||||||
"description": "A web-based tool to view, edit and format JSON",
|
|
||||||
"tags": [
|
|
||||||
"json",
|
|
||||||
"editor",
|
|
||||||
"viewer",
|
|
||||||
"formatter"
|
|
||||||
],
|
|
||||||
"homepage": "http://jsoneditoronline.org/",
|
|
||||||
"repository": {
|
|
||||||
"type": "git",
|
|
||||||
"url": "https://github.com/josdejong/jsoneditor.git"
|
|
||||||
},
|
|
||||||
"main": [
|
|
||||||
"./dist/jsoneditor.min.js",
|
|
||||||
"./dist/jsoneditor.min.css"
|
|
||||||
],
|
|
||||||
"bugs": "https://github.com/josdejong/jsoneditor/issues",
|
|
||||||
"ignore": [
|
|
||||||
"misc",
|
|
||||||
"node_modules",
|
|
||||||
"test",
|
|
||||||
"tools",
|
|
||||||
"gulpfile.js",
|
|
||||||
"npm-debug.log",
|
|
||||||
".idea",
|
|
||||||
".npmignore",
|
|
||||||
".gitignore"
|
|
||||||
],
|
|
||||||
"dependencies": {}
|
|
||||||
}
|
|
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
File diff suppressed because one or more lines are too long
|
@ -1,24 +0,0 @@
|
||||||
# Which files do I need?
|
|
||||||
|
|
||||||
There are two versions available: a full version and a minimalist version.
|
|
||||||
|
|
||||||
## Full version
|
|
||||||
|
|
||||||
If you're not sure which version to use, use the full version: jsoneditor.js.
|
|
||||||
|
|
||||||
|
|
||||||
## Minimalist version
|
|
||||||
|
|
||||||
The minimalist version, jsoneditor-minimalist.js, has excluded the following libraries:
|
|
||||||
|
|
||||||
- `ace` (via `brace`), used for the code editor.
|
|
||||||
- `ajv`, used for JSON schema validation.
|
|
||||||
|
|
||||||
This reduces the the size of the minified and gzipped JavaScript considerably.
|
|
||||||
|
|
||||||
When to use the minimalist version?
|
|
||||||
|
|
||||||
- If you don't need the mode "code" and don't need JSON schema validation.
|
|
||||||
- Or if you want to provide `ace` and/or `ajv` yourself via the configuration
|
|
||||||
options, for example when you already use Ace in other parts of your
|
|
||||||
web application too and don't want to bundle the library twice.
|
|
44
docs/api.md
44
docs/api.md
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
### Construction
|
### Construction
|
||||||
|
|
||||||
#### `jsoneditor(container [, options [, json]])`
|
#### `jsoneditor(container [, options])`
|
||||||
|
|
||||||
Constructs a new JSONEditor.
|
Constructs a new JSONEditor.
|
||||||
|
|
||||||
|
@ -19,13 +19,9 @@ Constructs a new JSONEditor.
|
||||||
Optional object with options. The available options are described under
|
Optional object with options. The available options are described under
|
||||||
[Configuration options](#configuration-options).
|
[Configuration options](#configuration-options).
|
||||||
|
|
||||||
- `{JSON} json`
|
|
||||||
|
|
||||||
Initial JSON data to be loaded into the JSONEditor. Alternatively, the method `JSONEditor.set(json)` can be used to load JSON data into the editor.
|
|
||||||
|
|
||||||
*Returns:*
|
*Returns:*
|
||||||
|
|
||||||
- `{JSONEditor} editor`
|
- `{Object} editor`
|
||||||
|
|
||||||
New instance of a JSONEditor.
|
New instance of a JSONEditor.
|
||||||
|
|
||||||
|
@ -234,10 +230,10 @@ A tree editor:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var options = {
|
var options = {
|
||||||
"mode": "tree",
|
mode: 'tree',
|
||||||
"search": true
|
search: true
|
||||||
};
|
}
|
||||||
var editor = new JSONEditor(container, options);
|
var editor = new JSONEditor(container, options)
|
||||||
var json = {
|
var json = {
|
||||||
"Array": [1, 2, 3],
|
"Array": [1, 2, 3],
|
||||||
"Boolean": true,
|
"Boolean": true,
|
||||||
|
@ -245,21 +241,21 @@ var json = {
|
||||||
"Number": 123,
|
"Number": 123,
|
||||||
"Object": {"a": "b", "c": "d"},
|
"Object": {"a": "b", "c": "d"},
|
||||||
"String": "Hello World"
|
"String": "Hello World"
|
||||||
};
|
}
|
||||||
editor.set(json);
|
editor.set(json)
|
||||||
editor.expandAll();
|
editor.expandAll()
|
||||||
|
|
||||||
var json = editor.get(json);
|
var json = editor.get(json)
|
||||||
```
|
```
|
||||||
|
|
||||||
A text editor:
|
A text editor:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var options = {
|
var options = {
|
||||||
"mode": "text",
|
mode: 'text',
|
||||||
"indentation": 2
|
indentation: 2
|
||||||
};
|
}
|
||||||
var editor = new JSONEditor(container, options);
|
var editor = new JSONEditor(container, options)
|
||||||
var json = {
|
var json = {
|
||||||
"Array": [1, 2, 3],
|
"Array": [1, 2, 3],
|
||||||
"Boolean": true,
|
"Boolean": true,
|
||||||
|
@ -267,10 +263,10 @@ var json = {
|
||||||
"Number": 123,
|
"Number": 123,
|
||||||
"Object": {"a": "b", "c": "d"},
|
"Object": {"a": "b", "c": "d"},
|
||||||
"String": "Hello World"
|
"String": "Hello World"
|
||||||
};
|
}
|
||||||
editor.set(json);
|
editor.set(json)
|
||||||
|
|
||||||
var json = editor.get();
|
var json = editor.get()
|
||||||
```
|
```
|
||||||
|
|
||||||
## JSON parsing and stringification
|
## JSON parsing and stringification
|
||||||
|
@ -278,17 +274,17 @@ var json = editor.get();
|
||||||
In general to parse or stringify JSON data, the browsers built in JSON parser can be used. To create a formatted string from a JSON object, use:
|
In general to parse or stringify JSON data, the browsers built in JSON parser can be used. To create a formatted string from a JSON object, use:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var formattedString = JSON.stringify(json, null, 2);
|
var formattedString = JSON.stringify(json, null, 2)
|
||||||
```
|
```
|
||||||
|
|
||||||
to create a compacted string from a JSON object, use:
|
to create a compacted string from a JSON object, use:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var compactString = JSON.stringify(json);
|
var compactString = JSON.stringify(json)
|
||||||
```
|
```
|
||||||
|
|
||||||
To parse a String to a JSON object, use:
|
To parse a String to a JSON object, use:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var json = JSON.parse(string);
|
var json = JSON.parse(string)
|
||||||
```
|
```
|
||||||
|
|
|
@ -2,21 +2,10 @@
|
||||||
|
|
||||||
### Install
|
### Install
|
||||||
|
|
||||||
with npm:
|
using npm:
|
||||||
|
|
||||||
npm install jsoneditor
|
npm install jsoneditor
|
||||||
|
|
||||||
with bower:
|
|
||||||
|
|
||||||
bower install jsoneditor
|
|
||||||
|
|
||||||
download:
|
|
||||||
|
|
||||||
[http://jsoneditoronline.org/downloads/](http://jsoneditoronline.org/downloads/)
|
|
||||||
|
|
||||||
The library consists of three files: one javascript file, one css file and an
|
|
||||||
image. Both full and minified version are available.
|
|
||||||
|
|
||||||
## Load
|
## Load
|
||||||
|
|
||||||
To implement JSONEditor in a web application, load the javascript file
|
To implement JSONEditor in a web application, load the javascript file
|
||||||
|
@ -37,11 +26,11 @@ In the body, create an div element with an id and a size:
|
||||||
After the page is loaded, load the editor with javascript:
|
After the page is loaded, load the editor with javascript:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var container = document.getElementById("jsoneditor");
|
var container = document.getElementById("jsoneditor")
|
||||||
var options = {
|
var options = {
|
||||||
mode: 'tree'
|
mode: 'tree'
|
||||||
};
|
}
|
||||||
var editor = jsoneditor(container, options);
|
var editor = jsoneditor(container, options)
|
||||||
```
|
```
|
||||||
|
|
||||||
To set JSON data in the editor:
|
To set JSON data in the editor:
|
||||||
|
@ -54,14 +43,14 @@ var json = {
|
||||||
"Number": 123,
|
"Number": 123,
|
||||||
"Object": {"a": "b", "c": "d"},
|
"Object": {"a": "b", "c": "d"},
|
||||||
"String": "Hello World"
|
"String": "Hello World"
|
||||||
};
|
}
|
||||||
editor.set(json);
|
editor.set(json)
|
||||||
```
|
```
|
||||||
|
|
||||||
To get JSON data from the editor:
|
To get JSON data from the editor:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var json = editor.get();
|
var json = editor.get()
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
@ -74,20 +63,19 @@ var json = editor.get();
|
||||||
<!-- when using the mode "code", it's important to specify charset utf-8 -->
|
<!-- when using the mode "code", it's important to specify charset utf-8 -->
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||||
|
|
||||||
<link href="jsoneditor/dist/jsoneditor.min.css" rel="stylesheet" type="text/css">
|
<script src="jsoneditor/dist/jsoneditor.js"></script>
|
||||||
<script src="jsoneditor/dist/jsoneditor.min.js"></script>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<p>
|
<p>
|
||||||
<button onclick="setJSON();">Set JSON</button>
|
<button onclick="setJSON()">Set JSON</button>
|
||||||
<button onclick="getJSON();">Get JSON</button>
|
<button onclick="getJSON()">Get JSON</button>
|
||||||
</p>
|
</p>
|
||||||
<div id="jsoneditor" style="width: 400px; height: 400px;"></div>
|
<div id="jsoneditor" style="width: 400px; height: 400px;"></div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// create the editor
|
// create the editor
|
||||||
var container = document.getElementById("jsoneditor");
|
var container = document.getElementById('jsoneditor')
|
||||||
var editor = jsoneditor(container);
|
var editor = jsoneditor(container)
|
||||||
|
|
||||||
// set json
|
// set json
|
||||||
function setJSON () {
|
function setJSON () {
|
||||||
|
@ -98,14 +86,14 @@ var json = editor.get();
|
||||||
"Number": 123,
|
"Number": 123,
|
||||||
"Object": {"a": "b", "c": "d"},
|
"Object": {"a": "b", "c": "d"},
|
||||||
"String": "Hello World"
|
"String": "Hello World"
|
||||||
};
|
}
|
||||||
editor.set(json);
|
editor.set(json)
|
||||||
}
|
}
|
||||||
|
|
||||||
// get json
|
// get json
|
||||||
function getJSON() {
|
function getJSON() {
|
||||||
var json = editor.get();
|
var json = editor.get()
|
||||||
alert(JSON.stringify(json, null, 2));
|
alert(JSON.stringify(json, null, 2))
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
Loading…
Reference in New Issue