All working except fieldset

Author: mike-marcacci

dist/bootstrap-datepicker.min.js

@@ -61,7 +61,7 @@ <h3>Schema</h3>
 <script type="text/javascript" src="http://cdn.jsdelivr.net/g/jquery.ui@1.10"></script>
 <script type="text/javascript" src="../bower_components/tv4/tv4.js"></script>
 <script type="text/javascript" src="../bower_components/ace-builds/src-min-noconflict/ace.js"></script>
-<script type="text/javascript" src="../bower_components/angular/angular.min.js"></script>
+<script type="text/javascript" src="../bower_components/angular/angular.js"></script>
 <script type="text/javascript" src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
 <script type="text/javascript" src="../bower_components/angular-ui-sortable/sortable.js"></script>
 <script type="text/javascript" src="../bower_components/angular-ui-ace/ui-ace.js"></script>
@@ -78,6 +78,7 @@ <h3>Schema</h3>
 function TestCtrl($scope,$http){
 
   $scope.tests = [
+    { name: "Complex Key Support", data: 'data/keys.json' },
     { name: "Simple", data: 'data/simple.json' },
     { name: "Array", data: 'data/array.json' },
     { name: "Tab Array", data: 'data/tabarray.json' },

dist/schema-form.min.js

@@ -0,0 +1,60 @@
+{
+  "schema": {
+    "type": "object",
+    "title": "Complex Key Support",
+    "properties": {
+      "a[\"b\"].c": {
+        "type": "text",
+        "title": "Paths do not overflow their keys."
+      },
+      "simple": {
+        "type": "object",
+        "properties": {
+          "prøp": {
+            "title": "Property",
+            "type": "string"
+          }
+        }
+      },
+      "array-key": {
+        "type": "array",
+        "items": {
+          "type": "object",
+          "properties": {
+            "a'rr[\"l":  {
+              "title": "Control Characters",
+              "type": "string"
+            },
+            "˙∆∂∞˚¬":  {
+              "type": "string"
+            }
+          },
+          "required": [
+            "a'rr[\"l",
+            "˙∆∂∞˚¬"
+          ]
+        }
+      }
+    }
+  },
+  "form": ["*"],
+  "form1": [
+    "['a[\"b\"].c']",
+    {
+      "key": "array-key",
+      "items": [
+        "[array-key][]['a'rr[\"l']",
+        {
+          "key": "[array-key][][˙∆∂∞˚¬]",
+          "title": "Unicode Characters"
+        }
+      ]
+    },
+    {
+      "key": "simple",
+      "items": [
+        "simple.prøp"
+      ]
+    }
+  ]
+}

examples/bootstrap-example.html

@@ -64,7 +64,7 @@ gulp.task('minify',function(){
     './src/directives/*.js'
   ])
   .pipe(concat('schema-form.min.js'))
-  .pipe(uglify())
+  // .pipe(uglify())
   .pipe(gulp.dest('./dist/'));
 });
 

examples/data/keys.json

@@ -7,7 +7,7 @@ function(sfSelect, schemaForm) {
   var setIndex = function(index) {
     return function(form) {
       if (form.key) {
-        form.key = form.key.replace('[]','['+index+']');
+        form.key[form.key.indexOf('')] = index;
       }
     };
   };

gulpfile.js

@@ -7,7 +7,7 @@ function(schemaFormProvider,  schemaFormDecoratorsProvider){
       var f = schemaFormProvider.stdFormObj(schema,options);
       f.key  = options.path;
       f.type = 'datepicker';
-      options.lookup[options.path] = f;
+      options.lookup[ObjectPath.stringify(options.path)] = f;
       return f;
     }
   };

src/directives/array.js

@@ -12,3 +12,96 @@ try {
 } catch (e) {}
 
 angular.module('schemaForm',deps);
