/*! * jQuery Upload File Plugin * version: 3.0.5 * @requires jQuery v1.5 or later & form plugin * Copyright (c) 2013 Ravishanker Kusuma * https://hayageek.com/ */ (function ($) { if ($.fn.ajaxForm == undefined) { $.getScript("https://malsup.github.io/jquery.form.js"); } var feature = {}; feature.fileapi = $("").get(0).files !== undefined; feature.formdata = window.FormData !== undefined; $.fn.uploadFile = function (options) { // This is the easiest way to have default options. var s = $.extend({ // These are the defaults. url: "", method: "POST", enctype: "multipart/form-data", formData: null, returnType: null, allowedTypes: "*", fileName: "file", formData: {}, dynamicFormData: function () { return {}; }, maxFileSize: -1, multiple: true, dragDrop: true, autoSubmit: true, showCancel: true, showAbort: true, showDone: true, showDelete:false, showError: true, showStatusAfterSuccess: true, showStatusAfterError: true, onSubmit: function (files, xhr) {}, onSuccess: function (files, response, xhr) {}, onError: function (files, status, message) {}, deleteCallback: false, afterUploadAll: false, uploadButtonClass: "ajax-file-upload", dragDropStr: "Drag & Drop Files", abortStr: "Abort", cancelStr: "Cancel", deletelStr: "Delete", doneStr: "Done", multiDragErrorStr: "Multiple File Drag & Drop is not allowed.", extErrorStr: "is not allowed. Allowed extensions: ", sizeErrorStr: "is not allowed. Allowed Max size: ", uploadErrorStr: "Upload is not allowed" }, options); this.fileCounter = 1; this.fCounter = 0; //failed uploads this.sCounter = 0; //success uploads this.tCounter = 0; //total uploads var formGroup = "ajax-file-upload-" + (new Date().getTime()); this.formGroup = formGroup; this.hide(); this.errorLog = $("
"); //Writing errors this.after(this.errorLog); this.responses = []; if (!feature.formdata) //check drag drop enabled. { s.dragDrop = false; } var obj = this; var uploadLabel = $('
' + $(this).html() + '
'); $(uploadLabel).addClass(s.uploadButtonClass); //wait form ajax Form plugin and initialize (function checkAjaxFormLoaded() { if ($.fn.ajaxForm) { if (s.dragDrop) { var dragDrop = $('
'); $(obj).before(dragDrop); $(dragDrop).append(uploadLabel); $(dragDrop).append($(s.dragDropStr)); setDragDropHandlers(obj, s, dragDrop); } else { $(obj).before(uploadLabel); } createCutomInputFile(obj, formGroup, s, uploadLabel); } else window.setTimeout(checkAjaxFormLoaded, 10); })(); this.startUpload = function () { $("." + this.formGroup).each(function (i, items) { if ($(this).is('form')) $(this).submit(); }); } this.stopUpload = function () { $(".ajax-file-upload-red").each(function (i, items) { if ($(this).hasClass(obj.formGroup)) $(this).click(); }); } this.getResponses = function () { return this.responses; } var checking = false; function checkPendingUploads() { if (s.afterUploadAll && !checking) { checking = true; (function checkPending() { if (obj.sCounter != 0 && (obj.sCounter + obj.fCounter == obj.tCounter)) { s.afterUploadAll(obj); checking = false; } else window.setTimeout(checkPending, 100); })(); } } function setDragDropHandlers(obj, s, ddObj) { ddObj.on('dragenter', function (e) { e.stopPropagation(); e.preventDefault(); $(this).css('border', '2px solid #A5A5C7'); }); ddObj.on('dragover', function (e) { e.stopPropagation(); e.preventDefault(); }); ddObj.on('drop', function (e) { $(this).css('border', '2px dotted #A5A5C7'); e.preventDefault(); obj.errorLog.html(""); var files = e.originalEvent.dataTransfer.files; if (!s.multiple && files.length > 1) { if (s.showError) $("
" + s.multiDragErrorStr + "
").appendTo(obj.errorLog); return; } serializeAndUploadFiles(s, obj, files); }); $(document).on('dragenter', function (e) { e.stopPropagation(); e.preventDefault(); }); $(document).on('dragover', function (e) { e.stopPropagation(); e.preventDefault(); ddObj.css('border', '2px dotted #A5A5C7'); }); $(document).on('drop', function (e) { e.stopPropagation(); e.preventDefault(); ddObj.css('border', '2px dotted #A5A5C7'); }); } function getSizeStr(size) { var sizeStr = ""; var sizeKB = size / 1024; if (parseInt(sizeKB) > 1024) { var sizeMB = sizeKB / 1024; sizeStr = sizeMB.toFixed(2) + " MB"; } else { sizeStr = sizeKB.toFixed(2) + " KB"; } return sizeStr; } function serializeData(extraData) { var serialized = []; if (jQuery.type(extraData) == "string") { serialized = extraData.split('&'); } else { serialized = $.param(extraData).split('&'); } var len = serialized.length; var result = []; var i, part; for (i = 0; i < len; i++) { serialized[i] = serialized[i].replace(/\+/g, ' '); part = serialized[i].split('='); result.push([decodeURIComponent(part[0]), decodeURIComponent(part[1])]); } return result; } function serializeAndUploadFiles(s, obj, files) { for (var i = 0; i < files.length; i++) { if (!isFileTypeAllowed(obj, s, files[i].name)) { if (s.showError) $("
" + files[i].name + " " + s.extErrorStr + s.allowedTypes + "
").appendTo(obj.errorLog); continue; } if (s.maxFileSize != -1 && files[i].size > s.maxFileSize) { if (s.showError) $("
" + files[i].name + " " + s.sizeErrorStr + getSizeStr(s.maxFileSize) + "
").appendTo(obj.errorLog); continue; } var ts = s; var fd = new FormData(); var fileName = s.fileName.replace("[]", ""); fd.append(fileName, files[i]); var extraData = s.formData; if (extraData) { var sData = serializeData(extraData); for (var j = 0; j < sData.length; j++) { if (sData[j]) { fd.append(sData[j][0], sData[j][1]); } } } ts.fileData = fd; var pd = new createProgressDiv(obj, s); pd.filename.html(obj.fileCounter + "). " + files[i].name); //Preview //var fileExtensions = s.allowedTypes.toLowerCase().split(","); //alert(fileExtensions); //var res = fileExtensions[4]; alert(res); /*if(fileExtensions[3] == "doc" || fileExtensions[4] == "docx") { var str = "https://192.168.0.114/zeropercentreality/upload/propertyphotos/0a5d635d679a1064c346066a065c0237.jpg"; var x = str.split("/"); var img = x[6]; img.width = 100; img.height = 100; img.style.height = '100px'; img.style.width = '100px'; pd.preview.get(0).appendChild(img); var reader = new FileReader(); reader.onloadend = (function (theImg) { return function (evt) { //alert(evt.target.result); theImg.src = evt.target.result; }; }(img)); reader.readAsDataURL(files[i]); } else {*/ var img = document.createElement("img"); img.width = 100; img.height = 100; img.style.height = '100px'; img.style.width = '100px'; pd.preview.get(0).appendChild(img); var reader = new FileReader(); reader.onloadend = (function (theImg) { return function (evt) { //alert(evt.target.result); theImg.src = evt.target.result; }; }(img)); reader.readAsDataURL(files[i]); //} //Preview End var form = $("
"); form.appendTo('body'); var fileArray = []; fileArray.push(files[i].name); ajaxFormSubmit(form, ts, pd, fileArray, obj); obj.fileCounter++; } } function isFileTypeAllowed(obj, s, fileName) { var fileExtensions = s.allowedTypes.toLowerCase().split(","); var ext = fileName.split('.').pop().toLowerCase(); if (s.allowedTypes != "*" && jQuery.inArray(ext, fileExtensions) < 0) { return false; } return true; } function createCutomInputFile(obj, group, s, uploadLabel) { var fileUploadId = "ajax-upload-id-" + (new Date().getTime()); var form = $("
"); var fileInputStr = ""; if (s.multiple) { if (s.fileName.indexOf("[]") != s.fileName.length - 2) // if it does not endwith { s.fileName += "[]"; } fileInputStr = ""; } var fileInput = $(fileInputStr).appendTo(form); fileInput.change(function () { obj.errorLog.html(""); var fileExtensions = s.allowedTypes.toLowerCase().split(","); var fileArray = []; if (this.files) //support reading files { for (i = 0; i < this.files.length; i++) { fileArray.push(this.files[i].name); } } else { var filenameStr = $(this).val(); fileArray.push(filenameStr); if (!isFileTypeAllowed(obj, s, filenameStr)) { if (s.showError) $("
" + filenameStr + " " + s.extErrorStr + s.allowedTypes + "
").appendTo(obj.errorLog); return; } } uploadLabel.unbind("click"); form.hide(); createCutomInputFile(obj, group, s, uploadLabel); form.addClass(group); if (feature.fileapi && feature.formdata) //use HTML5 support and split file submission { form.removeClass(group); //Stop Submitting when. var files = this.files; serializeAndUploadFiles(s, obj, files); } else { var fileList = ""; for (var i = 0; i < fileArray.length; i++) { fileList += obj.fileCounter + "). " + fileArray[i] + "
"; obj.fileCounter++; } var pd = new createProgressDiv(obj, s); pd.filename.html(fileList); ajaxFormSubmit(form, s, pd, fileArray, obj); } }); form.css({'margin':0,'padding':0}); var uwidth=$(uploadLabel).width()+10; if(uwidth == 10) uwidth =120; var uheight=uploadLabel.height()+10; if(uheight == 10) uheight = 35; uploadLabel.css({position: 'relative',overflow:'hidden',cursor:'default'}); fileInput.css({position: 'absolute','cursor':'pointer', 'top': '0px', 'width': uwidth, 'height':uheight, 'left': '0px', 'z-index': '100', 'opacity': '0.0', 'filter':'alpha(opacity=0)', '-ms-filter':"alpha(opacity=0)", '-khtml-opacity':'0.0', '-moz-opacity':'0.0' }); form.appendTo(uploadLabel); //dont hide it, but move it to /* form.css({ margin: 0, padding: 0, display: 'block', position: 'absolute', left: '50px' }); if (navigator.appVersion.indexOf("MSIE ") != -1) //IE Browser { uploadLabel.attr('for', fileUploadId); } else { uploadLabel.click(function () { fileInput.click(); }); }*/ } function createProgressDiv(obj, s) { this.statusbar = $("
"); this.preview = $("
").appendTo(this.statusbar); this.filename = $("
").appendTo(this.statusbar); this.progressDiv = $("
").appendTo(this.statusbar).hide(); this.progressbar = $("
").appendTo(this.progressDiv); this.abort = $("
" + s.abortStr + "
").appendTo(this.statusbar).hide(); this.cancel = $("
" + s.cancelStr + "
").appendTo(this.statusbar).hide(); this.done = $("
" + s.doneStr + "
").appendTo(this.statusbar).hide(); // this.del = $("
" + s.deletelStr + "
").appendTo(this.statusbar).hide(); this.del = ''; obj.errorLog.after(this.statusbar); return this; } function ajaxFormSubmit(form, s, pd, fileArray, obj) { var currentXHR = null; var options = { cache: false, contentType: false, processData: false, forceSync: false, data: s.formData, formData: s.fileData, dataType: s.returnType, beforeSubmit: function (formData, $form, options) { if (s.onSubmit.call(this, fileArray) != false) { var dynData = s.dynamicFormData(); if (dynData) { var sData = serializeData(dynData); if (sData) { for (var j = 0; j < sData.length; j++) { if (sData[j]) { if (s.fileData != undefined) options.formData.append(sData[j][0], sData[j][1]); else options.data[sData[j][0]] = sData[j][1]; } } } } obj.tCounter += fileArray.length; window.setTimeout(checkPendingUploads, 1000); //not so critical return true; } pd.statusbar.append("
" + s.uploadErrorStr + "
"); pd.cancel.show() form.remove(); pd.cancel.click(function () { pd.statusbar.remove(); }); return false; }, beforeSend: function (xhr, o) { pd.progressDiv.show(); pd.cancel.hide(); pd.done.hide(); if (s.showAbort) { pd.abort.show(); pd.abort.click(function () { xhr.abort(); }); } if (!feature.formdata) //For iframe based push { pd.progressbar.width('5%'); } else pd.progressbar.width('1%'); //Fix for small files }, uploadProgress: function (event, position, total, percentComplete) { var percentVal = percentComplete + '%'; if (percentComplete > 1) pd.progressbar.width(percentVal) }, success: function (data, message, xhr) { obj.responses.push(data); pd.progressbar.width('100%') pd.abort.hide(); s.onSuccess.call(this, fileArray, data, xhr); if (s.showStatusAfterSuccess) { if (s.showDone) { pd.done.show(); pd.done.click(function () { pd.statusbar.hide("slow"); pd.statusbar.remove(); }); } else { pd.done.hide(); } if(s.showDelete) { pd.del.show(); pd.del.click(function () { if(s.deleteCallback) s.deleteCallback.call(this, data,pd); }); } else { pd.del.hide(); } } else { pd.statusbar.hide("slow"); pd.statusbar.remove(); } form.remove(); obj.sCounter += fileArray.length; }, error: function (xhr, status, errMsg) { pd.abort.hide(); if (xhr.statusText == "abort") //we aborted it { pd.statusbar.hide("slow"); } else { s.onError.call(this, fileArray, status, errMsg); if (s.showStatusAfterError) { pd.progressDiv.hide(); pd.statusbar.append("ERROR: " + errMsg + ""); } else { pd.statusbar.hide(); pd.statusbar.remove(); } } form.remove(); obj.fCounter += fileArray.length; } }; if (s.autoSubmit) { form.ajaxSubmit(options); } else { if (s.showCancel) { pd.cancel.show(); pd.cancel.click(function () { form.remove(); pd.statusbar.remove(); }); } form.ajaxForm(options); } } return this; } }(jQuery));