diff --git a/examples/01_basic_usage.html b/examples/01_basic_usage.html index 296a068..6db1b0f 100644 --- a/examples/01_basic_usage.html +++ b/examples/01_basic_usage.html @@ -21,9 +21,9 @@ diff --git a/examples/02_viewer.html b/examples/02_viewer.html index f463190..2ae78cf 100644 --- a/examples/02_viewer.html +++ b/examples/02_viewer.html @@ -17,16 +17,18 @@

- This editor is read-only (mode='viewer'). + This editor is read-only (mode='view').

diff --git a/examples/03_switch_mode.html b/examples/03_switch_mode.html index e830b4d..a448931 100644 --- a/examples/03_switch_mode.html +++ b/examples/03_switch_mode.html @@ -37,18 +37,20 @@
diff --git a/examples/04_load_and_save.html b/examples/04_load_and_save.html index 2e12fe6..8682054 100644 --- a/examples/04_load_and_save.html +++ b/examples/04_load_and_save.html @@ -37,36 +37,36 @@ diff --git a/examples/05_custom_fields_editable.html b/examples/_05_custom_fields_editable.html similarity index 100% rename from examples/05_custom_fields_editable.html rename to examples/_05_custom_fields_editable.html diff --git a/examples/06_custom_styling.html b/examples/_06_custom_styling.html similarity index 100% rename from examples/06_custom_styling.html rename to examples/_06_custom_styling.html diff --git a/examples/07_json_schema_validation.html b/examples/_07_json_schema_validation.html similarity index 100% rename from examples/07_json_schema_validation.html rename to examples/_07_json_schema_validation.html diff --git a/examples/requirejs_demo/requirejs_demo.html b/examples/requirejs_demo/requirejs_demo.html index 0d4a7c6..acd51d8 100644 --- a/examples/requirejs_demo/requirejs_demo.html +++ b/examples/requirejs_demo/requirejs_demo.html @@ -8,7 +8,7 @@ height: 500px; } - +

