Merge branch 'release/0.7.8'

Author: Dervisevic

.npmignore

@@ -0,0 +1 @@
+    **/.*

CHANGELOG

@@ -1,3 +1,13 @@
+v0.7.8
+------
+* Thanks to @burdiuz for finding a memory leak issue and finding a solution. And thanks to @davidlgj for implementing that solution.
+* Post render event, thanks @mrijken
+* Events documentation, thanks @Dervisevic
+* startEmpty documentation, thanks @davidlj
+* npm and bower updates, thanks @Dervisevic
+* x-schema-form attribute, thanks @davidlgj
+* htmlClass and fieldHtmlClass form options, thanks @davidlgj
+
 v0.7.7
 ------
  * Array ref changes in model updates form, thanks @Sandreu

README.md

@@ -145,12 +145,13 @@ angular.module('myModule', ['schemaForm']);
 
 Add-ons
 ------
-There is currently three add-ons, a date picker, a colorpicker and the wysiwyg html editor tinymce.
+There are a couple of add-ons, a date picker, a colorpicker and two wysiwyg editors. 
 They have their own repos and you can find them here with usage instructions:
 
   * [https://github.com/Textalk/angular-schema-form-datepicker](https://github.com/Textalk/angular-schema-form-datepicker)
   * [https://github.com/Textalk/angular-schema-form-colorpicker](https://github.com/Textalk/angular-schema-form-colorpicker)
   * [https://github.com/Textalk/angular-schema-form-tinymce](https://github.com/Textalk/angular-schema-form-tinymce)
+  * [https://github.com/webcanvas/angular-schema-form-ckeditor](https://github.com/webcanvas/angular-schema-form-ckeditor)
 
 Your can also [create your own add-ons!](docs/extending.md)
 

bower.json

@@ -4,10 +4,13 @@
     "dist/schema-form.min.js",
     "dist/bootstrap-decorator.min.js"
   ],
-  "version": "0.7.7",
+  "version": "0.7.8",
   "authors": [
     "Textalk",
-    "David Jensen <[email protected]>"
+    "David Jensen <[email protected]>",
+    "Cameron Edwards",
+    "Mike Marcacci",
+    "Denis Dervisevic <[email protected]>"
   ],
   "moduleType": [
     "globals"
@@ -23,10 +26,17 @@
   "license": "MIT",
   "ignore": [
     "**/.*",
+    "*.js",
+    "*.json",
     "node_modules",
     "bower_components",
     "test",
-    "coverage"
+    "coverage",
+    "docs",
+    "examples",
+    "gulp",
+    "CHANGELOG",
+    "LICENSE"
   ],
   "dependencies": {
     "angular": ">= 1.2",

dist/bootstrap-decorator.min.js

@@ -481,8 +481,15 @@ angular.module('schemaForm').provider('schemaForm',
       var def;
       for (var i = 0; i < rules.length; i++) {
         def = rules[i](name, schema, options);
+
         //first handler in list that actually returns something is our handler!
         if (def) {
+
+          // Do we have form defaults in the schema under the x-schema-form-attribute?
+          if (def.schema['x-schema-form'] && angular.isObject(def.schema['x-schema-form'])) {
+            def = angular.extend(def, def.schema['x-schema-form']);
+          }
+
           return def;
         }
       }
@@ -508,14 +515,16 @@ angular.module('schemaForm').provider('schemaForm',
     if (schema.minimum) { f.minimum = schema.minimum + (schema.exclusiveMinimum ? 1 : 0); }
     if (schema.maximum) { f.maximum = schema.maximum - (schema.exclusiveMaximum ? 1 : 0); }
 
-    //Non standard attributes
+    // Non standard attributes (DONT USE DEPRECATED)
+    // If you must set stuff like this in the schema use the x-schema-form attribute
     if (schema.validationMessage) { f.validationMessage = schema.validationMessage; }
     if (schema.enumNames) { f.titleMap = canonicalTitleMap(schema.enumNames, schema['enum']); }
     f.schema = schema;
 
     // Ng model options doesn't play nice with undefined, might be defined
     // globally though
     f.ngModelOptions = f.ngModelOptions || {};
+
     return f;
   };
 
@@ -1279,7 +1288,7 @@ angular.module('schemaForm')
         //Since we are dependant on up to three
         //attributes we'll do a common watch
         var lastDigest = {};
-
+        var childScope;
         scope.$watch(function() {
 
           var schema = scope.schema;
@@ -1295,8 +1304,17 @@ angular.module('schemaForm')
             var merged = schemaForm.merge(schema, form, ignore, scope.options);
             var frag = document.createDocumentFragment();
 
+            // Create a new form and destroy the old one.
+            // Not doing keeps old form elements hanging around after
+            // they have been removed from the DOM
+            // https://github.com/Textalk/angular-schema-form/issues/200
+            if (childScope) {
+              childScope.$destroy();
+            }
+            childScope = scope.$new();
+
             //make the form available to decorators
-            scope.schemaForm  = {form:  merged, schema: schema};
+            childScope.schemaForm  = {form:  merged, schema: schema};
 
             //clean all but pre existing html.
             element.children(':not(.schema-form-ignore)').remove();
@@ -1335,7 +1353,7 @@ angular.module('schemaForm')
             element[0].appendChild(frag);
 
             //compile only children
-            $compile(element.children())(scope);
+            $compile(element.children())(childScope);
 
             //ok, now that that is done let's set any defaults
             schemaForm.traverseSchema(schema, function(prop, path) {
@@ -1346,7 +1364,8 @@ angular.module('schemaForm')
                 }
               }
             });
-          }
+          };
+          scope.$emit('sf-render-finished', element);
         });
       }
     };

