jsonschema.js
3.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
(function() {
JSONSchema.defaults.options.theme = 'bootstrap3';
JSONSchema.defaults.options.iconlib = 'bootstrap3';
JSONSchema.defaults.options.disable_edit_json = true;
JSONSchema.defaults.options.disable_properties = true;
JSONSchema.defaults.options.disable_array_reorder = true;
JSONSchema.defaults.options.disable_array_delete_all_rows = true;
JSONSchema.defaults.options.disable_array_delete_last_row = true;
JSONSchema.defaults.options.enum_titles = true;
JSONSchema.defaults.options.no_additional_properties = true;
JSONSchema.defaults.options.show_errors = 'interaction';
JSONSchema.defaults.options.object_layout = 'grid';
JSONSchema.plugins.ace.theme = 'twilight';
var schema = {
title: "Person",
type: "object",
properties: {
name: { type: "string", description: "First and Last name", minLength: 4, default: "Jeremy Dorn" },
age: { type: "integer", default: 25, minimum: 18, maximum: 99 },
favorite_color: { type: "string", format: "color", title: "favorite color", default: "#ffa500" },
gender: { type: "string", enum: ["male", "female"] },
location: {
type: "object",
title: "Location",
properties: {
city: { type: "string", default: "San Francisco" },
state: { type: "string", default: "CA" },
citystate: {
type: "string",
description: "This is generated automatically from the previous two fields",
template: "{{city}}, {{state}}",
watch: {
city: 'location.city',
state: 'location.state'
}
}
}
},
pets: {
type: "array",
format: "table",
title: "Pets",
uniqueItems: true,
items: {
type: "object",
title: "Pet",
properties: {
type: { type: "string", enum: ["cat","dog","bird","reptile","other"], default: "dog" },
name: { type: "string" }
}
},
default: [ { type: "dog", name: "Walter" } ]
}
}
}
var $schema = new JSONEditor(document.getElementById('schema'), {hideMenu: true, mode: 'code'});
var $output = new JSONEditor(document.getElementById('output'), {hideMenu: true, mode: 'code'});
var $editor = document.getElementById('editor');
var $validate = document.getElementById('validate');
// Buttons
var $set_schema_button = document.getElementById('setschema');
var $set_value_button = document.getElementById('setvalue');
var jsoneditor = null;
var reload = function(keep_value) {
var startval = (jsoneditor && keep_value) ? jsoneditor.getValue() : window.startval;
window.startval = undefined;
if (jsoneditor)
jsoneditor.destroy();
jsoneditor = new JSONSchema($editor, { schema: schema, startval: startval });
window.jsoneditor = jsoneditor;
jsoneditor.on('change', function() {
var json = jsoneditor.getValue();
try {
$output.set(json);
} catch (e) {
}
var validation_errors = jsoneditor.validate();
if (validation_errors.length)
$validate.value = JSON.stringify(validation_errors, null, 2);
else
$validate.value = 'valid';
});
};
$schema.set(schema);
$output.set({});
$set_value_button.addEventListener('click', function() {
var out = null;
try {
out = $output.get();
} catch (e) {
}
jsoneditor.setValue(out);
});
$set_schema_button.addEventListener('click',function() {
try {
schema = $schema.get();
} catch(e) {
alert('Invalid Schema: ' + e.message);
return;
}
reload();
});
reload();
})();