angular-floating-label - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

bower.json

 {
   "name": "angular-floating-label",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "homepage": "https://github.com/klaascuvelier/angular-floating-label",
@@ -19,5 +19,5 @@ "authors": [
   "devDependencies": {
-    "angular": "1.3.x",
-    "angular-mocks": "1.3.x"
+    "angular": "^1.3.0",
+    "angular-mocks": "^1.3.0"
   }
 }

CHANGELOG.md

 
+## 1.0.1
+* Update environment
+* Fix for numerical values #5 (thanks @ablamunits)
+
 ## 1.0.0
@@ -12,2 +16,2 @@ * New directory structure
 ## 0.0.1
-Initial version
+Initial version

dist/floating-label.js

@@ -1,7 +0,6 @@
-(function(angular) {
+(function initModule (angular) {
     'use strict';
-
     angular.module('components', []);
+})(window.angular);
 
-})(window.angular);
 //
@@ -15,3 +14,3 @@ //
 //
-(function (angular) {
+(function initDirective (angular) {
     'use strict';
@@ -22,19 +21,30 @@
      * @param {angular.element} inputBox
-     * @return {string}
+     * @returns {string}
      */
-    function generateNgModelKey(inputBox) {
-        var inputId = inputBox.attr('id') || '',
-            inputName = inputBox.attr('name') || '';
+    function generateNgModelKey (inputBox) {
+        var inputId = inputBox.attr('id') || '';
+        var inputName = inputBox.attr('name') || '';
 
-        return 'input_' + (inputId ? inputId : inputName);
+        if (inputId.length === 0 && inputName.length === 0) {
+            throw new Error('If no ng-model is defined, the input should have an id or a name');
+        }
+
+        return 'input_' + inputId || inputName;
     }
 
+    /**
+     * Angular compile method
+     * @param {angular.element} $element
+     * @param {angular.attrs} $attrs
+     * @returns {object}
+     */
     function floatingLabelCompileFunction ($element, $attrs)
     {
-        var templateAttributes = [],
-            template, attr;
+        var templateAttributes = [];
+        var template = null;
+        var attr = null;
 
         // if there is no placeholder, there is no use for this directive
         if (!$attrs.placeholder) {
-            return;
+            throw new Error('Floating label needs a placeholder');
         }
@@ -56,5 +66,5 @@
         template = '<div class="floating-label">' +
-            '<label ng-class="{ \'active\': showLabel }">' + $attrs.placeholder + '</label>'+
-            '<input ' + templateAttributes.join(' ') + ' />' +
-        '</div>';
+                '<label ng-class="{ \'active\': showLabel }">' + $attrs.placeholder + '</label>' +
+                '<input ' + templateAttributes.join(' ') + ' />' +
+            '</div>';
 
@@ -69,17 +79,19 @@ $element.replaceWith(angular.element(template));
     // Add DI
-    floatingLabelCompileFunction.$inject = ['$element', '$attrs'];
+    floatingLabelCompileFunction.$inject = [ '$element', '$attrs' ];
 
     /**
      * Post compile method
-     * @param $scope
-     * @param $element
+     * @param {angular.scope} $scope
+     * @param {angular.element} $element
      */
     function floatingLabelPostCompileFunction ($scope, $element)
     {
-        var inputBox = $element.find('input'),
-            ngModelKey = inputBox.attr('ng-model');
+        var inputBox = $element.find('input');
+        var ngModelKey = inputBox.attr('ng-model');
 
-        $scope.$watch(ngModelKey, function (newValue) {
+        $scope.showLabel = false;
+
+        $scope.$watch(ngModelKey, function modelKeyWatcher (newValue) {
             // if the field is not empty, show the label, otherwise hide it
-            $scope.showLabel = newValue && newValue.length > 0;
+            $scope.showLabel = typeof newValue === 'string' && newValue.length > 0;
         });
@@ -89,3 +101,3 @@ }
     // Add DI
-    floatingLabelPostCompileFunction.$inject = ['$scope', '$element'];
+    floatingLabelPostCompileFunction.$inject = [ '$scope', '$element' ];
 
@@ -96,3 +108,3 @@ /**
      */
-    function floatingLabelDefinition() {
+    function floatingLabelDefinition () {
 
@@ -111,2 +123,2 @@ return {
         .directive('floatingLabel', floatingLabelDefinition);
-})(window.angular);
+})(window.angular);

gulp/test.js

 'use strict';
 
-var gulp    = require('gulp');
-var karma   = require('karma').server;
-var jshint  = require('gulp-jshint');
-var stylish = require('jshint-stylish');
+var gulp = require('gulp');
+var karma = require('karma').server;
+var eslint = require('gulp-eslint');
 
@@ -13,4 +12,3 @@ /**
  */
-function karmaTask(configFile)
-{
+function karmaTask(configFile) {
     return function (done) {
@@ -29,10 +27,9 @@ karma.start({
  */
-function jsHintTask(sources)
-{
+function lintTask(sources) {
     return function () {
         return gulp
             .src(sources)
-            .pipe(jshint())
-            .pipe(jshint.reporter(stylish))
-            .pipe(jshint.reporter('fail'));
+            .pipe(eslint())
+            .pipe(eslint.format())
+            .pipe(eslint.failAfterError());
     };
@@ -44,3 +41,3 @@ }
     karmaTask: karmaTask,
-    jsHintTask: jsHintTask
-};
+    lintTask: lintTask
+};

gulpfile.js

 'use strict';
 
-var gulp        = require('gulp');
-var gulpTest    = require('./gulp/test');
-var gulpBuild   = require('./gulp/build');
+var gulp = require('gulp');
+var gulpTest = require('./gulp/test');
+var gulpBuild = require('./gulp/build');
 
@@ -11,4 +11,4 @@
         karmaConfigFile: __dirname + '/test/karma.conf.js',
-        jsSources: [ './src/floating-label.module.js', './src/floating-label.directive.js' ],
-        lessSources: [ './src/*.less' ],
+        jsSources: ['./src/floating-label.module.js', './src/floating-label.directive.js'],
+        lessSources: ['./src/*.less'],
 
@@ -21,7 +21,7 @@ dist: './dist/',
 
-gulp.task('jshint', gulpTest.jsHintTask(config.paths.jsSources));
+gulp.task('lint', gulpTest.lintTask(config.paths.jsSources));
 
 gulp.task('karma', gulpTest.karmaTask(config.paths.karmaConfigFile));
 
-gulp.task('test', ['jshint', 'karma']);
+gulp.task('test', ['lint', 'karma']);
 
@@ -28,0 +28,0 @@ gulp.task('scripts', ['test'], gulpBuild.scriptsTask(

package.json

 {
   "name": "angular-floating-label",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Floating label directive for AngularJs",
@@ -25,16 +25,16 @@ "scripts": {
   "devDependencies": {
-    "bower": "^1.3.12",
-    "gulp": "3.8.x",
-    "gulp-autoprefixer": "2.0.x",
-    "gulp-concat": "2.4.x",
-    "gulp-jshint": "1.9.x",
-    "gulp-less": "2.0.x",
-    "jasmine-core": "2.1.x",
-    "jshint-stylish": "1.0.x",
-    "karma": "0.12.x",
-    "karma-coverage": "0.2.x",
-    "karma-jasmine": "0.3.x",
-    "karma-junit-reporter": "0.2.x",
-    "karma-phantomjs-launcher": "0.1.x"
+    "bower": "^1.8.0",
+    "gulp": "^3.9.1",
+    "gulp-autoprefixer": "^4.0.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-eslint": "^4.0.0",
+    "gulp-less": "^3.3.2",
+    "jasmine-core": "^2.7.0",
+    "js-styleguide": "git://github.com/klaascuvelier/js-styleguide.git#master",
+    "karma": "^1.7.0",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "^1.1.0",
+    "karma-junit-reporter": "^1.2.0",
+    "karma-phantomjs-launcher": "^1.0.4"
   }
 }

src/floating-label.directive.js

@@ -9,3 +9,3 @@ //
 //
-(function (angular) {
+(function initDirective (angular) {
     'use strict';
@@ -16,23 +16,30 @@
      * @param {angular.element} inputBox
-     * @return {string}
+     * @returns {string}
      */
-    function generateNgModelKey(inputBox) {
-        var inputId = inputBox.attr('id') || '',
-            inputName = inputBox.attr('name') || '';
+    function generateNgModelKey (inputBox) {
+        var inputId = inputBox.attr('id') || '';
+        var inputName = inputBox.attr('name') || '';
 
         if (inputId.length === 0 && inputName.length === 0) {
-            throw 'If no ng-model is defined, the input should have an id or a name';
+            throw new Error('If no ng-model is defined, the input should have an id or a name');
         }
 
-        return 'input_' + (inputId ? inputId : inputName);
+        return 'input_' + inputId || inputName;
     }
 
+    /**
+     * Angular compile method
+     * @param {angular.element} $element
+     * @param {angular.attrs} $attrs
+     * @returns {object}
+     */
     function floatingLabelCompileFunction ($element, $attrs)
     {
-        var templateAttributes = [],
-            template, attr;
+        var templateAttributes = [];
+        var template = null;
+        var attr = null;
 
         // if there is no placeholder, there is no use for this directive
         if (!$attrs.placeholder) {
-            throw 'Floating label needs a placeholder';
+            throw new Error('Floating label needs a placeholder');
         }
@@ -54,3 +61,3 @@
         template = '<div class="floating-label">' +
-                '<label ng-class="{ \'active\': showLabel }">' + $attrs.placeholder + '</label>'+
+                '<label ng-class="{ \'active\': showLabel }">' + $attrs.placeholder + '</label>' +
                 '<input ' + templateAttributes.join(' ') + ' />' +
@@ -67,19 +74,19 @@ '</div>';
     // Add DI
-    floatingLabelCompileFunction.$inject = ['$element', '$attrs'];
+    floatingLabelCompileFunction.$inject = [ '$element', '$attrs' ];
 
     /**
      * Post compile method
-     * @param $scope
-     * @param $element
+     * @param {angular.scope} $scope
+     * @param {angular.element} $element
      */
     function floatingLabelPostCompileFunction ($scope, $element)
     {
-        var inputBox = $element.find('input'),
-            ngModelKey = inputBox.attr('ng-model');
+        var inputBox = $element.find('input');
+        var ngModelKey = inputBox.attr('ng-model');
 
         $scope.showLabel = false;
 
-        $scope.$watch(ngModelKey, function (newValue) {
+        $scope.$watch(ngModelKey, function modelKeyWatcher (newValue) {
             // if the field is not empty, show the label, otherwise hide it
-            $scope.showLabel = typeof newValue === 'string' && newValue.length > 0;
+            $scope.showLabel = newValue !== undefined && newValue.toString().length > 0;
         });
@@ -89,3 +96,3 @@ }
     // Add DI
-    floatingLabelPostCompileFunction.$inject = ['$scope', '$element'];
+    floatingLabelPostCompileFunction.$inject = [ '$scope', '$element' ];
 
@@ -96,3 +103,3 @@ /**
      */
-    function floatingLabelDefinition() {
+    function floatingLabelDefinition () {
 
@@ -111,2 +118,2 @@ return {
         .directive('floatingLabel', floatingLabelDefinition);
-})(window.angular);
+})(window.angular);

src/floating-label.module.js

@@ -1,6 +0,4 @@
-(function(angular) {
+(function initModule (angular) {
     'use strict';
-
     angular.module('components', []);
-
-})(window.angular);
+})(window.angular);

test/karma.conf.js

@@ -44,3 +44,4 @@ // Karma configuration
         junitReporter: {
-            outputFile: 'test/test-results.xml'
+            outputDir: 'test/junit',
+            outputFile: 'test-results.xml'
         },
@@ -47,0 +48,0 @@

test/spec/floating-label.directive.spec.js

@@ -22,3 +22,3 @@ 'use strict';
             $scope.$digest();
-        }).toThrow('Floating label needs a placeholder');
+        }).toThrow(new Error('Floating label needs a placeholder'));
 
@@ -44,3 +44,3 @@ });
             $scope.$digest();
-        }).toThrow('If no ng-model is defined, the input should have an id or a name');
+        }).toThrow(new Error('If no ng-model is defined, the input should have an id or a name'));
 
@@ -107,2 +107,18 @@
 
+    it('should handle numeric values', function () {
+        var element = angular.element('<div><div ng-model="test" floating-label placeholder="test"></div></div>');
+        var input;
+        var directiveScope;
+
+        $compile(element)($scope);
+        $scope.$digest();
+
+        input = element[0].querySelector('input');
+        directiveScope = angular.element(input).scope();
+        directiveScope.test = 0;
+        $scope.$digest();
+
+        expect(directiveScope.showLabel).toBeTruthy();
+    });
+
     it('should set the value of showLabel to true when the model is filled in', function () {
@@ -179,2 +195,2 @@
 
-});
+});

No alert changes

Improved metrics

Total package byte prevSize

27420

4.56%

Number of package files

21

5%

Lines of code

556

6.31%

No dependency changes