open-dsi
/
nextcloud-server
mirror of https://github.com/nextcloud/server
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

separate uploading code from progress code, add progress capability detection

Browse Source
remotes/origin/stable6
Jörn Friedrich Dreyer 12 years ago
parent 49fd7e9f1e
commit bbf8acb383
4 changed files with 136 additions and 122 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 145
      apps/files/js/file-upload.js
  2. 20
      apps/files/js/filelist.js
  3. 32
      apps/files/js/files.js
  4. 13
      core/js/oc-dialogs.js

145
apps/files/js/file-upload.js
Unescape View File

@ -14,6 +14,7 @@
* - when only existing -> remember as single skip action * - when only existing -> remember as single skip action
* - when only new -> remember as single replace action * - when only new -> remember as single replace action
* - when both -> remember as single autorename action * - when both -> remember as single autorename action
* - continue -> apply marks, when nothing is marked continue == skip all
* - start uploading selection * - start uploading selection
* *
* on send * on send
@ -96,7 +97,30 @@
* *
*/ */
// from https://github.com/New-Bamboo/example-ajax-upload/blob/master/public/index.html
// also see article at http://blog.new-bamboo.co.uk/2012/01/10/ridiculously-simple-ajax-uploads-with-formdata
// Function that will allow us to know if Ajax uploads are supported
function supportAjaxUploadWithProgress() {
return supportFileAPI() && supportAjaxUploadProgressEvents() && supportFormData();
// Is the File API supported?
function supportFileAPI() {
var fi = document.createElement('INPUT');
fi.type = 'file';
return 'files' in fi;
};
// Are progress events supported?
function supportAjaxUploadProgressEvents() {
var xhr = new XMLHttpRequest();
return !! (xhr && ('upload' in xhr) && ('onprogress' in xhr.upload));
};
// Is FormData supported?
function supportFormData() {
return !! window.FormData;
}
}
//TODO clean uploads when all progress has completed //TODO clean uploads when all progress has completed
OC.Upload = { OC.Upload = {
@ -245,6 +269,7 @@ OC.Upload = {
console.log(data); console.log(data);
}, },
checkExistingFiles: function (selection, callbacks){ checkExistingFiles: function (selection, callbacks){
// FIXME check filelist before uploading
callbacks.onNoConflicts(selection); callbacks.onNoConflicts(selection);
} }
}; };
@ -327,7 +352,7 @@ $(document).ready(function() {
return false; //don't upload anything return false; //don't upload anything
} }
// check existing files whan all is collected // check existing files when all is collected
if ( selection.uploads.length >= selection.filesToUpload ) { if ( selection.uploads.length >= selection.filesToUpload ) {
//remove our selection hack: //remove our selection hack:
@ -358,11 +383,6 @@ $(document).ready(function() {
OC.Upload.checkExistingFiles(selection, callbacks); OC.Upload.checkExistingFiles(selection, callbacks);
//TODO refactor away:
//show cancel button
if($('html.lte9').length === 0 && data.dataType !== 'iframe') {
$('#uploadprogresswrapper input.stop').show();
}
} }
@ -389,13 +409,6 @@ $(document).ready(function() {
*/ */
start: function(e) { start: function(e) {
OC.Upload.logStatus('start', e, null); OC.Upload.logStatus('start', e, null);
//IE < 10 does not fire the necessary events for the progress bar.
if($('html.lte9').length > 0) {
return true;
}
$('#uploadprogresswrapper input.stop').show();
$('#uploadprogressbar').progressbar({value:0});
$('#uploadprogressbar').fadeIn();
}, },
fail: function(e, data) { fail: function(e, data) {
OC.Upload.logStatus('fail', e, data); OC.Upload.logStatus('fail', e, data);
@ -414,32 +427,6 @@ $(document).ready(function() {
} }
//var selection = OC.Upload.getSelection(data.originalFiles); //var selection = OC.Upload.getSelection(data.originalFiles);
//OC.Upload.deleteSelectionUpload(selection, data.files[0].name); //OC.Upload.deleteSelectionUpload(selection, data.files[0].name);
//if user pressed cancel hide upload progress bar and cancel button
if (data.errorThrown === 'abort') {
$('#uploadprogresswrapper input.stop').fadeOut();
$('#uploadprogressbar').fadeOut();
}
},
progress: function(e, data) {
OC.Upload.logStatus('progress', e, data);
// TODO: show nice progress bar in file row
},
/**
*
* @param {type} e
* @param {type} data (only has loaded, total and lengthComputable)
* @returns {unresolved}
*/
progressall: function(e, data) {
OC.Upload.logStatus('progressall', e, data);
//IE < 10 does not fire the necessary events for the progress bar.
if($('html.lte9').length > 0) {
return;
}
var progress = (data.loaded/data.total)*100;
//var progress = OC.Upload.progressBytes();
$('#uploadprogressbar').progressbar('value', progress);
}, },
/** /**
* called for every successful upload * called for every successful upload
@ -460,14 +447,8 @@ $(document).ready(function() {
//var selection = OC.Upload.getSelection(data.originalFiles); //var selection = OC.Upload.getSelection(data.originalFiles);
if(typeof result[0] !== 'undefined' if(typeof result[0] !== 'undefined'
&& result[0].status === 'success' && result[0].status === 'existserror'
) { ) {
//if (selection) {
// selection.loadedBytes+=data.loaded;
//}
//OC.Upload.nextUpload();
} else {
if (result[0].status === 'existserror') {
//show "file already exists" dialog //show "file already exists" dialog
var original = result[0]; var original = result[0];
var replacement = data.files[0]; var replacement = data.files[0];
@ -480,13 +461,7 @@ $(document).ready(function() {
var fu = $(this).data('blueimp-fileupload') || $(this).data('fileupload'); var fu = $(this).data('blueimp-fileupload') || $(this).data('fileupload');
fu._trigger('fail', e, data); fu._trigger('fail', e, data);
} }
}
//if user pressed cancel hide upload chrome
//if (! OC.Upload.isProcessing()) {
// $('#uploadprogresswrapper input.stop').fadeOut();
// $('#uploadprogressbar').fadeOut();
//}
}, },
/** /**
@ -496,6 +471,49 @@ $(document).ready(function() {
*/ */
stop: function(e, data) { stop: function(e, data) {
OC.Upload.logStatus('stop', e, data); OC.Upload.logStatus('stop', e, data);
}
};
if ( document.getElementById('data-upload-form') ) {
// initialize jquery fileupload (blueimp)
var fileupload = $('#file_upload_start').fileupload(file_upload_param);
if(supportAjaxUploadWithProgress()) {
// add progress handlers
fileupload.on('fileuploadadd', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadadd', e, data);
//show cancel button
//if(data.dataType !== 'iframe') { //FIXME when is iframe used? only for ie?
// $('#uploadprogresswrapper input.stop').show();
//}
});
// add progress handlers
fileupload.on('fileuploadstart', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadstart', e, data);
$('#uploadprogresswrapper input.stop').show();
$('#uploadprogressbar').progressbar({value:0});
$('#uploadprogressbar').fadeIn();
});
fileupload.on('fileuploadprogress', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadprogress', e, data);
//TODO progressbar in row
});
fileupload.on('fileuploadprogressall', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadprogressall', e, data);
var progress = (data.loaded / data.total) * 100;
$('#uploadprogressbar').progressbar('value', progress);
});
fileupload.on('fileuploaddone', function(e, data) {
OC.Upload.logStatus('progress handle fileuploaddone', e, data);
//if user pressed cancel hide upload chrome
//if (! OC.Upload.isProcessing()) {
// $('#uploadprogresswrapper input.stop').fadeOut();
// $('#uploadprogressbar').fadeOut();
//}
});
fileupload.on('fileuploadstop', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadstop', e, data);
//if(OC.Upload.progressBytes()>=100) { //only hide controls when all selections have ended uploading //if(OC.Upload.progressBytes()>=100) { //only hide controls when all selections have ended uploading
//OC.Upload.cancelUploads(); //cleanup //OC.Upload.cancelUploads(); //cleanup
@ -504,11 +522,6 @@ $(document).ready(function() {
// $('#uploadprogresswrapper input.stop').hide(); // $('#uploadprogresswrapper input.stop').hide();
// } // }
//IE < 10 does not fire the necessary events for the progress bar.
if($('html.lte9').length > 0) {
return;
}
// $('#uploadprogressbar').progressbar('value', 100); // $('#uploadprogressbar').progressbar('value', 100);
// $('#uploadprogressbar').fadeOut(); // $('#uploadprogressbar').fadeOut();
//} //}
@ -517,15 +530,19 @@ $(document).ready(function() {
// $('#uploadprogresswrapper input.stop').fadeOut(); // $('#uploadprogresswrapper input.stop').fadeOut();
// $('#uploadprogressbar').fadeOut(); // $('#uploadprogressbar').fadeOut();
//} //}
});
fileupload.on('fileuploadfail', function(e, data) {
OC.Upload.logStatus('progress handle fileuploadfail', e, data);
//if user pressed cancel hide upload progress bar and cancel button
if (data.errorThrown === 'abort') {
$('#uploadprogresswrapper input.stop').fadeOut();
$('#uploadprogressbar').fadeOut();
} }
}; });
var file_upload_handler = function() {
$('#file_upload_start').fileupload(file_upload_param);
};
if ( document.getElementById('data-upload-form') ) { } else {
$(file_upload_handler); console.log('skipping file progress because your browser is broken');
}
} }
$.assocArraySize = function(obj) { $.assocArraySize = function(obj) {
// http://stackoverflow.com/a/6700/11236 // http://stackoverflow.com/a/6700/11236

20
apps/files/js/filelist.js
Unescape View File

@ -517,7 +517,7 @@ $(document).ready(function(){
var file_upload_start = $('#file_upload_start'); var file_upload_start = $('#file_upload_start');
file_upload_start.on('fileuploaddrop', function(e, data) { file_upload_start.on('fileuploaddrop', function(e, data) {
OC.Upload.logStatus('fileuploaddrop', e, data); OC.Upload.logStatus('filelist handle fileuploaddrop', e, data);
var dropTarget = $(e.originalEvent.target).closest('tr'); var dropTarget = $(e.originalEvent.target).closest('tr');
if(dropTarget && dropTarget.data('type') === 'dir') { // drag&drop upload to folder if(dropTarget && dropTarget.data('type') === 'dir') { // drag&drop upload to folder
@ -556,7 +556,7 @@ $(document).ready(function(){
}); });
file_upload_start.on('fileuploadadd', function(e, data) { file_upload_start.on('fileuploadadd', function(e, data) {
OC.Upload.logStatus('fileuploadadd', e, data); OC.Upload.logStatus('filelist handle fileuploadadd', e, data);
// lookup selection for dir // lookup selection for dir
var selection = OC.Upload.getSelection(data.originalFiles); var selection = OC.Upload.getSelection(data.originalFiles);
@ -592,10 +592,10 @@ $(document).ready(function(){
}); });
file_upload_start.on('fileuploadstart', function(e, data) { file_upload_start.on('fileuploadstart', function(e, data) {
OC.Upload.logStatus('fileuploadstart', e, data); OC.Upload.logStatus('filelist handle fileuploadstart', e, data);
}); });
file_upload_start.on('fileuploaddone', function(e, data) { file_upload_start.on('fileuploaddone', function(e, data) {
OC.Upload.logStatus('fileuploaddone', e, data); OC.Upload.logStatus('filelist handle fileuploaddone', e, data);
var response; var response;
if (typeof data.result === 'string') { if (typeof data.result === 'string') {
@ -672,22 +672,22 @@ $(document).ready(function(){
}); });
file_upload_start.on('fileuploadalways', function(e, data) { file_upload_start.on('fileuploadalways', function(e, data) {
OC.Upload.logStatus('fileuploadalways', e, data); OC.Upload.logStatus('filelist handle fileuploadalways', e, data);
}); });
file_upload_start.on('fileuploadsend', function(e, data) { file_upload_start.on('fileuploadsend', function(e, data) {
OC.Upload.logStatus('fileuploadsend', e, data); OC.Upload.logStatus('filelist handle fileuploadsend', e, data);
// TODOD add vis // TODOD add vis
//data.context.element = //data.context.element =
}); });
file_upload_start.on('fileuploadprogress', function(e, data) { file_upload_start.on('fileuploadprogress', function(e, data) {
OC.Upload.logStatus('fileuploadprogress', e, data); OC.Upload.logStatus('filelist handle fileuploadprogress', e, data);
}); });
file_upload_start.on('fileuploadprogressall', function(e, data) { file_upload_start.on('fileuploadprogressall', function(e, data) {
OC.Upload.logStatus('fileuploadprogressall', e, data); OC.Upload.logStatus('filelist handle fileuploadprogressall', e, data);
}); });
file_upload_start.on('fileuploadstop', function(e, data) { file_upload_start.on('fileuploadstop', function(e, data) {
OC.Upload.logStatus('fileuploadstop', e, data); OC.Upload.logStatus('filelist handle fileuploadstop', e, data);
//if user pressed cancel hide upload chrome //if user pressed cancel hide upload chrome
if (! OC.Upload.isProcessing()) { if (! OC.Upload.isProcessing()) {
@ -700,7 +700,7 @@ $(document).ready(function(){
} }
}); });
file_upload_start.on('fileuploadfail', function(e, data) { file_upload_start.on('fileuploadfail', function(e, data) {
OC.Upload.logStatus('fileuploadfail', e, data); OC.Upload.logStatus('filelist handle fileuploadfail', e, data);
//if user pressed cancel hide upload chrome //if user pressed cancel hide upload chrome
if (data.errorThrown === 'abort') { if (data.errorThrown === 'abort') {

32
apps/files/js/files.js
Unescape View File

@ -1,6 +1,6 @@
Files={ Files={
updateMaxUploadFilesize:function(response) { updateMaxUploadFilesize:function(response) {
if(response == undefined) { if(response === undefined) {
return; return;
} }
if(response.data !== undefined && response.data.uploadMaxFilesize !== undefined) { if(response.data !== undefined && response.data.uploadMaxFilesize !== undefined) {
@ -9,7 +9,7 @@ Files={
$('#usedSpacePercent').val(response.data.usedSpacePercent); $('#usedSpacePercent').val(response.data.usedSpacePercent);
Files.displayStorageWarnings(); Files.displayStorageWarnings();
} }
if(response[0] == undefined) { if(response[0] === undefined) {
return; return;
} }
if(response[0].uploadMaxFilesize !== undefined) { if(response[0].uploadMaxFilesize !== undefined) {
@ -25,7 +25,7 @@ Files={
OC.Notification.show(t('files', '\'.\' is an invalid file name.')); OC.Notification.show(t('files', '\'.\' is an invalid file name.'));
return false; return false;
} }
if (name.length == 0) { if (name.length === 0) {
OC.Notification.show(t('files', 'File name cannot be empty.')); OC.Notification.show(t('files', 'File name cannot be empty.'));
return false; return false;
} }
@ -33,7 +33,7 @@ Files={
// check for invalid characters // check for invalid characters
var invalid_characters = ['\\', '/', '<', '>', ':', '"', '|', '?', '*']; var invalid_characters = ['\\', '/', '<', '>', ':', '"', '|', '?', '*'];
for (var i = 0; i < invalid_characters.length; i++) { for (var i = 0; i < invalid_characters.length; i++) {
if (name.indexOf(invalid_characters[i]) != -1) { if (name.indexOf(invalid_characters[i]) !== -1) {
OC.Notification.show(t('files', "Invalid name, '\\', '/', '<', '>', ':', '\"', '|', '?' and '*' are not allowed.")); OC.Notification.show(t('files', "Invalid name, '\\', '/', '<', '>', ':', '\"', '|', '?' and '*' are not allowed."));
return false; return false;
} }
@ -127,7 +127,7 @@ $(document).ready(function() {
var rows = $(this).parent().parent().parent().children('tr'); var rows = $(this).parent().parent().parent().children('tr');
for (var i = start; i < end; i++) { for (var i = start; i < end; i++) {
$(rows).each(function(index) { $(rows).each(function(index) {
if (index == i) { if (index === i) {
var checkbox = $(this).children().children('input:checkbox'); var checkbox = $(this).children().children('input:checkbox');
$(checkbox).attr('checked', 'checked'); $(checkbox).attr('checked', 'checked');
$(checkbox).parent().parent().addClass('selected'); $(checkbox).parent().parent().addClass('selected');
@ -145,7 +145,7 @@ $(document).ready(function() {
$(checkbox).attr('checked', 'checked'); $(checkbox).attr('checked', 'checked');
$(checkbox).parent().parent().toggleClass('selected'); $(checkbox).parent().parent().toggleClass('selected');
var selectedCount=$('td.filename input:checkbox:checked').length; var selectedCount=$('td.filename input:checkbox:checked').length;
if (selectedCount == $('td.filename input:checkbox').length) { if (selectedCount === $('td.filename input:checkbox').length) {
$('#select_all').attr('checked', 'checked'); $('#select_all').attr('checked', 'checked');
} }
} }
@ -192,7 +192,7 @@ $(document).ready(function() {
var rows = $(this).parent().parent().parent().children('tr'); var rows = $(this).parent().parent().parent().children('tr');
for (var i = start; i < end; i++) { for (var i = start; i < end; i++) {
$(rows).each(function(index) { $(rows).each(function(index) {
if (index == i) { if (index === i) {
var checkbox = $(this).children().children('input:checkbox'); var checkbox = $(this).children().children('input:checkbox');
$(checkbox).attr('checked', 'checked'); $(checkbox).attr('checked', 'checked');
$(checkbox).parent().parent().addClass('selected'); $(checkbox).parent().parent().addClass('selected');
@ -205,7 +205,7 @@ $(document).ready(function() {
if(!$(this).attr('checked')){ if(!$(this).attr('checked')){
$('#select_all').attr('checked',false); $('#select_all').attr('checked',false);
}else{ }else{
if(selectedCount==$('td.filename input:checkbox').length){ if(selectedCount === $('td.filename input:checkbox').length){
$('#select_all').attr('checked',true); $('#select_all').attr('checked',true);
} }
} }
@ -262,9 +262,9 @@ $(document).ready(function() {
function resizeBreadcrumbs(firstRun) { function resizeBreadcrumbs(firstRun) {
var width = $(this).width(); var width = $(this).width();
if (width != lastWidth) { if (width !== lastWidth) {
if ((width < lastWidth || firstRun) && width < breadcrumbsWidth) { if ((width < lastWidth || firstRun) && width < breadcrumbsWidth) {
if (hiddenBreadcrumbs == 0) { if (hiddenBreadcrumbs === 0) {
breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth; breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth;
$(breadcrumbs[1]).find('a').hide(); $(breadcrumbs[1]).find('a').hide();
$(breadcrumbs[1]).append('<span>...</span>'); $(breadcrumbs[1]).append('<span>...</span>');
@ -276,12 +276,12 @@ $(document).ready(function() {
breadcrumbsWidth -= $(breadcrumbs[i]).get(0).offsetWidth; breadcrumbsWidth -= $(breadcrumbs[i]).get(0).offsetWidth;
$(breadcrumbs[i]).hide(); $(breadcrumbs[i]).hide();
hiddenBreadcrumbs = i; hiddenBreadcrumbs = i;
i++ i++;
} }
} else if (width > lastWidth && hiddenBreadcrumbs > 0) { } else if (width > lastWidth && hiddenBreadcrumbs > 0) {
var i = hiddenBreadcrumbs; var i = hiddenBreadcrumbs;
while (width > breadcrumbsWidth && i > 0) { while (width > breadcrumbsWidth && i > 0) {
if (hiddenBreadcrumbs == 1) { if (hiddenBreadcrumbs === 1) {
breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth; breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth;
$(breadcrumbs[1]).find('span').remove(); $(breadcrumbs[1]).find('span').remove();
$(breadcrumbs[1]).find('a').show(); $(breadcrumbs[1]).find('a').show();
@ -382,7 +382,7 @@ scanFiles.scanning=false;
function boolOperationFinished(data, callback) { function boolOperationFinished(data, callback) {
result = jQuery.parseJSON(data.responseText); result = jQuery.parseJSON(data.responseText);
Files.updateMaxUploadFilesize(result); Files.updateMaxUploadFilesize(result);
if(result.status == 'success'){ if(result.status === 'success'){
callback.call(); callback.call();
} else { } else {
alert(result.data.message); alert(result.data.message);
@ -436,7 +436,7 @@ var createDragShadow = function(event){
}); });
return dragshadow; return dragshadow;
} };
//options for file drag/drop //options for file drag/drop
var dragOptions={ var dragOptions={
@ -446,7 +446,7 @@ var dragOptions={
stop: function(event, ui) { stop: function(event, ui) {
$('#fileList tr td.filename').addClass('ui-draggable'); $('#fileList tr td.filename').addClass('ui-draggable');
} }
} };
// sane browsers support using the distance option // sane browsers support using the distance option
if ( $('html.ie').length === 0) { if ( $('html.ie').length === 0) {
dragOptions['distance'] = 20; dragOptions['distance'] = 20;
@ -489,7 +489,7 @@ var folderDropOptions={
}); });
}, },
tolerance: 'pointer' tolerance: 'pointer'
} };
var crumbDropOptions={ var crumbDropOptions={
drop: function( event, ui ) { drop: function( event, ui ) {

13
core/js/oc-dialogs.js
Unescape View File

@ -257,13 +257,7 @@ var OCdialogs = {
//TODO add to same size collection? //TODO add to same size collection?
} }
//add checkbox toggling actions //TODO show skip action for files with same size and mtime in bottom row
conflict.find('.replacement,.original').on('click', function(){
var checkbox = $(this).find('input[type="checkbox"]');
checkbox.prop('checkbox', !checkbox.prop('checkbox'));
}).find('input[type="checkbox"]').prop('checkbox',false);
//TODO show skip action for files with same size and mtime
}; };
var selection = controller.getSelection(data.originalFiles); var selection = controller.getSelection(data.originalFiles);
@ -345,11 +339,14 @@ var OCdialogs = {
var checkboxes = $(dialog_id).find('.conflict:not(.template) .original input[type="checkbox"]'); var checkboxes = $(dialog_id).find('.conflict:not(.template) .original input[type="checkbox"]');
checkboxes.prop('checked', $(this).prop('checked')); checkboxes.prop('checked', $(this).prop('checked'));
}); });
$(dialog_id).find('.conflicts').on('click', '.replacement,.original', function() { $(dialog_id).find('.conflicts').on('click', '.replacement,.original', function() {
var checkbox = $(this).find('input[type="checkbox"]'); var checkbox = $(this).find('input[type="checkbox"]');
checkbox.prop('checked', !checkbox.prop('checked')); checkbox.prop('checked', !checkbox.prop('checked'));
}); });
$(dialog_id).find('.conflicts').on('click', 'input[type="checkbox"]', function() {
var checkbox = $(this);
checkbox.prop('checked', !checkbox.prop('checked'));
});
//update counters //update counters
$(dialog_id).on('click', '.replacement,.allnewfiles', function() { $(dialog_id).on('click', '.replacement,.allnewfiles', function() {

Write Preview
Loading…
Cancel
Save