/*
*	Class: fileUploader
*	Use: Upload multiple files the jQuery way
*	Author: Michael Laniba (http://pixelcone.com)
*	Version: 1.0
*/

(function($) {
	$.fileUploader = {version: '1.0'};
	$.fn.fileUploader = function(config){
		
		config = $.extend({}, {
			imageLoader: '',
			paramForm: '',
			buttonUpload: '#pxUpload',
			buttonClear: '#pxClear',
			inputName: '#userfile',
			successOutput: 'File Uploaded',
			errorOutput: 'Failed',
			uploadingOutput	: 'Uploading...',
			pendingOutput: 'Pending...',
			labelFormValidation : 'Add a new file',
			autoUpload : false,
			allowedExtension: 'jpg|jpeg|png|gif',
			hideForm : true,
			displayDiv : true,
			displayOutput : true,
			displayMessage : true,
			callBack : function (){}
		}, config);
		
		var itr = 0; //number of files to uploaded
		
		//public function
		$.fileUploader.ajout = function(e){
			var fname = px.validateFile( $(px.inputId).val() );
			if (fname == -1){
				alert ("Invalid file!");
				$(px.inputId).val("");
				return false;
			}
			$('#px_button input').removeAttr("disabled");
			var imageLoader = '';
			if ($.trim(config.imageLoader) != ''){
				imageLoader = '<img src="'+ config.imageLoader +'" alt="uploader" align="absmiddle"/>';
			}
			if (config.displayDiv) {
				var display = '<div class="uploadData" id="pxupload'+ itr +'_text" title="pxupload'+ itr +'">' + 
					'<span class="fname">'+ fname +'</span>' +
					'<span class="loader" style="display:none;">'+ imageLoader +'</span>' +
					'<span class="status">'+config.pendingOutput+'</span></div>';
				$("#px_display").append(display);
			} else {
				var display = '<span class="uploadData" id="pxupload'+ itr +'_text" title="pxupload'+ itr +'">' + 
					'<span class="loader" style="display:none;">'+ imageLoader +'</span>' +
					'<span class="status">'+config.pendingOutput+'</span></span>';
				$(px.inputId).parent("form").append(display);
			}
			$(e).remove();
			if (config.hideForm) $(px.inputId).parent("form").hide();
			px.appendForm();
			
			if (config.autoUpload) {
				upload();
			}
			
		}
		
		$(config.buttonUpload).live("click", function(){upload();});

		function upload(){
			if (itr > 1){
				$('#px_button input').attr("disabled","disabled")
				$('#px_button').after('<div id="px_countdown" style="display:none"><input id="countdown" type="text" value="'+(itr-1)+'"></div>');
				$("#pxupload_form form").each(function(){
					e = $(this);
					var id = "#" + $(e).attr("id");
					var input_id = id + "_input";
					var input_val = $(input_id).val();
					if (input_val != ""){
						$(id + "_text .status").text(config.uploadingOutput);
						$(id + "_text .loader").show();
						
						$(id).submit();
						$(id +"_frame").load(function(){
							$(id + "_text .loader").hide();
							up_output = '';
							if (config.displayOutput) {
								var sortie = $(this).contents().find("#output").text();
								if (sortie == "success"){
									up_output += config.successOutput;
								} else if (sortie == "error") {
									up_output += config.errorOutput;
								} else {
									up_output += $(this).contents().find("body").html();
								}
							}
							if (config.displayMessage) up_output += $(this).contents().find("#message").text();
							$(this).prev("form").after('<div id="message_fileuploader">'+up_output+'</div>').remove();
							$(config.buttonClear).removeAttr("disabled");
							$('#countdown').val($('#countdown').val()-1).trigger("change");
						});
					}
				});
			}
		}
		
		$('#countdown').live("change", function(){
			if ($(this).val()==0){
				config.callBack();
				$("#px_countdown").remove();
			}
		});
		
		$(config.buttonClear).live("click", function(){
			$("#px_display").fadeOut("slow",function(){
				$("#px_display").html("");
				$("#pxupload_form").html("");
				itr = 0;
				px.appendForm();
				$('#px_button input').attr("disabled","disabled");
				$(this).show();
			});
		});
		
		//private function
		var px = {
			init: function(e){
				var form = $(e).parents('form');
				px.formAction = $(form).attr('action');
				
				$(form).before(' \
					<div id="px_display"></div> \
					<div id="pxupload_form"></div> \
					<div id="px_button"></div> \
				');
				$(config.buttonUpload+','+config.buttonClear).appendTo('#px_button');
				px.classBouton = $(config.buttonUpload).attr("class");

				px.form_content = $(form).html();
				$(form).hide();
				this.appendForm();
			},
			appendForm: function(){
				itr++;
				var formId = "pxupload" + itr;
				var iframeId = "pxupload" + itr + "_frame";
				var inputId = "pxupload" + itr + "_input";
				px.inputId = "#"+inputId;

			var contents = '<form method="post" id="'+ formId +'" action="'+ px.formAction +'" enctype="multipart/form-data" target="'+ iframeId +'" '+config.paramForm+'>' + px.form_content + '<input type="button" class="'+px.classBouton+'" value="'+config.labelFormValidation+'" onclick="$.fileUploader.ajout(this);" /> '+
				'</form>' + 
//				'<iframe id="'+ iframeId +'" name="'+ iframeId +'" src="about:blank"></iframe>';
				'<iframe id="'+ iframeId +'" name="'+ iframeId +'" src="about:blank" style="display:none"></iframe>';

				$("#pxupload_form").append( contents );
				$(config.inputName).attr("id",inputId);
			},
			validateFile: function(file) {
				if (file.indexOf('/') > -1){
					file = file.substring(file.lastIndexOf('/') + 1);
				}else if (file.indexOf('\\') > -1){
					file = file.substring(file.lastIndexOf('\\') + 1);
				}
				//var extensions = /(.jpg|.jpeg|.gif|.png)$/i;
				var extensions = new RegExp(config.allowedExtension + '$', 'i');
				if (extensions.test(file)){
					return file;
				} else {
					return -1;
				}
			}
		}
		
		px.init(this);
		
		return this;
	}
})(jQuery);