Merge pull request #581 from ivanp81/master

Add JSONForms example
2016-08-08 22:13:14 -06:00 · 2016-08-08 22:13:14 -06:00 · f73bee24e1
parent 5975a654fd cc9370e8ff
commit f73bee24e1
5 changed files with 102 additions and 0 deletions
--- a/json/src/main/webapp/index.html
+++ b/json/src/main/webapp/index.html
@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html ng-app="jsonforms-intro">
+<head>
+    <title>Introduction to JSONForms</title>
+    <script src="node_modules/jsonforms/dist/jsonforms.js" type="text/javascript"></script>
+    <script src="js/app.js" type="text/javascript"></script>
+    <script src="js/schema.js" type="text/javascript"></script>
+    <script src="js/ui-schema.js" type="text/javascript"></script>
+</head>
+<body>
+    <div class="container" ng-controller="MyController">
+        <div class="row" id="demo">
+            <div class="col-sm-12">
+                <div class="panel-primary panel-default">
+                    <div class="panel-heading">
+                        <h3 class="panel-title"><strong>Introduction to JSONForms</strong></h3>
+                    </div>
+                    <div class="panel-body jsf">
+                    	Bound data: {{data}}
+                        <jsonforms schema="schema" ui-schema="uiSchema" data="data"/>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
--- a/json/src/main/webapp/js/app.js
+++ b/json/src/main/webapp/js/app.js
@ -0,0 +1,15 @@
+'use strict';
+
+var app = angular.module('jsonforms-intro', ['jsonforms']);
+app.controller('MyController', ['$scope', 'Schema', 'UISchema', function($scope, Schema, UISchema) {
+
+    $scope.schema = Schema;
+
+    $scope.uiSchema = UISchema;
+
+    $scope.data = {
+        "id": 1,
+        "name": "Lampshade",
+        "price": 1.85
+    };
+}]);
--- a/json/src/main/webapp/js/schema.js
+++ b/json/src/main/webapp/js/schema.js
@ -0,0 +1,27 @@
+'use strict';
+
+var app = angular.module('jsonforms-intro');
+app.value('Schema',
+	{
+	    "$schema": "http://json-schema.org/draft-04/schema#",
+	    "title": "Product",
+	    "description": "A product from the catalog",
+	    "type": "object",
+	    "properties": {
+	        "id": {
+	            "description": "The unique identifier for a product",
+	            "type": "integer"
+	        },
+	        "name": {
+	            "description": "Name of the product",
+	            "type": "string"
+	        },
+	        "price": {
+	            "type": "number",
+	            "minimum": 0,
+	            "exclusiveMinimum": true
+	        }
+	    },
+	    "required": ["id", "name", "price"]
+	}
+);
--- a/json/src/main/webapp/js/ui-schema.js
+++ b/json/src/main/webapp/js/ui-schema.js
@ -0,0 +1,22 @@
+'use strict';
+
+var app = angular.module('jsonforms-intro');
+app.value('UISchema',
+    {
+        "type": "HorizontalLayout",
+        "elements": [
+            {
+                "type": "Control",
+                "scope": { "$ref": "#/properties/id" }
+            },
+            {
+                "type": "Control",
+                "scope": { "$ref": "#/properties/name" }
+            },
+            {
+                "type": "Control",
+                "scope": { "$ref": "#/properties/price" }
+            },
+        ]
+    }
+);
--- a/json/src/main/webapp/package.json
+++ b/json/src/main/webapp/package.json
@ -0,0 +1,11 @@
+{
+    "name": "jsonforms-intro",
+    "description": "Introduction to JSONForms",
+    "version": "0.0.1",
+    "license": "MIT",
+    "dependencies": {
+         "typings": "0.6.5",
+         "jsonforms": "0.0.19",
+         "bootstrap": "3.3.6"
+     }
+}