flow ui

OpenAuth.Mvc/Content/scripts/plugins/uploadify/ajaxfileupload.js

@@ -0,0 +1,201 @@
+
+jQuery.extend({
+	
+
+    createUploadIframe: function(id, uri)
+	{
+			//create frame
+            var frameId = 'jUploadFrame' + id;
+            var iframeHtml = '<iframe id="' + frameId + '" name="' + frameId + '" style="position:absolute; top:-9999px; left:-9999px"';
+			if(window.ActiveXObject)
+			{
+                if(typeof uri== 'boolean'){
+					iframeHtml += ' src="' + 'javascript:false' + '"';
+
+                }
+                else if(typeof uri== 'string'){
+					iframeHtml += ' src="' + uri + '"';
+
+                }	
+			}
+			iframeHtml += ' />';
+			jQuery(iframeHtml).appendTo(document.body);
+
+            return jQuery('#' + frameId).get(0);			
+    },
+    createUploadForm: function(id, fileElementId, data)
+	{
+		//create form	
+		var formId = 'jUploadForm' + id;
+		var fileId = 'jUploadFile' + id;
+		var form = jQuery('<form  action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');	
+		if(data)
+		{
+			for(var i in data)
+			{
+				jQuery('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form);
+			}			
+		}		
+		var oldElement = jQuery('#' + fileElementId);
+		var newElement = jQuery(oldElement).clone();
+		jQuery(oldElement).attr('id', fileId);
+		jQuery(oldElement).before(newElement);
+		jQuery(oldElement).appendTo(form);
+
+
+		
+		//set attributes
+		jQuery(form).css('position', 'absolute');
+		jQuery(form).css('top', '-1200px');
+		jQuery(form).css('left', '-1200px');
+		jQuery(form).appendTo('body');		
+		return form;
+    },
+
+    ajaxFileUpload: function(s) {
+        // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout		
+        s = jQuery.extend({}, jQuery.ajaxSettings, s);
+        var id = new Date().getTime()        
+		var form = jQuery.createUploadForm(id, s.fileElementId, (typeof(s.data)=='undefined'?false:s.data));
+		var io = jQuery.createUploadIframe(id, s.secureuri);
+		var frameId = 'jUploadFrame' + id;
+		var formId = 'jUploadForm' + id;		
+        // Watch for a new set of requests
+        if ( s.global && ! jQuery.active++ )
+		{
+			jQuery.event.trigger( "ajaxStart" );
+		}            
+        var requestDone = false;
+        // Create the request object
+        var xml = {}   
+        if ( s.global )
+            jQuery.event.trigger("ajaxSend", [xml, s]);
+        // Wait for a response to come back
+        var uploadCallback = function(isTimeout)
+		{			
+			var io = document.getElementById(frameId);
+            try 
+			{				
+				if(io.contentWindow)
+				{
+					 xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
+                	 xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
+					 
+				}else if(io.contentDocument)
+				{
+					 xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
+                	xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
+				}						
+            }catch(e)
+			{
+				jQuery.handleError(s, xml, null, e);
+			}
+            if ( xml || isTimeout == "timeout") 
+			{				
+                requestDone = true;
+                var status;
+                try {
+                    status = isTimeout != "timeout" ? "success" : "error";
+                    // Make sure that the request was successful or notmodified
+                    if ( status != "error" )
+					{
+                        // process the data (runs the xml through httpData regardless of callback)
+                        var data = jQuery.uploadHttpData( xml, s.dataType );    
+                        // If a local callback was specified, fire it and pass it the data
+                        if ( s.success )
+                            s.success( data, status );
+    
+                        // Fire the global callback
+                        if( s.global )
+                            jQuery.event.trigger( "ajaxSuccess", [xml, s] );
+                    } else
+                        jQuery.handleError(s, xml, status);
+                } catch(e) 
+				{
+                    status = "error";
+                    jQuery.handleError(s, xml, status, e);
+                }
+
+                // The request was completed
+                if( s.global )
+                    jQuery.event.trigger( "ajaxComplete", [xml, s] );
+
+                // Handle the global AJAX counter
+                if ( s.global && ! --jQuery.active )
+                    jQuery.event.trigger( "ajaxStop" );
+
+                // Process result
+                if ( s.complete )
+                    s.complete(xml, status);
+
+                jQuery(io).unbind()
+
+                setTimeout(function()
+									{	try 
+										{
+											jQuery(io).remove();
+											jQuery(form).remove();	
+											
+										} catch(e) 
+										{
+											jQuery.handleError(s, xml, null, e);
+										}									
+
+									}, 100)
+
+                xml = null
+
+            }
+        }
+        // Timeout checker
+        if ( s.timeout > 0 ) 
+		{
+            setTimeout(function(){
+                // Check to see if the request is still happening
+                if( !requestDone ) uploadCallback( "timeout" );
+            }, s.timeout);
+        }
+        try 
+		{
+
+			var form = jQuery('#' + formId);
+			jQuery(form).attr('action', s.url);
+			jQuery(form).attr('method', 'POST');
+			jQuery(form).attr('target', frameId);
+            if(form.encoding)
+			{
+				jQuery(form).attr('encoding', 'multipart/form-data');      			
+            }
+            else
+			{	
+				jQuery(form).attr('enctype', 'multipart/form-data');			
+            }			
+            jQuery(form).submit();
+
+        } catch(e) 
+		{			
+            jQuery.handleError(s, xml, null, e);
+        }
+		
+		jQuery('#' + frameId).load(uploadCallback	);
+        return {abort: function () {}};	
+
+    },
+
+    uploadHttpData: function( r, type ) {
+        var data = !type;
+        data = type == "xml" || data ? r.responseXML : r.responseText;
+        // If the type is "script", eval it in global context
+        if ( type == "script" )
+            jQuery.globalEval( data );
+        // Get the JavaScript object, if JSON is used.
+        if ( type == "json" )
+            eval( "data = " + data );
+        // evaluate scripts within html
+        if ( type == "html" )
+            jQuery("<div>").html(data).evalScripts();
+
+        return data;
+    }
+})
+

OpenAuth.Mvc/Content/scripts/plugins/uploadify/uploadify.css

@@ -0,0 +1,12 @@
+
+.uploadify{position: relative;float:left;}
+.uploadify-button{color:#333;border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px;line-height:25px;text-align:center;border: 1px solid #ccc;}
+.uploadify:hover .uploadify-button{color:#333;background-color:#e6e6e6;border-color:#adadad}
+.uploadify-button.disabled{/*background-color: #D0D0D0;color: #808080;*/}
+.uploadify-queue{height:auto;width:100%;overflow:hidden;}
+.uploadify-queue-item{margin-right:5px;margin-top:5px;float:left;padding:5px 5px;width: 310px;height: 36px;overflow: hidden;position: relative;background-color: #f5f5f5;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;font-size:12px;}
+.uploadify-error{background-color: #FDE5DD !important;}
+.uploadify-queue-item .cancel a{/*ɾ<><C9BE>ͼ<EFBFBD><CDBC><EFBFBD><EFBFBD>·<EFBFBD><C2B7>*/background: url('uploadify-cancel.png') 0 0 no-repeat;float: right;height:16px;text-indent: -9999px;width: 16px;margin-top: 3px;}
+.uploadify-queue-item.completed{background-color: #E5E5E5;}
+.uploadify-progress{background-color: #E5E5E5;margin-top: 10px;width: 100%;}
+.uploadify-progress-bar{background-color: #337ab7;height: 3px;width: 1px;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;}

OpenAuth.Mvc/Content/scripts/plugins/uploadify/uploadify.extension.css

@@ -0,0 +1,10 @@
+.uploadify-button{margin-bottom: 10px;}
+.uploadify-queue{height: 295px;overflow: auto;position: relative;top: 8px;border: 1px solid #ccc;border-radius: 5px;}
+.uploadify-queue-item{margin-top: 0px;margin-right: 0px;margin-bottom: 0px;float: none;width: auto;border-radius: 0px;height: 50px;line-height: 39px;border-bottom: 1px solid #ccc;background-color: #fff;}
+.uploadify-progress{margin-top: -3px;border-radius: 5px;margin-left: 50px;width: 90%;}
+.uploadify-progress-bar{height: 5px;border-radius: 5px;}
+.uploadify-queue-item .cancel a{display: none;}
+.uploadify-queue-item .succeed{float: right;height: 16px;width: 16px;margin-top: 5px;margin-right: 10px;}
+.uploadify-queue-item .succeed i{color: #5cb85c;font-size: 25px;}
+.uploadify-queue-item .error{float: right;height: 16px;width: 16px;margin-top: 5px;margin-right: 10px;}
+.uploadify-queue-item .error i{color: #b94a48;font-size: 25px;}