From b7afbf1eed3d4a93b0d5c180fd73bf3f29e500fb Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bernus Date: Wed, 9 Aug 2017 15:48:40 +0200 Subject: [PATCH 1/4] Local demo --- README.md | 4 ++++ demo/index.html | 55 +++++++++++++++++++++++++++++++++++++++++++++++++ package.json | 7 ++++++- 3 files changed, 65 insertions(+), 1 deletion(-) create mode 100644 demo/index.html diff --git a/README.md b/README.md index a506643..8a2599c 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,10 @@ Finally, add the directive to your html: http://jsfiddle.net/angulartools/sd3at5ek/ +## Local Demo + +Run `npm install` to install the local server, then `npm start` to start it. Then visit `http://http://localhost:1112/demo/` + ### Sample code ```javascript diff --git a/demo/index.html b/demo/index.html new file mode 100644 index 0000000..e153ef7 --- /dev/null +++ b/demo/index.html @@ -0,0 +1,55 @@ + + + + + + + ng-jsoneditor demo + + + + + + + +
+ + + + + +
{{pretty(obj.data)}}
+ + + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 6d46229..35baf0d 100644 --- a/package.json +++ b/package.json @@ -9,8 +9,13 @@ "peerDependencies": { "jsoneditor": "^5.5.6" }, + "scripts": { + "start": "http-server -a localhost -p 1112", + }, "description": "Angular version of the insanely cool jsoneditor", - "devDependencies": {}, + "devDependencies": { + "http-server": "~0.8.0", + }, "directories": {}, "homepage": "https://github.com/angular-tools/ng-jsoneditor", "keywords": [ From 668895d3ae9688308096edaef4bbf53dfb20bf93 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bernus Date: Wed, 9 Aug 2017 15:50:52 +0200 Subject: [PATCH 2/4] Minification process --- README.md | 4 ++++ package.json | 2 ++ 2 files changed, 6 insertions(+) diff --git a/README.md b/README.md index 8a2599c..cc9e565 100644 --- a/README.md +++ b/README.md @@ -103,6 +103,10 @@ myAppModule.controller('MyController', [ '$scope', function($scope) { }]); ``` +### Development + +To minify the source file, run `npm install` to install the *uglify-js* module, then run `npm run minify` + ### Contributors - Sanchit Bhatnagar diff --git a/package.json b/package.json index 35baf0d..490cb7f 100644 --- a/package.json +++ b/package.json @@ -11,10 +11,12 @@ }, "scripts": { "start": "http-server -a localhost -p 1112", + "minify": "uglifyjs ng-jsoneditor.js -o ng-jsoneditor.min.js" }, "description": "Angular version of the insanely cool jsoneditor", "devDependencies": { "http-server": "~0.8.0", + "uglify-js": "^3.0.27" }, "directories": {}, "homepage": "https://github.com/angular-tools/ng-jsoneditor", From 74927795a48f9701df0faf0042bbfd5a86f5dfc8 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bernus Date: Wed, 9 Aug 2017 15:51:07 +0200 Subject: [PATCH 3/4] change event to onChange --- ng-jsoneditor.js | 2 +- ng-jsoneditor.min.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ng-jsoneditor.js b/ng-jsoneditor.js index b11f9c7..aa5b48a 100644 --- a/ng-jsoneditor.js +++ b/ng-jsoneditor.js @@ -21,7 +21,7 @@ function _createEditor(options) { var settings = angular.extend({}, defaults, options); var theOptions = angular.extend({}, settings, { - change: function () { + onChange: function () { if (typeof debounceTo !== 'undefined') { $timeout.cancel(debounceTo); } diff --git a/ng-jsoneditor.min.js b/ng-jsoneditor.min.js index 68c29d4..1b5fcc0 100644 --- a/ng-jsoneditor.min.js +++ b/ng-jsoneditor.min.js @@ -1 +1 @@ -(function(){var module=angular.module("ng.jsoneditor",[]);module.constant("ngJsoneditorConfig",{});module.directive("ngJsoneditor",["ngJsoneditorConfig","$timeout",function(ngJsoneditorConfig,$timeout){var defaults=ngJsoneditorConfig||{};return{restrict:"A",require:"ngModel",scope:{options:"=",ngJsoneditor:"=",preferText:"="},link:function($scope,element,attrs,ngModel){var debounceTo,debounceFrom;var editor;var internalTrigger=false;if(!angular.isDefined(window.JSONEditor)){throw new Error("Please add the jsoneditor.js script first!")}function _createEditor(options){var settings=angular.extend({},defaults,options);var theOptions=angular.extend({},settings,{change:function(){if(typeof debounceTo!=="undefined"){$timeout.cancel(debounceTo)}debounceTo=$timeout(function(){if(editor){internalTrigger=true;var error=undefined;try{ngModel.$setViewValue($scope.preferText===true?editor.getText():editor.get());}catch(err){error=err;}if(settings&&settings.hasOwnProperty("change")){settings.change(error);}}},settings.timeout||100);}});element.html("");var instance=new JSONEditor(element[0],theOptions);if($scope.ngJsoneditor instanceof Function){$timeout(function(){$scope.ngJsoneditor(instance)})}return instance}$scope.$watch("options",function(newValue,oldValue){for(var k in newValue){if(newValue.hasOwnProperty(k)){var v=newValue[k];if(newValue[k]!==oldValue[k]){if(k==="mode"){editor.setMode(v)}else if(k==="name"){editor.setName(v)}else{editor=_createEditor(newValue);$scope.updateJsonEditor();return}}}}},true);$scope.$on("$destroy",function(){});$scope.updateJsonEditor=function(newValue){if(internalTrigger){internalTrigger=false;return;}if(typeof debounceFrom!=="undefined"){$timeout.cancel(debounceFrom)}debounceFrom=$timeout(function(){if($scope.preferText===true&&!angular.isObject(ngModel.$viewValue)){editor.setText(ngModel.$viewValue||"{}")}else{editor.set(ngModel.$viewValue||{})}},$scope.options.timeout||100)};editor=_createEditor($scope.options);if($scope.options.hasOwnProperty("expanded")){$timeout($scope.options.expanded?function(){editor.expandAll()}:function(){editor.collapseAll()},($scope.options.timeout||100)+100)}ngModel.$render=$scope.updateJsonEditor;$scope.$watch(function(){return ngModel.$modelValue},$scope.updateJsonEditor,true)}}}])})(); +(function(){var module=angular.module("ng.jsoneditor",[]);module.constant("ngJsoneditorConfig",{});module.directive("ngJsoneditor",["ngJsoneditorConfig","$timeout",function(ngJsoneditorConfig,$timeout){var defaults=ngJsoneditorConfig||{};return{restrict:"A",require:"ngModel",scope:{options:"=",ngJsoneditor:"=",preferText:"="},link:function($scope,element,attrs,ngModel){var debounceTo,debounceFrom;var editor;var internalTrigger=false;if(!angular.isDefined(window.JSONEditor)){throw new Error("Please add the jsoneditor.js script first!")}function _createEditor(options){var settings=angular.extend({},defaults,options);var theOptions=angular.extend({},settings,{onChange:function(){if(typeof debounceTo!=="undefined"){$timeout.cancel(debounceTo)}debounceTo=$timeout(function(){if(editor){internalTrigger=true;var error=undefined;try{ngModel.$setViewValue($scope.preferText===true?editor.getText():editor.get())}catch(err){error=err}if(settings&&settings.hasOwnProperty("change")){settings.change(error)}}},settings.timeout||100)}});element.html("");var instance=new JSONEditor(element[0],theOptions);if($scope.ngJsoneditor instanceof Function){$timeout(function(){$scope.ngJsoneditor(instance)})}return instance}$scope.$watch("options",function(newValue,oldValue){for(var k in newValue){if(newValue.hasOwnProperty(k)){var v=newValue[k];if(newValue[k]!==oldValue[k]){if(k==="mode"){editor.setMode(v)}else if(k==="name"){editor.setName(v)}else{editor=_createEditor(newValue);$scope.updateJsonEditor();return}}}}},true);$scope.$on("$destroy",function(){});$scope.updateJsonEditor=function(newValue){if(internalTrigger){internalTrigger=false;return}if(typeof debounceFrom!=="undefined"){$timeout.cancel(debounceFrom)}debounceFrom=$timeout(function(){if($scope.preferText===true&&!angular.isObject(ngModel.$viewValue)){editor.setText(ngModel.$viewValue||"{}")}else{editor.set(ngModel.$viewValue||{})}},$scope.options.timeout||100)};editor=_createEditor($scope.options);if($scope.options.hasOwnProperty("expanded")){$timeout($scope.options.expanded?function(){editor.expandAll()}:function(){editor.collapseAll()},($scope.options.timeout||100)+100)}ngModel.$render=$scope.updateJsonEditor;$scope.$watch(function(){return ngModel.$modelValue},$scope.updateJsonEditor,true)}}}])})(); \ No newline at end of file From 3ec1d4ea9418183882f9da10a600d1421ad54953 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bernus Date: Wed, 9 Aug 2017 15:53:10 +0200 Subject: [PATCH 4/4] Readme fix --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index cc9e565..0428869 100644 --- a/README.md +++ b/README.md @@ -49,14 +49,14 @@ http://jsfiddle.net/angulartools/sd3at5ek/ ## Local Demo -Run `npm install` to install the local server, then `npm start` to start it. Then visit `http://http://localhost:1112/demo/` +Run `npm install` to install the local server, then `npm start` to start it. Then visit `http://localhost:1112/demo/` ### Sample code ```javascript myAppModule.controller('MyController', [ '$scope', function($scope) { $scope.obj = {data: json, options: { mode: 'tree' }}; - + $scope.btnClick = function() { $scope.obj.options.mode = 'code'; //should switch you to code view }