/* ------------------------------------------------------------------------------
*
* # Bootstrap multiple file uploader
*
* Specific JS code additions for uploader_bootstrap.html page
*
* Version: 1.0
* Latest update: Aug 1, 2015
*
* ---------------------------------------------------------------------------- */
$(function() {
// Basic example
$('.file-input').fileinput({
browseLabel: '',
browseClass: 'btn btn-primary btn-icon',
removeLabel: '',
uploadLabel: '',
uploadClass: 'btn btn-default btn-icon',
browseIcon: ' ',
uploadIcon: ' ',
removeClass: 'btn btn-danger btn-icon',
removeIcon: ' ',
layoutTemplates: {
caption: ''
},
initialCaption: "No file selected"
});
// With preview
$(".file-input-preview").fileinput({
browseLabel: '',
browseClass: 'btn btn-primary btn-icon',
removeLabel: '',
uploadLabel: '',
uploadClass: 'btn btn-default btn-icon',
browseIcon: ' ',
uploadIcon: ' ',
removeClass: 'btn btn-danger btn-icon',
removeIcon: ' ',
layoutTemplates: {
caption: ''
},
initialPreview: [
"
",
"",
],
overwriteInitial: false,
maxFileSize: 100
});
// Display preview on load
$(".file-input-overwrite").fileinput({
browseLabel: '',
browseClass: 'btn btn-primary btn-icon',
removeLabel: '',
uploadLabel: '',
uploadClass: 'btn btn-default btn-icon',
browseIcon: ' ',
uploadIcon: ' ',
removeClass: 'btn btn-danger btn-icon',
removeIcon: ' ',
layoutTemplates: {
caption: ''
},
initialPreview: [
"",
"",
],
overwriteInitial: true
});
// Custom layout
$('.file-input-custom').fileinput({
previewFileType: 'image',
browseLabel: 'Select',
browseClass: 'btn bg-slate-700',
browseIcon: ' ',
removeLabel: 'Remove',
removeClass: 'btn btn-danger',
removeIcon: ' ',
uploadClass: 'btn bg-teal-400',
uploadIcon: ' ',
layoutTemplates: {
caption: ''
},
initialCaption: "No file selected"
});
// Advanced example
$('.file-input-advanced').fileinput({
browseLabel: 'Browse',
browseClass: 'btn btn-default',
removeLabel: '',
uploadLabel: '',
browseIcon: ' ',
uploadClass: 'btn btn-primary btn-icon',
uploadIcon: ' ',
removeClass: 'btn btn-danger btn-icon',
removeIcon: ' ',
initialCaption: "No file selected",
layoutTemplates: {
caption: '',
main1: "{preview}\n" +
""
}
});
// Disable/enable button
$("#btn-modify").on("click", function() {
$btn = $(this);
if ($btn.text() == "Disable file input") {
$("#file-input-methods").fileinput("disable");
$btn.html("Enable file input");
alert("Hurray! I have disabled the input and hidden the upload button.");
}
else {
$("#file-input-methods").fileinput("enable");
$btn.html("Disable file input");
alert("Hurray! I have reverted back the input to enabled with the upload button.");
}
});
// Custom file extensions
$(".file-input-extensions").fileinput({
browseLabel: 'Browse',
browseClass: 'btn btn-primary',
removeLabel: '',
browseIcon: ' ',
uploadIcon: ' ',
removeClass: 'btn btn-danger btn-icon',
removeIcon: ' ',
layoutTemplates: {
caption: ''
},
initialCaption: "No file selected",
maxFilesNum: 10,
allowedFileExtensions: ["jpg", "gif", "png", "txt"]
});
});