Browse Source

Upgrade to release v2.3.0

Kartik Visweswaran 10 years ago
parent
commit
f355244714

+ 8 - 0
CHANGE.md

@@ -1,8 +1,16 @@
+version 2.3.0
+=============
+**Date:** 19-Sep-2014
+
+1. (enh #26): Added support for previewing flash and video files.
+2. Better replacement of tags in templates. Replaces all tag occurences with this new release.
+
 version 2.2.0
 version 2.2.0
 =============
 =============
 **Date:** 19-Aug-2014
 **Date:** 19-Aug-2014
 
 
 1. (enh #24): Update readAsBinaryString to readAsArrayBuffer
 1. (enh #24): Update readAsBinaryString to readAsArrayBuffer
+2. (enh #25): Graceful degrade to normal file input for older browsers (including previous versions of Safari).
 
 
 version 2.1.0
 version 2.1.0
 =============
 =============

+ 42 - 4
README.md

@@ -5,7 +5,7 @@ An enhanced HTML 5 file input for Bootstrap 3.x with file preview for images and
 
 
 ![File Input Screenshot](https://lh6.googleusercontent.com/-2niyujIaat0/UyqzA_78OQI/AAAAAAAAADE/f6IJkr11uA8/w666-h418-no/fileinput-screenshot.jpg)
 ![File Input Screenshot](https://lh6.googleusercontent.com/-2niyujIaat0/UyqzA_78OQI/AAAAAAAAADE/f6IJkr11uA8/w666-h418-no/fileinput-screenshot.jpg)
 
 
-> NOTE: The latest version of the plugin v2.1.0 has been released. Refer the [CHANGE LOG](https://github.com/kartik-v/bootstrap-fileinput/blob/master/CHANGE.md) for details.
+> NOTE: The latest version of the plugin v2.3.0 has been released. Refer the [CHANGE LOG](https://github.com/kartik-v/bootstrap-fileinput/blob/master/CHANGE.md) for details.
 
 
 ## Features  
 ## Features  
 
 
@@ -13,7 +13,7 @@ An enhanced HTML 5 file input for Bootstrap 3.x with file preview for images and
 2. The file input consists of the following three sections with options and templates to control the display:
 2. The file input consists of the following three sections with options and templates to control the display:
    - file caption section: to display a brief information of the file(s) selected
    - file caption section: to display a brief information of the file(s) selected
    - file action buttons section: to browse, remove, and upload files.
    - file action buttons section: to browse, remove, and upload files.
-   - file preview section: to display the selected files on client for preview (supports images and text file types). Other file types will be displayed as normal thumbnails.
+   - file preview section: to display the selected files on client for preview (supports preview of image, text, flash, and video file types). Other file types will be displayed as normal thumbnails.
 3. The plugin automatically converts an input with `type = file` to an advanced file picker input if you set its `class = file`. All options to the input can be passed as HTML5 `data` attributes.
 3. The plugin automatically converts an input with `type = file` to an advanced file picker input if you set its `class = file`. All options to the input can be passed as HTML5 `data` attributes.
 4. Ability to select and preview multiple files. Uses HTML 5 File reader API to read and preview files. Displays the progress of files being being loaded onto the preview zone, in case many files are chosen.
 4. Ability to select and preview multiple files. Uses HTML 5 File reader API to read and preview files. Displays the progress of files being being loaded onto the preview zone, in case many files are chosen.
 5. Offers predefined templates and CSS classes which can be changed to style your file-input display as per your needs.
 5. Offers predefined templates and CSS classes which can be changed to style your file-input display as per your needs.
@@ -32,7 +32,12 @@ An enhanced HTML 5 file input for Bootstrap 3.x with file preview for images and
 11. Upload action defaults to form submit. Supports an upload route/server action parameter for custom ajax based upload.
 11. Upload action defaults to form submit. Supports an upload route/server action parameter for custom ajax based upload.
 12. Triggers JQuery events for advanced development. Events currently available are `filereset`, `fileclear`, `filecleared`, `fileloaded`, and `fileerror`.
 12. Triggers JQuery events for advanced development. Events currently available are `filereset`, `fileclear`, `filecleared`, `fileloaded`, and `fileerror`.
 13. Disabled and readonly file input support.
 13. Disabled and readonly file input support.
-14. Size of the entire plugin is less than 6KB if gzipped. The minified assets are less than 19KB (about 16KB for the minified JS and 3KB for the minified CSS).
+14. Size of the entire plugin is less than 6KB if gzipped. The minified assets are less than 21KB (about 18KB for the minified JS and 3KB for the minified CSS).
+
+> **NEW:** With release v2.3.0, the plugin now supports preview of flash and video files. Flash video preview will require Shockwave flash to be installed and supported by the client browser.
+Videos will be previewed using the new HTML5 `video` tag. Note that browsers have limited support for the HTML5 `video` element including specific video 
+formats (e.g. mp4, webm, ogg). The size of video files are recommended to be small (controlled through `maxFileSize` property) for not affecting your 
+browser preview performance. You can copy a few files from the `examples` directory of this plugin repo, to test a few examples of flash and video files.
 
 
 ## Demo
 ## Demo
 
 
@@ -42,7 +47,7 @@ View the [plugin documentation](http://plugins.krajee.com/file-input) and [plugi
 
 
 1. [Bootstrap 3.x](http://getbootstrap.com/)
 1. [Bootstrap 3.x](http://getbootstrap.com/)
 2. Latest [JQuery](http://jquery.com/)
 2. Latest [JQuery](http://jquery.com/)
-3. Most modern browsers supporting HTML5 file inputs and FileReader API including CSS3 & JQuery. For Internet Explorer, one must use IE versions 10 and above. IE9 and below will work as a normal file input, and will not support multiple file selection or the HTML 5 FileReader API.
+3. Most modern browsers supporting HTML5 (inputs and FileReader API) including CSS3 & JQuery. For Internet Explorer, one must use IE versions 10 and above. IE9 and below will work as a normal file input, and will not support multiple file selection or the HTML 5 FileReader API.
 
 
 ## Restrictions
 ## Restrictions
 The plugin supports only file input and preview at client level. It does not actually process the upload of the files to the server.
 The plugin supports only file input and preview at client level. It does not actually process the upload of the files to the server.
@@ -276,6 +281,39 @@ The following variables will be parsed:
 </div>
 </div>
 ```
 ```
 
 
+#### previewFlashTemplate
+_string_ the template markup for previewing flash files within the preview container. Defaults to `FLASH_TEMPLATE` as shown below.
+The following variables will be parsed:
+
+- `{previewId}`: the previewed file container identifier
+- `{caption}`: the file name to be displayed on hover
+- `{media}`: the flash content to be previewed
+
+```html
+'<div class="file-preview-frame" id="{previewId}" title="{caption}">
+    <object type="application/x-shockwave-flash" data="{media}" width="320" height="240">
+        <param name="movie" value="{media}" />
+        <param name="quality" value="high" />
+    </object>
+</div>
+```
+
+#### previewVideoTemplate
+_string_ the template markup for previewing video files within the preview container. Defaults to `VIDEO_TEMPLATE` as shown below.
+The following variables will be parsed:
+
+- `{previewId}`: the previewed file container identifier
+- `{caption}`: the file name to be displayed on hover
+- `{media}`: the flash content to be previewed
+- `{type}`: the type of video file to be previewed
+
+```html
+'<div class="file-preview-frame" id="{previewId}" title="{caption}">
+    <source src="{media}" type="{type}">
+    <small>The video format of "{caption}" is not supported by your browser for preview (must be one mp4, webm, 3gp, ogg).</small>
+</div>
+```
+
 #### previewOtherTemplate
 #### previewOtherTemplate
 _string_ the template markup for previewing all other files within the preview container. Defaults to `OTHER_TEMPLATE` as shown below.
 _string_ the template markup for previewing all other files within the preview container. Defaults to `OTHER_TEMPLATE` as shown below.
 The following variables will be parsed:
 The following variables will be parsed:

+ 1 - 1
bower.json

@@ -1,6 +1,6 @@
 {
 {
     "name": "bootstrap-fileinput",
     "name": "bootstrap-fileinput",
-    "version": "2.2.0",
+    "version": "2.3.0",
     "homepage": "https://github.com/kartik-v/bootstrap-fileinput",
     "homepage": "https://github.com/kartik-v/bootstrap-fileinput",
     "authors": [
     "authors": [
         "Kartik Visweswaran <[email protected]>"
         "Kartik Visweswaran <[email protected]>"

+ 2 - 2
css/fileinput.css

@@ -1,12 +1,12 @@
 /*!
 /*!
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
  * @package bootstrap-fileinput
  * @package bootstrap-fileinput
- * @version 2.0.0
+ * @version 2.3.0
  *
  *
  * File input styling for Bootstrap 3.0
  * File input styling for Bootstrap 3.0
  * Built for Yii Framework 2.0
  * Built for Yii Framework 2.0
  * Author: Kartik Visweswaran
  * Author: Kartik Visweswaran
- * Year: 2013
+ * Year: 2014
  * For more Yii related demos visit http://demos.krajee.com
  * For more Yii related demos visit http://demos.krajee.com
  */
  */
 .file-input {
 .file-input {

+ 2 - 2
css/fileinput.min.css

@@ -1,11 +1,11 @@
 /*!
 /*!
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
  * @package bootstrap-fileinput
  * @package bootstrap-fileinput
- * @version 2.0.0
+ * @version 2.3.0
  *
  *
  * File input styling for Bootstrap 3.0
  * File input styling for Bootstrap 3.0
  * Built for Yii Framework 2.0
  * Built for Yii Framework 2.0
  * Author: Kartik Visweswaran
  * Author: Kartik Visweswaran
- * Year: 2013
+ * Year: 2014
  * For more Yii related demos visit http://demos.krajee.com
  * For more Yii related demos visit http://demos.krajee.com
  */.file-input{overflow-x:auto}.file-loading{top:0;right:0;width:25px;height:25px;font-size:999px;text-align:right;color:#fff;background:transparent url(../img/loading.gif) top left no-repeat;border:none}.btn-file{position:relative;overflow:hidden}.btn-file input[type=file]{position:absolute;top:0;right:0;min-width:100%;min-height:100%;text-align:right;filter:alpha(opacity=0);opacity:0;background:none repeat scroll 0 0 transparent;cursor:inherit;display:block}.file-caption .glyphicon{display:inline-block;min-width:18px;float:left;margin-top:2px}.file-caption-name{display:inline-block;float:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:85%}.file-error-message{background-color:#f2dede;color:#a94442;text-align:center;border-radius:5px;padding:5px}.file-caption-disabled{background-color:#EEE;cursor:not-allowed;opacity:1}.file-input .btn .disabled,.file-input .btn[disabled]{cursor:not-allowed}.file-preview{border-radius:5px;border:1px solid #ddd;padding:5px;width:100%;margin-bottom:5px}.file-preview-frame{display:table;margin:8px;height:160px;border:1px solid #ddd;box-shadow:1px 1px 5px 0 #a2958a;padding:6px;float:left;text-align:center}.file-preview-frame:hover{background-color:#eee;box-shadow:2px 2px 5px 0 #333}.file-preview-image{height:150px;vertical-align:text-center}.file-preview-text{display:table-cell;width:150px;height:150px;color:#428bca;font-size:11px;vertical-align:middle;text-align:center}.file-preview-other{display:table-cell;width:150px;height:150px;font-family:Monaco,Consolas,monospace;font-size:11px;vertical-align:middle;text-align:center}.file-input-new .close,.file-input-new .file-preview,.file-input-new .fileinput-remove-button,.file-input-new .fileinput-upload-button,.file-input-new .glyphicon-file{display:none}.loading{background:transparent url(../img/loading.gif) no-repeat scroll center center content-box!important}.wrap-indicator{font-weight:700;color:#245269;cursor:pointer}
  */.file-input{overflow-x:auto}.file-loading{top:0;right:0;width:25px;height:25px;font-size:999px;text-align:right;color:#fff;background:transparent url(../img/loading.gif) top left no-repeat;border:none}.btn-file{position:relative;overflow:hidden}.btn-file input[type=file]{position:absolute;top:0;right:0;min-width:100%;min-height:100%;text-align:right;filter:alpha(opacity=0);opacity:0;background:none repeat scroll 0 0 transparent;cursor:inherit;display:block}.file-caption .glyphicon{display:inline-block;min-width:18px;float:left;margin-top:2px}.file-caption-name{display:inline-block;float:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:85%}.file-error-message{background-color:#f2dede;color:#a94442;text-align:center;border-radius:5px;padding:5px}.file-caption-disabled{background-color:#EEE;cursor:not-allowed;opacity:1}.file-input .btn .disabled,.file-input .btn[disabled]{cursor:not-allowed}.file-preview{border-radius:5px;border:1px solid #ddd;padding:5px;width:100%;margin-bottom:5px}.file-preview-frame{display:table;margin:8px;height:160px;border:1px solid #ddd;box-shadow:1px 1px 5px 0 #a2958a;padding:6px;float:left;text-align:center}.file-preview-frame:hover{background-color:#eee;box-shadow:2px 2px 5px 0 #333}.file-preview-image{height:150px;vertical-align:text-center}.file-preview-text{display:table-cell;width:150px;height:150px;color:#428bca;font-size:11px;vertical-align:middle;text-align:center}.file-preview-other{display:table-cell;width:150px;height:150px;font-family:Monaco,Consolas,monospace;font-size:11px;vertical-align:middle;text-align:center}.file-input-new .close,.file-input-new .file-preview,.file-input-new .fileinput-remove-button,.file-input-new .fileinput-upload-button,.file-input-new .glyphicon-file{display:none}.loading{background:transparent url(../img/loading.gif) no-repeat scroll center center content-box!important}.wrap-indicator{font-weight:700;color:#245269;cursor:pointer}

BIN
examples/BannerSnack-ad-336x280.swf


BIN
examples/Car-speakers-590x90.swf


BIN
examples/small.3gp


BIN
examples/small.flv


BIN
examples/small.mp4


BIN
examples/small.ogv


BIN
examples/small.webm


+ 101 - 47
js/fileinput.js

@@ -1,6 +1,6 @@
 /*!
 /*!
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
  * @copyright Copyright &copy; Kartik Visweswaran, Krajee.com, 2014
- * @version 2.1.0
+ * @version 2.3.0
  *
  *
  * File input styled for Bootstrap 3.0 that utilizes HTML5 File Input's advanced 
  * File input styled for Bootstrap 3.0 that utilizes HTML5 File Input's advanced 
  * features including the FileReader API. This plugin is inspired by the blog article at
  * features including the FileReader API. This plugin is inspired by the blog article at
@@ -11,7 +11,7 @@
  * upload. In addition it provides the ability to preview content of images and text files. 
  * upload. In addition it provides the ability to preview content of images and text files. 
  * 
  * 
  * Author: Kartik Visweswaran
  * Author: Kartik Visweswaran
- * Copyright: 2013, Kartik Visweswaran, Krajee.com
+ * Copyright: 2014, Kartik Visweswaran, Krajee.com
  * For more JQuery plugins visit http://plugins.krajee.com
  * For more JQuery plugins visit http://plugins.krajee.com
  * For more Yii related demos visit http://demos.krajee.com
  * For more Yii related demos visit http://demos.krajee.com
  */
  */
@@ -63,6 +63,20 @@
             '   </div>\n' +
             '   </div>\n' +
             '</div>\n',
             '</div>\n',
 
 
+        FLASH_TEMPLATE = '<div class="file-preview-frame" id="{previewId}" title="{caption}">\n' +
+            '   <object type="application/x-shockwave-flash" data="{media}" width="320" height="240">\n' +
+            '       <param name="movie" value="{media}" />\n' +
+            '       <param name="quality" value="high" />\n' +
+            '   </object>\n' +
+            '</div>\n',
+
+        VIDEO_TEMPLATE = '<div class="file-preview-frame" id="{previewId}" title="{caption}">\n' +
+            '   <video width="320" height="240" controls>\n' +
+            '       <source src="{media}" type="{type}">\n' +
+            '       <small>The video format of "{caption}" is not supported by your browser for preview (must be one mp4, webm, 3gp, ogg).</small>' +
+            '   </video>\n' +
+            '</div>\n',
+
         OTHER_TEMPLATE = '<div class="file-preview-frame" id="{previewId}">\n' +
         OTHER_TEMPLATE = '<div class="file-preview-frame" id="{previewId}">\n' +
             '   <div class="file-preview-other">\n' +
             '   <div class="file-preview-other">\n' +
             '       <h2><i class="glyphicon glyphicon-file"></i></h2>\n' +
             '       <h2><i class="glyphicon glyphicon-file"></i></h2>\n' +
@@ -72,10 +86,10 @@
 
 
         isEmpty = function (value, trim) {
         isEmpty = function (value, trim) {
             return value === null || value === undefined || value == []
             return value === null || value === undefined || value == []
-                || value === '' || trim && $.trim(value) === '';
+            || value === '' || trim && $.trim(value) === '';
         },
         },
-        isArray = Array.isArray || function (a) {
-            return Object.prototype.toString.call(a) === '[object Array]';
+        isArray = function (a) {
+            return Array.isArray(a) || Object.prototype.toString.call(a) === '[object Array]';
         },
         },
         getValue = function (options, param, value) {
         getValue = function (options, param, value) {
             return (isEmpty(options) || isEmpty(options[param])) ? value : options[param];
             return (isEmpty(options) || isEmpty(options[param])) ? value : options[param];
@@ -89,6 +103,12 @@
         isTextFile = function (type, name) {
         isTextFile = function (type, name) {
             return (typeof type !== "undefined") ? type.match('text.*') : name.match(/\.(txt|md|csv|htm|html|php|ini)$/i);
             return (typeof type !== "undefined") ? type.match('text.*') : name.match(/\.(txt|md|csv|htm|html|php|ini)$/i);
         },
         },
+        isVideoFile = function (type, name) {
+            return (typeof type !== "undefined") ? type.match('video.*') : name.match(/\.(ogg|mp4|webm|3gp|flv)$/i);
+        },
+        isFlashFile = function (type, name) {
+            return typeof type !== "undefined" && type == 'application/x-shockwave-flash' || type.match(/\.(swf)$/i);
+        },
         uniqId = function () {
         uniqId = function () {
             return Math.round(new Date().getTime() + (Math.random() * 100));
             return Math.round(new Date().getTime() + (Math.random() * 100));
         },
         },
@@ -143,6 +163,8 @@
             self.previewTemplate = (self.showPreview) ? options.previewTemplate : '';
             self.previewTemplate = (self.showPreview) ? options.previewTemplate : '';
             self.previewGenericTemplate = options.previewGenericTemplate;
             self.previewGenericTemplate = options.previewGenericTemplate;
             self.previewImageTemplate = options.previewImageTemplate;
             self.previewImageTemplate = options.previewImageTemplate;
+            self.previewFlashTemplate = options.previewFlashTemplate;
+            self.previewVideoTemplate = options.previewVideoTemplate;
             self.previewTextTemplate = options.previewTextTemplate;
             self.previewTextTemplate = options.previewTextTemplate;
             self.previewOtherTemplate = options.previewOtherTemplate;
             self.previewOtherTemplate = options.previewOtherTemplate;
             self.captionTemplate = options.captionTemplate;
             self.captionTemplate = options.captionTemplate;
@@ -204,30 +226,36 @@
         initPreview: function () {
         initPreview: function () {
             var self = this, html = '', content = self.initialPreview, len = self.initialPreviewCount,
             var self = this, html = '', content = self.initialPreview, len = self.initialPreviewCount,
                 cap = self.initialCaption.length, previewId = "preview-" + uniqId(),
                 cap = self.initialCaption.length, previewId = "preview-" + uniqId(),
-                caption = (cap > 0) ? self.initialCaption : self.msgSelected.replace("{n}", len);
+                caption = (cap > 0) ? self.initialCaption : self.msgSelected.replace(/\{n\}/g, len);
             if (isArray(content) && len > 0) {
             if (isArray(content) && len > 0) {
                 for (var i = 0; i < len; i++) {
                 for (var i = 0; i < len; i++) {
                     previewId += '-' + i;
                     previewId += '-' + i;
-                    html += self.previewGenericTemplate.replace("{previewId}", previewId).replace("{content}", content[i]);
-                }
-                if (len > 1 && cap == 0) {
-                    caption = self.msgSelected.replace("{n}", len);
-                }
-            } else if (len > 0) {
-                var fileList = content.split(self.initialDelimiter);
-                for (var i = 0; i < len; i++) {
-                    previewId += '-' + i;
-                    html += self.previewGenericTemplate.replace("{previewId}", previewId).replace("{content}", fileList[i]);
+                    html += self.previewGenericTemplate.replace(/\{previewId\}/g, previewId).replace(/\{content\}/g,
+                        content[i]);
                 }
                 }
                 if (len > 1 && cap == 0) {
                 if (len > 1 && cap == 0) {
-                    caption = self.msgSelected.replace("{n}", len);
+                    caption = self.msgSelected.replace(/\{n\}/g, len);
                 }
                 }
-            } else if (cap > 0) {
-                self.$caption.html(caption);
-                self.$captionContainer.attr('title', caption);
-                return;
             } else {
             } else {
-                return;
+                if (len > 0) {
+                    var fileList = content.split(self.initialDelimiter);
+                    for (var i = 0; i < len; i++) {
+                        previewId += '-' + i;
+                        html += self.previewGenericTemplate.replace(/\{previewId\}/g, previewId).replace(/\{content\}/g,
+                            fileList[i]);
+                    }
+                    if (len > 1 && cap == 0) {
+                        caption = self.msgSelected.replace(/\{n\}/g, len);
+                    }
+                } else {
+                    if (cap > 0) {
+                        self.$caption.html(caption);
+                        self.$captionContainer.attr('title', caption);
+                        return;
+                    } else {
+                        return;
+                    }
+                }
             }
             }
             self.initialPreviewContent = html;
             self.initialPreviewContent = html;
             self.$preview.html(html);
             self.$preview.html(html);
@@ -330,16 +358,16 @@
             var self = this;
             var self = this;
             switch (evt.target.error.code) {
             switch (evt.target.error.code) {
                 case evt.target.error.NOT_FOUND_ERR:
                 case evt.target.error.NOT_FOUND_ERR:
-                    self.addError(self.msgFileNotFound.replace('{name}', caption));
+                    self.addError(self.msgFileNotFound.replace(/\{name\}/g, caption));
                     break;
                     break;
                 case evt.target.error.NOT_READABLE_ERR:
                 case evt.target.error.NOT_READABLE_ERR:
-                    self.addError(self.msgFileNotReadable.replace('{name}', caption));
+                    self.addError(self.msgFileNotReadable.replace(/\{name\}/g, caption));
                     break;
                     break;
                 case evt.target.error.ABORT_ERR:
                 case evt.target.error.ABORT_ERR:
-                    self.addError(self.msgFilePreviewAborted.replace('{name}', caption));
+                    self.addError(self.msgFilePreviewAborted.replace(/\{name\}/g, caption));
                     break;
                     break;
                 default:
                 default:
-                    self.addError(self.msgFilePreviewError.replace('{name}', caption));
+                    self.addError(self.msgFilePreviewError.replace(/\{name\}/g, caption));
             }
             }
         },
         },
         loadImage: function (file, caption) {
         loadImage: function (file, caption) {
@@ -376,15 +404,18 @@
                 }
                 }
                 var previewId = previewInitId + "-" + i;
                 var previewId = previewInitId + "-" + i;
                 var file = files[i], caption = file.name, isImg = isImageFile(file.type, file.name),
                 var file = files[i], caption = file.name, isImg = isImageFile(file.type, file.name),
+                    isFlash = isFlashFile(file.type, file.name), isVideo = isVideoFile(file.type, file.name),
                     isTxt = isTextFile(file.type, file.name), fileSize = (file.size ? file.size : 0) / 1000;
                     isTxt = isTextFile(file.type, file.name), fileSize = (file.size ? file.size : 0) / 1000;
                 fileSize = fileSize.toFixed(2);
                 fileSize = fileSize.toFixed(2);
                 if (self.maxFileSize > 0 && fileSize > self.maxFileSize) {
                 if (self.maxFileSize > 0 && fileSize > self.maxFileSize) {
-                    var msg = self.msgSizeTooLarge.replace('{name}', caption).replace('{size}', fileSize).replace('{maxSize}', self.maxFileSize);
+                    var msg = self.msgSizeTooLarge.replace(/\{name\}/g, caption).replace(/\{size\}/g,
+                        fileSize).replace(/\{maxSize\}/g, self.maxFileSize);
                     self.isError = self.showError(msg, file, previewId, i);
                     self.isError = self.showError(msg, file, previewId, i);
                     return;
                     return;
                 }
                 }
-                if ($preview.length > 0 && (fileType == "any" ? (isImg || isTxt) : (fileType == "text" ? isTxt : isImg)) && typeof FileReader !== "undefined") {
-                    $status.html(msgLoading.replace('{index}', i + 1).replace('{files}', numFiles));
+                var chkPreview = ($preview.length > 0 && typeof FileReader !== "undefined" && (isImg || isTxt || isFlash || isVideo));
+                if (chkPreview) {
+                    $status.html(msgLoading.replace(/\{index\}/g, i + 1).replace(/\{files\}/g, numFiles));
                     $container.addClass('loading');
                     $container.addClass('loading');
                     reader.onerror = function (evt) {
                     reader.onerror = function (evt) {
                         self.errorHandler(evt, caption);
                         self.errorHandler(evt, caption);
@@ -395,18 +426,36 @@
                             var strText = theFile.target.result;
                             var strText = theFile.target.result;
                             if (strText.length > wrapLen) {
                             if (strText.length > wrapLen) {
                                 var id = uniqId(), height = window.innerHeight * .75,
                                 var id = uniqId(), height = window.innerHeight * .75,
-                                    modal = MODAL_TEMPLATE.replace("{id}", id).replace("{title}", caption).replace("{body}", strText).replace("{height}", height);
-                                wrapInd = wrapInd.replace("{title}", caption).replace("{dialog}", "$('#" + id + "').modal('show')");
+                                    modal = MODAL_TEMPLATE.replace(/\{id\}/g, id).replace(/\{title\}/g,
+                                        caption).replace(/\{body\}/g, strText).replace(/\{height\}/g, height);
+                                wrapInd = wrapInd.replace(/\{title\}/g, caption).replace(/\{dialog\}/g,
+                                    "$('#" + id + "').modal('show')");
                                 strText = strText.substring(0, (wrapLen - 1)) + wrapInd;
                                 strText = strText.substring(0, (wrapLen - 1)) + wrapInd;
                             }
                             }
-                            content = self.previewTextTemplate.replace("{previewId}", previewId).replace("{caption}", caption).replace("{strText}", strText) + modal;
+                            content = self.previewTextTemplate.replace(/\{previewId\}/g,
+                                previewId).replace(/\{caption\}/g, caption).replace(/\{strText\}/g, strText) + modal;
                         } else {
                         } else {
-                            content = self.previewImageTemplate.replace("{previewId}", previewId).replace("{content}", self.loadImage(file, caption));
+                            if (isFlash) {
+                                var media = vUrl.createObjectURL(file);
+                                content = self.previewFlashTemplate.replace(/\{previewId\}/g,
+                                    previewId).replace(/\{caption\}/g, caption).replace(/\{media\}/g, media);
+                            } else {
+                                if (isVideo) {
+                                    var media = vUrl.createObjectURL(file);
+                                    content = self.previewVideoTemplate.replace(/\{previewId\}/g,
+                                        previewId).replace(/\{caption\}/g, caption).replace(/\{type\}/g,
+                                        file.type).replace(/\{media\}/g, media);
+                                } else {
+                                    content = self.previewImageTemplate.replace(/\{previewId\}/g,
+                                        previewId).replace(/\{content\}/g, self.loadImage(file, caption));
+                                }
+                            }
                         }
                         }
                         $preview.append("\n" + content);
                         $preview.append("\n" + content);
                     };
                     };
                     reader.onloadend = function (e) {
                     reader.onloadend = function (e) {
-                        var msg = msgProgress.replace('{index}', i + 1).replace('{files}', numFiles).replace('{percent}', 100).replace('{name}', file.name);
+                        var msg = msgProgress.replace(/\{index\}/g, i + 1).replace(/\{files\}/g,
+                            numFiles).replace(/\{percent\}/g, 100).replace(/\{name\}/g, file.name);
                         setTimeout(function () {
                         setTimeout(function () {
                             $status.html(msg);
                             $status.html(msg);
                         }, 1000);
                         }, 1000);
@@ -418,7 +467,8 @@
                     reader.onprogress = function (data) {
                     reader.onprogress = function (data) {
                         if (data.lengthComputable) {
                         if (data.lengthComputable) {
                             var progress = parseInt(((data.loaded / data.total) * 100), 10);
                             var progress = parseInt(((data.loaded / data.total) * 100), 10);
-                            var msg = msgProgress.replace('{index}', i + 1).replace('{files}', numFiles).replace('{percent}', progress).replace('{name}', file.name);
+                            var msg = msgProgress.replace(/\{index\}/g, i + 1).replace(/\{files\}/g,
+                                numFiles).replace(/\{percent\}/g, progress).replace(/\{name\}/g, file.name);
                             setTimeout(function () {
                             setTimeout(function () {
                                 $status.html(msg);
                                 $status.html(msg);
                             }, 1000);
                             }, 1000);
@@ -430,7 +480,8 @@
                         reader.readAsArrayBuffer(file);
                         reader.readAsArrayBuffer(file);
                     }
                     }
                 } else {
                 } else {
-                    $preview.append("\n" + self.previewOtherTemplate.replace("{previewId}", previewId).replace("{caption}", caption));
+                    $preview.append("\n" + self.previewOtherTemplate.replace(/\{previewId\}/g,
+                        previewId).replace(/\{caption\}/g, caption));
                     $el.trigger('fileloaded', [file, previewId, i]);
                     $el.trigger('fileloaded', [file, previewId, i]);
                     setTimeout(readFile(i + 1), 1000);
                     setTimeout(readFile(i + 1), 1000);
                 }
                 }
@@ -460,7 +511,7 @@
             }
             }
             var total = tfiles.length;
             var total = tfiles.length;
             if (self.maxFileCount > 0 && total > self.maxFileCount) {
             if (self.maxFileCount > 0 && total > self.maxFileCount) {
-                var msg = self.msgFilesTooMany.replace('{m}', self.maxFileCount).replace('{n}', total);
+                var msg = self.msgFilesTooMany.replace(/\{m\}/g, self.maxFileCount).replace(/\{n\}/g, total);
                 self.isError = self.showError(msg, null, null, null);
                 self.isError = self.showError(msg, null, null, null);
                 self.$captionContainer.find('.kv-caption-icon').hide();
                 self.$captionContainer.find('.kv-caption-icon').hide();
                 self.$caption.html(self.msgValidationError);
                 self.$caption.html(self.msgValidationError);
@@ -469,7 +520,7 @@
             }
             }
             self.readFiles(files);
             self.readFiles(files);
             self.reader = null;
             self.reader = null;
-            var log = numFiles > 1 ? msgSelected.replace('{n}', numFiles) : label;
+            var log = numFiles > 1 ? msgSelected.replace(/\{n\}/g, numFiles) : label;
             if (self.isError) {
             if (self.isError) {
                 self.$captionContainer.find('.kv-caption-icon').hide();
                 self.$captionContainer.find('.kv-caption-icon').hide();
                 log = self.msgValidationError;
                 log = self.msgValidationError;
@@ -501,15 +552,15 @@
         },
         },
         renderMain: function () {
         renderMain: function () {
             var self = this;
             var self = this;
-            var preview = self.previewTemplate.replace('{class}', self.previewClass);
+            var preview = self.previewTemplate.replace(/\{class\}/g, self.previewClass);
             var css = self.isDisabled ? self.captionClass + ' file-caption-disabled' : self.captionClass;
             var css = self.isDisabled ? self.captionClass + ' file-caption-disabled' : self.captionClass;
-            var caption = self.captionTemplate.replace('{class}', css + ' kv-fileinput-caption');
-            return self.mainTemplate.replace('{class}', self.mainClass).
-                replace('{preview}', preview).
-                replace('{caption}', caption).
-                replace('{upload}', self.renderUpload()).
-                replace('{remove}', self.renderRemove()).
-                replace('{browse}', self.renderBrowse());
+            var caption = self.captionTemplate.replace(/\{class\}/g, css + ' kv-fileinput-caption');
+            return self.mainTemplate.replace(/\{class\}/g, self.mainClass).
+                replace(/\{preview\}/g, preview).
+                replace(/\{caption\}/g, caption).
+                replace(/\{upload\}/g, self.renderUpload()).
+                replace(/\{remove\}/g, self.renderRemove()).
+                replace(/\{browse\}/g, self.renderBrowse());
         },
         },
         renderBrowse: function () {
         renderBrowse: function () {
             var self = this, css = self.browseClass + ' btn-file', status = '';
             var self = this, css = self.browseClass + ' btn-file', status = '';
@@ -567,7 +618,8 @@
                 options = typeof option === 'object' && option;
                 options = typeof option === 'object' && option;
 
 
             if (!data) {
             if (!data) {
-                $this.data('fileinput', (data = new FileInput(this, $.extend({}, $.fn.fileinput.defaults, options, $(this).data()))));
+                $this.data('fileinput',
+                    (data = new FileInput(this, $.extend({}, $.fn.fileinput.defaults, options, $(this).data()))));
             }
             }
 
 
             if (typeof option === 'string') {
             if (typeof option === 'string') {
@@ -594,6 +646,8 @@
         previewTemplate: PREVIEW_TEMPLATE,
         previewTemplate: PREVIEW_TEMPLATE,
         previewGenericTemplate: IMAGE_TEMPLATE,
         previewGenericTemplate: IMAGE_TEMPLATE,
         previewImageTemplate: IMAGE_TEMPLATE,
         previewImageTemplate: IMAGE_TEMPLATE,
+        previewFlashTemplate: FLASH_TEMPLATE,
+        previewVideoTemplate: VIDEO_TEMPLATE,
         previewTextTemplate: TEXT_TEMPLATE,
         previewTextTemplate: TEXT_TEMPLATE,
         previewOtherTemplate: OTHER_TEMPLATE,
         previewOtherTemplate: OTHER_TEMPLATE,
         captionTemplate: CAPTION_TEMPLATE,
         captionTemplate: CAPTION_TEMPLATE,

File diff suppressed because it is too large
+ 1 - 1
js/fileinput.min.js


Some files were not shown because too many files changed in this diff