Index: photark-ui-admin/src/main/webapp/admin/upload.js
===================================================================
--- photark-ui-admin/src/main/webapp/admin/upload.js	(revision 924668)
+++ photark-ui-admin/src/main/webapp/admin/upload.js	(working copy)
@@ -20,7 +20,9 @@
 dojo.require("dojox.form.FileUploader");
 dojo.require("dijit.form.Button");
 dojo.require("dijit.ProgressBar");
+dojo.require("dojo.parser");
 
+
 //using this early for the forceNoFlash test:
 dojo.require("dojox.embed.Flash");
 
@@ -31,9 +33,21 @@
 	}
 };
 
+var displayProgress = function (){
+	//to show its loading..
+	jsProgress.update({indeterminate:true});
+	dojo.byId("progressBar").style.display="";
+};
 
+var setProgressbar = function(currentVal,totalVal){
+    jsProgress.update({
+      maximum: totalVal, 
+      progress: currentVal,
+      indeterminate:false
+    });
+};
+
 dojo.addOnLoad( function(){
-
 	var fileUploaderConfig = {
 		isDebug:false,
 		hoverClass:"uploadHover",
@@ -63,6 +77,7 @@
 		
 		doUpload = function(){
 			console.log("doUpload");
+			displayProgress();
 			var selectAlbum = dojo.byId("selectAlbum");
 			var selected = selectAlbum.value;
 			console.log("selected:"+selected);
@@ -76,21 +91,49 @@
 					//add new album to list of albums
 					selectAlbum.options[selectAlbum.options.length] =  new Option(albumName, albumName, false, false);
 					//upload the files
+					setProgressbar(0,1);
 					uploader.upload({albumName:albumName});
 				}
 			} else {
 				//upload files to existent album
+				setProgressbar(0,1);
 				uploader.upload({albumName:selected});
 			}
 			//dojo.byId("newAlbumName").value ="";
-			
 		}
 		
 		dojo.connect(uploader, "onComplete", function(dataArray){
+			console.log("onComplete");
+			setProgressbar(1,1);
 			dojo.byId("newAlbumName").value ="";
 		});
-
+		
+		dojo.connect(uploader, "onProgress", function(dataArray){
+			var uploadedPercent=0;
+			var totalPercent=0;
+			for(var i=0;i<dataArray.length;i++){
+				uploadedPercent+=dataArray[i].bytesLoaded;
+				totalPercent+=dataArray[i].bytesTotal;
+			}
+			console.log("onProgress:"+uploadedPercent+"/"+totalPercent);
+			setProgressbar((uploadedPercent/totalPercent),1.01011);
+			//dojo.byId("newAlbumName").value ="";
+		});
+		
+		dojo.connect(uploader, "onChange", function(dataArray){
+			//hiding the progress bar
+			dojo.byId("progressBar").style.display="none";
+		});
+		
 		dojo.connect(uploader, "onError", function(err){
+			var uploadedPercent=0;
+			var totalPercent=0;
+			for(var i=0;i<dataArray.length;i++){
+				uploadedPercent+=dataArray[i].bytesLoaded;
+				totalPercent+=dataArray[i].bytesTotal;
+			}
+			console.log("onProgress:"+uploadedPercent+"/"+totalPercent);
+			setProgressbar((uploadedPercent/totalPercent),1.01011);
 			if(err && err.text) {
 				console.error("Error uploading files:" + err.text);
 				//alert("Error uploading files:" + err.text);
Index: photark-ui-admin/src/main/webapp/admin/upload.html
===================================================================
--- photark-ui-admin/src/main/webapp/admin/upload.html	(revision 924668)
+++ photark-ui-admin/src/main/webapp/admin/upload.html	(working copy)
@@ -24,6 +24,7 @@
 <script type="text/javascript" src="../constants.js"></script>
 <script type="text/javascript" src="upload.js" charset="utf-8"></script>
 
+<link rel="stylesheet" type="text/css" href="../dijit/themes/tundra/tundra.css">
 <link href="upload.css" rel="stylesheet">
 
 <style type="text/css">
@@ -52,6 +53,10 @@
 	}
 </style>
 
+<style type="text/css">
+    #progressDiv,#progressBar { font-family:helvetica,arial,sans-serif; font-size:90%;z-index: 1000; }
+</style>
+
 <script type="text/javascript">
 	//gallery json-rpc service
 	dojo.require("dojo.rpc.JsonService");
@@ -77,6 +82,7 @@
 	}
 
 	dojo.addOnLoad( function() { populateSelect(); });
+	
 </script>
 </head>
 
@@ -99,9 +105,15 @@
               <li>
                  <label>Files:</label>
                  <div id="files" class="field"></div>
+                
               </li>
               <li>
-                  <div id="btnUploader" class="uploadBtn btn">Select Files</div>
+               	<div id="progressDiv" class="tundra" > 
+                	<div id="progressBar" dojoType="dijit.ProgressBar" style="width:300px;display:none;" jsId="jsProgress"></div> 
+               	</div>
+              </li>
+              <li>
+                  <div id="btnUploader" class="uploadBtn btn" >Select Files</div>
                   <div id="btnUpload" class="uploadBtn btn" onClick="doUpload();">Upload</div>	
               </li>
 		  </ol>