]> source.dussan.org Git - nextcloud-server.git/commitdiff
Added uploading to folder and cancellable downloads
authorSimon Birnbach <simon@simon-birnbach.de>
Tue, 27 Mar 2012 19:38:55 +0000 (21:38 +0200)
committerSimon Birnbach <simon@simon-birnbach.de>
Tue, 27 Mar 2012 19:38:55 +0000 (21:38 +0200)
files/css/files.css
files/js/fileactions.js
files/js/filelist.js
files/js/files.js
files/templates/index.php
files/templates/part.list.php

index 60851b6f57ea2aa1ff46056fb60bfad7906493e6..8e3a767721eb5081f6bbb4c753cc07d68462ed09 100644 (file)
@@ -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; }
index b5dd3982803405ef8eadbde0fbcc7472a36922a0..384ffc92cf231ab8008a3d6be4bccdbf52c1287c 100644 (file)
@@ -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){
index 35847e06dfea783a56fb591820e5ae8d0ffe1afa..0faff08a73f7ab5bdf2512297e8c4cfee7b759c7 100644 (file)
@@ -42,6 +42,7 @@ FileList={
                td.append('<input type="checkbox" />');
                var link_elem = $('<a></a>').attr({ "class": "name", "href": "index.php?dir="+ encodeURIComponent($('#dir').val()+'/'+name).replace(/%2F/g, '/') });
                link_elem.append($('<span></span>').addClass('nametext').text(name));
+               link_elem.append($('<span></span>').attr({'class': 'uploadtext', 'currentUploads': 0}));
                td.append(link_elem);
                html.append(td);
                if(size!='Pending'){
index 5f61bdd2ac371568190a6b4022a38be08c4f83c0..6eed25dfe994a2d9526888f4b0b55b8733a45c32 100644 (file)
@@ -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<files.length;i++){
+                                               var dropTarget = $(e.originalEvent.target).closest('tr');
+                                               if(dropTarget && dropTarget.attr('data-type') === 'dir') {
+                                                       var dirName = dropTarget.attr('data-file')
+                                                       var jqXHR =  $('.file_upload_start').fileupload('send', {files: files[i],
+                                                                       formData: function(form) {
+                                                                               var formArray = form.serializeArray();
+                                                                               formArray[1]['value'] = dirName;
+                                                                               return formArray;
+                                                                       }}).success(function(result, textStatus, jqXHR) {
+                                                                               var response;
+                                                                               response=jQuery.parseJSON(result);
+                                                                               if(response[0] == undefined || response[0].status != 'success') {
+                                                                                       $('#notification').text(t('files', response.data.message));
+                                                                                       $('#notification').fadeIn();
+                                                                               }
+                                                                               var file=response[0];
+                                                                               delete uploadingFiles[file.name];
+                                                                               var currentUploads = parseInt(uploadtext.attr('currentUploads'));
+                                                                               currentUploads -= 1;
+                                                                               uploadtext.attr('currentUploads', currentUploads);
+                                                                               if(currentUploads === 0) {
+                                                                                       var img = OC.imagePath('core', 'filetypes/folder.png');
+                                                                                       var tr=$('tr').filterAttr('data-file',dirName);
+                                                                                       tr.find('td.filename').attr('style','background-image:url('+img+')');
+                                                                                       uploadtext.text('');
+                                                                                       uploadtext.hide();
+                                                                               } else {
+                                                                                       uploadtext.text(currentUploads + ' files uploading')
+                                                                               }
+                                                                       })
+                                                       .error(function(jqXHR, textStatus, errorThrown) {
+                                                               if(errorThrown === 'abort') {
+                                                                       $('#notification').hide();
+                                                                       $('#notification').text(t('files', 'Upload cancelled.'));
+                                                                       $('#notification').fadeIn();
+                                                               }
+                                                       });
+                                               } else {
+                                                       var jqXHR =  $('.file_upload_start').fileupload('send', {files: files[i]})
+                                                                       .success(function(result, textStatus, jqXHR) {
+                                                                               var response;
+                                                                               response=jQuery.parseJSON(result);
+                                                                               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();
+                                                                               }
+                                                                       })
+                                                       .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<files.length;i++){
@@ -187,8 +303,22 @@ $(document).ready(function() {
                                                        }else{
                                                                var size=t('files','Pending');
                                                        }
-                                                       if(files){
+                                                       if(files && !dirName){
                                                                FileList.addFile(files[i].name,size,date,true);
+                                                       } else if(dirName) {
+                                                               var uploadtext = $('tr').filterAttr('data-type', 'dir').filterAttr('data-file', dirName).find('.uploadtext')
+                                                               var currentUploads = parseInt(uploadtext.attr('currentUploads'));
+                                                               currentUploads += 1;
+                                                               uploadtext.attr('currentUploads', currentUploads);
+                                                               if(currentUploads === 1) {
+                                                                       var img = OC.imagePath('core', 'loading.gif');
+                                                                       var tr=$('tr').filterAttr('data-file',dirName);
+                                                                       tr.find('td.filename').attr('style','background-image:url('+img+')');
+                                                                       uploadtext.text('1 file uploading');
+                                                                       uploadtext.show();
+                                                               } else {
+                                                                       uploadtext.text(currentUploads + ' files uploading')
+                                                               }
                                                        }
                                                }
                                        }else{
@@ -197,28 +327,6 @@ $(document).ready(function() {
                                        }
                                }
                        },
-                       done: function(e, data) {
-                               var response;
-                               if(data.dataType == 'iframe ') {
-                                       response = jQuery.parseJSON(data.result[0].body.innerText);
-                               } else {
-                                       response=jQuery.parseJSON(data.result);
-                               }                               
-                               if(response[0] != undefined && response[0].status == 'success') {
-                                       var file=response[0];
-                                       $('tr').filterAttr('data-file',file.name).data('mime',file.type);
-                                       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();
-                               }
-                       },
                        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){
index abcbd2692110be0400c377bbec85347681694a87..319c8c64a07dd4aa9dc4d0ed503bdeea0ac56356 100644 (file)
                                        <iframe name="file_upload_target_1" class='file_upload_target' src=""></iframe>
                                </form>
                        </div>
-                       <div id="uploadprogressbar"></div>
+                                       <div id="upload">
+                                               <div id="uploadprogressbar"></div>
+                                               <input type="button" class="stop" style="display:none" value="<?php echo $l->t('Cancel upload');?>" onclick="javascript:Files.cancelUploads();" />
+                                       </div>
+
                </div>
                <div id="file_action_panel"></div>
        <?php else:?>
index b117d81a1a580b7ecbb871bbaebbd23f0313856d..a86632bafc83e2da43fa9873492dc77bca6a46fd 100644 (file)
                                                        <?php echo htmlspecialchars($file['basename']);?><span class='extention'><?php echo $file['extention'];?></span>
                                                <?php endif;?>
                                        </span>
+                                       <?php if($file['type'] == 'dir'):?>
+                                               <span class="uploadtext" currentUploads="0">
+                                               </span>
+                                       <?php endif;?>
                                        </a>
                                </td>
                                <td class="filesize" title="<?php echo human_file_size($file['size']); ?>" style="color:rgb(<?php echo $simple_size_color.','.$simple_size_color.','.$simple_size_color ?>)"><?php echo $simple_file_size; ?></td>