Add in test GRID template

Author: iamanthropic

examples/data/grid.json

@@ -3,10 +3,33 @@
     "type": "object",
     "title": "Comment",
     "properties": {
-      "name":  {
+      "firstname":  {
         "title": "Name",
         "type": "string"
       },
+      "lastname":  {
+        "title": "Surname",
+        "type": "string"
+      },
+      "address_line_1":  {
+        "title": "Address",
+        "type": "string"
+      },
+      "address_line_2":  {
+        "type": "string"
+      },
+      "city":  {
+        "type": "string"
+      },
+      "state":  {
+        "type": "string",
+        "enum": ["VIC","NSW","QLD","WA","SA","TAS","ACT","NT"]
+      },
+      "postcode":  {
+        "type": "integer",
+        "minimum":1000,
+        "maximum":9999
+      },
       "email":  {
         "title": "Email",
         "type": "string",
@@ -25,20 +48,64 @@
   "form": [
     {
       "type": "help",
-      "helpvalue": "<div class=\"alert alert-info\">Grid it up with bootstrap</div>"
+      "helpvalue": "<div class=\"alert alert-info\">Grid it up with FLEX</div>"
     },
     {
       "type": "section",
-      "htmlClass": "row",
+      "grid": {
+        "layout": "column"
+      },
       "items": [
         {
           "type": "section",
-          "htmlClass": "col-xs-6",
-          "items": ["name"]
+          "grid": {
+            "layout": "row"
+          },
+          "items": [
+            {
+              "key": "firstname",
+              "grid": { "flex": 50, "layout": "column" }
+            },
+            {
+              "key": "lastname",
+              "grid": { "flex": 50, "layout": "column" }
+            }
+          ]
+        },
+        {
+          "key": "address_line_1",
+          "grid": { "flex": 100, "layout": "row" }
+        },
+        {
+          "key": "address_line_2",
+          "grid": { "flex": 100, "layout": "row" }
+        },
+        {
+          "type": "section",
+          "grid": {
+            "layout": "row"
+          },
+          "items": [
+            {
+              "key": "city",
+              "grid": { "flex": 50, "layout": "column" }
+            },
+            {
+              "key": "state",
+              "type":"select",
+              "grid": { "state": 25, "layout": "column" }
+            },
+            {
+              "key": "postcode",
+              "grid": { "postcode": 25, "layout": "column" }
+            }
+          ]
         },
         {
           "type": "section",
-          "htmlClass": "col-xs-6",
+          "grid": {
+            "layout": "row"
+          },
           "items": ["email"]
         }
       ]
@@ -50,7 +117,7 @@
     },
     {
       "type": "submit",
-	  "style": "btn-info",
+    "style": "btn-info",
       "title": "OK"
     }
   ]

examples/material-example.html

@@ -188,12 +188,12 @@ <h3>Schema</h3>
 app.controller('TestCtrl', function($scope, $http, $location, $timeout, $q) {
 
   $scope.tests = [
-    { name: "TitleMap Examples", data: 'data/titlemaps.json' },
     { name: "Material Flex Grid", data: 'data/grid.json' },
     { name: "Simple", data: 'data/simple.json' },
     { name: "Basic JSON Schema Type", data: 'data/types.json' },
     { name: "Autocomplete", data: 'data/autocomplete.json' },
     { name: "Switch", data: 'data/switch.json'},
+    { name: "TitleMap Examples", data: 'data/titlemaps.json' },
     /*{ name: "Complex Key Support", data: 'data/complex-keys.json' },*/
     /*{ name: "Array", data: 'data/array.json' },*/
     /*{ name: "Tab Array", data: 'data/tabarray.json' },*/

src/material-decorator.js

@@ -131,11 +131,6 @@
             // TODO enable filter to allow processing results
             // args.form.optionSource = link.href.replace(related, '$1$1 model.$2 | _externalOptionUri $3$3');
             args.form.optionSource = link.href.replace(related, '$1$1 model.$2 $3$3');
-            // args.form.watchList = [];
-            // matched = args.form.optionSource.match(source);
-            // while ((matched = source.exec(args.form.optionSource)) !== null) {
-            //   args.form.watchList.push(matched);
-            // };
           };
         };
 
@@ -144,19 +139,6 @@
       else {
         args.form.selectOptions = sfOptionsProcessor(args.form);
       };
-
-      // TODO implement $watch for remote data loading after the page loads
-      function getOptionsHandler(form, evalExpr) {
-        if (form.optionData) {
-          return evalExpr(form.optionData);
-        };
-
-        if (form.selectOptions) {
-          return form.selectOptions;
-        };
-
-        return [];
-      };
     };
 
     function mdDatepickerBuilder(args) {
@@ -207,6 +189,18 @@
     };
   };
 
+  function getOptionsHandler(form, evalExpr) {
+    if (form.optionData) {
+      return evalExpr(form.optionData);
+    };
+
+    if (form.selectOptions) {
+      return form.selectOptions;
+    };
+
+    return [];
+  };
+
   function sfOptionsProcessor(data) {
     var enumTitleMap = [];