forked from probots-io/floatlabels.js
-
Notifications
You must be signed in to change notification settings - Fork 1
/
floatlabels.min.js
12 lines (12 loc) · 2.86 KB
/
floatlabels.min.js
1
2
3
4
5
6
7
8
9
10
11
12
;(function($,window,document,undefined){var pluginName="floatlabel",defaults={slideInput:true,labelStartTop:'0px',labelEndTop:'0px',paddingOffset:'12px',labelClass:'',typeMatches:/text|password|email|number|search|url|tel/,};function Plugin(element,options){this.$element=$(element);this.settings=$.extend({},defaults,options);this.init();}
Plugin.prototype={init:function(){var self=this,settings=this.settings,thisElement=this.$element,elementID,placeholderText,floatingText,extraClasses;if(thisElement.prop('tagName').toUpperCase()!='INPUT'&&thisElement.prop('tagName').toUpperCase()!='TEXTAREA'){return;}
if(thisElement.prop('tagName').toUpperCase()==='INPUT'&&!settings.typeMatches.test(thisElement.attr('type'))){return;}
placeholderText=thisElement.attr('placeholder');if(typeof(placeholderText)==='undefined'){return;}
elementID=thisElement.attr('id');if(!elementID){elementID=Math.floor(Math.random()*100)+1;thisElement.attr('id',elementID);}
floatingText=thisElement.data('label');extraClasses=thisElement.data('class');if(!extraClasses){extraClasses='';}
if(!floatingText||floatingText===''){floatingText=placeholderText;}
thisElement.wrap('<div class="floatlabel-wrapper"></div>');thisElement.addClass('floatlabel-input');thisElement.before('<label for="'+elementID+'" class="floatlabel-label floatlabel-label-inactive'+settings.labelClass+' '+extraClasses+'">'+floatingText+'</label>');this.$label=thisElement.prev('label');thisElement.on('keyup blur change',function(e){self.checkValue(e);});thisElement.on('blur',function(){thisElement.prev('label').removeClass('floatlabel-label-focus')});thisElement.on('focus',function(){thisElement.prev('label').addClass('floatlabel-label-focus')});this.checkValue();},checkValue:function(e){if(e){var keyCode=e.keyCode||e.which;if(keyCode===9){return;}}
var thisElement=this.$element,currentFlout=thisElement.data('flout');if(thisElement.val()!==""){thisElement.data('flout','1');}
if(thisElement.val()===""){thisElement.data('flout','0');}
if(thisElement.data('flout')==='1'&¤tFlout!=='1'){this.showLabel();}
if(thisElement.data('flout')==='0'&¤tFlout!=='0'){this.hideLabel();}},showLabel:function(){var self=this;self.$label.css({'display':'block'});window.setTimeout(function(){self.$label.removeClass('floatlabel-label-inactive').addClass('floatlabel-label-active');if(self.settings.slideInput===true){self.$element.addClass('floatlabel-input-slide');}},50);},hideLabel:function(){var self=this;self.$label.removeClass('floatlabel-label-active').addClass('floatlabel-label-inactive');if(self.settings.slideInput===true){self.$element.removeClass('floatlabel-input-slide');}}};$.fn[pluginName]=function(options){return this.each(function(){if(!$.data(this,"plugin_"+pluginName)){$.data(this,"plugin_"+pluginName,new Plugin(this,options));}});};})(jQuery,window,document);