You are viewing a plain text version of this content. The canonical link for it is here.
Posted to photark-commits@incubator.apache.org by av...@apache.org on 2010/03/20 05:07:59 UTC

svn commit: r925548 - in /incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin: upload.html upload.js

Author: avd
Date: Sat Mar 20 05:07:59 2010
New Revision: 925548

URL: http://svn.apache.org/viewvc?rev=925548&view=rev
Log:
PHOTARK-23 Applying patch from Suhothayan Sriskandarajah.Integrated dojo progress bar.

Modified:
    incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.html
    incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.js

Modified: incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.html
URL: http://svn.apache.org/viewvc/incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.html?rev=925548&r1=925547&r2=925548&view=diff
==============================================================================
--- incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.html (original)
+++ incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.html Sat Mar 20 05:07:59 2010
@@ -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="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="btnUploader" class="uploadBtn btn" >Select Files</div>
                   <div id="btnUpload" class="uploadBtn btn" onClick="doUpload();">Upload</div>	
               </li>
 		  </ol>

Modified: incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.js
URL: http://svn.apache.org/viewvc/incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.js?rev=925548&r1=925547&r2=925548&view=diff
==============================================================================
--- incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.js (original)
+++ incubator/photark/trunk/photark-ui-admin/src/main/webapp/admin/upload.js Sat Mar 20 05:07:59 2010
@@ -20,6 +20,8 @@
 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 passthrough = function(msg){
 	}
 };
 
+var displayProgress = function (){
+	//to show its loading..
+	jsProgress.update({indeterminate:true});
+	dojo.byId("progressBar").style.display="";
+};
 
-dojo.addOnLoad( function(){
+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 @@ dojo.addOnLoad( function(){
 		
 		doUpload = function(){
 			console.log("doUpload");
+			displayProgress();
 			var selectAlbum = dojo.byId("selectAlbum");
 			var selected = selectAlbum.value;
 			console.log("selected:"+selected);
@@ -76,21 +91,49 @@ dojo.addOnLoad( function(){
 					//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);