fixed behavior of floating labels

dist/js/material.js

@@ -2,6 +2,15 @@
 
 $(function (){
 
+    function isChar(evt) {
+        if (typeof evt.which == "undefined") {
+            return true;
+        } else if (typeof evt.which == "number" && evt.which > 0) {
+            return !evt.ctrlKey && !evt.metaKey && !evt.altKey && evt.which != 8;
+        }
+        return false;
+    }
+
     if (typeof ripples == "object") {
         ripples.init( ".btn:not(.btn-link)," +
                      ".card-image," +
@@ -54,14 +63,13 @@ $(function (){
         $(this).blur();
     });
 
-    $(document).on("focus change", ".form-control", function() {
+    $(document).on("keydown", ".form-control", function(e) {
         var $this = $(this);
-        if($this.val() === "") {
+        if(isChar(e)) {
             $this.removeClass("empty");
         }
     });
-
+    $(document).on("keyup", ".form-control", function() {
-    $(document).on("blur", ".form-control", function() {
         var $this = $(this);
         if($this.val() === "") {
             $this.addClass("empty");

dist/js/material.min.js

@@ -1 +1 @@
-$(function(){"object"==typeof ripples&&ripples.init(".btn:not(.btn-link),.card-image,.navbar a:not(.withoutripple),.nav-tabs a:not(.withoutripple),.withripple");var a=function(){$(".checkbox > label > input").not(".bs-material").addClass("bs-material").after("<span class=check></span>"),$(".radio > label > input").not(".bs-material").addClass("bs-material").after("<span class=circle></span><span class=check></span>"),$("input.form-control, textarea.form-control, select.form-control").not(".bs-material").each(function(){if(!$(this).is(".bs-material")){if($(this).wrap("<div class=form-control-wrapper></div>"),$(this).after("<span class=material-input></span>"),$(this).hasClass("floating-label")){var a=$(this).attr("placeholder");$(this).attr("placeholder",null).removeClass("floating-label"),$(this).after("<div class=floating-label>"+a+"</div>")}if(($(this).is(":empty")||null===$(this).val()||"undefined"==$(this).val()||""===$(this).val())&&$(this).addClass("empty"),$(this).parent().next().is("[type=file]")){$(this).parent().addClass("fileinput");var b=$(this).parent().next().detach();$(this).after(b)}}})};a(),document.arrive&&document.arrive("input, textarea, select",function(){a()}),$(document).on("change",".checkbox input",function(){$(this).blur()}),$(document).on("focus change",".form-control",function(){var a=$(this);""===a.val()&&a.removeClass("empty")}),$(document).on("blur",".form-control",function(){var a=$(this);""===a.val()&&a.addClass("empty")}),$(document).on("focus",".form-control-wrapper.fileinput",function(){$(this).find("input").addClass("focus")}).on("blur",".form-control-wrapper.fileinput",function(){$(this).find("input").removeClass("focus")}).on("change",".form-control-wrapper.fileinput [type=file]",function(){var a="";$.each($(this)[0].files,function(b,c){console.log(c),a+=c.name+", "}),a=a.substring(0,a.length-2),a?$(this).prev().removeClass("empty"):$(this).prev().addClass("empty"),$(this).prev().val(a)})});
+$(function(){function a(a){return"undefined"==typeof a.which?!0:"number"==typeof a.which&&a.which>0?!a.ctrlKey&&!a.metaKey&&!a.altKey&&8!=a.which:!1}"object"==typeof ripples&&ripples.init(".btn:not(.btn-link),.card-image,.navbar a:not(.withoutripple),.nav-tabs a:not(.withoutripple),.withripple");var b=function(){$(".checkbox > label > input").not(".bs-material").addClass("bs-material").after("<span class=check></span>"),$(".radio > label > input").not(".bs-material").addClass("bs-material").after("<span class=circle></span><span class=check></span>"),$("input.form-control, textarea.form-control, select.form-control").not(".bs-material").each(function(){if(!$(this).is(".bs-material")){if($(this).wrap("<div class=form-control-wrapper></div>"),$(this).after("<span class=material-input></span>"),$(this).hasClass("floating-label")){var a=$(this).attr("placeholder");$(this).attr("placeholder",null).removeClass("floating-label"),$(this).after("<div class=floating-label>"+a+"</div>")}if(($(this).is(":empty")||null===$(this).val()||"undefined"==$(this).val()||""===$(this).val())&&$(this).addClass("empty"),$(this).parent().next().is("[type=file]")){$(this).parent().addClass("fileinput");var b=$(this).parent().next().detach();$(this).after(b)}}})};b(),document.arrive&&document.arrive("input, textarea, select",function(){b()}),$(document).on("change",".checkbox input",function(){$(this).blur()}),$(document).on("keydown",".form-control",function(b){var c=$(this);a(b)&&c.removeClass("empty")}),$(document).on("keyup",".form-control",function(){var a=$(this);""===a.val()&&a.addClass("empty")}),$(document).on("focus",".form-control-wrapper.fileinput",function(){$(this).find("input").addClass("focus")}).on("blur",".form-control-wrapper.fileinput",function(){$(this).find("input").removeClass("focus")}).on("change",".form-control-wrapper.fileinput [type=file]",function(){var a="";$.each($(this)[0].files,function(b,c){console.log(c),a+=c.name+", "}),a=a.substring(0,a.length-2),a?$(this).prev().removeClass("empty"):$(this).prev().addClass("empty"),$(this).prev().val(a)})});

scripts/material.js

@@ -2,6 +2,15 @@
 
 $(function (){
 
+    function isChar(evt) {
+        if (typeof evt.which == "undefined") {
+            return true;
+        } else if (typeof evt.which == "number" && evt.which > 0) {
+            return !evt.ctrlKey && !evt.metaKey && !evt.altKey && evt.which != 8;
+        }
+        return false;
+    }
+
     if (typeof ripples == "object") {
         ripples.init( ".btn:not(.btn-link)," +
                      ".card-image," +
@@ -54,14 +63,13 @@ $(function (){
         $(this).blur();
     });
 
-    $(document).on("focus change", ".form-control", function() {
+    $(document).on("keydown", ".form-control", function(e) {
         var $this = $(this);
-        if($this.val() === "") {
+        if(isChar(e)) {
             $this.removeClass("empty");
         }
     });
-
+    $(document).on("keyup", ".form-control", function() {
-    $(document).on("blur", ".form-control", function() {
         var $this = $(this);
         if($this.val() === "") {
             $this.addClass("empty");

template/material/js/material.js

@@ -2,12 +2,21 @@
 
 $(function (){
 
+    function isChar(evt) {
+        if (typeof evt.which == "undefined") {
+            return true;
+        } else if (typeof evt.which == "number" && evt.which > 0) {
+            return !evt.ctrlKey && !evt.metaKey && !evt.altKey && evt.which != 8;
+        }
+        return false;
+    }
+
     if (typeof ripples == "object") {
         ripples.init( ".btn:not(.btn-link)," +
-                      ".card-image," +
+                     ".card-image," +
-                      ".navbar a:not(.withoutripple)," +
+                     ".navbar a:not(.withoutripple)," +
-                      ".nav-tabs a:not(.withoutripple)," +
+                     ".nav-tabs a:not(.withoutripple)," +
-                      ".withripple" );
+                     ".withripple" );
     }
 
     var initInputs = function() {
@@ -54,16 +63,15 @@ $(function (){
         $(this).blur();
     });
 
-    $(document).on("keyup change", ".form-control", function() {
+    $(document).on("keydown", ".form-control", function(e) {
-        var self = $(this);
+        var $this = $(this);
-        setTimeout(function() {
+        if($this.val() !== "" || isChar(e)) {
-            if (self.val() === "") {
+            $this.removeClass("empty");
-                self.addClass("empty");
+        } else  {
-            } else {
+            $this.addClass("empty");
-                self.removeClass("empty");
+        }
-            }
-        }, 1);
     });
+
     $(document)
     .on("focus", ".form-control-wrapper.fileinput", function() {
         $(this).find("input").addClass("focus");

template/material/js/material.min.js

@@ -1 +1 @@
-$(function(){"object"==typeof ripples&&ripples.init(".btn:not(.btn-link),.card-image,.navbar a:not(.withoutripple),.nav-tabs a:not(.withoutripple),.withripple");var a=function(){$(".checkbox > label > input").not(".bs-material").addClass("bs-material").after("<span class=check></span>"),$(".radio > label > input").not(".bs-material").addClass("bs-material").after("<span class=circle></span><span class=check></span>"),$("input.form-control, textarea.form-control, select.form-control").not(".bs-material").each(function(){if(!$(this).is(".bs-material")){if($(this).wrap("<div class=form-control-wrapper></div>"),$(this).after("<span class=material-input></span>"),$(this).hasClass("floating-label")){var a=$(this).attr("placeholder");$(this).attr("placeholder",null).removeClass("floating-label"),$(this).after("<div class=floating-label>"+a+"</div>")}if(($(this).is(":empty")||null===$(this).val()||"undefined"==$(this).val()||""===$(this).val())&&$(this).addClass("empty"),$(this).parent().next().is("[type=file]")){$(this).parent().addClass("fileinput");var b=$(this).parent().next().detach();$(this).after(b)}}})};a(),document.arrive&&document.arrive("input, textarea, select",function(){a()}),$(document).on("change",".checkbox input",function(){$(this).blur()}),$(document).on("focus change",".form-control",function(){var a=$(this);""===a.val()&&a.removeClass("empty")}),$(document).on("blur",".form-control",function(){var a=$(this);""===a.val()&&a.addClass("empty")}),$(document).on("focus",".form-control-wrapper.fileinput",function(){$(this).find("input").addClass("focus")}).on("blur",".form-control-wrapper.fileinput",function(){$(this).find("input").removeClass("focus")}).on("change",".form-control-wrapper.fileinput [type=file]",function(){var a="";$.each($(this)[0].files,function(b,c){console.log(c),a+=c.name+", "}),a=a.substring(0,a.length-2),a?$(this).prev().removeClass("empty"):$(this).prev().addClass("empty"),$(this).prev().val(a)})});
+$(function(){function a(a){return"undefined"==typeof a.which?!0:"number"==typeof a.which&&a.which>0?!a.ctrlKey&&!a.metaKey&&!a.altKey&&8!=a.which:!1}"object"==typeof ripples&&ripples.init(".btn:not(.btn-link),.card-image,.navbar a:not(.withoutripple),.nav-tabs a:not(.withoutripple),.withripple");var b=function(){$(".checkbox > label > input").not(".bs-material").addClass("bs-material").after("<span class=check></span>"),$(".radio > label > input").not(".bs-material").addClass("bs-material").after("<span class=circle></span><span class=check></span>"),$("input.form-control, textarea.form-control, select.form-control").not(".bs-material").each(function(){if(!$(this).is(".bs-material")){if($(this).wrap("<div class=form-control-wrapper></div>"),$(this).after("<span class=material-input></span>"),$(this).hasClass("floating-label")){var a=$(this).attr("placeholder");$(this).attr("placeholder",null).removeClass("floating-label"),$(this).after("<div class=floating-label>"+a+"</div>")}if(($(this).is(":empty")||null===$(this).val()||"undefined"==$(this).val()||""===$(this).val())&&$(this).addClass("empty"),$(this).parent().next().is("[type=file]")){$(this).parent().addClass("fileinput");var b=$(this).parent().next().detach();$(this).after(b)}}})};b(),document.arrive&&document.arrive("input, textarea, select",function(){b()}),$(document).on("change",".checkbox input",function(){$(this).blur()}),$(document).on("keydown",".form-control",function(b){var c=$(this);a(b)&&c.removeClass("empty")}),$(document).on("keyup",".form-control",function(){var a=$(this);""===a.val()&&a.addClass("empty")}),$(document).on("focus",".form-control-wrapper.fileinput",function(){$(this).find("input").addClass("focus")}).on("blur",".form-control-wrapper.fileinput",function(){$(this).find("input").removeClass("focus")}).on("change",".form-control-wrapper.fileinput [type=file]",function(){var a="";$.each($(this)[0].files,function(b,c){console.log(c),a+=c.name+", "}),a=a.substring(0,a.length-2),a?$(this).prev().removeClass("empty"):$(this).prev().addClass("empty"),$(this).prev().val(a)})});