DynamicUpload demo

Plugin author: github.com/klawson88

HTML

<div id='demoContainerDiv'>
  <span id='instructionSpan'>
  Select some images from your device, and then upload them!
  <span id='infoSpan'>(In this demo, any upload which spurs a response from the target server is regarded as sucessful)</span>
  </span>
  <div id='demoButtonContainerDiv'>
    <button id='demoFileSelectionButton' type="button">Select file</button>
		<button id='demoFileUploadButton' type="button">Upload file(s)</button>
	</div>
	<div id='demoVisualQueueDiv'></div>
</div>

CSS

#demoContainerDiv
			{
				position:relative;
				
				left: 50%;
				top: 100px;
				
				width: 500px;
				min-height: 200px;
				
				margin-left: -250px;
				
			}
      
        #instructionSpan
        {
          display: block;
          width: 500px;
          
          margin-bottom: 30px;
          text-align: center;
          font: .8em Arial, sans-serif;
          white-space: pre-wrap;
        }
        
        #infoSpan
        {
          font-size: .79em;
        }
        
				#demoButtonContainerDiv
				{
					position: relative;
					height: 100px;
				}
		
					#demoFileSelectionButton
					{
						position: absolute;
						
						
						left: 50px;
						
						width: 100px;
						height: 35px;
						
						-moz-border-radius: 4px;
						-webkit-border-radius: 4px;
						border-radius: 4px;
					}
					
					
					#demoFileUploadButton
					{
						position: absolute;
						
						
						right: 50px;
						z-index: 1;
						
						width: 100px;
						height: 35px;
						
						-moz-border-radius: 4px;
						-webkit-border-radius: 4px;
						border-radius: 4px;
					}
					
				#demoVisualQueueDiv
				{
					position: relative;
				}
			
					.progressContainerDivs
					{
						margin: 5px;
						padding: 4px;
						border: solid 1px #BBBBBB;
						background-color: #F7F7F7;

						overflow: hidden;

						-moz-border-radius: 1px;
						-webkit-border-radius: 1px;
						border-radius: 1px;
					}
					
					/* In Progress */
					.blue
					{
						border: solid 1px #CEE2F2;
						background-color: #F0F5FF;
					}

					/* Complete */
					.green
					{
						border: solid 1px #bddfbd;
						background-color: #d5ffd5;
					}

					/* Error */
					.red 
					{
						border: solid 1px #B50000;
						background-color: #ffc9ca;
					}

						.progressCancelSpans
						{
							font-size: 0;
							display: block;
							height: 14px;
							width: 14px;
							background-image:...

JavaScript

(function($){
	
	
	
	$.fn.dynamicUpload = function(){
		
		if(arguments.length == 2)
		{
			var firstArg = arguments[0];
			
			var invokedFunc;
			var invokedFuncArgArray;
			
			if(firstArg === "uploadQueueHead")
			{
				invokedFunc = uploadQueueHead;
				invokedFuncArgArray = [arguments[1]];
			}
			else if(firstArg === "removeQueueElement")
			{
				invokedFunc = removeQueueElement;
				invokedFuncArgArray = [arguments[1]];
			}
			else
			{
				invokedFunc = create;
				invokedFuncArgArray = arguments;
			}
			
			if(!!invokedFunc)
				return invokedFunc.apply(this, invokedFuncArgArray);
		}
		
		
		function internalUploadQueueHead(du$formQueue, uploadFile, doAfterQueuePop)
		{
			if(doAfterQueuePop)
			{
				var formerHead$Form = du$formQueue.shift();
				
				if(!!formerHead$Form)
					formerHead$Form.remove();
			}
			
			if(du$formQueue.length > 0)
				uploadFile(du$formQueue[0]);
		}
		
		function uploadQueueHead(doAfterQueuePop)
		{
			var publicAssetsObj = $(this).data("dynamicUpload.publicAssetsObj");
			internalUploadQueueHead(publicAssetsObj.du$formQueue, publicAssetsObj.uploadFile, doAfterQueuePop);
		}
		
		
		function removeQueueElement(fileOrdinal)
		{
			var du$formQueue = $(this).data("dynamicUpload.publicAssetsObj").du$formQueue;
			
			du$formQueue[fileOrdinal].remove();
			du$formQueue.splice(fileOrdinal, 1);
		}
		
		function create(uploadStartElementRepObj, argOptionsObj)
		{
			var optionsObj = {
				doSetupModernFileSelectionModule: true,
				doSetupModernUploadModule: true,
				
				uploadFormTypeClass: "dynamicUploadForms",
				uploadFormFileInputClass: "dynamicUploadFormFileInputs",
				uploadFormHiddenInputNameToValueObj: {},
				uploadFormAction: "",
				
				uploadIframeHandle: "dynamicUploadIframe",
				acceptedFileExtensionArray: [],
				
				uploadFile: defaultUploadFile,
				
				onFileSelectSuccess: null,
				onFileSelectFailure: null,
				
				beforeFileUploadStart: null,
				afterFileUploadEnd: null
			};
			
			var...