diff --git a/src/bootstrap-filestyle.js b/src/bootstrap-filestyle.js index 796bfc2..e24f381 100644 --- a/src/bootstrap-filestyle.js +++ b/src/bootstrap-filestyle.js @@ -413,7 +413,7 @@ 'text' : $this.attr('data-text'), 'btnClass' : $this.attr('data-btnClass'), 'badge' : $this.attr('data-badge') === 'true', - 'dragdrop' : $this.attr('data-dragdrop') === 'false', + 'dragdrop' : $this.attr('data-dragdrop') !== 'false', 'badgeName' : $this.attr('data-badgeName'), 'placeholder': $this.attr('data-placeholder') }; diff --git a/src/bootstrap-filestyle.min.js b/src/bootstrap-filestyle.min.js index 88c8bd0..7722190 100644 --- a/src/bootstrap-filestyle.min.js +++ b/src/bootstrap-filestyle.min.js @@ -7,17 +7,4 @@ * Version 2.1.0 * Licensed under the MIT license. */ - (function($){"use strict";var nextId=0;var Filestyle=function(element,options){this.options=options;this.$elementFilestyle=[];this.$element=$(element)};Filestyle.prototype={clear:function(){this.$element.val('');this.$elementFilestyle.find(':text').val('');this.$elementFilestyle.find('.badge').remove()},destroy:function(){this.$element.removeAttr('style').removeData('filestyle');this.$elementFilestyle.remove()},disabled:function(value){if(value===!0||value===!1){this.options.disabled=value;this.$element.prop('disabled',this.options.disabled);this.$elementFilestyle.find('label').prop('disabled',this.options.disabled);if(this.options.disabled) -this.$elementFilestyle.find('label').css('opacity','0.65');else this.$elementFilestyle.find('label').css('opacity','1')}else{return this.options.disabled}},dragdrop:function(value){if(value===!0||value===!1){this.options.dragdrop=value}else{return this.options.dragdrop}},buttonBefore:function(value){if(value===!0){if(!this.options.buttonBefore){this.options.buttonBefore=value;if(this.options.input){this.$elementFilestyle.remove();this.constructor();this.pushNameFiles()}}}else if(value===!1){if(this.options.buttonBefore){this.options.buttonBefore=value;if(this.options.input){this.$elementFilestyle.remove();this.constructor();this.pushNameFiles()}}}else{return this.options.buttonBefore}},input:function(value){if(value===!0){if(!this.options.input){this.options.input=value;if(this.options.buttonBefore){this.$elementFilestyle.append(this.htmlInput())}else{this.$elementFilestyle.prepend(this.htmlInput())} -this.pushNameFiles();this.$elementFilestyle.find('.group-span-filestyle').addClass('input-group-btn')}}else if(value===!1){if(this.options.input){this.options.input=value;this.$elementFilestyle.find(':text').remove();this.$elementFilestyle.find('.group-span-filestyle').removeClass('input-group-btn')}}else{return this.options.input}},size:function(value){if(value!==undefined){this.options.size=value;var btn=this.$elementFilestyle.find('label'),input=this.$elementFilestyle.find('input');btn.removeClass('btn-lg btn-sm');input.removeClass('form-control-lg form-control-sm');if(this.options.size!='nr'){btn.addClass('btn-'+this.options.size);input.addClass('form-control-'+this.options.size)}}else{return this.options.size}},placeholder:function(value){if(value!==undefined){this.options.placeholder=value;this.$elementFilestyle.find('input').attr('placeholder',value)}else{return this.options.placeholder}},text:function(value){if(value!==undefined){this.options.text=value;this.$elementFilestyle.find('label .text').html(this.options.text)}else{return this.options.text}},btnClass:function(value){if(value!==undefined){this.options.btnClass=value;this.$elementFilestyle.find('label').attr({'class':'btn '+this.options.btnClass+' btn-'+this.options.size})}else{return this.options.btnClass}},badge:function(value){if(value===!0){this.options.badge=value;var files=this.pushNameFiles();this.$elementFilestyle.find('label').append(' '+files.length+'')}else if(value===!1){this.options.badge=value;this.$elementFilestyle.find('.badge').remove()}else{return this.options.badge}},badgeName:function(value){if(value!==undefined){this.options.badgeName=value;this.$elementFilestyle.find('.badge').attr({'class':'badge '+this.options.badgeName})}else{return this.options.badgeName}},htmlIcon:function(value){if(value!==undefined){this.options.htmlIcon=value} -return this.options.htmlIcon},htmlInput:function(){if(this.options.input){return ' '}else{return ''}},pushNameFiles:function(){var content='',files=[];if(this.$element[0].files===undefined){files[0]={'name':this.$element[0]&&this.$element[0].value}}else{files=this.$element[0].files} -for(var i=0;i'+''+'';html=_self.options.buttonBefore?btn+_self.htmlInput():_self.htmlInput()+btn;_self.$elementFilestyle=$('
'+html+'
');_self.$elementFilestyle.find('.group-span-filestyle').attr('tabindex',"0").keypress(function(e){if(e.keyCode===13||e.charCode===32){_self.$elementFilestyle.find('label').click();return!1}});_self.$element.css({'position':'absolute','clip':'rect(0px 0px 0px 0px)'}).attr('tabindex',"-1").after(_self.$elementFilestyle);_self.$elementFilestyle.find(_self.options.buttonBefore?'label':':input').css({'border-top-left-radius':'.25rem','border-bottom-left-radius':'.25rem'});_self.$elementFilestyle.find('[name="filedrag"]').css({position:'absolute',width:'100%',height:_self.$elementFilestyle.height()+'px','z-index':-1});if(_self.options.disabled||_self.$element.attr('disabled')){_self.$element.attr('disabled','true');if(_self.options.disabled) -_self.$elementFilestyle.find('label').css('opacity','0.65');else _self.$elementFilestyle.find('label').css('opacity','1')} -_self.$element.change(function(){var files=_self.pushNameFiles();if(_self.options.badge){if(_self.$elementFilestyle.find('.badge').length==0){_self.$elementFilestyle.find('label').append(' '+files.length+'')}else if(files.length==0){_self.$elementFilestyle.find('.badge').remove()}else{_self.$elementFilestyle.find('.badge').html(files.length)}}else{_self.$elementFilestyle.find('.badge').remove()} -_self.options.onChange(files)});if(window.navigator.userAgent.search(/firefox/i)>-1){_self.$elementFilestyle.find('label').click(function(){_self.$element.click();return!1})} -$(document).on('dragover',function(e){e.preventDefault();e.stopPropagation();if(_self.options.dragdrop){$('[name="filedrag"]').css('z-index','9')}}).on('drop',function(e){e.preventDefault();e.stopPropagation();if(_self.options.dragdrop){$('[name="filedrag"]').css('z-index','-1')}});_self.$elementFilestyle.find('[name="filedrag"]').on('dragover',function(e){e.preventDefault();e.stopPropagation()}).on('dragenter',function(e){e.preventDefault();e.stopPropagation()}).on('drop',function(e){if(e.originalEvent.dataTransfer&&!_self.options.disabled&&_self.options.dragdrop){if(e.originalEvent.dataTransfer.files.length){e.preventDefault();e.stopPropagation();_self.$element[0].files=e.originalEvent.dataTransfer.files;var files=_self.pushNameFiles();if(_self.options.badge){if(_self.$elementFilestyle.find('.badge').length==0){_self.$elementFilestyle.find('label').append(' '+files.length+'')}else if(files.length==0){_self.$elementFilestyle.find('.badge').remove()}else{_self.$elementFilestyle.find('.badge').html(files.length)}}else{_self.$elementFilestyle.find('.badge').remove()} -_self.options.onChange(files);$('[name="filedrag"]').css('z-index','-1')}}})}};var old=$.fn.filestyle;$.fn.filestyle=function(option,value){var get='',element=this.each(function(){if($(this).attr('type')==='file'){var $this=$(this),data=$this.data('filestyle'),options=$.extend({},$.fn.filestyle.defaults,option,typeof option==='object'&&option);if(!data){$this.data('filestyle',(data=new Filestyle(this,options)));data.constructor()} -if(typeof option==='string'){get=data[option](value)}}});if(typeof get!==undefined){return get}else{return element}};$.fn.filestyle.defaults={'text':'Choose file','htmlIcon':'','btnClass':'btn-secondary','size':'nr','input':!0,'badge':!1,'badgeName':'badge-light','buttonBefore':!1,'dragdrop':!0,'disabled':!1,'placeholder':'','onChange':function(){}};$.fn.filestyle.noConflict=function(){$.fn.filestyle=old;return this};$(function(){$('.filestyle').each(function(){var $this=$(this),options={'input':$this.attr('data-input')!=='false','htmlIcon':$this.attr('data-icon'),'buttonBefore':$this.attr('data-buttonBefore')==='true','disabled':$this.attr('data-disabled')==='true','size':$this.attr('data-size'),'text':$this.attr('data-text'),'btnClass':$this.attr('data-btnClass'),'badge':$this.attr('data-badge')==='true','dragdrop':$this.attr('data-dragdrop')==='false','badgeName':$this.attr('data-badgeName'),'placeholder':$this.attr('data-placeholder')};$this.filestyle(options)})})})(window.jQuery) \ No newline at end of file +!function(e){"use strict";var t=0,i=function(t,i){this.options=i,this.$elementFilestyle=[],this.$element=e(t)};i.prototype={clear:function(){this.$element.val(""),this.$elementFilestyle.find(":text").val(""),this.$elementFilestyle.find(".badge").remove()},destroy:function(){this.$element.removeAttr("style").removeData("filestyle"),this.$elementFilestyle.remove()},disabled:function(e){return e!==!0&&e!==!1?this.options.disabled:(this.options.disabled=e,this.$element.prop("disabled",this.options.disabled),this.$elementFilestyle.find("label").prop("disabled",this.options.disabled),this.options.disabled?this.$elementFilestyle.find("label").css("opacity","0.65"):this.$elementFilestyle.find("label").css("opacity","1"),void 0)},dragdrop:function(e){return e!==!0&&e!==!1?this.options.dragdrop:void(this.options.dragdrop=e)},buttonBefore:function(e){if(e===!0)this.options.buttonBefore||(this.options.buttonBefore=e,this.options.input&&(this.$elementFilestyle.remove(),this.constructor(),this.pushNameFiles()));else{if(e!==!1)return this.options.buttonBefore;this.options.buttonBefore&&(this.options.buttonBefore=e,this.options.input&&(this.$elementFilestyle.remove(),this.constructor(),this.pushNameFiles()))}},input:function(e){if(e===!0)this.options.input||(this.options.input=e,this.options.buttonBefore?this.$elementFilestyle.append(this.htmlInput()):this.$elementFilestyle.prepend(this.htmlInput()),this.pushNameFiles(),this.$elementFilestyle.find(".group-span-filestyle").addClass("input-group-btn"));else{if(e!==!1)return this.options.input;this.options.input&&(this.options.input=e,this.$elementFilestyle.find(":text").remove(),this.$elementFilestyle.find(".group-span-filestyle").removeClass("input-group-btn"))}},size:function(e){if(void 0===e)return this.options.size;this.options.size=e;var t=this.$elementFilestyle.find("label"),i=this.$elementFilestyle.find("input");t.removeClass("btn-lg btn-sm"),i.removeClass("form-control-lg form-control-sm"),"nr"!=this.options.size&&(t.addClass("btn-"+this.options.size),i.addClass("form-control-"+this.options.size))},placeholder:function(e){return void 0===e?this.options.placeholder:(this.options.placeholder=e,void this.$elementFilestyle.find("input").attr("placeholder",e))},text:function(e){return void 0===e?this.options.text:(this.options.text=e,void this.$elementFilestyle.find("label .text").html(this.options.text))},btnClass:function(e){return void 0===e?this.options.btnClass:(this.options.btnClass=e,void this.$elementFilestyle.find("label").attr({"class":"btn "+this.options.btnClass+" btn-"+this.options.size}))},badge:function(e){if(e===!0){this.options.badge=e;var t=this.pushNameFiles();this.$elementFilestyle.find("label").append(' '+t.length+"")}else{if(e!==!1)return this.options.badge;this.options.badge=e,this.$elementFilestyle.find(".badge").remove()}},badgeName:function(e){return void 0===e?this.options.badgeName:(this.options.badgeName=e,void this.$elementFilestyle.find(".badge").attr({"class":"badge "+this.options.badgeName}))},htmlIcon:function(e){return void 0!==e&&(this.options.htmlIcon=e),this.options.htmlIcon},htmlInput:function(){return this.options.input?' ':""},pushNameFiles:function(){var e="",t=[];void 0===this.$element[0].files?t[0]={name:this.$element[0]&&this.$element[0].value}:t=this.$element[0].files;for(var i=0;i",n=i.options.buttonBefore?l+i.htmlInput():i.htmlInput()+l,i.$elementFilestyle=e('
'+n+"
"),i.$elementFilestyle.find(".group-span-filestyle").attr("tabindex","0").keypress(function(e){return 13===e.keyCode||32===e.charCode?(i.$elementFilestyle.find("label").click(),!1):void 0}),i.$element.css({position:"absolute",clip:"rect(0px 0px 0px 0px)"}).attr("tabindex","-1").after(i.$elementFilestyle),i.$elementFilestyle.find(i.options.buttonBefore?"label":":input").css({"border-top-left-radius":".25rem","border-bottom-left-radius":".25rem"}),i.$elementFilestyle.find('[name="filedrag"]').css({position:"absolute",width:"100%",height:i.$elementFilestyle.height()+"px","z-index":-1}),(i.options.disabled||i.$element.attr("disabled"))&&(i.$element.attr("disabled","true"),i.options.disabled?i.$elementFilestyle.find("label").css("opacity","0.65"):i.$elementFilestyle.find("label").css("opacity","1")),i.$element.change(function(){var e=i.pushNameFiles();i.options.badge?0==i.$elementFilestyle.find(".badge").length?i.$elementFilestyle.find("label").append(' '+e.length+""):0==e.length?i.$elementFilestyle.find(".badge").remove():i.$elementFilestyle.find(".badge").html(e.length):i.$elementFilestyle.find(".badge").remove(),i.options.onChange(e)}),window.navigator.userAgent.search(/firefox/i)>-1&&i.$elementFilestyle.find("label").click(function(){return i.$element.click(),!1}),e(document).on("dragover",function(t){t.preventDefault(),t.stopPropagation(),i.options.dragdrop&&e('[name="filedrag"]').css("z-index","9")}).on("drop",function(t){t.preventDefault(),t.stopPropagation(),i.options.dragdrop&&e('[name="filedrag"]').css("z-index","-1")}),i.$elementFilestyle.find('[name="filedrag"]').on("dragover",function(e){e.preventDefault(),e.stopPropagation()}).on("dragenter",function(e){e.preventDefault(),e.stopPropagation()}).on("drop",function(t){if(t.originalEvent.dataTransfer&&!i.options.disabled&&i.options.dragdrop&&t.originalEvent.dataTransfer.files.length){t.preventDefault(),t.stopPropagation(),i.$element[0].files=t.originalEvent.dataTransfer.files;var n=i.pushNameFiles();i.options.badge?0==i.$elementFilestyle.find(".badge").length?i.$elementFilestyle.find("label").append(' '+n.length+""):0==n.length?i.$elementFilestyle.find(".badge").remove():i.$elementFilestyle.find(".badge").html(n.length):i.$elementFilestyle.find(".badge").remove(),i.options.onChange(n),e('[name="filedrag"]').css("z-index","-1")}})}};var n=e.fn.filestyle;e.fn.filestyle=function(t,n){var s="",l=this.each(function(){if("file"===e(this).attr("type")){var l=e(this),o=l.data("filestyle"),a=e.extend({},e.fn.filestyle.defaults,t,"object"==typeof t&&t);o||(l.data("filestyle",o=new i(this,a)),o.constructor()),"string"==typeof t&&(s=o[t](n))}});return void 0!==typeof s?s:l},e.fn.filestyle.defaults={text:"Choose file",htmlIcon:"",btnClass:"btn-secondary",size:"nr",input:!0,badge:!1,badgeName:"badge-light",buttonBefore:!1,dragdrop:!0,disabled:!1,placeholder:"",onChange:function(){}},e.fn.filestyle.noConflict=function(){return e.fn.filestyle=n,this},e(function(){e(".filestyle").each(function(){var t=e(this),i={input:"false"!==t.attr("data-input"),htmlIcon:t.attr("data-icon"),buttonBefore:"true"===t.attr("data-buttonBefore"),disabled:"true"===t.attr("data-disabled"),size:t.attr("data-size"),text:t.attr("data-text"),btnClass:t.attr("data-btnClass"),badge:"true"===t.attr("data-badge"),dragdrop:"false"!==t.attr("data-dragdrop"),badgeName:t.attr("data-badgeName"),placeholder:t.attr("data-placeholder")};t.filestyle(i)})})}(window.jQuery); \ No newline at end of file diff --git a/test/index.html b/test/index.html index f38c0d5..d202240 100644 --- a/test/index.html +++ b/test/index.html @@ -22,7 +22,6 @@ - @@ -76,7 +75,7 @@

Testing Options JavaScript

- +
@@ -165,7 +164,7 @@

Testing initialize via data attributes

- +
@@ -175,6 +174,7 @@

Testing initialize via data attributes

+