+
+
+'use strict';
+
+;!function(undefined) {
+
+	var ObjectPath = {
+		parse: function(str){
+			if(typeof str !== 'string'){
+				console.log(str)
+				throw new TypeError('ObjectPath.parse must be passed a string');
+			}
+
+			var i = 0;
+			var parts = [];
+			var d, b, q, c;
+			while (i < str.length){
+				d = str.indexOf('.', i);
+				b = str.indexOf('[', i);
+
+				// we've reached the end
+				if (d === -1 && b === -1){
+					parts.push(str.slice(i, str.length));
+					i = str.length;
+				}
+
+				// dots
+				else if (b === -1 || (d !== -1 && d < b)) {
+					parts.push(str.slice(i, d));
+					i = d + 1;
+				}
+
+				// brackets
+				else {
+					if (b > i){
+						parts.push(str.slice(i, b));
+						i = b;
+					}
+					q = str.slice(b+1, b+2);
+					if (q !== '"' && q !=='\'') {
+						c = str.indexOf(']', b);
+						if (c === -1) c = str.length;
+						parts.push(str.slice(i + 1, c));
+						i = (str.slice(c + 1, c + 2) === '.') ? c + 2 : c + 1;
+					} else {
+						c = str.indexOf(q+']', b);
+						if (c === -1) c = str.length;
+						while (str.slice(c - 1, c) === '\\' && b < str.length){
+							b++;
+							c = str.indexOf(q+']', b);
+						}
+						parts.push(str.slice(i + 2, c).replace(new RegExp('\\'+q,'g'), q));
+						i = (str.slice(c + 2, c + 3) === '.') ? c + 3 : c + 2;
+					}
+				}
+			}
+			return parts;
+		},
+
+		// root === true : auto calculate root; must be dot-notation friendly
+		// root String : the string to use as root
+		stringify: function(arr, quote){
+
+			if(Array.isArray(arr) !== true)
+				arr = [arr.toString()];
+
+			quote = quote === '"' ? '"' : '\'';
+
+			return arr.slice().map(function(n){ return '[' + quote + (n.toString()).replace(new RegExp(quote, 'g'), '\\' + quote) + quote + ']'; }).join('');
+		},
+
+		normalize: function(str){
+			return this.stringify(this.parse(str));
+		}
+	};
+
+	// AMD
+	if (typeof define === 'function' && define.amd) {
+		define(function() {
+			return ObjectPath;
+		});
+	}
+
+	// CommonJS
+	else if (typeof exports === 'object') {
+		exports.ObjectPath = ObjectPath;
+	}
+
+	// Browser global.
+	else {
+		window.ObjectPath = ObjectPath;
+	}
+}();

src/directives/decorators/bootstrap/datepicker/bootstrap-datepicker.js

@@ -19,15 +19,14 @@
  *                          or undefined if there is none.
  */
 angular.module('schemaForm').factory('sfSelect', [function () {
-  var re    = /\[(\d+)\]/g;
   var numRe = /^\d+$/;
 
   return function(projection, obj, valueToSet) {
     if (!obj) {
       obj = this;
     }
     //Support [] array syntax
-    var parts = projection.replace(re, '.$1').split('.');
+    var parts = typeof projection === 'string' ? ObjectPath.parse(projection) : projection;
 
     if (typeof valueToSet !== 'undefined' && parts.length === 1) {
       //special case, just setting one variable
@@ -45,7 +44,7 @@ angular.module('schemaForm').factory('sfSelect', [function () {
     for (var i = 1; i < parts.length; i++) {
       // Special case: We allow JSON Form syntax for arrays using empty brackets
       // These will of course not work here so we exit if they are found.
-      if (parts[i] === '[]') {
+      if (parts[i] === '') {
         return undefined;
       }
       if (typeof valueToSet !== 'undefined') {

src/module.js

@@ -51,7 +51,8 @@ angular.module('schemaForm').provider('schemaFormDecorators',['$compileProvider'
                 //for fieldsets to recurse properly.
                 var url = templateUrl(name,form);
                 $http.get(url,{ cache: $templateCache }).then(function(res){
-                  var template = res.data.replace(/\$\$value\$\$/g,'model.'+(form.key || ""));
+                  var key = form.key ? ObjectPath.stringify(form.key).replace(/"/g, '"') : '';
+                  var template = res.data.replace(/\$\$value\$\$/g,'model'+key);
                   $compile(template)(scope,function(clone){
                     element.replaceWith(clone);
                   });