|
28 | 28 | .ace_editor { font-size: 20px !important;} |
29 | 29 | .form { height: 400px; } |
30 | 30 | .schema { height: 800px; } |
| 31 | + [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { |
| 32 | + display: none !important; |
| 33 | + } |
31 | 34 | </style> |
32 | 35 | </head> |
33 | | -<body ng-app="test" ng-controller="TestCtrl"> |
| 36 | +<body ng-app="test" ng-controller="TestCtrl" ng-cloak> |
34 | 37 |
|
35 | 38 | <div class="col-md-12"> |
36 | 39 | <h1>Schema Form Example</h1> |
| 40 | + <div class="row"> |
| 41 | + <div class="col-md-4"><p ng-if="error" class="alert alert-danger ">{{error}}</p></div> |
| 42 | + </div> |
37 | 43 | <div class="row"> |
38 | 44 | <div class="col-sm-4"> |
39 | | - <button ng-click="loadGist();">Save</button> |
40 | | - <button ng-click="saveToGist();">Save as new</button> |
41 | | - |
| 45 | + <button ng-click="save();">Save</button> |
| 46 | + <br> |
| 47 | + <p>{{link}}</p> |
42 | 48 | </div> |
43 | 49 | </div> |
44 | 50 | <div class="row"> |
@@ -125,12 +131,16 @@ <h3>Schema</h3> |
125 | 131 | // Load data from gist. |
126 | 132 | if ($location.path().length > 4) { |
127 | 133 | var gistId = $location.path().replace('/',''); |
128 | | - $http.get('https://api.github.com/gists/' + gistId).then(function(res) { |
129 | | - var data = JSON.parse(res.data.files['schemaform.json'].content); |
130 | | - setNewData(data); |
| 134 | + $scope.loading = true; |
| 135 | + $http.get('https://api.github.com/gists/' + gistId).success(function(res) { |
| 136 | + $scope.loading = false; |
| 137 | + //var data = JSON.parse(res.files['schemaform.json'].content); |
| 138 | + $scope.schemaJson = res.files['schema.json'].content; |
| 139 | + $scope.formJson = res.files['form.json'].content; |
| 140 | + $scope.modelData = res.files['model.json'].content; // Knasig |
| 141 | + }).error(function(res) { |
| 142 | + $scope.error = 'Failed to load gist.'; |
131 | 143 | }); |
132 | | - |
133 | | - // ERROR HANDLING. |
134 | 144 | } |
135 | 145 |
|
136 | 146 | $scope.selectedTest = $scope.tests[0]; |
@@ -194,13 +204,32 @@ <h3>Schema</h3> |
194 | 204 | }; |
195 | 205 |
|
196 | 206 | $scope.save = function() { |
197 | | - // $http.get(val.data).then(function(res){ |
198 | | - // $scope.schema = res.data.schema; |
199 | | - // $scope.form = res.data.form; |
200 | | - // $scope.schemaJson = JSON.stringify($scope.schema,undefined,2); |
201 | | - // $scope.formJson = JSON.stringify($scope.form,undefined,2); |
202 | | - // $scope.modelData = res.data.model || {}; |
203 | | - // }); |
| 207 | + // To be able to save invalid json and point out errors, we |
| 208 | + // don't save the schema/form but rather the ones in the input. |
| 209 | + |
| 210 | + var gist = { |
| 211 | + "description": "A saved configuration for a schema form example, http://textalk.github.io/angular-schema-form/examples/bootstrap-example.html", |
| 212 | + "public": true, |
| 213 | + "files": { |
| 214 | + "schema.json": { |
| 215 | + "content": $scope.schemaJson |
| 216 | + }, |
| 217 | + "form.json": { |
| 218 | + "content": $scope.formJson |
| 219 | + }, |
| 220 | + "model.json": { |
| 221 | + "content": JSON.stringify($scope.modelData, undefined, 2) |
| 222 | + } |
| 223 | + } |
| 224 | + }; |
| 225 | + |
| 226 | + $http.post('https://api.github.com/gists', gist).success(function(data) { |
| 227 | + $scope.savedGistData = data; |
| 228 | + $location.path('/' + data.id); |
| 229 | + $scope.link = data.html_url; |
| 230 | + }).error(function(data) { |
| 231 | + $scope.error = 'Failed to save gist.' |
| 232 | + }); |
204 | 233 | } |
205 | 234 |
|
206 | 235 | $scope.submitForm = function(form, model) { |
|
0 commit comments