diff --git a/examples/requirejs_demo/scripts/main.js b/examples/requirejs_demo/scripts/main.js index f66f2c6..820aad7 100644 --- a/examples/requirejs_demo/scripts/main.js +++ b/examples/requirejs_demo/scripts/main.js @@ -1,8 +1,9 @@ -var module = '../../../dist/jsoneditor'; +var module = '../../../dist/jsoneditor' + require([module], function (jsoneditor) { // create the editor - var container = document.getElementById('jsoneditor'); - var editor = jsoneditor(container); + var container = document.getElementById('jsoneditor') + var editor = jsoneditor(container) // set json document.getElementById('setJSON').onclick = function () { @@ -14,12 +15,12 @@ require([module], function (jsoneditor) { 'object': {'a': 'b', 'c': 'd'}, 'string': 'Hello World' }; - editor.set(json); + editor.set(json) }; // get json document.getElementById('getJSON').onclick = function () { var json = editor.get(); - alert(JSON.stringify(json, null, 2)); + alert(JSON.stringify(json, null, 2)) }; }); diff --git a/examples/requirejs_demo/scripts/require.js b/examples/requirejs_demo/scripts/require.js deleted file mode 100644 index d65036f..0000000 --- a/examples/requirejs_demo/scripts/require.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - RequireJS 2.1.13 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved. - Available via the MIT or new BSD license. - see: http://github.com/jrburke/requirejs for details -*/ -var requirejs,require,define; -(function(ba){function G(b){return"[object Function]"===K.call(b)}function H(b){return"[object Array]"===K.call(b)}function v(b,c){if(b){var d;for(d=0;dthis.depCount&&!this.defined){if(G(l)){if(this.events.error&&this.map.isDefine||g.onError!==ca)try{f=i.execCb(c,l,b,f)}catch(d){a=d}else f=i.execCb(c,l,b,f);this.map.isDefine&&void 0===f&&((b=this.module)?f=b.exports:this.usingExports&& -(f=this.exports));if(a)return a.requireMap=this.map,a.requireModules=this.map.isDefine?[this.map.id]:null,a.requireType=this.map.isDefine?"define":"require",w(this.error=a)}else f=l;this.exports=f;if(this.map.isDefine&&!this.ignore&&(r[c]=f,g.onResourceLoad))g.onResourceLoad(i,this.map,this.depMaps);y(c);this.defined=!0}this.defining=!1;this.defined&&!this.defineEmitted&&(this.defineEmitted=!0,this.emit("defined",this.exports),this.defineEmitComplete=!0)}}else this.fetch()}},callPlugin:function(){var a= -this.map,b=a.id,d=p(a.prefix);this.depMaps.push(d);q(d,"defined",u(this,function(f){var l,d;d=m(aa,this.map.id);var e=this.map.name,P=this.map.parentMap?this.map.parentMap.name:null,n=i.makeRequire(a.parentMap,{enableBuildCallback:!0});if(this.map.unnormalized){if(f.normalize&&(e=f.normalize(e,function(a){return c(a,P,!0)})||""),f=p(a.prefix+"!"+e,this.map.parentMap),q(f,"defined",u(this,function(a){this.init([],function(){return a},null,{enabled:!0,ignore:!0})})),d=m(h,f.id)){this.depMaps.push(f); -if(this.events.error)d.on("error",u(this,function(a){this.emit("error",a)}));d.enable()}}else d?(this.map.url=i.nameToUrl(d),this.load()):(l=u(this,function(a){this.init([],function(){return a},null,{enabled:!0})}),l.error=u(this,function(a){this.inited=!0;this.error=a;a.requireModules=[b];B(h,function(a){0===a.map.id.indexOf(b+"_unnormalized")&&y(a.map.id)});w(a)}),l.fromText=u(this,function(f,c){var d=a.name,e=p(d),P=M;c&&(f=c);P&&(M=!1);s(e);t(j.config,b)&&(j.config[d]=j.config[b]);try{g.exec(f)}catch(h){return w(C("fromtexteval", -"fromText eval for "+b+" failed: "+h,h,[b]))}P&&(M=!0);this.depMaps.push(e);i.completeLoad(d);n([d],l)}),f.load(a.name,n,l,j))}));i.enable(d,this);this.pluginMaps[d.id]=d},enable:function(){V[this.map.id]=this;this.enabling=this.enabled=!0;v(this.depMaps,u(this,function(a,b){var c,f;if("string"===typeof a){a=p(a,this.map.isDefine?this.map:this.map.parentMap,!1,!this.skipMap);this.depMaps[b]=a;if(c=m(L,a.id)){this.depExports[b]=c(this);return}this.depCount+=1;q(a,"defined",u(this,function(a){this.defineDep(b, -a);this.check()}));this.errback&&q(a,"error",u(this,this.errback))}c=a.id;f=h[c];!t(L,c)&&(f&&!f.enabled)&&i.enable(a,this)}));B(this.pluginMaps,u(this,function(a){var b=m(h,a.id);b&&!b.enabled&&i.enable(a,this)}));this.enabling=!1;this.check()},on:function(a,b){var c=this.events[a];c||(c=this.events[a]=[]);c.push(b)},emit:function(a,b){v(this.events[a],function(a){a(b)});"error"===a&&delete this.events[a]}};i={config:j,contextName:b,registry:h,defined:r,urlFetched:S,defQueue:A,Module:Z,makeModuleMap:p, -nextTick:g.nextTick,onError:w,configure:function(a){a.baseUrl&&"/"!==a.baseUrl.charAt(a.baseUrl.length-1)&&(a.baseUrl+="/");var b=j.shim,c={paths:!0,bundles:!0,config:!0,map:!0};B(a,function(a,b){c[b]?(j[b]||(j[b]={}),U(j[b],a,!0,!0)):j[b]=a});a.bundles&&B(a.bundles,function(a,b){v(a,function(a){a!==b&&(aa[a]=b)})});a.shim&&(B(a.shim,function(a,c){H(a)&&(a={deps:a});if((a.exports||a.init)&&!a.exportsFn)a.exportsFn=i.makeShimExports(a);b[c]=a}),j.shim=b);a.packages&&v(a.packages,function(a){var b, -a="string"===typeof a?{name:a}:a;b=a.name;a.location&&(j.paths[b]=a.location);j.pkgs[b]=a.name+"/"+(a.main||"main").replace(ia,"").replace(Q,"")});B(h,function(a,b){!a.inited&&!a.map.unnormalized&&(a.map=p(b))});if(a.deps||a.callback)i.require(a.deps||[],a.callback)},makeShimExports:function(a){return function(){var b;a.init&&(b=a.init.apply(ba,arguments));return b||a.exports&&da(a.exports)}},makeRequire:function(a,e){function j(c,d,m){var n,q;e.enableBuildCallback&&(d&&G(d))&&(d.__requireJsBuild= -!0);if("string"===typeof c){if(G(d))return w(C("requireargs","Invalid require call"),m);if(a&&t(L,c))return L[c](h[a.id]);if(g.get)return g.get(i,c,a,j);n=p(c,a,!1,!0);n=n.id;return!t(r,n)?w(C("notloaded",'Module name "'+n+'" has not been loaded yet for context: '+b+(a?"":". Use require([])"))):r[n]}J();i.nextTick(function(){J();q=s(p(null,a));q.skipMap=e.skipMap;q.init(c,d,m,{enabled:!0});D()});return j}e=e||{};U(j,{isBrowser:z,toUrl:function(b){var d,e=b.lastIndexOf("."),k=b.split("/")[0];if(-1!== -e&&(!("."===k||".."===k)||1e.attachEvent.toString().indexOf("[native code"))&&!Y?(M=!0,e.attachEvent("onreadystatechange",b.onScriptLoad)): -(e.addEventListener("load",b.onScriptLoad,!1),e.addEventListener("error",b.onScriptError,!1)),e.src=d,J=e,D?y.insertBefore(e,D):y.appendChild(e),J=null,e;if(ea)try{importScripts(d),b.completeLoad(c)}catch(m){b.onError(C("importscripts","importScripts failed for "+c+" at "+d,m,[c]))}};z&&!q.skipDataMain&&T(document.getElementsByTagName("script"),function(b){y||(y=b.parentNode);if(I=b.getAttribute("data-main"))return s=I,q.baseUrl||(E=s.split("/"),s=E.pop(),O=E.length?E.join("/")+"/":"./",q.baseUrl= -O),s=s.replace(Q,""),g.jsExtRegExp.test(s)&&(s=I),q.deps=q.deps?q.deps.concat(s):[s],!0});define=function(b,c,d){var e,g;"string"!==typeof b&&(d=c,c=b,b=null);H(c)||(d=c,c=null);!c&&G(d)&&(c=[],d.length&&(d.toString().replace(ka,"").replace(la,function(b,d){c.push(d)}),c=(1===d.length?["require"]:["require","exports","module"]).concat(c)));if(M){if(!(e=J))N&&"interactive"===N.readyState||T(document.getElementsByTagName("script"),function(b){if("interactive"===b.readyState)return N=b}),e=N;e&&(b|| -(b=e.getAttribute("data-requiremodule")),g=F[e.getAttribute("data-requirecontext")])}(g?g.defQueue:R).push([b,c,d])};define.amd={jQuery:!0};g.exec=function(b){return eval(b)};g(q)}})(this); diff --git a/src/TreeMode.js b/src/TreeMode.js index 182eb21..fd50c0b 100644 --- a/src/TreeMode.js +++ b/src/TreeMode.js @@ -75,7 +75,7 @@ export default class TreeMode extends Component { } renderMenu () { - return h('div', {class: 'jsoneditor-menu'}, [ + let items = [ h('button', { class: 'jsoneditor-expand-all', title: 'Expand all objects and arrays', @@ -85,34 +85,44 @@ export default class TreeMode extends Component { class: 'jsoneditor-collapse-all', title: 'Collapse all objects and arrays', onClick: this.handleCollapseAll - }), - - h('div', {class: 'jsoneditor-vertical-menu-separator'}), - - h('div', {style: 'display:inline-block'}, [ - h('button', { - class: 'jsoneditor-undo', - title: 'Undo last action', - disabled: !this.canUndo(), - onClick: this.undo - }), - ]), - h('button', { - class: 'jsoneditor-redo', - title: 'Redo', - disabled: !this.canRedo(), - onClick: this.redo - }), - - h('div', {class: 'jsoneditor-vertical-menu-separator'}), - - this.props.options.modes && h(ModeButton, { - modes: this.props.options.modes, - mode: this.props.mode, - onChangeMode: this.props.onChangeMode, - onError: this.handleError }) - ]) + ] + + if (this.props.mode !== 'view') { + items = items.concat([ + h('div', {class: 'jsoneditor-vertical-menu-separator'}), + + h('div', {style: 'display:inline-block'}, [ + h('button', { + class: 'jsoneditor-undo', + title: 'Undo last action', + disabled: !this.canUndo(), + onClick: this.undo + }), + ]), + h('button', { + class: 'jsoneditor-redo', + title: 'Redo', + disabled: !this.canRedo(), + onClick: this.redo + }) + ]) + } + + if (this.props.options.modes ) { + items = items.concat([ + h('div', {class: 'jsoneditor-vertical-menu-separator'}), + + h(ModeButton, { + modes: this.props.options.modes, + mode: this.props.mode, + onChangeMode: this.props.onChangeMode, + onError: this.handleError + }) + ]) + } + + return h('div', {class: 'jsoneditor-menu'}, items) } /** @private */ diff --git a/src/jsoneditor.less b/src/jsoneditor.less index 94af2d3..53e9e30 100644 --- a/src/jsoneditor.less +++ b/src/jsoneditor.less @@ -10,6 +10,8 @@ display: inline-flex; flex-direction: column; + + line-height: normal; } .jsoneditor-menu { diff --git a/src/typedef.js b/src/typedef.js index 18f0d20..8a943f0 100644 --- a/src/typedef.js +++ b/src/typedef.js @@ -31,13 +31,13 @@ * }} JSONPatchResult * * @typedef {{ - * mode: 'code' | 'form' | 'text' | 'tree' | 'view', - * modes: string[], - * indentation: number | string, - * onChange: function (patch: JSONPatch, revert: JSONPatch), - * onChangeText: function (), - * onChangeMode: function (mode: string, prevMode: string), - * onError: function (err: Error) + * mode?: 'code' | 'form' | 'text' | 'tree' | 'view', + * modes?: string[], + * indentation?: number | string, + * onChange?: function (patch: JSONPatch, revert: JSONPatch), + * onChangeText?: function (), + * onChangeMode?: function (mode: string, prevMode: string), + * onError?: function (err: Error) * }} Options * * @typedef {{