@wirenboard/json-editor 2.5.3-wb13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.env-dist +2 -0
- package/.eslintrc +7 -0
- package/.gitattributes +1 -0
- package/.github/PULL_REQUEST_TEMPLATE.md +9 -0
- package/.github/issue_template +25 -0
- package/.github/workflows/build.yml +58 -0
- package/.travis.yml +70 -0
- package/CHANGELOG.md +915 -0
- package/CONTRIBUTING.md +92 -0
- package/LICENSE +20 -0
- package/Makefile +26 -0
- package/README.md +1646 -0
- package/README_ADDON.md +573 -0
- package/UPGRADING.md +46 -0
- package/build/CssToJson.js +55 -0
- package/codecept.conf.js +35 -0
- package/config/.eslintrc +7 -0
- package/config/codeceptjs_helpers.js +139 -0
- package/config/helpers.js +10 -0
- package/config/karma.conf.js +93 -0
- package/config/readme.md +31 -0
- package/config/webpack.common.js +75 -0
- package/config/webpack.dev.js +15 -0
- package/config/webpack.nonmin.js +19 -0
- package/config/webpack.prod.js +25 -0
- package/dist/jsoneditor.js +14 -0
- package/dist/nonmin/jsoneditor.js +29097 -0
- package/dist/nonmin/jsoneditor.js.map +1 -0
- package/docs/ace_editor.html +56 -0
- package/docs/advanced.html +136 -0
- package/docs/basic.html +63 -0
- package/docs/basic_person.json +26 -0
- package/docs/choices.html +86 -0
- package/docs/cleave.html +132 -0
- package/docs/colorpicker.html +194 -0
- package/docs/css_integration.html +135 -0
- package/docs/datetime.html +305 -0
- package/docs/describedby.html +161 -0
- package/docs/enumsource.html +67 -0
- package/docs/images/categoriesDemo.png +0 -0
- package/docs/images/inheritance_tree.png +0 -0
- package/docs/images/jsoneditor.png +0 -0
- package/docs/imask.html +192 -0
- package/docs/index.html +579 -0
- package/docs/materialize_css.html +164 -0
- package/docs/meta_schema.json +705 -0
- package/docs/multiple_upload_base64.html +65 -0
- package/docs/person.json +73 -0
- package/docs/polyfills/assign.js +29 -0
- package/docs/radio.html +156 -0
- package/docs/recursive.html +170 -0
- package/docs/select2.html +99 -0
- package/docs/selectize.html +100 -0
- package/docs/signature.html +42 -0
- package/docs/starrating.html +137 -0
- package/docs/upload.html +131 -0
- package/docs/uuid.html +70 -0
- package/docs/wysiwyg.html +56 -0
- package/jasmine.json +11 -0
- package/json-editor-json-editor-2.5.3-wb13.tgz +0 -0
- package/package.json +100 -0
- package/release-notes.md +88 -0
- package/src/core.js +412 -0
- package/src/defaults.js +402 -0
- package/src/editor.js +707 -0
- package/src/editors/ace.js +89 -0
- package/src/editors/array/choices.js +103 -0
- package/src/editors/array/select2.js +110 -0
- package/src/editors/array/selectize.js +103 -0
- package/src/editors/array.css +9 -0
- package/src/editors/array.css.js +3 -0
- package/src/editors/array.js +818 -0
- package/src/editors/autocomplete.js +58 -0
- package/src/editors/base64.js +157 -0
- package/src/editors/button.js +97 -0
- package/src/editors/checkbox.js +95 -0
- package/src/editors/choices.css +3 -0
- package/src/editors/choices.css.js +3 -0
- package/src/editors/choices.js +69 -0
- package/src/editors/colorpicker.js +103 -0
- package/src/editors/datetime.js +141 -0
- package/src/editors/describedby.js +188 -0
- package/src/editors/enum.js +136 -0
- package/src/editors/hidden.js +127 -0
- package/src/editors/index.js +81 -0
- package/src/editors/info.js +20 -0
- package/src/editors/integer.js +19 -0
- package/src/editors/ip.js +36 -0
- package/src/editors/jodit.js +64 -0
- package/src/editors/multiple.js +409 -0
- package/src/editors/multiselect.js +218 -0
- package/src/editors/null.js +18 -0
- package/src/editors/number.js +51 -0
- package/src/editors/object.css +41 -0
- package/src/editors/object.css.js +3 -0
- package/src/editors/object.js +1290 -0
- package/src/editors/radio.js +111 -0
- package/src/editors/sceditor.js +72 -0
- package/src/editors/select.js +370 -0
- package/src/editors/select2.js +110 -0
- package/src/editors/selectize.js +112 -0
- package/src/editors/signature.js +113 -0
- package/src/editors/simplemde.js +100 -0
- package/src/editors/starrating.css +52 -0
- package/src/editors/starrating.css.js +3 -0
- package/src/editors/starrating.js +135 -0
- package/src/editors/stepper.js +27 -0
- package/src/editors/string.js +372 -0
- package/src/editors/table.js +516 -0
- package/src/editors/upload.js +321 -0
- package/src/editors/uuid.js +56 -0
- package/src/iconlib.js +24 -0
- package/src/iconlibs/bootstrap2.js +28 -0
- package/src/iconlibs/bootstrap3.js +28 -0
- package/src/iconlibs/fontawesome3.js +28 -0
- package/src/iconlibs/fontawesome4.js +28 -0
- package/src/iconlibs/fontawesome5.js +28 -0
- package/src/iconlibs/foundation2.js +24 -0
- package/src/iconlibs/foundation3.js +28 -0
- package/src/iconlibs/index.js +25 -0
- package/src/iconlibs/jqueryui.js +28 -0
- package/src/iconlibs/materialicons.js +49 -0
- package/src/iconlibs/openiconic.js +28 -0
- package/src/iconlibs/spectre.js +28 -0
- package/src/resolvers.js +128 -0
- package/src/schemaloader.js +408 -0
- package/src/style.css +150 -0
- package/src/style.css.js +3 -0
- package/src/templates/default.js +52 -0
- package/src/templates/ejs.js +13 -0
- package/src/templates/handlebars.js +1 -0
- package/src/templates/hogan.js +10 -0
- package/src/templates/index.js +21 -0
- package/src/templates/lodash.js +9 -0
- package/src/templates/markup.js +9 -0
- package/src/templates/mustache.js +9 -0
- package/src/templates/swig.js +1 -0
- package/src/templates/underscore.js +9 -0
- package/src/theme.js +659 -0
- package/src/themes/barebones.css +35 -0
- package/src/themes/barebones.css.js +3 -0
- package/src/themes/barebones.js +28 -0
- package/src/themes/bootstrap2.js +319 -0
- package/src/themes/bootstrap3.css +0 -0
- package/src/themes/bootstrap3.css.js +3 -0
- package/src/themes/bootstrap3.js +315 -0
- package/src/themes/bootstrap4.css +89 -0
- package/src/themes/bootstrap4.css.js +3 -0
- package/src/themes/bootstrap4.js +690 -0
- package/src/themes/bootstrap5.css.js +3 -0
- package/src/themes/foundation.js +569 -0
- package/src/themes/html.css +60 -0
- package/src/themes/html.css.js +3 -0
- package/src/themes/html.js +71 -0
- package/src/themes/index.js +28 -0
- package/src/themes/jqueryui.js +198 -0
- package/src/themes/materialize.js +426 -0
- package/src/themes/spectre.css +208 -0
- package/src/themes/spectre.css.js +3 -0
- package/src/themes/spectre.js +406 -0
- package/src/themes/tailwind.css +249 -0
- package/src/themes/tailwind.css.js +3 -0
- package/src/themes/tailwind.js +443 -0
- package/src/utilities.js +138 -0
- package/src/validator.js +877 -0
- package/src/validators/ip-validator.js +51 -0
- package/tests/Dockerfile +3 -0
- package/tests/README.md +48 -0
- package/tests/codeceptjs/codecept.json +42 -0
- package/tests/codeceptjs/constrains/if-then-else_test.js +143 -0
- package/tests/codeceptjs/core_test.js +217 -0
- package/tests/codeceptjs/editors/advanced_test.js +13 -0
- package/tests/codeceptjs/editors/array_any_of_test.js +50 -0
- package/tests/codeceptjs/editors/array_test.js +900 -0
- package/tests/codeceptjs/editors/button_test.js +35 -0
- package/tests/codeceptjs/editors/checkbox_test.js +21 -0
- package/tests/codeceptjs/editors/colorpicker_test.js +27 -0
- package/tests/codeceptjs/editors/datetime_test.js +33 -0
- package/tests/codeceptjs/editors/inheritance_test.js +11 -0
- package/tests/codeceptjs/editors/integer_test.js +84 -0
- package/tests/codeceptjs/editors/issues/issue-gh-812_test.js +32 -0
- package/tests/codeceptjs/editors/jodit_test.js +24 -0
- package/tests/codeceptjs/editors/multiselect_test.js +8 -0
- package/tests/codeceptjs/editors/number_test.js +82 -0
- package/tests/codeceptjs/editors/object_test.js +204 -0
- package/tests/codeceptjs/editors/option-no_default_values_test.js +42 -0
- package/tests/codeceptjs/editors/programmatic-changes_test.js +20 -0
- package/tests/codeceptjs/editors/radio_test.js +10 -0
- package/tests/codeceptjs/editors/rating_test.js +13 -0
- package/tests/codeceptjs/editors/select_test.js +22 -0
- package/tests/codeceptjs/editors/stepper_test.js +27 -0
- package/tests/codeceptjs/editors/string_test.js +118 -0
- package/tests/codeceptjs/editors/table-confirm-delete_test.js +67 -0
- package/tests/codeceptjs/editors/tabs_test.js +14 -0
- package/tests/codeceptjs/editors/uuid_test.js +21 -0
- package/tests/codeceptjs/editors/validation_test.js +14 -0
- package/tests/codeceptjs/meta-schema_test.js +17 -0
- package/tests/codeceptjs/schemaloader_test.js +13 -0
- package/tests/codeceptjs/steps.d.ts +13 -0
- package/tests/codeceptjs/steps_file.js +12 -0
- package/tests/codeceptjs/themes_test.js +519 -0
- package/tests/docker-compose.yml +34 -0
- package/tests/fixtures/basic_person.json +26 -0
- package/tests/fixtures/nested_object.json +26 -0
- package/tests/fixtures/person.json +55 -0
- package/tests/fixtures/recursive.json +8 -0
- package/tests/fixtures/some_types.json +32 -0
- package/tests/fixtures/string.json +3 -0
- package/tests/fixtures/validation.json +1140 -0
- package/tests/pages/_demo.html +475 -0
- package/tests/pages/advanced.html +137 -0
- package/tests/pages/anyof.html +80 -0
- package/tests/pages/array-anyof.html +142 -0
- package/tests/pages/array-checkboxes.html +41 -0
- package/tests/pages/array-choices.html +45 -0
- package/tests/pages/array-integers.html +37 -0
- package/tests/pages/array-move-events.html +61 -0
- package/tests/pages/array-multiselects.html +42 -0
- package/tests/pages/array-nested-arrays.html +40 -0
- package/tests/pages/array-numbers.html +37 -0
- package/tests/pages/array-objects.html +42 -0
- package/tests/pages/array-ratings.html +40 -0
- package/tests/pages/array-selectize.html +51 -0
- package/tests/pages/array-selects.html +36 -0
- package/tests/pages/array-strings.html +36 -0
- package/tests/pages/array.html +42 -0
- package/tests/pages/assets/pages.css +130 -0
- package/tests/pages/button-callbacks.html +77 -0
- package/tests/pages/checkbox-labels.html +114 -0
- package/tests/pages/colorpicker-no-3rd-party.html +43 -0
- package/tests/pages/colorpicker-use-vanilla-picker.html +50 -0
- package/tests/pages/core.html +118 -0
- package/tests/pages/datetime.html +76 -0
- package/tests/pages/form-name.html +108 -0
- package/tests/pages/grid-strict.html +311 -0
- package/tests/pages/grid.html +284 -0
- package/tests/pages/if-then-else-allOf.html +117 -0
- package/tests/pages/inheritance.html +76 -0
- package/tests/pages/integer.html +68 -0
- package/tests/pages/issues/_template.html +50 -0
- package/tests/pages/issues/issue-gh-812.html +110 -0
- package/tests/pages/issues/issue-gh-823-meta-schema.html +35 -0
- package/tests/pages/issues/issue-gh-848.html +81 -0
- package/tests/pages/meta_schema.json +705 -0
- package/tests/pages/number.html +89 -0
- package/tests/pages/object-no-additional-properties.html +65 -0
- package/tests/pages/object-no-duplicated-id.html +68 -0
- package/tests/pages/object-required-properties.html +236 -0
- package/tests/pages/object-with-dependencies-array.html +46 -0
- package/tests/pages/object-with-dependencies.html +60 -0
- package/tests/pages/object.html +79 -0
- package/tests/pages/oneof.html +103 -0
- package/tests/pages/option-no_default_values.html +58 -0
- package/tests/pages/programmatic-changes.html +120 -0
- package/tests/pages/read-only.html +105 -0
- package/tests/pages/select.html +41 -0
- package/tests/pages/stepper.html +59 -0
- package/tests/pages/string-ace-editor.html +52 -0
- package/tests/pages/string-cleave.html +46 -0
- package/tests/pages/string-custom-attributes.html +62 -0
- package/tests/pages/string-formats.html +52 -0
- package/tests/pages/string-formats2.html +57 -0
- package/tests/pages/string-jodit-editor.html +49 -0
- package/tests/pages/string-sceditor.html +62 -0
- package/tests/pages/table-move-events.html +56 -0
- package/tests/pages/table.html +46 -0
- package/tests/pages/tabs.html +131 -0
- package/tests/pages/themes.html +527 -0
- package/tests/pages/translate-property.html +247 -0
- package/tests/pages/urn.html +93 -0
- package/tests/pages/uuid.html +72 -0
- package/tests/pages/validation.html +99 -0
- package/tests/unit/.eslintrc +8 -0
- package/tests/unit/core.spec.js +309 -0
- package/tests/unit/defaults.spec.js +40 -0
- package/tests/unit/editor.spec.js +160 -0
- package/tests/unit/editors/array.spec.js +86 -0
- package/tests/unit/editors/object.spec.js +79 -0
- package/tests/unit/editors/table.spec.js +91 -0
- package/tests/unit/readme.md +35 -0
- package/tests/unit/schemaloader.spec.js +498 -0
- package/tests/unit/validator.spec.js +94 -0
- package/tests/unit/validators/ip-validator.spec.js +62 -0
package/docs/index.html
ADDED
|
@@ -0,0 +1,579 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8"/>
|
|
5
|
+
<title>JSON Editor Interactive Example</title>
|
|
6
|
+
<script src="https://cdn.jsdelivr.net/npm/@json-editor/json-editor@latest/dist/jsoneditor.min.js"></script>
|
|
7
|
+
<script src="./polyfills/assign.js"></script>
|
|
8
|
+
<script src="https://cdn.jsdelivr.net/npm/lz-string@1.4.4/libs/lz-string.min.js"></script>
|
|
9
|
+
<link rel='stylesheet' id='theme-link'>
|
|
10
|
+
<link rel='stylesheet' id='iconlib-link'>
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<div class='container grid-xl'>
|
|
14
|
+
<div class="row columns md:flex">
|
|
15
|
+
<div class='col-8 col-md-8 w-8/12'>
|
|
16
|
+
<h1>Editor</h1>
|
|
17
|
+
<p>Below is the editor generated from the JSON Schema.</p>
|
|
18
|
+
<div id="json-editor-form"></div>
|
|
19
|
+
</div>
|
|
20
|
+
<div class='col-4 col-md-4 w-4/12'>
|
|
21
|
+
<div>
|
|
22
|
+
<a class="btn btn-primary" id="direct-link" title="preserves schema, value, and options">Direct Link</a>
|
|
23
|
+
<a class="btn btn-secondary" href="?" title="reload editor with default example settings">reset</a>
|
|
24
|
+
</div>
|
|
25
|
+
<h2>JSON Output</h2>
|
|
26
|
+
<p>You can also make changes to the JSON here and set the value in the editor by clicking "Update Form"</p>
|
|
27
|
+
<label for="output-textarea"></label>
|
|
28
|
+
<button class='btn btn-primary btn-block' id='setvalue'>Update Form</button>
|
|
29
|
+
<textarea id='output-textarea' rows="15" style="width: 100%; font-family: monospace;"
|
|
30
|
+
class='form-control'></textarea>
|
|
31
|
+
<h2>Validation</h2>
|
|
32
|
+
<label for="validate-textarea">This will update whenever the form changes to show validation errors if there
|
|
33
|
+
are any.</label><br>
|
|
34
|
+
<textarea id='validate-textarea' readonly disabled class='form-control'></textarea>
|
|
35
|
+
<h2>Options</h2>
|
|
36
|
+
<div>
|
|
37
|
+
<label for="boolean-options-select">Boolean options</label><br>
|
|
38
|
+
<select multiple size="15" id="boolean-options-select" class="form-control browser-default">
|
|
39
|
+
<option value='required_by_default'>Object properties required by default</option>
|
|
40
|
+
<option value='display_required_only'>Only show required properties by default</option>
|
|
41
|
+
<option value='show_opt_in'>Show optional properties (with checkbox)</option>
|
|
42
|
+
<option value='no_additional_properties'>No additional object properties</option>
|
|
43
|
+
<option value='ajax'>Allow loading schemas via Ajax</option>
|
|
44
|
+
<option value='disable_edit_json'>Disable "Edit JSON" buttons</option>
|
|
45
|
+
<option value='disable_collapse'>Disable collapse buttons</option>
|
|
46
|
+
<option value='disable_properties'>Disable properties buttons</option>
|
|
47
|
+
<option value='disable_array_add'>Disable array add buttons</option>
|
|
48
|
+
<option value='disable_array_reorder'>Disable array move buttons</option>
|
|
49
|
+
<option value='disable_array_delete'>Disable array delete buttons</option>
|
|
50
|
+
<option value='enable_array_copy'>Add copy buttons to arrays</option>
|
|
51
|
+
<option value='array_controls_top'>Array controls will be displayed at top of list</option>
|
|
52
|
+
<option value='disable_array_delete_all_rows'>Disable array delete all rows buttons</option>
|
|
53
|
+
<option value='disable_array_delete_last_row'>Disable array delete last row buttons</option>
|
|
54
|
+
</select>
|
|
55
|
+
</div>
|
|
56
|
+
<div>
|
|
57
|
+
<label for="theme-select">theme</label><br>
|
|
58
|
+
<select id='theme-select' name="theme" class='form-control browser-default'>
|
|
59
|
+
<option value='barebones'>Barebones</option>
|
|
60
|
+
<option value='bootstrap3'>Bootstrap 3</option>
|
|
61
|
+
<option value='bootstrap4'>Bootstrap 4</option>
|
|
62
|
+
<option value='html'>HTML</option>
|
|
63
|
+
<option value='spectre'>Spectre</option>
|
|
64
|
+
<option value='tailwind'>Tailwind</option>
|
|
65
|
+
</select>
|
|
66
|
+
</div>
|
|
67
|
+
<div>
|
|
68
|
+
<label for="iconlib-select">iconlib</label><br>
|
|
69
|
+
<select id='iconlib-select' name="iconlib" class='form-control browser-default'>
|
|
70
|
+
<option value='fontawesome3'>fontawesome 3</option>
|
|
71
|
+
<option value='fontawesome4'>fontawesome 4</option>
|
|
72
|
+
<option value='fontawesome5'>fontawesome 5</option>
|
|
73
|
+
<option value='jqueryui'>jQuery UI</option>
|
|
74
|
+
<option value='openiconic'>Open Iconic</option>
|
|
75
|
+
<option value='spectre'>Spectre</option>
|
|
76
|
+
</select>
|
|
77
|
+
</div>
|
|
78
|
+
<div>
|
|
79
|
+
<label for="object-layout-select">Object Layout</label><br>
|
|
80
|
+
<select id='object-layout-select' class='form-control browser-default'>
|
|
81
|
+
<option value='normal'>normal</option>
|
|
82
|
+
<option value='grid'>grid</option>
|
|
83
|
+
</select>
|
|
84
|
+
</div>
|
|
85
|
+
<div>
|
|
86
|
+
<label for="show-errors-select">Show Errors</label><br>
|
|
87
|
+
<select id='show-errors-select' class='form-control browser-default'>
|
|
88
|
+
<option value='interaction'>On Interaction</option>
|
|
89
|
+
<option value='change'>On Field Change</option>
|
|
90
|
+
<option value='always'>Always</option>
|
|
91
|
+
<option value='never'>Never</option>
|
|
92
|
+
</select>
|
|
93
|
+
</div>
|
|
94
|
+
<div>
|
|
95
|
+
<label for="lib-select"
|
|
96
|
+
title="It's recommended that you click the Direct Link after changing these options">Include
|
|
97
|
+
External Library</label><br>
|
|
98
|
+
<select multiple size="10" id='lib-select' class='form-control browser-default'
|
|
99
|
+
title="It's reccomended that you click the Direct Link after changing these options">
|
|
100
|
+
<option value='ace_editor'>Ace Editor</option>
|
|
101
|
+
<option value='choices'>Choices</option>
|
|
102
|
+
<option value='sceditor'>SCEditor</option>
|
|
103
|
+
<option value='simplemde'>SimpleMDE</option>
|
|
104
|
+
<option value='select2'>Select2</option>
|
|
105
|
+
<option value='selectize'>Selectize</option>
|
|
106
|
+
<option value='flatpickr'>Flatpickr</option>
|
|
107
|
+
<option value='signature_pad'>Signature Pad</option>
|
|
108
|
+
<option value='mathjs'>Math.js</option>
|
|
109
|
+
<option value='cleavejs'>Cleave.js</option>
|
|
110
|
+
</select>
|
|
111
|
+
</div>
|
|
112
|
+
</div>
|
|
113
|
+
</div>
|
|
114
|
+
<div class="row columns md:flex">
|
|
115
|
+
<div class='col-12 col-md-12 w-12/12'>
|
|
116
|
+
<h2>Schema</h2>
|
|
117
|
+
<label for="schema-textarea">You can change the schema and see how the generated form looks. After you make
|
|
118
|
+
changes, click "Update Schema"</label>
|
|
119
|
+
<button class='btn btn-primary btn-block' id='setschema'>Update Schema</button>
|
|
120
|
+
<textarea id='schema-textarea' rows="30" style="width: 100%; font-family: monospace;"
|
|
121
|
+
class='form-control'></textarea>
|
|
122
|
+
</div>
|
|
123
|
+
</div>
|
|
124
|
+
</div>
|
|
125
|
+
<script>
|
|
126
|
+
|
|
127
|
+
var defaultSchema = {
|
|
128
|
+
'title': 'Person',
|
|
129
|
+
'type': 'object',
|
|
130
|
+
'required': [
|
|
131
|
+
'name',
|
|
132
|
+
'age',
|
|
133
|
+
'date',
|
|
134
|
+
'favorite_color',
|
|
135
|
+
'gender',
|
|
136
|
+
'location',
|
|
137
|
+
'pets'
|
|
138
|
+
],
|
|
139
|
+
'properties': {
|
|
140
|
+
'name': {
|
|
141
|
+
'type': 'string',
|
|
142
|
+
'description': 'First and Last name',
|
|
143
|
+
'minLength': 4,
|
|
144
|
+
'default': 'Jeremy Dorn'
|
|
145
|
+
},
|
|
146
|
+
'age': {
|
|
147
|
+
'type': 'integer',
|
|
148
|
+
'default': 25,
|
|
149
|
+
'minimum': 18,
|
|
150
|
+
'maximum': 99
|
|
151
|
+
},
|
|
152
|
+
'favorite_color': {
|
|
153
|
+
'type': 'string',
|
|
154
|
+
'format': 'color',
|
|
155
|
+
'title': 'favorite color',
|
|
156
|
+
'default': '#ffa500'
|
|
157
|
+
},
|
|
158
|
+
'gender': {
|
|
159
|
+
'type': 'string',
|
|
160
|
+
'enum': [
|
|
161
|
+
'male',
|
|
162
|
+
'female',
|
|
163
|
+
'other'
|
|
164
|
+
]
|
|
165
|
+
},
|
|
166
|
+
'date': {
|
|
167
|
+
'type': 'string',
|
|
168
|
+
'format': 'date',
|
|
169
|
+
'options': {
|
|
170
|
+
'flatpickr': {}
|
|
171
|
+
}
|
|
172
|
+
},
|
|
173
|
+
'location': {
|
|
174
|
+
'type': 'object',
|
|
175
|
+
'title': 'Location',
|
|
176
|
+
'properties': {
|
|
177
|
+
'city': {
|
|
178
|
+
'type': 'string',
|
|
179
|
+
'default': 'San Francisco'
|
|
180
|
+
},
|
|
181
|
+
'state': {
|
|
182
|
+
'type': 'string',
|
|
183
|
+
'default': 'CA'
|
|
184
|
+
},
|
|
185
|
+
'citystate': {
|
|
186
|
+
'type': 'string',
|
|
187
|
+
'description': 'This is generated automatically from the previous two fields',
|
|
188
|
+
'template': '{{city}}, {{state}}',
|
|
189
|
+
'watch': {
|
|
190
|
+
'city': 'location.city',
|
|
191
|
+
'state': 'location.state'
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
},
|
|
196
|
+
'pets': {
|
|
197
|
+
'type': 'array',
|
|
198
|
+
'format': 'table',
|
|
199
|
+
'title': 'Pets',
|
|
200
|
+
'uniqueItems': true,
|
|
201
|
+
'items': {
|
|
202
|
+
'type': 'object',
|
|
203
|
+
'title': 'Pet',
|
|
204
|
+
'properties': {
|
|
205
|
+
'type': {
|
|
206
|
+
'type': 'string',
|
|
207
|
+
'enum': [
|
|
208
|
+
'cat',
|
|
209
|
+
'dog',
|
|
210
|
+
'bird',
|
|
211
|
+
'reptile',
|
|
212
|
+
'other'
|
|
213
|
+
],
|
|
214
|
+
'default': 'dog'
|
|
215
|
+
},
|
|
216
|
+
'name': {
|
|
217
|
+
'type': 'string'
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
},
|
|
221
|
+
'default': [
|
|
222
|
+
{
|
|
223
|
+
'type': 'dog',
|
|
224
|
+
'name': 'Walter'
|
|
225
|
+
}
|
|
226
|
+
]
|
|
227
|
+
}
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
// parse url -> merge options -> refreshUI() -> initJsoneditor() -> direct link
|
|
232
|
+
|
|
233
|
+
/* ------------------------------------------------------------------- data */
|
|
234
|
+
|
|
235
|
+
var data = {}
|
|
236
|
+
|
|
237
|
+
var defaultOptions = {
|
|
238
|
+
iconlib: 'fontawesome5',
|
|
239
|
+
object_layout: 'normal',
|
|
240
|
+
schema: defaultSchema,
|
|
241
|
+
show_errors: 'interaction',
|
|
242
|
+
theme: 'bootstrap4'
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
var jsoneditor = null
|
|
246
|
+
var directLink = document.querySelector('#direct-link')
|
|
247
|
+
|
|
248
|
+
var booleanOptionsSelect = document.querySelector('#boolean-options-select')
|
|
249
|
+
var head = document.getElementsByTagName('head')[0]
|
|
250
|
+
var iconlibSelect = document.querySelector('#iconlib-select')
|
|
251
|
+
var iconlibLink = document.querySelector('#iconlib-link')
|
|
252
|
+
var libSelect = document.querySelector('#lib-select')
|
|
253
|
+
var jsonEditorForm = document.querySelector('#json-editor-form')
|
|
254
|
+
var objectLayoutSelect = document.querySelector('#object-layout-select')
|
|
255
|
+
var outputTextarea = document.querySelector('#output-textarea')
|
|
256
|
+
var schemaTextarea = document.querySelector('#schema-textarea')
|
|
257
|
+
var setSchema = document.querySelector('#setschema')
|
|
258
|
+
var setValue = document.querySelector('#setvalue')
|
|
259
|
+
var showErrorsSelect = document.querySelector('#show-errors-select')
|
|
260
|
+
var themeSelect = document.querySelector('#theme-select')
|
|
261
|
+
var themeLink = document.querySelector('#theme-link')
|
|
262
|
+
var validateTextarea = document.querySelector('#validate-textarea')
|
|
263
|
+
|
|
264
|
+
/* -------------------------------------------------------------- parse url */
|
|
265
|
+
|
|
266
|
+
var parseUrl = function () {
|
|
267
|
+
var url = window.location.search
|
|
268
|
+
var queryParamsString = url.substring(1, url.length)
|
|
269
|
+
var queryParams = queryParamsString.split('&')
|
|
270
|
+
|
|
271
|
+
if (queryParamsString.length) {
|
|
272
|
+
queryParams.forEach(function (queryParam) {
|
|
273
|
+
var splittedParam = queryParam.split('=')
|
|
274
|
+
var param = splittedParam[0]
|
|
275
|
+
var value = splittedParam[1]
|
|
276
|
+
|
|
277
|
+
// data query param
|
|
278
|
+
if (param === 'data') {
|
|
279
|
+
// compress schema and value
|
|
280
|
+
try {
|
|
281
|
+
data = JSON.parse(LZString.decompressFromBase64(value))
|
|
282
|
+
} catch (reason) {
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
})
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
mergeOptions()
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
/* ----------------------------------------------------------- mergeOptions */
|
|
292
|
+
|
|
293
|
+
var mergeOptions = function () {
|
|
294
|
+
data.options = Object.assign(defaultOptions, data.options)
|
|
295
|
+
refreshUI()
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
/* -------------------------------------------------------------- refreshUI */
|
|
299
|
+
|
|
300
|
+
var refreshUI = function () {
|
|
301
|
+
// schema
|
|
302
|
+
schemaTextarea.value = JSON.stringify(data.options.schema, null, 2)
|
|
303
|
+
|
|
304
|
+
// theme
|
|
305
|
+
var themeMap = {
|
|
306
|
+
barebones: '',
|
|
307
|
+
bootstrap3: 'https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css',
|
|
308
|
+
bootstrap4: 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css',
|
|
309
|
+
html: '',
|
|
310
|
+
spectre: 'https://unpkg.com/spectre.css/dist/spectre.min.css',
|
|
311
|
+
tailwind: 'https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css'
|
|
312
|
+
}
|
|
313
|
+
themeLink.href = themeMap[data.options.theme]
|
|
314
|
+
themeSelect.value = data.options.theme
|
|
315
|
+
|
|
316
|
+
// iconlLib
|
|
317
|
+
var iconLibMap = {
|
|
318
|
+
fontawesome3: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.css',
|
|
319
|
+
fontawesome4: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css',
|
|
320
|
+
fontawesome5: 'https://use.fontawesome.com/releases/v5.6.1/css/all.css',
|
|
321
|
+
jqueryui: 'https://code.jquery.com/ui/1.10.3/themes/south-street/jquery-ui.css',
|
|
322
|
+
openiconic: 'https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic.min.css',
|
|
323
|
+
spectre: 'https://unpkg.com/spectre.css/dist/spectre-icons.min.css'
|
|
324
|
+
}
|
|
325
|
+
iconlibLink.href = iconLibMap[data.options.iconlib]
|
|
326
|
+
iconlibSelect.value = data.options.iconlib
|
|
327
|
+
|
|
328
|
+
// object_layout
|
|
329
|
+
objectLayoutSelect.value = data.options.object_layout
|
|
330
|
+
|
|
331
|
+
// show_errors
|
|
332
|
+
showErrorsSelect.value = data.options.show_errors
|
|
333
|
+
|
|
334
|
+
// boolean values
|
|
335
|
+
var booleanOptions = booleanOptionsSelect.children
|
|
336
|
+
for (var i = 0; i < booleanOptions.length; i++) {
|
|
337
|
+
var booleanValue = booleanOptions[i]
|
|
338
|
+
if (data.options[booleanValue.value]) {
|
|
339
|
+
booleanValue.selected = true
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
// libs
|
|
344
|
+
var libMapping = {
|
|
345
|
+
ace_editor: {
|
|
346
|
+
js: [
|
|
347
|
+
'https://cdn.jsdelivr.net/npm/ace-editor-builds@1.2.4/src-min-noconflict/ace.js'
|
|
348
|
+
],
|
|
349
|
+
css: []
|
|
350
|
+
},
|
|
351
|
+
choices: {
|
|
352
|
+
js: [
|
|
353
|
+
'https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js'
|
|
354
|
+
],
|
|
355
|
+
css: [
|
|
356
|
+
'https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css'
|
|
357
|
+
]
|
|
358
|
+
},
|
|
359
|
+
cleavejs: {
|
|
360
|
+
js: [
|
|
361
|
+
'https://cdn.jsdelivr.net/npm/cleave.js@1.4.7/dist/cleave.min.js'
|
|
362
|
+
],
|
|
363
|
+
css: []
|
|
364
|
+
},
|
|
365
|
+
sceditor: {
|
|
366
|
+
js: [
|
|
367
|
+
'https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js',
|
|
368
|
+
'https://cdn.jsdelivr.net/npm/sceditor@2.1.3/minified/sceditor.min.js',
|
|
369
|
+
'https://cdn.jsdelivr.net/npm/sceditor@2.1.3/minified/formats/bbcode.js',
|
|
370
|
+
'https://cdn.jsdelivr.net/npm/sceditor@2.1.3/minified/formats/xhtml.js'
|
|
371
|
+
],
|
|
372
|
+
css: [
|
|
373
|
+
'https://cdn.jsdelivr.net/npm/sceditor@2.1.3/minified/themes/default.min.css'
|
|
374
|
+
]
|
|
375
|
+
},
|
|
376
|
+
simplemde: {
|
|
377
|
+
js: [
|
|
378
|
+
'https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js'
|
|
379
|
+
],
|
|
380
|
+
css: [
|
|
381
|
+
'https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css'
|
|
382
|
+
]
|
|
383
|
+
},
|
|
384
|
+
select2: {
|
|
385
|
+
js: [
|
|
386
|
+
'https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js',
|
|
387
|
+
'https://cdn.jsdelivr.net/npm/select2@4.0.6-rc.1/dist/js/select2.min.js'
|
|
388
|
+
],
|
|
389
|
+
css: [
|
|
390
|
+
'https://cdn.jsdelivr.net/npm/select2@4.0.6-rc.1/dist/css/select2.min.css'
|
|
391
|
+
]
|
|
392
|
+
},
|
|
393
|
+
selectize: {
|
|
394
|
+
js: [
|
|
395
|
+
'https://cdn.jsdelivr.net/npm/selectize@0.12.6/dist/js/standalone/selectize.min.js'
|
|
396
|
+
],
|
|
397
|
+
css: [
|
|
398
|
+
'https://cdn.jsdelivr.net/npm/selectize@0.12.6/dist/css/selectize.min.css',
|
|
399
|
+
'https://cdn.jsdelivr.net/npm/selectize@0.12.6/dist/css/selectize.default.min.css'
|
|
400
|
+
]
|
|
401
|
+
},
|
|
402
|
+
flatpickr: {
|
|
403
|
+
js: [
|
|
404
|
+
'https://cdn.jsdelivr.net/npm/flatpickr'
|
|
405
|
+
],
|
|
406
|
+
css: [
|
|
407
|
+
'https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css'
|
|
408
|
+
]
|
|
409
|
+
},
|
|
410
|
+
signature_pad: {
|
|
411
|
+
js: [
|
|
412
|
+
'https://cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js'
|
|
413
|
+
],
|
|
414
|
+
css: []
|
|
415
|
+
},
|
|
416
|
+
mathjs: {
|
|
417
|
+
js: [
|
|
418
|
+
'https://cdn.jsdelivr.net/npm/mathjs@5.3.1/dist/math.min.js'
|
|
419
|
+
],
|
|
420
|
+
css: []
|
|
421
|
+
},
|
|
422
|
+
}
|
|
423
|
+
|
|
424
|
+
if (data.selectedLibs || data.unselectedLibs) {
|
|
425
|
+
|
|
426
|
+
var booleanOptions = booleanOptionsSelect.children
|
|
427
|
+
for (var i = 0; i < booleanOptions.length; i++) {
|
|
428
|
+
var booleanValue = booleanOptions[i]
|
|
429
|
+
if (data.options[booleanValue.value]) {
|
|
430
|
+
booleanValue.selected = true
|
|
431
|
+
}
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
var libSelectChildren = libSelect.children
|
|
435
|
+
for (var i = 0; i < libSelectChildren.length; i++) {
|
|
436
|
+
var child = libSelectChildren[i]
|
|
437
|
+
child.selected = data.selectedLibs.includes(child.value)
|
|
438
|
+
}
|
|
439
|
+
|
|
440
|
+
// remove libraries
|
|
441
|
+
data.unselectedLibs.forEach(function (selectedLib) {
|
|
442
|
+
var concat = libMapping[selectedLib].js.concat(libMapping[selectedLib].css)
|
|
443
|
+
concat.forEach(function () {
|
|
444
|
+
var className = '.external_' + selectedLib
|
|
445
|
+
var toRemove = head.querySelector(className)
|
|
446
|
+
if (toRemove) {
|
|
447
|
+
toRemove.parentNode.removeChild(toRemove)
|
|
448
|
+
}
|
|
449
|
+
})
|
|
450
|
+
})
|
|
451
|
+
|
|
452
|
+
// add libraries
|
|
453
|
+
data.selectedLibs.forEach(function (selectedLib) {
|
|
454
|
+
// add js
|
|
455
|
+
libMapping[selectedLib].js.forEach(function (js) {
|
|
456
|
+
var scriptElement = document.createElement('script')
|
|
457
|
+
scriptElement.type = 'text/javascript'
|
|
458
|
+
scriptElement.src = js
|
|
459
|
+
scriptElement.async = false
|
|
460
|
+
scriptElement.classList.add('external_' + selectedLib)
|
|
461
|
+
head.appendChild(scriptElement)
|
|
462
|
+
})
|
|
463
|
+
// add css
|
|
464
|
+
libMapping[selectedLib].css.forEach(function (css) {
|
|
465
|
+
var linkElement = document.createElement('link')
|
|
466
|
+
linkElement.setAttribute('rel', 'stylesheet')
|
|
467
|
+
linkElement.setAttribute('type', 'text/css')
|
|
468
|
+
linkElement.setAttribute('href', css)
|
|
469
|
+
linkElement.classList.add('external_' + selectedLib)
|
|
470
|
+
head.appendChild(linkElement)
|
|
471
|
+
})
|
|
472
|
+
})
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
initJsoneditor()
|
|
476
|
+
}
|
|
477
|
+
|
|
478
|
+
/* --------------------------------------------------------- initJsoneditor */
|
|
479
|
+
|
|
480
|
+
var initJsoneditor = function () {
|
|
481
|
+
// destroy old JSONEditor instance if exists
|
|
482
|
+
if (jsoneditor) {
|
|
483
|
+
jsoneditor.destroy()
|
|
484
|
+
}
|
|
485
|
+
|
|
486
|
+
// new instance of JSONEditor
|
|
487
|
+
jsoneditor = new window.JSONEditor(jsonEditorForm, data.options)
|
|
488
|
+
|
|
489
|
+
// listen for changes
|
|
490
|
+
jsoneditor.on('change', function () {
|
|
491
|
+
// output
|
|
492
|
+
var json = jsoneditor.getValue()
|
|
493
|
+
outputTextarea.value = JSON.stringify(json, null, 2)
|
|
494
|
+
|
|
495
|
+
// validate
|
|
496
|
+
var validationErrors = jsoneditor.validate()
|
|
497
|
+
if (validationErrors.length) {
|
|
498
|
+
validateTextarea.value = JSON.stringify(validationErrors, null, 2)
|
|
499
|
+
} else {
|
|
500
|
+
validateTextarea.value = 'valid'
|
|
501
|
+
}
|
|
502
|
+
})
|
|
503
|
+
updateDirectLink()
|
|
504
|
+
}
|
|
505
|
+
|
|
506
|
+
/* ------------------------------------------------------- updateDirectLink */
|
|
507
|
+
|
|
508
|
+
var updateDirectLink = function () {
|
|
509
|
+
var url = window.location.href.replace(/\?.*/, '')
|
|
510
|
+
url += '?data='
|
|
511
|
+
url += LZString.compressToBase64(JSON.stringify(data))
|
|
512
|
+
directLink.href = url
|
|
513
|
+
}
|
|
514
|
+
|
|
515
|
+
/* -------------------------------------------------------- event listeners */
|
|
516
|
+
|
|
517
|
+
setValue.addEventListener('click', function () {
|
|
518
|
+
jsoneditor.setValue(JSON.parse(outputTextarea.value))
|
|
519
|
+
})
|
|
520
|
+
|
|
521
|
+
setSchema.addEventListener('click', function () {
|
|
522
|
+
try {
|
|
523
|
+
data.options.schema = JSON.parse(schemaTextarea.value)
|
|
524
|
+
} catch (e) {
|
|
525
|
+
alert('Invalid Schema: ' + e.message)
|
|
526
|
+
return
|
|
527
|
+
}
|
|
528
|
+
refreshUI()
|
|
529
|
+
})
|
|
530
|
+
|
|
531
|
+
themeSelect.addEventListener('change', function () {
|
|
532
|
+
data.options.theme = this.value || ''
|
|
533
|
+
refreshUI()
|
|
534
|
+
})
|
|
535
|
+
|
|
536
|
+
iconlibSelect.addEventListener('change', function () {
|
|
537
|
+
data.options.iconlib = this.value || ''
|
|
538
|
+
refreshUI()
|
|
539
|
+
})
|
|
540
|
+
|
|
541
|
+
objectLayoutSelect.addEventListener('change', function () {
|
|
542
|
+
data.options.object_layout = this.value || ''
|
|
543
|
+
refreshUI()
|
|
544
|
+
})
|
|
545
|
+
|
|
546
|
+
showErrorsSelect.addEventListener('change', function () {
|
|
547
|
+
data.options.show_errors = this.value || ''
|
|
548
|
+
refreshUI()
|
|
549
|
+
})
|
|
550
|
+
|
|
551
|
+
booleanOptionsSelect.addEventListener('change', function () {
|
|
552
|
+
var booleanOptions = this.children
|
|
553
|
+
for (var i = 0; i < booleanOptions.length; i++) {
|
|
554
|
+
data.options[booleanOptions[i].value] = booleanOptions[i].selected
|
|
555
|
+
}
|
|
556
|
+
refreshUI()
|
|
557
|
+
})
|
|
558
|
+
|
|
559
|
+
libSelect.addEventListener('change', function () {
|
|
560
|
+
data.selectedLibs = []
|
|
561
|
+
data.unselectedLibs = []
|
|
562
|
+
|
|
563
|
+
var libs = this.children
|
|
564
|
+
|
|
565
|
+
for (var i = 0; i < libs.length; i++) {
|
|
566
|
+
if (libs[i].selected) {
|
|
567
|
+
data.selectedLibs.push(libs[i].value)
|
|
568
|
+
} else {
|
|
569
|
+
data.unselectedLibs.push(libs[i].value)
|
|
570
|
+
}
|
|
571
|
+
}
|
|
572
|
+
refreshUI()
|
|
573
|
+
})
|
|
574
|
+
|
|
575
|
+
parseUrl()
|
|
576
|
+
|
|
577
|
+
</script>
|
|
578
|
+
</body>
|
|
579
|
+
</html>
|