dist/schema-form.js

@@ -4,6 +4,7 @@ Documentation
 1. [Basic Usage](#basic-usage)
 1. [Handling Submit](#handling-submit)
 1. [Global Options](#global-options)
+1. [Form defaults in schema](#form-defaults-in-schema)
 1. [Form types](#form-types)
 1. [Default form types](#default-form-types)
 1. [Form definitions](#form-definitions)
@@ -25,6 +26,7 @@ Documentation
     1. [array](#array)
     1. [tabarray](#tabarray)
 1. [Post process function](#post-process-function)
+1. [Events](#events)
 1. [Manual field insertion](#manual-field-insertion)
 1. [Extending Schema Form](extending.md)
 
@@ -173,7 +175,29 @@ Ex.
 </div>
 ```
 
+Form defaults in schema
+-----------------------
+Its recommended to split presentation and validation into a form definition and a json schema. But
+if you for some reason can't do this, but *do* have the power to change the schema, you can supply form
+default values within the schema using the custom attribute `x-schema-form`. `x-schema-form` should
+be a form object and acts as form definition defaults for that field.  
 
+Example schema.
+```js
+{
+  "type": "object",
+  "properties": {
+    "comment": {
+      "type": "string",
+      "title": "Comment",
+      "x-schema-form": {
+        "type": "textarea",
+        "placeholder": "Don't hold back"
+      }
+    }
+  }
+}
+```
 
 Form types
 ----------
@@ -314,8 +338,10 @@ General options most field types can handle:
   feedback: false,             // Inline feedback icons
   placeholder: "Input...",     // placeholder on inputs and textarea
   ngModelOptions: { ... },     // Passed along to ng-model-options
-  readonly: true               // Same effect as readOnly in schema. Put on a fieldset or array
+  readonly: true,              // Same effect as readOnly in schema. Put on a fieldset or array
                                // and their items will inherit it.
+  htmlClass: "street foobar",  // CSS Class(es) to be added to the container div
+  fieldHtmlClass: "street"     // CSS Class(es) to be added to field input (or similar)
 }
 ```
 
@@ -836,6 +862,9 @@ need the reordering.
 In the form definition you can refer to properties of an array item by the empty
 bracket notation. In the `key` simply end the name of the array with `[]`
 
+By default the array will start with one *undefined* value so that the user is presented with one a
+form, to supress this the attribute `startEmpty` to `true`
+
 Given the schema:
 ```json
 {
@@ -888,7 +917,7 @@ function FormCtrl($scope) {
 
 Example with sub form, note that you can get rid of the form field the object wrapping the
 subform fields gives you per default by using the `items` option in the
-form definition.
+form definition, also example of `startEmpty`.
 
 ```javascript
 function FormCtrl($scope) {
@@ -926,7 +955,8 @@ function FormCtrl($scope) {
         "subforms[].nick",
         "subforms[].name",
         "subforms[].emails",
-      ]
+      ],
+      startEmpty: true
     }
   ];
 }
@@ -1029,7 +1059,14 @@ angular.module('myModule', ['schemaForm']).config(function(schemaFormProvider){
 });
 ```
 
+Events
+---------------------
+Events are emitted or broadcast at various points in the process of rendering or validating the
+form. Below is a list of these events and how they are propagated.
 
+| Event                | When                   | Type  | Arguments                          |
+|:--------------------:|:----------------------:|:-----:|:----------------------------------:|
+| `sf-render-finished` | After form is rendered | emit  | The sf-schema directives's element |
 
 ### Manual field insertion
 There is a limited feature for controlling manually where a generated field should go so you can

dist/schema-form.min.js

@@ -1,12 +1,34 @@
 {
   "name": "angular-schema-form",
-  "version": "0.7.7",
-  "description": "Create forms from a JSON schema",
+  "version": "0.7.8",
+  "description": "Create complex forms from a JSON schema with angular.",
+  "repository": "Textalk/angular-schema-form",
+  "main": "dist/schema-form.min.js",
   "scripts": {
     "test": "rm -fr coverage && ./node_modules/karma/bin/karma start --single-run --browsers PhantomJS karma.conf.js && find coverage/ -name lcov.info -print0 | xargs -0 cat | ./node_modules/coveralls/bin/coveralls.js"
   },
   "author": "Textalk",
+  "contributors": [
+    "David Jensen <[email protected]> (https://github.com/davidlgj)",
+    "Cameron Edwards (https://github.com/cameronprattedwards)",
+    "Mike Marcacci (https://github.com/mike-marcacci)",
+    "Denis Dervisevic <[email protected]> (https://github.com/Dervisevic)"
+  ],
   "license": "MIT",
+  "dependencies": {
+    "angular": ">= 1.2",
+    "tv4": "~1.0.15",
+    "angular-sanitize": ">= 1.2",
+    "objectpath": "~1.1.0"
+  },
+  "keywords": [
+    "angular",
+    "angularjs",
+    "form",
+    "json",
+    "json-schema",
+    "schema"
+  ],
   "devDependencies": {
     "chai": "^1.9.0",
     "coveralls": "^2.11.0",
@@ -28,5 +50,11 @@
     "sinon": "^1.9.0",
     "sinon-chai": "^2.5.0",
     "streamqueue": "0.0.5"
+  },
+"licenses": [
+  {
+    "type": "MIT",
+    "url": "https://raw.githubusercontent.com/Textalk/angular-schema-form/master/LICENSE"
   }
+]
 }

docs/index.md

@@ -1 +1 @@
-<div class="btn-group" ng-transclude></div>
+<div class="btn-group schema-form-actions {{form.htmlClass}}" ng-transclude></div>

package.json

@@ -1,10 +1,11 @@
-<div class="btn-group">
+<div class="btn-group schema-form-actions {{form.htmlClass}}">
   <input ng-repeat-start="item in form.items"
          type="submit"
-         class="btn {{ item.style || 'btn-primary' }}"
+         class="btn {{ item.style || 'btn-default' }} {{form.fieldHtmlClass}}"
          value="{{item.title}}"
          ng-if="item.type === 'submit'">
-  <button ng-repeat-end class="btn {{ item.style || 'btn-default' }}"
+  <button ng-repeat-end
+          class="btn {{ item.style || 'btn-default' }} {{form.fieldHtmlClass}}"
           type="button"
           ng-disabled="form.readonly"
           ng-if="item.type !== 'submit'"

src/directives/decorators/bootstrap/actions-trcl.html

@@ -1,7 +1,9 @@
-<div sf-array="form" ng-model="$$value$$" ng-model-options="form.ngModelOptions">
+<div sf-array="form" class="schema-form-array {{form.htmlClass}}"
+     ng-model="$$value$$" ng-model-options="form.ngModelOptions">
   <h3 ng-show="form.title && form.notitle !== true">{{ form.title }}</h3>
   <ol class="list-group" ng-model="modelArray" ui-sortable>
-    <li class="list-group-item" ng-repeat="item in modelArray track by $index">
+    <li class="list-group-item {{form.fieldHtmlClass}}"
+        ng-repeat="item in modelArray track by $index">
       <button ng-hide="form.readonly"
               ng-click="deleteFromArray($index)"
               style="position: relative; z-index: 20;"
@@ -12,7 +14,7 @@ <h3 ng-show="form.title && form.notitle !== true">{{ form.title }}</h3>
     </li>
   </ol>
   <div class="clearfix" style="padding: 15px;">
-    <button ng-hide="form.readonly"
+    <button ng-hide="form.readonly || form.add === null"
             ng-click="appendToArray()"
             type="button"
             class="btn {{ form.style.add || 'btn-default' }} pull-right">

src/directives/decorators/bootstrap/actions.html

@@ -1,11 +1,14 @@
-<div class="checkbox" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
+<div class="checkbox schema-form-checkbox {{form.htmlClass}}"
+     ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
   <label>
     <input type="checkbox"
            sf-changed="form"
            ng-disabled="form.readonly"
            ng-model="$$value$$"
            ng-model-options="form.ngModelOptions"
-           schema-validate="form">
+           schema-validate="form"
+           class="{{form.fieldHtmlClass}}"
+           name="{{form.key.slice(-1)[0]}}">
     <span ng-bind-html="form.title"></span>
   </label>
 

src/directives/decorators/bootstrap/array.html

@@ -1,11 +1,15 @@
-<div sf-array="form" ng-model="$$value$$" class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
+<div sf-array="form" ng-model="$$value$$"
+     class="form-group schema-form-checkboxes {{form.htmlClass}}"
+     ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
   <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
   <div class="checkbox" ng-repeat="val in titleMapValues track by $index" >
     <label>
       <input type="checkbox"
              ng-disabled="form.readonly"
              sf-changed="form"
-             ng-model="titleMapValues[$index]">
+             class="{{form.fieldHtmlClass}}"
+             ng-model="titleMapValues[$index]"
+             name="{{form.key.slice(-1)[0]}}">
       <span ng-bind-html="form.titleMap[$index].name"></span>
     </label>
 

src/directives/decorators/bootstrap/checkbox.html

@@ -1,16 +1,18 @@
-<div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess(), 'has-feedback': form.feedback !== false }">
+<div class="form-group schema-form-{{form.type}} {{form.htmlClass}}"
+     ng-class="{'has-error': hasError(), 'has-success': hasSuccess(), 'has-feedback': form.feedback !== false }">
   <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
 
   <input ng-show="form.key"
          type="{{form.type}}"
          step="any"
          sf-changed="form"
          placeholder="{{form.placeholder}}"
-         class="form-control"
+         class="form-control {{form.fieldHtmlClass}}"
          ng-model-options="form.ngModelOptions"
          ng-model="$$value$$"
          ng-disabled="form.readonly"
-         schema-validate="form">
+         schema-validate="form"
+         name="{{form.key.slice(-1)[0]}}">
   <span ng-if="form.feedback !== false"
         class="form-control-feedback"
         ng-class="evalInScope(form.feedback) || {'glyphicon': true, 'glyphicon-ok': hasSuccess(), 'glyphicon-remove': hasError() }"></span>