StardewValley
/
jsoneditor
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #396 from israelito3000/feature/templateItems 

Feature/template items
This commit is contained in:
Jos de Jong 2017-05-07 15:21:15 +02:00 committed by GitHub
parent 56c450bf0f a5f91f8f99
commit 913af51aab
4 changed files with 193 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
examples/10_templates.html Normal file
View File

@ -0,0 +1,59 @@
<!DOCTYPE HTML>
<html>
<head>
<title>JSONEditor | JSON schema validation</title>
<link href="../dist/jsoneditor.css" rel="stylesheet" type="text/css">
<script src="../dist/jsoneditor.js"></script>
<style type="text/css">
body {
width: 600px;
font: 11pt sans-serif;
}
#jsoneditor {
width: 100%;
height: 500px;
}
</style>
</head>
<body>
<h1>JSON schema validation</h1>
<p>
This example demonstrates JSON schema validation. The JSON object in this example must contain properties <code>firstName</code> and <code>lastName</code>, can can optionally have a property <code>age</code> which must be a positive integer.
</p>
<p>
See <a href="http://json-schema.org/" target="_blank">http://json-schema.org/</a> for more information.
</p>
<div id="jsoneditor"></div>
<script>
var json = {
firstName: 'John',
lastName: 'Doe',
gender: null,
age: 28
};
var options = {
templates: [
{
"menu": "Special Node",
"name": "SpecialNode",
"data": {
"field1": "value1",
"field2": "value2"
}
}
]
};
// create the editor
var container = document.getElementById('jsoneditor');
var editor = new JSONEditor(container, options, json);
</script>
</body>
</html>

10
src/js/JSONEditor.js
View File

