diff --git a/files/css/files.css b/files/css/files.css index 60851b6f57..8e3a767721 100644 --- a/files/css/files.css +++ b/files/css/files.css @@ -30,7 +30,8 @@ .file_upload_filename { position: relative; z-index:100; padding-left: 0.8em; padding-right: 0.8em; cursor:pointer; border-top-left-radius:0; border-bottom-left-radius:0; } .file_upload_filename img { position: absolute; top: 0.4em; left: 0.4em; } -#uploadprogressbar { position:absolute; right:14.5em; display:inline-block; width:10em; height:1.5em; top:.4em; } +#upload { position:absolute; right:13.5em; top:0em; } +#upload #uploadprogressbar { position:relative; display:inline-block; width:10em; height:1.5em; top:.4em; } .file_upload_form, .file_upload_wrapper, .file_upload_start, .file_upload_filename, #file_upload_submit { cursor:pointer; } @@ -41,7 +42,7 @@ tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#f8f8f8; h tbody tr { background-color:#fff; } tbody tr.selected { background-color:#eee; } tbody a { color:#000; } -span.extention, td.date { color:#999; } +span.extention, span.uploading, td.date { color:#999; } span.extention { opacity:0; -webkit-transition:opacity 500ms; -moz-transition:opacity 500ms; -o-transition:opacity 500ms; transition:opacity 500ms; } tr:hover span.extention { opacity:1; } div.crumb { float:left; display:block; background:no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em; } @@ -60,8 +61,9 @@ table td.filename a.name { display:block; height:1.5em; vertical-align:middle; m table tr[data-type="dir"] td.filename a.name {font-weight:bold; } table td.filename a.name input, table td.filename a.name form { width:100%; cursor:text; } table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:.2em .5em .5em 0; } -table td.filename .nametext, .modified { float:left; padding:.3em 0; } -table td.filename .nametext { width:60%; } +table td.filename .nametext, .uploadtext, .modified { float:left; padding:.3em 0; } +//table td.filename .nametext { width:60%; } +table td.filename .uploadtext { font-weight:normal; margin-left:.5em; } table td.filename form { float:left; font-size:.85em; } table thead.fixed tr{ position:fixed; top:6.5em; z-index:49; -moz-box-shadow:0 -3px 7px #ddd; -webkit-box-shadow:0 -3px 7px #ddd; box-shadow:0 -3px 7px #ddd; } table thead.fixed { height:2em; } diff --git a/files/js/fileactions.js b/files/js/fileactions.js index b5dd398280..384ffc92cf 100644 --- a/files/js/fileactions.js +++ b/files/js/fileactions.js @@ -133,7 +133,20 @@ FileActions.register('all','Download',function(){return OC.imagePath('core','act }); FileActions.register('all','Delete',function(){return OC.imagePath('core','actions/delete')},function(filename){ - FileList.do_delete(filename); + if(Files.cancelUpload(filename)) { + if(filename.substr){ + filename=[filename]; + } + $.each(filename,function(index,file){ + var filename = $('tr').filterAttr('data-file',file); + filename.hide(); + filename.find('input[type="checkbox"]').removeAttr('checked'); + filename.removeClass('selected'); + }); + procesSelection(); + }else{ + FileList.do_delete(filename); + } }); FileActions.register('all','Rename',function(){return OC.imagePath('core','actions/rename')},function(filename){ diff --git a/files/js/filelist.js b/files/js/filelist.js index 35847e06df..0faff08a73 100644 --- a/files/js/filelist.js +++ b/files/js/filelist.js @@ -42,6 +42,7 @@ FileList={ td.append(''); var link_elem = $('').attr({ "class": "name", "href": "index.php?dir="+ encodeURIComponent($('#dir').val()+'/'+name).replace(/%2F/g, '/') }); link_elem.append($('').addClass('nametext').text(name)); + link_elem.append($('').attr({'class': 'uploadtext', 'currentUploads': 0})); td.append(link_elem); html.append(td); if(size!='Pending'){ diff --git a/files/js/files.js b/files/js/files.js index 5f61bdd2ac..6eed25dfe9 100644 --- a/files/js/files.js +++ b/files/js/files.js @@ -1,3 +1,25 @@ +var uploadingFiles = {}; +Files={ + cancelUpload:function(filename) { + if(uploadingFiles[filename]) { + uploadingFiles[filename].abort(); + delete uploadingFiles[filename]; + return true; + } + return false; + }, + cancelUploads:function() { + $.each(uploadingFiles,function(index,file){ + file.abort(); + delete uploadingFiles[index]; + var filename = $('tr').filterAttr('data-file',index); + filename.hide(); + filename.find('input[type="checkbox"]').removeAttr('checked'); + filename.removeClass('selected'); + }); + procesSelection(); + } +} $(document).ready(function() { $('#fileList tr').each(function(){ //little hack to set unescape filenames in attribute @@ -151,9 +173,13 @@ $(document).ready(function() { }); // drag&drop support using jquery.fileupload + $(document).bind('drop dragover', function (e) { + e.preventDefault(); // prevent browser from doing anything, if file isn't dropped in dropZone + }); + $(function() { $('.file_upload_start').fileupload({ - //dropZone: $('#content'), // restrict dropZone to content div + dropZone: $('#content'), // restrict dropZone to content div add: function(e, data) { var files = data.files; var totalSize=0; @@ -178,7 +204,97 @@ $(document).ready(function() { } }); }else{ - data.submit(); + if($.support.xhrFileUpload) { + for(var i=0;i tr').not('[data-mime]').fadeOut(); + $('#fileList > tr').not('[data-mime]').remove(); + } + }) + .error(function(jqXHR, textStatus, errorThrown) { + if(errorThrown === 'abort') { + $('#notification').hide(); + $('#notification').text(t('files', 'Upload cancelled.')); + $('#notification').fadeIn(); + } + }); + } + uploadingFiles[files[i].name] = jqXHR; + } + }else{ + data.submit().success(function(data, status) { + response = jQuery.parseJSON(data[0].body.innerText); + if(response[0] != undefined && response[0].status == 'success') { + var file=response[0]; + delete uploadingFiles[file.name]; + $('tr').filterAttr('data-file',file.name).data('mime',file.mime); + var size = $('tr').filterAttr('data-file',file.name).find('td.filesize').text(); + if(size==t('files','Pending')){ + $('tr').filterAttr('data-file',file.name).find('td.filesize').text(file.size); + } + FileList.loadingDone(file.name); + } else { + $('#notification').text(t('files', response.data.message)); + $('#notification').fadeIn(); + $('#fileList > tr').not('[data-mime]').fadeOut(); + $('#fileList > tr').not('[data-mime]').remove(); + } + }); + } + var date=new Date(); if(files){ for(var i=0;i tr').not('[data-mime]').fadeOut(); - $('#fileList > tr').not('[data-mime]').remove(); - } - }, fail: function(e, data) { // TODO: cancel upload & display error notification }, @@ -230,17 +338,22 @@ $(document).ready(function() { $('#uploadprogressbar').progressbar('value',progress); }, start: function(e, data) { - $('#uploadprogressbar').progressbar({value:0}); - $('#uploadprogressbar').fadeIn(); + $('#uploadprogressbar').progressbar({value:0}); + $('#uploadprogressbar').fadeIn(); + if(data.dataType != 'iframe ') { + $('#upload input.stop').show(); + } }, stop: function(e, data) { - $('#uploadprogressbar').progressbar('value',100); - $('#uploadprogressbar').fadeOut(); + if(data.dataType != 'iframe ') { + $('#upload input.stop').hide(); + } + $('#uploadprogressbar').progressbar('value',100); + $('#uploadprogressbar').fadeOut(); } }) }); - //add multiply file upload attribute to all browsers except konqueror (which crashes when it's used) if(navigator.userAgent.search(/konqueror/i)==-1){ diff --git a/files/templates/index.php b/files/templates/index.php index abcbd26921..319c8c64a0 100644 --- a/files/templates/index.php +++ b/files/templates/index.php @@ -21,7 +21,11 @@ -
+
+
+ +
+
diff --git a/files/templates/part.list.php b/files/templates/part.list.php index b117d81a1a..a86632bafc 100644 --- a/files/templates/part.list.php +++ b/files/templates/part.list.php @@ -21,6 +21,10 @@ + + + +