Support forums - Re: customizing progress bar

Support forums » Products » Ajax Uploader » Re: customizing progress bar

Re: customizing progress bar

03-17-2010, 10:08 PM

cutechat
Joined on 07-22-2004
Posts 2,332

Re: customizing progress bar

Reply Quote

John,

Please try this code

<%@ Page Language="C#" Title="Total Progress" %>
<%@ Import Namespace="CuteWebUI" %>
<%@ Register TagPrefix="CuteWebUI" Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

void InsertMsg(string msg)
	{
		ListBoxEvents.Items.Insert(0, msg);
		ListBoxEvents.SelectedIndex = 0;
	}
	protected void UploadAttachments1_AttachmentAdded(object sender, AttachmentItemEventArgs args)
	{
		InsertMsg("Added.." + args.Item.FileName);
	}

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
</head>
<body>
	<form id="Form1" runat="server">
		<CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1" OnAttachmentAdded="UploadAttachments1_AttachmentAdded">
		</CuteWebUI:UploadAttachments>
		<div id='progressInfo' style="display:none;font-size:18px;color:DarkRed"></div>
		<br />
		<div>
			Server Trace:
			<br />
			<asp:ListBox runat="server" ID="ListBoxEvents" Width="800"></asp:ListBox>
		</div>
	</form>
	<script type="text/javascript">
	function ToFixed(num) {
		if (num > 100)
			return Math.round(num);
		if (num > 10)
			return num.toFixed(1);
		return num.toFixed(2);
	}
	function FormatSize(bytecount) {
		var str = bytecount + ' B';
		if (Number(bytecount) >= 2048) { str = ToFixed(bytecount / 1024) + ' KB'; }
		if (Number(bytecount) >= 2097152) { str = ToFixed(bytecount / 1048576) + ' MB'; }
		if (Number(bytecount) >= 2147483648) { str = ToFixed(bytecount / 1073741824) + ' GB'; }
		return str;
	}
	
	var progressInfo=document.getElementById("progressInfo");
	var hasStarted=false;
	var startTime=0;
	var fullSize=0;
	var finishSize=0;
	var queueSize=0;
	var filecount=0;
	function CuteWebUI_AjaxUploader_OnStart()
	{
		if(hasStarted)return;
		hasStarted=true;
		startTime=new Date().getTime();
		progressInfo.innerHTML="Start upload";
		progressInfo.style.display="";
	}
	function CuteWebUI_AjaxUploader_OnStop()
	{
		hasStarted=false;
		progressInfo.style.display="none";
	}
	function CuteWebUI_AjaxUploader_OnPostback()
	{
		hasStarted=false;
		progressInfo.style.display="none";
	}
	function CuteWebUI_AjaxUploader_OnQueueUI(list)
	{
		filecount=list.length;
		fullSize=0;
		finishSize=0;
		queueSize=0;
		for(var i=0;i<list.length;i++)
		{
			var size=list[ i ].FileSize;	//or -1 if iframe mode
			var stat=list[ i ].Status;
			fullSize+=size;
			if(stat=="Finish")
				finishSize+=size;
			if(stat=="Queue")
				queueSize+=size;
		}
		return true;
	}
	function CuteWebUI_AjaxUploader_OnProgress(enable,filename,begintime,uploadedsize,totalsize)
	{
		if(fullSize<0)
		{
			progressInfo.innerHTML="Unable to calculate total progress for iframe mode";
			return true;
		}
		
		if(!enable)
			return;
		if(!totalsize)
			return;

var size1=finishSize+uploadedsize;
		var size2=queueSize+totalsize-uploadedsize;
		var size3=size1+size2;
		var seconds=(new Date().getTime()-startTime)/1000;
		var speed=size1/seconds;
		var timeleft=size2/speed;

progressInfo.innerHTML="Uploading "+filecount+" files. "+FormatSize(size1)+" of "+FormatSize(size3)+" at "+FormatSize(Math.round(speed))+"/s; "+Math.round(timeleft)+" seconds remaining ";
		//return false;
	}
	</script>

</body>
</html>

Regards,
Terry

View Complete Thread