Skip to content

Commit f75ba1e

Browse files
blueimpblueimp
committed
Updated to Bootstrap 3 release version.
Removed Font Awesome in favor of using Glyphicons included in Bootstrap 3.
1 parent 6ef84e0 commit f75ba1e

5 files changed

Lines changed: 52 additions & 65 deletions

File tree

‎angularjs.html‎

Lines changed: 15 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE HTML>
22
<!--
33
/*
4-
* jQuery File Upload Plugin AngularJS Demo 1.6.1
4+
* jQuery File Upload Plugin AngularJS Demo 1.6.2
55
* https://github.com/blueimp/jQuery-File-Upload
66
*
77
* Copyright 2013, Sebastian Tschan
@@ -22,9 +22,7 @@
2222
<meta name="description" content="File Upload widget with multiple file selection, drag&amp;drop support, progress bars, validation and preview images, audio and video for AngularJS. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.">
2323
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2424
<!-- Bootstrap styles -->
25-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap.min.css">
26-
<!-- Font Awesome icons -->
27-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
25+
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
2826
<!-- Generic page styles -->
2927
<link rel="stylesheet" href="css/style.css">
3028
<!-- blueimp Gallery styles -->
@@ -41,22 +39,22 @@
4139
</style>
4240
</head>
4341
<body>
44-
<div class="navbar navbar-fixed-top">
42+
<div class="navbar navbar-default navbar-fixed-top">
4543
<div class="container">
4644
<div class="navbar-header">
47-
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
45+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-fixed-top .navbar-collapse">
4846
<span class="icon-bar"></span>
4947
<span class="icon-bar"></span>
5048
<span class="icon-bar"></span>
5149
</button>
5250
<a class="navbar-brand" href="https://github.com/blueimp/jQuery-File-Upload">jQuery File Upload</a>
5351
</div>
54-
<div class="navbar-collapse collapse navbar-responsive-collapse">
52+
<div class="navbar-collapse collapse">
5553
<ul class="nav navbar-nav">
5654
<li><a href="https://github.com/blueimp/jQuery-File-Upload/tags">Download</a></li>
5755
<li><a href="https://github.com/blueimp/jQuery-File-Upload">Source Code</a></li>
5856
<li><a href="https://github.com/blueimp/jQuery-File-Upload/wiki">Documentation</a></li>
59-
<li><a href="https://blueimp.net">&copy; blueimp.net</a></li>
57+
<li><a href="https://blueimp.net">&copy; Sebastian Tschan</a></li>
6058
</ul>
6159
</div>
6260
</div>
@@ -87,16 +85,16 @@ <h2 class="lead">AngularJS version</h2>
8785
<div class="col-lg-7">
8886
<!-- The fileinput-button span is used to style the file input field as button -->
8987
<span class="btn btn-success fileinput-button" ng-class="{disabled: disabled}">
90-
<i class="icon-plus icon-white"></i>
88+
<i class="glyphicon glyphicon-plus"></i>
9189
<span>Add files...</span>
9290
<input type="file" name="files[]" multiple ng-disabled="disabled">
9391
</span>
9492
<button type="button" class="btn btn-primary start" data-ng-click="submit()">
95-
<i class="icon-upload icon-white"></i>
93+
<i class="glyphicon glyphicon-upload"></i>
9694
<span>Start upload</span>
9795
</button>
9896
<button type="button" class="btn btn-warning cancel" data-ng-click="cancel()">
99-
<i class="icon-ban-circle icon-white"></i>
97+
<i class="glyphicon glyphicon-ban-circle"></i>
10098
<span>Cancel upload</span>
10199
</button>
102100
<!-- The loading indicator is shown during file processing -->
@@ -135,23 +133,23 @@ <h2 class="lead">AngularJS version</h2>
135133
</td>
136134
<td>
137135
<button type="button" class="btn btn-primary start" data-ng-click="file.$submit()" data-ng-hide="!file.$submit">
138-
<i class="icon-upload icon-white"></i>
136+
<i class="glyphicon glyphicon-upload"></i>
139137
<span>Start</span>
140138
</button>
141139
<button type="button" class="btn btn-warning cancel" data-ng-click="file.$cancel()" data-ng-hide="!file.$cancel">
142-
<i class="icon-ban-circle icon-white"></i>
140+
<i class="glyphicon glyphicon-ban-circle"></i>
143141
<span>Cancel</span>
144142
</button>
145143
<button data-ng-controller="FileDestroyController" type="button" class="btn btn-danger destroy" data-ng-click="file.$destroy()" data-ng-hide="!file.$destroy">
146-
<i class="icon-ban-circle icon-white"></i>
144+
<i class="glyphicon glyphicon-trash"></i>
147145
<span>Delete</span>
148146
</button>
149147
</td>
150148
</tr>
151149
</table>
152150
</form>
153151
<br>
154-
<div class="panel">
152+
<div class="panel panel-default">
155153
<div class="panel-heading">
156154
<h3 class="panel-title">Demo Notes</h3>
157155
</div>
@@ -162,7 +160,7 @@ <h3 class="panel-title">Demo Notes</h3>
162160
<li>Uploaded files will be deleted automatically after <strong>5 minutes</strong> (demo setting).</li>
163161
<li>You can <strong>drag &amp; drop</strong> files from your desktop on this webpage (see <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support">Browser support</a>).</li>
164162
<li>Please refer to the <a href="https://github.com/blueimp/jQuery-File-Upload">project website</a> and <a href="https://github.com/blueimp/jQuery-File-Upload/wiki">documentation</a> for more information.</li>
165-
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a>.</li>
163+
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://glyphicons.com/">Glyphicons</a>.</li>
166164
</ul>
167165
</div>
168166
</div>
@@ -186,9 +184,8 @@ <h3 class="title"></h3>
186184
<!-- The Canvas to Blob plugin is included for image resizing functionality -->
187185
<script src="http://blueimp.github.io/JavaScript-Canvas-to-Blob/js/canvas-to-blob.min.js"></script>
188186
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
189-
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/js/bootstrap.min.js"></script>
187+
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
190188
<!-- blueimp Gallery script -->
191-
<script src="http://blueimp.github.io/Gallery/js/blueimp-gallery.min.js"></script>
192189
<script src="http://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script>
193190
<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
194191
<script src="js/jquery.iframe-transport.js"></script>

‎basic-plus.html‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE HTML>
22
<!--
33
/*
4-
* jQuery File Upload Plugin Basic Plus Demo 1.3.1
4+
* jQuery File Upload Plugin Basic Plus Demo 1.3.2
55
* https://github.com/blueimp/jQuery-File-Upload
66
*
77
* Copyright 2013, Sebastian Tschan
@@ -20,31 +20,29 @@
2020
<meta name="description" content="File Upload widget with multiple file selection, drag&amp;drop support, progress bar, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.">
2121
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2222
<!-- Bootstrap styles -->
23-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap.min.css">
24-
<!-- Font Awesome icons -->
25-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
23+
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
2624
<!-- Generic page styles -->
2725
<link rel="stylesheet" href="css/style.css">
2826
<!-- CSS to style the file input field as button and adjust the Bootstrap progress bars -->
2927
<link rel="stylesheet" href="css/jquery.fileupload-ui.css">
3028
</head>
3129
<body>
32-
<div class="navbar navbar-fixed-top">
30+
<div class="navbar navbar-default navbar-fixed-top">
3331
<div class="container">
3432
<div class="navbar-header">
35-
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
33+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-fixed-top .navbar-collapse">
3634
<span class="icon-bar"></span>
3735
<span class="icon-bar"></span>
3836
<span class="icon-bar"></span>
3937
</button>
4038
<a class="navbar-brand" href="https://github.com/blueimp/jQuery-File-Upload">jQuery File Upload</a>
4139
</div>
42-
<div class="navbar-collapse collapse navbar-responsive-collapse">
40+
<div class="navbar-collapse collapse">
4341
<ul class="nav navbar-nav">
4442
<li><a href="https://github.com/blueimp/jQuery-File-Upload/tags">Download</a></li>
4543
<li><a href="https://github.com/blueimp/jQuery-File-Upload">Source Code</a></li>
4644
<li><a href="https://github.com/blueimp/jQuery-File-Upload/wiki">Documentation</a></li>
47-
<li><a href="https://blueimp.net">&copy; blueimp.net</a></li>
45+
<li><a href="https://blueimp.net">&copy; Sebastian Tschan</a></li>
4846
</ul>
4947
</div>
5048
</div>
@@ -68,7 +66,7 @@ <h2 class="lead">Basic Plus version</h2>
6866
<br>
6967
<!-- The fileinput-button span is used to style the file input field as button -->
7068
<span class="btn btn-success fileinput-button">
71-
<i class="icon-plus icon-white"></i>
69+
<i class="glyphicon glyphicon-plus"></i>
7270
<span>Add files...</span>
7371
<!-- The file input field used as target for the file upload widget -->
7472
<input id="fileupload" type="file" name="files[]" multiple>
@@ -82,7 +80,7 @@ <h2 class="lead">Basic Plus version</h2>
8280
<!-- The container for the uploaded files -->
8381
<div id="files" class="files"></div>
8482
<br>
85-
<div class="panel">
83+
<div class="panel panel-default">
8684
<div class="panel-heading">
8785
<h3 class="panel-title">Demo Notes</h3>
8886
</div>
@@ -93,7 +91,7 @@ <h3 class="panel-title">Demo Notes</h3>
9391
<li>Uploaded files will be deleted automatically after <strong>5 minutes</strong> (demo setting).</li>
9492
<li>You can <strong>drag &amp; drop</strong> files from your desktop on this webpage (see <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support">Browser support</a>).</li>
9593
<li>Please refer to the <a href="https://github.com/blueimp/jQuery-File-Upload">project website</a> and <a href="https://github.com/blueimp/jQuery-File-Upload/wiki">documentation</a> for more information.</li>
96-
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a>.</li>
94+
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://glyphicons.com/">Glyphicons</a>.</li>
9795
</ul>
9896
</div>
9997
</div>
@@ -106,7 +104,7 @@ <h3 class="panel-title">Demo Notes</h3>
106104
<!-- The Canvas to Blob plugin is included for image resizing functionality -->
107105
<script src="http://blueimp.github.io/JavaScript-Canvas-to-Blob/js/canvas-to-blob.min.js"></script>
108106
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
109-
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/js/bootstrap.min.js"></script>
107+
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
110108
<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
111109
<script src="js/jquery.iframe-transport.js"></script>
112110
<!-- The basic File Upload plugin -->

‎basic.html‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE HTML>
22
<!--
33
/*
4-
* jQuery File Upload Plugin Basic Demo 1.2.1
4+
* jQuery File Upload Plugin Basic Demo 1.2.2
55
* https://github.com/blueimp/jQuery-File-Upload
66
*
77
* Copyright 2013, Sebastian Tschan
@@ -20,31 +20,29 @@
2020
<meta name="description" content="File Upload widget with multiple file selection, drag&amp;drop support and progress bar for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.">
2121
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2222
<!-- Bootstrap styles -->
23-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap.min.css">
24-
<!-- Font Awesome icons -->
25-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
23+
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
2624
<!-- Generic page styles -->
2725
<link rel="stylesheet" href="css/style.css">
2826
<!-- CSS to style the file input field as button and adjust the Bootstrap progress bars -->
2927
<link rel="stylesheet" href="css/jquery.fileupload-ui.css">
3028
</head>
3129
<body>
32-
<div class="navbar navbar-fixed-top">
30+
<div class="navbar navbar-default navbar-fixed-top">
3331
<div class="container">
3432
<div class="navbar-header">
35-
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
33+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-fixed-top .navbar-collapse">
3634
<span class="icon-bar"></span>
3735
<span class="icon-bar"></span>
3836
<span class="icon-bar"></span>
3937
</button>
4038
<a class="navbar-brand" href="https://github.com/blueimp/jQuery-File-Upload">jQuery File Upload</a>
4139
</div>
42-
<div class="navbar-collapse collapse navbar-responsive-collapse">
40+
<div class="navbar-collapse collapse">
4341
<ul class="nav navbar-nav">
4442
<li><a href="https://github.com/blueimp/jQuery-File-Upload/tags">Download</a></li>
4543
<li><a href="https://github.com/blueimp/jQuery-File-Upload">Source Code</a></li>
4644
<li><a href="https://github.com/blueimp/jQuery-File-Upload/wiki">Documentation</a></li>
47-
<li><a href="https://blueimp.net">&copy; blueimp.net</a></li>
45+
<li><a href="https://blueimp.net">&copy; Sebastian Tschan</a></li>
4846
</ul>
4947
</div>
5048
</div>
@@ -68,7 +66,7 @@ <h2 class="lead">Basic version</h2>
6866
<br>
6967
<!-- The fileinput-button span is used to style the file input field as button -->
7068
<span class="btn btn-success fileinput-button">
71-
<i class="icon-plus icon-white"></i>
69+
<i class="glyphicon glyphicon-plus"></i>
7270
<span>Select files...</span>
7371
<!-- The file input field used as target for the file upload widget -->
7472
<input id="fileupload" type="file" name="files[]" multiple>
@@ -82,7 +80,7 @@ <h2 class="lead">Basic version</h2>
8280
<!-- The container for the uploaded files -->
8381
<div id="files" class="files"></div>
8482
<br>
85-
<div class="panel">
83+
<div class="panel panel-default">
8684
<div class="panel-heading">
8785
<h3 class="panel-title">Demo Notes</h3>
8886
</div>
@@ -93,7 +91,7 @@ <h3 class="panel-title">Demo Notes</h3>
9391
<li>Uploaded files will be deleted automatically after <strong>5 minutes</strong> (demo setting).</li>
9492
<li>You can <strong>drag &amp; drop</strong> files from your desktop on this webpage (see <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support">Browser support</a>).</li>
9593
<li>Please refer to the <a href="https://github.com/blueimp/jQuery-File-Upload">project website</a> and <a href="https://github.com/blueimp/jQuery-File-Upload/wiki">documentation</a> for more information.</li>
96-
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a>.</li>
94+
<li>Built with Twitter's <a href="http://twitter.github.com/bootstrap/">Bootstrap</a> CSS framework and Icons from <a href="http://glyphicons.com/">Glyphicons</a>.</li>
9795
</ul>
9896
</div>
9997
</div>
@@ -106,7 +104,7 @@ <h3 class="panel-title">Demo Notes</h3>
106104
<!-- The basic File Upload plugin -->
107105
<script src="js/jquery.fileupload.js"></script>
108106
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
109-
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/js/bootstrap.min.js"></script>
107+
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
110108
<script>
111109
/*jslint unparam: true */
112110
/*global window, $ */

‎css/style.css‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@charset "UTF-8";
22
/*
3-
* jQuery File Upload Plugin CSS Example 8.8.1
3+
* jQuery File Upload Plugin CSS Example 8.8.2
44
* https://github.com/blueimp/jQuery-File-Upload
55
*
66
* Copyright 2013, Sebastian Tschan
@@ -13,7 +13,3 @@
1313
body {
1414
padding-top: 60px;
1515
}
16-
17-
body > .container {
18-
padding: 0 15px;
19-
}

0 commit comments

Comments
 (0)