git.rot13.org Git - angular-drzb/blob - app/js/directives.js

   1 'use strict';
   2
   3 /* Directives */
   4
   5
   6 angular.module('myApp.directives', []).
   7   directive('appVersion', ['version', function(version) {
   8     return function(scope, elm, attrs) {
   9       elm.text(version);
  10     };
  11   }]).
  12   directive('myInput', function() {
  13     return {
  14                 restrict: 'C',
  15                 compile: function(element, attrs) {
  16                         var my_class = attrs['class'] || '';
  17                         my_class = my_class.replace(/ *my-input */,'');
  18                         var my_type  = attrs['type']  || 'text';
  19                         var html = '<div class="'+my_class+'">'
  20                                 +'<label for="'+attrs.ngModel+'">' + attrs.placeholder + '</label>'
  21                                 +'<input type="'+my_type+'" name="'+attrs.ngModel+'" ng-model="' + attrs.ngModel + '"'
  22                                 +' placeholder="'+attrs.placeholder+'" class="'+my_class+'"'
  23                         ;
  24                         if ( attrs.ngRequired ) html += ' ng-required="' + attrs.ngRequired + '"';
  25                         if ( attrs.bsTypeahead )  html += ' bs-typeahead="'+attrs.bsTypeahead+'"';
  26                         if ( attrs.dataItems )  html += ' data-items="'+attrs.dataItems+'"'; // for typeahead
  27                         html += '/></div>';
  28                         element.replaceWith(html);
  29                 }
  30     };
  31   }).
  32
  33 directive('myLabelInput', function() {
  34     return {
  35                 restrict: 'C',
  36                 compile: function(element, attrs) {
  37                         var my_class = attrs['class'] || '';
  38                         my_class = my_class.replace(/ *my-input */,'');
  39                         var my_type  = attrs['type']  || 'text';
  40                         var m = attrs.ngModel;
  41                         var html =
  42 '  <div class="control-group">'+
  43 '    <label class="control-label" for="'+m+'">'+attrs.label+'</label>'+
  44 '    <div class="controls">'+
  45 '      <input type="'+my_type+'" id="'+m+'" ng-model="'+m+'"';
  46                         ;
  47                         if ( attrs.placeholder ) html += ' placeholder="' + attrs.placeholder + '"';
  48                         if ( attrs.ngRequired )  html += ' ng-required="' + attrs.ngRequired + '"';
  49                         if ( attrs.ngChange )    html += ' ng-change="' + attrs.ngChange + '"';
  50                         html += '>'+
  51 '    </div>'+
  52 '  </div>';
  53
  54                         element.replaceWith(html);
  55                 }
  56     };
  57 })
  58
  59 .directive('myLabelSelect', function() {
  60     return {
  61                 restrict: 'C',
  62                 compile: function(element, attrs) {
  63                         var my_class = attrs['class'] || '';
  64                         my_class = my_class.replace(/ *my-input */,'');
  65                         var m = attrs.ngModel;
  66                         var html =
  67 '  <div class="control-group">'+
  68 '    <label class="control-label" for="'+m+'">'+attrs.label+'</label>'+
  69 '    <div class="controls">'+
  70 '      <select id="'+m+'" ng-model="'+m+'"';
  71                         ;
  72                         if ( attrs.ngOptions  ) html += ' ng-options="' + attrs.ngOptions + '"';
  73                         html += '></select>'+
  74 '    </div>'+
  75 '  </div>';
  76
  77                         element.replaceWith(html);
  78                 }
  79     };
  80 })
  81
  82 .directive('bsTypeahead', ['$parse', function($parse) {
  83         'use strict';
  84
  85         return {
  86                 restrict: 'A',
  87                 require: '?ngModel',
  88                 link: function postLink(scope, element, attr, controller) {
  89
  90                         var getter = $parse(attr.bsTypeahead),
  91                                         setter = getter.assign,
  92                                         value = getter(scope);
  93
  94                         // Watch bsTypeahead for changes
  95                         scope.$watch(attr.bsTypeahead, function(newValue, oldValue) {
  96                                 if(newValue !== oldValue) {
  97                                         value = newValue;
  98                                 }
  99                         });
 100
 101                         element.attr('data-provide', 'typeahead');
 102                         element.typeahead({
 103                                 source: function(query) { return value; },
 104                                 items: attr.items,
 105                                 updater: function(value) {
 106                                         // If we have a controller (i.e. ngModelController) then wire it up
 107                                         if(controller) {
 108                                                 scope.$apply(function () {
 109                                                         controller.$setViewValue(value);
 110                                                 });
 111                                         }
 112                                         return value;
 113                                 }
 114                         });
 115
 116                         // add entered element into typeahead array for other fields
 117                         element.bind('blur', function() {
 118                                 var new_value = element.val();
 119                                 if ( new_value.length > 1 && $.inArray( new_value, value ) === -1 ) { // IE doesn't have .indexOf
 120                                         scope.$apply( function() {
 121                                                 value.unshift( element.val() );
 122                                         });
 123                                 }
 124                         });
 125
 126                 }
 127         };
 128 }])
 129 ;