Feature 3185 : Add upload progress indicator with Piecon

git-svn-id: http://piwigo.org/svn/trunk@30766 68402e56-0260-453c-a942-63ccdbb3a9ee

admin/themes/default/template/photos_add_direct.tpl

@@ -1,8 +1,9 @@
 {combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
+
 {combine_script id='jquery.jgrowl' load='footer' require='jquery' path='themes/default/js/plugins/jquery.jgrowl_minimized.js'}
+
 {combine_script id='jquery.plupload' load='footer' require='jquery' path='themes/default/js/plugins/plupload/plupload.full.min.js'}
 {combine_script id='jquery.plupload.queue' load='footer' require='jquery' path='themes/default/js/plugins/plupload/jquery.plupload.queue/jquery.plupload.queue.min.js'}
-{combine_script id='jquery.ui.progressbar' load='footer'}
 
 {combine_css path="themes/default/js/plugins/jquery.jgrowl.css"}
 {combine_css path="themes/default/js/plugins/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css"}
@@ -20,6 +21,8 @@
 {combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
 {combine_css id='jquery.selectize' path="themes/default/js/plugins/selectize.{$themeconf.colorscheme}.css"}
 
+{combine_script id='piecon' load='footer' path='themes/default/js/plugins/piecon.min.js'}
+
 {footer_script}
 {* <!-- CATEGORIES --> *}
 var categoriesCache = new CategoriesCache({
@@ -44,6 +47,13 @@ jQuery('[data-add-album]').pwgAddAlbum({
   }
 });
 
+Piecon.setOptions({
+  color: '#ff7700',
+  background: '#bbb',
+  shadow: '#fff',
+  fallback: 'force'
+});
+
 var pwg_token = '{$pwg_token}';
 var photosUploaded_label = "{'%d photos uploaded'|translate}";
 var batch_Label = "{'Manage this set of %d photos'|translate}";
@@ -118,6 +128,7 @@ jQuery(document).ready(function(){
       
       UploadProgress: function(up, file) {
         jQuery('#uploadingActions .progressbar').width(up.total.percent+'%');
+        Piecon.setProgress(up.total.percent);
       },
       
       BeforeUpload: function(up, file) {
@@ -173,6 +184,8 @@ jQuery(document).ready(function(){
       UploadComplete: function(up, files) {
         // Called when all files are either uploaded or failed
         //console.log('[UploadComplete]');
+        
+        Piecon.reset();
 
         jQuery(".selectAlbum, .selectFiles, #permissions, .showFieldset").hide();