Merge branch 'master' of https://github.com/markusslima/bootstrap-fil…

…estyle
markusslima · Aug 17, 2017 · cd192c5 · cd192c5
2 parents 27654e2 + 8d885e0
commit cd192c5
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 14 deletions.
diff --git a/src/bootstrap-filestyle.js b/src/bootstrap-filestyle.js
@@ -139,6 +139,19 @@
 			}
 		},
 
+		badge : function(value) {
+			if (value === true) {
+				this.options.badge = value;
+				var files = this.pushNameFiles();
+				this.$elementFilestyle.find('label').append(' <span class="badge '+this.options.badgeName+'">' + files.length + '</span>');
+			} else if (value === false) {
+				this.options.badge = value;
+				this.$elementFilestyle.find('.badge').remove();
+			} else {
+				return this.options.badge;
+			}
+		},
+
 		badgeName : function(value) {
 			if (value !== undefined) {
 				this.options.badgeName = value;
@@ -242,8 +255,7 @@
 			// Getting input file value
 			_self.$element.change(function() {
 				var files = _self.pushNameFiles();
-
-				if (_self.options.input == false && _self.options.badge) {
+				if (_self.options.badge) {
 					if (_self.$elementFilestyle.find('.badge').length == 0) {
 						_self.$elementFilestyle.find('label').append(' <span class="badge '+_self.options.badgeName+'">' + files.length + '</span>');
 					} else if (files.length == 0) {
@@ -300,8 +312,8 @@
 		'btnClass' : 'btn-secondary',
 		'size' : 'nr',
 		'input' : true,
-		'badge' : true,
-		'badgeName': 'badge-secondary',
+		'badge' : false,
+		'badgeName': 'badge-light',
 		'buttonBefore' : false,
 		'disabled' : false,
 		'placeholder': '',
@@ -323,8 +335,8 @@
 				'size' : $this.attr('data-size'),
 				'text' : $this.attr('data-text'),
 				'btnClass' : $this.attr('data-btnClass'),
-				'badge' : $this.attr('data-badge') !== 'false',
-				'badgeName' : $this.attr('data-badge'),
+				'badge' : $this.attr('data-badge') === 'true',
+				'badgeName' : $this.attr('data-badgeName'),
 				'placeholder': $this.attr('data-placeholder')
 			};
 

diff --git a/src/bootstrap-filestyle.min.js b/src/bootstrap-filestyle.min.js
diff --git a/test/index.html b/test/index.html
@@ -7,7 +7,7 @@
 		<title>Testing - Bootstrap FileStyle</title>
 
 		<link rel="icon" type="image/png" href="icons/favicon.png">
-		<link href="css/bootstrap.min.css" rel="stylesheet">
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
 		<link href="open-iconic/font/css/open-iconic-bootstrap.css" rel="stylesheet">
 		<style type="text/css" rel="stylesheet">
 			body {
@@ -21,9 +21,10 @@
 		<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
 		<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
 		<![endif]-->
-		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-		<script type="text/javascript" src="js/bootstrap.js"></script>
-		<script type="text/javascript" src="../src/bootstrap-filestyle.min.js"></script>
+		<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
+		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
+		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
+		<script type="text/javascript" src="../src/bootstrap-filestyle.js"></script>
 	</head>
 
 	<body>
@@ -70,7 +71,10 @@ <h3>Testing Options JavaScript</h3>
 							<input type="file" id="input001">
 						</div>
 						<div class="form-group">
-							<label>No input and file count <button type="button" class="btn btn-secondary btn-sm" id="countRed">Count red</button></label>
+							<label>No input and file count 
+								<button type="button" class="btn btn-secondary btn-sm" id="countRed">Count red</button>
+								<button type="button" class="btn btn-secondary btn-sm" id="countToggle">Toggle</button>
+							</label>
 							<input type="file" id="input03" multiple="multiple">
 						</div>
 						<div class="form-group">
@@ -164,7 +168,7 @@ <h3>Testing initialize via data attributes</h3>
 						</div>
 						<div class="form-group">
 							<label class="control-label">Multiples data attributes</label>
-							<input type="file" class="filestyle" data-text="Open" data-input="false" data-iconName="glyphicon-plus" data-classButton="btn btn-primary">
+							<input type="file" class="filestyle" data-text="Open" data-input="false" data-iconName="glyphicon-plus" data-btnClass="btn-primary">
 						</div>
 					</form>
 				</div>
@@ -181,8 +185,10 @@ <h3>Testing initialize via data attributes</h3>
 			});
 
 			$('#input03').filestyle({
+				badge: true,
 				input : false,
-				btnClass : 'btn-primary'
+				btnClass : 'btn-primary',
+				htmlIcon : '<span class="oi oi-folder"></span> '
 			});
 
 			$('#input04').filestyle({
@@ -250,6 +256,13 @@ <h3>Testing initialize via data attributes</h3>
 			$('#countRed').on('click', function () {
 				$('#input03').filestyle('badgeName', 'badge-danger');
 			})
+
+			$('#countToggle').on('click', function () {
+				if ($('#input03').filestyle('badge'))
+					$('#input03').filestyle('badge', false);
+				else
+					$('#input03').filestyle('badge', true);
+			})
 		</script>
 	</body>
 </html>