loading screen for filepicker

2 files changed, 5 insertions, 1 deletions

diff --git a/core/css/styles.css b/core/css/styles.css
index 1c50df9e58b..0eb299a8995 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -137,3 +137,4 @@ a.bookmarklet { background-color: #ddd; border:1px solid #ccc; padding: 5px;padd
 #dirtree {width: 100%;}
 #filelist {height: 270px; overflow:scroll; background-color: white;}
 .filepicker_element_selected { background-color: lightblue;}
+.filepicker_loader {height: 270px; width: 100%; background-color: #333; opacity: 0.3; visibility: visible; position:absolute; top:0; left:0; text-align:center; padding-top: 150px;}
diff --git a/core/js/oc-dialogs.js b/core/js/oc-dialogs.js
index 7ae9bc9d2ad..e027ffb5103 100644
--- a/core/js/oc-dialogs.js
+++ b/core/js/oc-dialogs.js
@@ -100,7 +100,7 @@ OCdialogs = {
   filepicker:function(title, callback, multiselect, mimetype_filter, modal) {
     var c_name = 'oc-dialog-'+OCdialogs.dialogs_counter+'-content';
     var c_id = '#'+c_name;
-    var d = '<div id="'+c_name+'" title="'+title+'"><select id="dirtree"><option value="0">'+OC.currentUser+'</option></select><div id="filelist"></div></div>';
+    var d = '<div id="'+c_name+'" title="'+title+'"><select id="dirtree"><option value="0">'+OC.currentUser+'</option></select><div id="filelist"></div><div class="filepicker_loader"><img src="'+OC.filePath('gallery','img','loading.gif')+'"></div></div>';
     if (!modal) modal = false;
     if (!multiselect) multiselect = false;
     $('body').append(d);
@@ -207,6 +207,7 @@ OCdialogs = {
       names += entry_template.replace('*LASTMODDATE*', OC.mtime2date(r.data[a].mtime)).replace('*NAME*', r.data[a].name).replace('*MIMETYPEICON*', r.data[a].mimetype_icon).replace('*ENTRYNAME*', r.data[a].name).replace('*ENTRYTYPE*', r.data[a].type);
     }
     $(dialog_content_id + ' #filelist').html(names);
+    $(dialog_content_id + ' .filepicker_loader').css('visibility', 'hidden');
   },
   handleTreeListSelect:function(event) {
     var newval = parseInt($(this).val());
@@ -220,6 +221,7 @@ OCdialogs = {
     var path = '';
     $(this).children().each(function(i, element) { if (skip_first) {skip_first = false; return; }path += '/'+$(element).text(); });
     $(event.data.dcid).data('path', path);
+    $(event.data.dcid + ' .filepicker_loader').css('visibility', 'visible');
     $.getJSON(OC.webroot+'/files/ajax/rawlist.php', {dir: path}, function(r){OC.dialogs.fillFilePicker(r, event.data.dcid)});
   },
   // this function is in early development state, please dont use it unlsess you know what you are doing
@@ -237,6 +239,7 @@ OCdialogs = {
     $(dcid + ' #dirtree option:last').removeAttr('selected');
     var newval = parseInt($(dcid + ' #dirtree option:last').val())+1;
     $(dcid + ' #dirtree').append('<option selected="selected" value="'+newval+'">'+name+'</option>');
+    $(dcid + ' .filepicker_loader').css('visibility', 'visible');
     $.getJSON(OC.webroot+'/files/ajax/rawlist.php', {dir: p}, function(r){OC.dialogs.fillFilePicker(r, dcid)});
   }
 };