added my-label-select

[angular-drzb] / app / js / directives.js

diff --git a/app/js/directives.js b/app/js/directives.js
index fb7b81e..ac273fe 100644 (file)
--- a/app/js/directives.js
+++ b/app/js/directives.js
@@ -14,13 +14,115 @@ angular.module('myApp.directives', []).
                restrict: 'C',
                compile: function(element, attrs) {
                        var my_class = attrs['class'] || '';
+                       my_class = my_class.replace(/ *my-input */,'');
                        var my_type  = attrs['type']  || 'text';
-                       var html = '<div class="controls '+my_class+'">'
+                       var html = '<div class="'+my_class+'">'
                                +'<label for="'+attrs.ngModel+'">' + attrs.placeholder + '</label>'
-                               +'<input type="'+my_type+'" name="'+attrs.ngModel+'" ng-model="' + attrs.ngModel + '" ng-required="' + attrs.ngRequired + '" placeholder="' + attrs.placeholder + '" />'
-                               +'</div>'
+                               +'<input type="'+my_type+'" name="'+attrs.ngModel+'" ng-model="' + attrs.ngModel + '"'
+                               +' placeholder="'+attrs.placeholder+'" class="'+my_class+'"'
                        ;
+                       if ( attrs.ngRequired ) html += ' ng-required="' + attrs.ngRequired + '"';
+                       if ( attrs.bsTypeahead )  html += ' bs-typeahead="'+attrs.bsTypeahead+'"';
+                       if ( attrs.dataItems )  html += ' data-items="'+attrs.dataItems+'"'; // for typeahead
+                       html += '/></div>';
                        element.replaceWith(html);
                }
     };
-  });
+  }).
+
+directive('myLabelInput', function() {
+    return {
+               restrict: 'C',
+               compile: function(element, attrs) {
+                       var my_class = attrs['class'] || '';
+                       my_class = my_class.replace(/ *my-input */,'');
+                       var my_type  = attrs['type']  || 'text';
+                       var m = attrs.ngModel;
+                       var html =
+'  <div class="control-group">'+
+'    <label class="control-label" for="'+m+'">'+attrs.label+'</label>'+
+'    <div class="controls">'+
+'      <input type="'+my_type+'" id="'+m+'" ng-model="'+m+'"';
+                       ;
+                       if ( attrs.placeholder ) html += ' placeholder="' + attrs.placeholder + '"';
+                       if ( attrs.ngRequired ) html += ' ng-required="' + attrs.ngRequired + '"';
+                       html += '>'+
+'    </div>'+
+'  </div>';
+
+                       element.replaceWith(html);
+               }
+    };
+})
+
+.directive('myLabelSelect', function() {
+    return {
+               restrict: 'C',
+               compile: function(element, attrs) {
+                       var my_class = attrs['class'] || '';
+                       my_class = my_class.replace(/ *my-input */,'');
+                       var m = attrs.ngModel;
+                       var html =
+'  <div class="control-group">'+
+'    <label class="control-label" for="'+m+'">'+attrs.label+'</label>'+
+'    <div class="controls">'+
+'      <select id="'+m+'" ng-model="'+m+'"';
+                       ;
+                       if ( attrs.ngOptions  ) html += ' ng-options="' + attrs.ngOptions + '"';
+                       html += '></select>'+
+'    </div>'+
+'  </div>';
+
+                       element.replaceWith(html);
+               }
+    };
+})
+
+.directive('bsTypeahead', ['$parse', function($parse) {
+       'use strict';
+
+       return {
+               restrict: 'A',
+               require: '?ngModel',
+               link: function postLink(scope, element, attr, controller) {
+
+                       var getter = $parse(attr.bsTypeahead),
+                                       setter = getter.assign,
+                                       value = getter(scope);
+
+                       // Watch bsTypeahead for changes
+                       scope.$watch(attr.bsTypeahead, function(newValue, oldValue) {
+                               if(newValue !== oldValue) {
+                                       value = newValue;
+                               }
+                       });
+
+                       element.attr('data-provide', 'typeahead');
+                       element.typeahead({
+                               source: function(query) { return value; },
+                               items: attr.items,
+                               updater: function(value) {
+                                       // If we have a controller (i.e. ngModelController) then wire it up
+                                       if(controller) {
+                                               scope.$apply(function () {
+                                                       controller.$setViewValue(value);
+                                               });
+                                       }
+                                       return value;
+                               }
+                       });
+
+                       // add entered element into typeahead array for other fields
+                       element.bind('blur', function() {
+                               var new_value = element.val();
+                               if ( new_value.length > 1 && $.inArray( new_value, value ) === -1 ) { // IE doesn't have .indexOf
+                                       scope.$apply( function() {
+                                               value.unshift( element.val() );
+                                       });
+                               }
+                       });
+
+               }
+       };
+}])
+;