From 33f677e53f97a8dacfae173120dbda369bd734ee Mon Sep 17 00:00:00 2001 From: Robert Messerle Date: Wed, 4 Feb 2015 09:48:27 -0800 Subject: [PATCH] feat(input): adds `no-float` class to disable floating label animations Closes #201 Closes #1392 --- src/components/input/input.js | 14 +++++++------- src/components/input/input.scss | 8 ++++---- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/src/components/input/input.js b/src/components/input/input.js index d09101ab864..53ded165bac 100644 --- a/src/components/input/input.js +++ b/src/components/input/input.js @@ -25,7 +25,7 @@ angular.module('material.components.input', [ * @description * `` is the parent of any input or textarea element. * - * Input and textarea elements will not behave properly unless the md-input-container + * Input and textarea elements will not behave properly unless the md-input-container * parent is provided. * * @param md-is-error {expression=} When the given expression evaluates to true, the input container will go into error state. Defaults to erroring if the input has been touched and is invalid. @@ -85,7 +85,7 @@ function labelDirective() { restrict: 'E', require: '^?mdInputContainer', link: function(scope, element, attr, containerCtrl) { - if (!containerCtrl) return; + if (!containerCtrl || attr.mdNoFloat) return; containerCtrl.label = element; scope.$on('$destroy', function() { @@ -170,7 +170,7 @@ function inputTextareaDirective($mdUtil, $window, $compile, $animate) { require: ['^?mdInputContainer', '?ngModel'], link: postLink }; - + function postLink(scope, element, attr, ctrls) { var containerCtrl = ctrls[0]; @@ -196,7 +196,7 @@ function inputTextareaDirective($mdUtil, $window, $compile, $animate) { return ngModelCtrl.$invalid && ngModelCtrl.$touched; }; scope.$watch(isErrorGetter, containerCtrl.setInvalid); - + ngModelCtrl.$parsers.push(ngModelPipelineCheckValue); ngModelCtrl.$formatters.push(ngModelPipelineCheckValue); @@ -290,14 +290,14 @@ function mdMaxlengthDirective($animate) { var containerCtrl = ctrls[1]; var charCountEl = angular.element('
'); - // Stop model from trimming. This makes it so whitespace + // Stop model from trimming. This makes it so whitespace // over the maxlength still counts as invalid. attr.$set('ngTrim', 'false'); containerCtrl.element.append(charCountEl); ngModelCtrl.$formatters.push(renderCharCount); ngModelCtrl.$viewChangeListeners.push(renderCharCount); - element.on('input keydown', function() { + element.on('input keydown', function() { renderCharCount(); //make sure it's called with no args }); @@ -305,7 +305,7 @@ function mdMaxlengthDirective($animate) { maxlength = value; if (angular.isNumber(value) && value > 0) { if (!charCountEl.parent().length) { - $animate.enter(charCountEl, containerCtrl.element, + $animate.enter(charCountEl, containerCtrl.element, angular.element(containerCtrl.element[0].lastElementChild)); } renderCharCount(); diff --git a/src/components/input/input.scss b/src/components/input/input.scss index 81d32f970f1..51c9009f2ee 100644 --- a/src/components/input/input.scss +++ b/src/components/input/input.scss @@ -46,7 +46,7 @@ md-input-container { overflow: hidden; } - label, + label:not(.md-no-float), .md-placeholder { order: 1; pointer-events: none; @@ -74,8 +74,8 @@ md-input-container { opacity: 0; } - /* - * The .md-input class is added to the input/textarea + /* + * The .md-input class is added to the input/textarea */ .md-input { flex: 1; @@ -139,7 +139,7 @@ md-input-container { &.md-input-focused, &.md-input-has-value { - label { + label:not(.md-no-float) { transform: translate3d(0,$input-label-float-offset,0) scale($input-label-float-scale); } }