@ -80,7 +80,7 @@ function JSONEditor (container, options, json) {
if (options) {
var VALID_OPTIONS = [
'ace', 'theme',
'ajv', 'schema',
'ajv', 'schema','templates',
'onChange', 'onEditable', 'onError', 'onModeChange',
'escapeUnicode', 'history', 'search', 'mode', 'modes', 'name', 'indentation', 'sortObjectKeys'
];
@ -288,11 +288,11 @@ JSONEditor.prototype.setSchema = function (schema) {
}
if (ajv) {
this.validateSchema = ajv.compile(schema);
this.validateSchema = ajv.compile(schema);
// add schema to the options, so that when switching to an other mode,
// the set schema is not lost
this.options.schema = schema;
// add schema to the options, so that when switching to an other mode,
// the set schema is not lost
this.options.schema = schema;
// validate now
this.validate();

152
src/js/Node.js
View File

@ -3175,6 +3175,32 @@ Node.TYPE_TITLES = {
'but always returned as string.'
};
Node.prototype.addTemplates = function (menu, append) {
var node = this;
var templates = node.editor.options.templates;
if (templates == null) return;
if (templates.length) {
// create a separator
menu.push({
'type': 'separator'
});
}
var appendData = function (name, data) {
node._onAppend(name, data);
};
var insertData = function (name, data) {
node._onInsertBefore(name, data);
};
templates.forEach(function (template) {
menu.push({
text: template.menu,
className: (template.class || 'jsoneditor-type-object'),
title: template.menu,
click: (append ? appendData.bind(this, template.name, template.data) : insertData.bind(this, template.name, template.data))
});
});
};
/**
* Show a contextmenu for this node
* @param {HTMLElement} anchor Anchor element to attach the context menu to
@ -3274,52 +3300,91 @@ Node.prototype.showContextMenu = function (anchor, onClose) {
// create append button (for last child node only)
var childs = node.parent.childs;
if (node == childs[childs.length - 1]) {
items.push({
text: 'Append',
title: 'Append a new field with type \'auto\' after this field (Ctrl+Shift+Ins)',
submenuTitle: 'Select the type of the field to be appended',
className: 'jsoneditor-append',
click: function () {
node._onAppend('', '', 'auto');
},
submenu: [
{
var appendSubmenu = [
{
text: 'Auto',
className: 'jsoneditor-type-auto',
title: titles.auto,
click: function () {
node._onAppend('', '', 'auto');
}
},
{
text: 'Array',
className: 'jsoneditor-type-array',
title: titles.array,
click: function () {
node._onAppend('', []);
}
},
{
text: 'Object',
className: 'jsoneditor-type-object',
title: titles.object,
click: function () {
node._onAppend('', {});
}
},
{
text: 'String',
className: 'jsoneditor-type-string',
title: titles.string,
click: function () {
node._onAppend('', '', 'string');
}
}
];
node.addTemplates(appendSubmenu, true);
items.push({
text: 'Append',
title: 'Append a new field with type \'auto\' after this field (Ctrl+Shift+Ins)',
submenuTitle: 'Select the type of the field to be appended',
className: 'jsoneditor-append',
click: function () {
node._onAppend('', '', 'auto');
},
submenu: appendSubmenu
});
}
// create insert button
var insertSubmenu = [
{
text: 'Auto',
className: 'jsoneditor-type-auto',
title: titles.auto,
click: function () {
node._onAppend('', '', 'auto');
node._onInsertBefore('', '', 'auto');
}
},
{
},
{
text: 'Array',
className: 'jsoneditor-type-array',
title: titles.array,
click: function () {
node._onAppend('', []);
node._onInsertBefore('', []);
}
},
{
},
{
text: 'Object',
className: 'jsoneditor-type-object',
title: titles.object,
click: function () {
node._onAppend('', {});
node._onInsertBefore('', {});
}
},
{
},
{
text: 'String',
className: 'jsoneditor-type-string',
title: titles.string,
click: function () {
node._onAppend('', '', 'string');
node._onInsertBefore('', '', 'string');
}
}
]
});
}
// create insert button
}
];
node.addTemplates(insertSubmenu, false);
items.push({
text: 'Insert',
title: 'Insert a new field with type \'auto\' before this field (Ctrl+Ins)',
@ -3328,40 +3393,7 @@ Node.prototype.showContextMenu = function (anchor, onClose) {
click: function () {
node._onInsertBefore('', '', 'auto');
},
submenu: [
{
text: 'Auto',
className: 'jsoneditor-type-auto',
title: titles.auto,
click: function () {
node._onInsertBefore('', '', 'auto');
}
},
{
text: 'Array',
className: 'jsoneditor-type-array',
title: titles.array,
click: function () {
node._onInsertBefore('', []);
}
},
{
text: 'Object',
className: 'jsoneditor-type-object',
title: titles.object,
click: function () {
node._onInsertBefore('', {});
}
},
{
text: 'String',
className: 'jsoneditor-type-string',
title: titles.string,
click: function () {
node._onInsertBefore('', '', 'string');
}
}
]
submenu: insertSubmenu
});
if (this.editable.field) {

72
src/js/appendNodeFactory.js
View File

@ -134,50 +134,52 @@ function appendNodeFactory(Node) {
AppendNode.prototype.showContextMenu = function (anchor, onClose) {
var node = this;
var titles = Node.TYPE_TITLES;
var appendSubmenu = [
{
text: 'Auto',
className: 'jsoneditor-type-auto',
title: titles.auto,
click: function () {
node._onAppend('', '', 'auto');
}
},
{
text: 'Array',
className: 'jsoneditor-type-array',
title: titles.array,
click: function () {
node._onAppend('', []);
}
},
{
text: 'Object',
className: 'jsoneditor-type-object',
title: titles.object,
click: function () {
node._onAppend('', {});
}
},
{
text: 'String',
className: 'jsoneditor-type-string',
title: titles.string,
click: function () {
node._onAppend('', '', 'string');
}
}
];
node.addTemplates(appendSubmenu, true);
var items = [
// create append button
{
'text': 'Append',
'text': 'Append!',
'title': 'Append a new field with type \'auto\' (Ctrl+Shift+Ins)',
'submenuTitle': 'Select the type of the field to be appended',
'className': 'jsoneditor-insert',
'click': function () {
node._onAppend('', '', 'auto');
},
'submenu': [
{
'text': 'Auto',
'className': 'jsoneditor-type-auto',
'title': titles.auto,
'click': function () {
node._onAppend('', '', 'auto');
}
},
{
'text': 'Array',
'className': 'jsoneditor-type-array',
'title': titles.array,
'click': function () {
node._onAppend('', []);
}
},
{
'text': 'Object',
'className': 'jsoneditor-type-object',
'title': titles.object,
'click': function () {
node._onAppend('', {});
}
},
{
'text': 'String',
'className': 'jsoneditor-type-string',
'title': titles.string,
'click': function () {
node._onAppend('', '', 'string');
}
}
]
'submenu': appendSubmenu
}
];