Merge pull request #116 from jeton/jeton_interpolation_provider

Jeton's interpolation provider

Author: davidlgj

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 coverage
 bower_components
+.idea

dist/bootstrap-decorator.min.js

@@ -1177,6 +1177,27 @@ angular.module('schemaForm').directive('sfChanged', function() {
   };
 });
 
+/**
+ *  Sets attributes 'type' and 'placeholder' to input elements
+ */
+angular.module('schemaForm').directive('sfDefaultInput', [function () {
+
+    return {
+        restrict: 'A',
+        scope: {
+            sfType: '=',
+            sfPlaceholder: '='
+        },
+        link: function (scope, element) {
+
+            element.attr('type', scope.sfType);
+            element.attr('placeholder', scope.sfPlaceholder);
+
+        }
+
+    };
+
+}]);
 /*
 FIXME: real documentation
 <form sf-form="form"  sf-schema="schema" sf-decorator="foobar"></form>

dist/schema-form.js

@@ -1,11 +1,11 @@
 <div class="btn-group">
   <input ng-repeat-start="item in form.items"
          type="submit"
-         class="btn {{ item.style || 'btn-primary' }}"
-         value="{{item.title}}"
+         class="btn" ng-class="item.style || 'btn-primary'"
+         ng-value="item.title"
          ng-if="item.type === 'submit'">
-  <button ng-repeat-end class="btn {{ item.style || 'btn-default' }}"
+  <button ng-repeat-end class="btn" ng-class="item.style || 'btn-default'"
           type="button"
           ng-if="item.type !== 'submit'"
-          ng-click="buttonClick($event,item)">{{item.title}}</button>
+          ng-click="buttonClick($event,item)" ng-bind="item.title"></button>
 </div>

dist/schema-form.min.js

@@ -1,5 +1,5 @@
 <div sf-array="form" ng-model="$$value$$" ng-model-options="form.ngModelOptions">
-  <h3 ng-show="form.title && form.notitle !== true">{{ form.title }}</h3>
+  <h3 ng-show="form.title && form.notitle !== true" ng-bind="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">
       <button ng-click="deleteFromArray($index)"
@@ -13,9 +13,9 @@ <h3 ng-show="form.title && form.notitle !== true">{{ form.title }}</h3>
   <div class="clearfix" style="padding: 15px;">
     <button ng-click="appendToArray()"
             type="button"
-            class="btn {{ form.style.add || 'btn-default' }} pull-right">
+            class="btn pull-right" ng-class="form.style.add || 'btn-default'">
       <i class="glyphicon glyphicon-plus"></i>
-      {{ form.add || 'Add'}}
+      <span ng-bind="form.add || 'Add'"></span>
     </button>
   </div>
   <div class="help-block"

src/directives/decorators/bootstrap/actions.html

@@ -46,7 +46,7 @@ angular.module('schemaForm').config(['schemaFormDecoratorsProvider', function(de
     input: base + 'default.html',
     radios: base + 'radios.html',
     'radios-inline': base + 'radios-inline.html',
-    radiobuttons: base + 'radio-buttons.html',
+    radiobuttons: base + 'radio-buttons.html'
   });
 
 }]).directive('sfFieldset', function() {

src/directives/decorators/bootstrap/array.html

@@ -1,5 +1,5 @@
 <div sf-array="form" ng-model="$$value$$" class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
-  <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
+  <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
   <div class="checkbox" ng-repeat="val in titleMapValues track by $index" >
     <label>
       <input type="checkbox"

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

@@ -1,10 +1,11 @@
 <div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess(), 'has-feedback': form.feedback !== false }">
-  <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
+  <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
 
   <input ng-show="form.key"
-         type="{{form.type}}"
+         sf-default-input
+         sf-type="form.type"
+         sf-placeholder="form.placeholder"
          sf-changed="form"
-         placeholder="{{form.placeholder}}"
          class="form-control"
          ng-model-options="form.ngModelOptions"
          ng-model="$$value$$"

src/directives/decorators/bootstrap/checkboxes.html

@@ -1,5 +1,5 @@
 <fieldset ng-disabled="form.readonly">
-  <legend ng-show="form.title">{{ form.title }}</legend>
+  <legend ng-show="form.title" ng-bind="form.title"></legend>
   <div class="help-block" ng-show="form.description" ng-bind-html="form.description"></div>
   <div ng-transclude></div>
 </fieldset>

src/directives/decorators/bootstrap/default.html

@@ -1,5 +1,5 @@
 <fieldset ng-disabled="form.readonly">
-  <legend ng-show="form.title">{{ form.title }}</legend>
+  <legend ng-show="form.title" ng-bind="form.title"></legend>
   <div class="help-block" ng-show="form.description" ng-bind-html="form.description"></div>
   <sf-decorator ng-repeat="item in form.items" form="item"></sf-decorator>
 </fieldset>

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

@@ -1,9 +1,9 @@
 <div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
   <div>
-    <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
+    <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
   </div>
   <div class="btn-group">
-    <label class="btn {{ (item.value === $$value$$) ? form.style.selected || 'btn-primary' : form.style.unselected || 'btn-primary'; }}"
+    <label class="btn" ng-class="(item.value === $$value$$) ? form.style.selected || 'btn-primary' : form.style.unselected || 'btn-primary'"
            ng-class="{ active: item.value === $$value$$ }"
            ng-repeat="item in form.titleMap">
       <input type="radio"

src/directives/decorators/bootstrap/fieldset.html

@@ -1,5 +1,5 @@
 <div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
-  <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
+  <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
   <div>
       <label class="radio-inline" ng-repeat="item in form.titleMap" >
       <input type="radio"

src/directives/decorators/bootstrap/radio-buttons.html

@@ -1,5 +1,5 @@
 <div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
-  <label class="control-label" ng-show="showTitle()">{{form.title}}</label>
+  <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
   <div class="radio" ng-repeat="item in form.titleMap" >
     <label>
       <input type="radio"

src/directives/decorators/bootstrap/radios-inline.html

@@ -1,6 +1,6 @@
 <div class="form-group">
-  <label ng-show="showTitle()">{{form.title}}</label>
-  <input ng-if="form.type !== 'textarea'" type="text" disabled class="form-control" value="{{$$value$$}}">
-  <textarea ng-if="form.type === 'textarea'"  disabled class="form-control">{{$$value$$}}</textarea>
+  <label ng-show="showTitle()" ng-bind="form.title"></label>
+  <input ng-if="form.type !== 'textarea'" type="text" disabled class="form-control" ng-value="$$value$$">
+  <textarea ng-if="form.type === 'textarea'"  disabled class="form-control" ng-bind="$$value$$"></textarea>
   <div class="help-block" ng-show="form.description" ng-bind-html="form.description"></div>
 </div>

src/directives/decorators/bootstrap/radios.html

@@ -1,7 +1,5 @@
 <div class="form-group" ng-class="{'has-error': hasError(), 'has-success': hasSuccess(), 'has-feedback': form.feedback !== false}">
-  <label class="control-label" ng-show="showTitle()">
-    {{form.title}}
-  </label>
+  <label class="control-label" ng-show="showTitle()" ng-bind="form.title"></label>
   <select ng-model="$$value$$"
           ng-model-options="form.ngModelOptions"
           sf-changed="form"

src/directives/decorators/bootstrap/readonly.html

@@ -1,10 +1,12 @@
 <div class="form-group">
   <input type="submit"
-         class="btn {{ form.style || 'btn-primary' }}"
-         value="{{form.title}}"
+         class="btn"
+         ng-class="form.style || 'btn-primary'"
+         ng-value="form.title"
          ng-if="form.type === 'submit'">
-  <button class="btn {{ form.style || 'btn-default' }}"
+  <button class="btn"
+          ng-class="form.style || 'btn-default'"
           type="button"
           ng-click="buttonClick($event,form)"
-          ng-if="form.type !== 'submit'">{{form.title}}</button>
+          ng-if="form.type !== 'submit'" ng-bind="form.title"></button>
 </div>

src/directives/decorators/bootstrap/select.html

@@ -8,12 +8,12 @@
       <li ng-repeat="item in modelArray track by $index"
           ng-click="$event.preventDefault() || (selected.tab = $index)"
           ng-class="{active: selected.tab === $index}">
-          <a href="#">{{evalExpr(form.title,{'$index':$index, value: item}) || $index}}</a>
+          <a href="#" ng-bind="evalExpr(form.title,{'$index':$index, value: item}) || $index"></a>
       </li>
       <li ng-click="$event.preventDefault() || (selected.tab = appendToArray().length - 1)">
         <a href="#">
           <i class="glyphicon glyphicon-plus"></i>
-          {{ form.add || 'Add'}}
+          <span ng-bind="form.add || 'Add'"></span>
           </a>
       </li>
     </ul>
@@ -30,9 +30,10 @@
 
            <button ng-click="selected.tab = deleteFromArray($index).length - 1"
                    type="button"
-                   class="btn {{ form.style.remove || 'btn-default' }} pull-right">
+                   class="btn pull-right"
+                   ng-class="form.style.remove || 'btn-default'">
              <i class="glyphicon glyphicon-trash"></i>
-             {{ form.remove || 'Remove'}}
+             <span ng-bind="form.remove || 'Remove'"></span>
            </button>
       </div>
     </div>
@@ -44,12 +45,12 @@
       <li ng-repeat="item in modelArray track by $index"
           ng-click="$event.preventDefault() || (selected.tab = $index)"
           ng-class="{active: selected.tab === $index}">
-          <a href="#">{{evalExpr(form.title,{'$index':$index, value: item}) || $index}}</a>
+          <a href="#" ng-bind="evalExpr(form.title,{'$index':$index, value: item}) || $index"></a>
       </li>
       <li ng-click="$event.preventDefault() || appendToArray()">
         <a href="#">
           <i class="glyphicon glyphicon-plus"></i>
-          {{ form.add || 'Add'}}
+          <span ng-bind="form.add || 'Add'"></span>
           </a>
       </li>
     </ul>

src/directives/decorators/bootstrap/submit.html

@@ -3,7 +3,7 @@
     <li ng-repeat="tab in form.tabs"
         ng-click="$event.preventDefault() || (selected.tab = $index)"
         ng-class="{active: selected.tab === $index}">
-        <a href="#">{{ tab.title }}</a>
+        <a href="#" ng-bind="tab.title"></a>
     </li>
   </ul>
 

src/directives/decorators/bootstrap/tabarray.html

@@ -1,5 +1,5 @@
 <div class="form-group has-feedback" ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
-  <label ng-show="showTitle()">{{form.title}}</label>
+  <label ng-show="showTitle()" ng-bind="form.title"></label>
   <textarea class="form-control"
             sf-changed="form"
             ng-model="$$value$$"
@@ -10,5 +10,5 @@
         class="form-control-feedback"
         ng-class="evalInScope(form.feedback) || { 'glyphicon': true, 'glyphicon-ok': hasSuccess(), 'glyphicon-remove': hasError() }"></span>
   -->
-  <span class="help-block">{{ (hasError() && errorMessage(schemaError())) || form.description}}</span>
+  <span class="help-block" ng-bind="(hasError() && errorMessage(schemaError())) || form.description"></span>
 </div>

src/directives/decorators/bootstrap/tabs.html

@@ -0,0 +1,21 @@
+/**
+ *  Sets attributes 'type' and 'placeholder' to input elements
+ */
+angular.module('schemaForm').directive('sfDefaultInput', [function () {
+
+    return {
+        restrict: 'A',
+        scope: {
+            sfType: '=',
+            sfPlaceholder: '='
+        },
+        link: function (scope, element) {
+
+            element.attr('type', scope.sfType);
+            element.attr('placeholder', scope.sfPlaceholder);
+
+        }
+
+    };
+
+}]);