refactor dialog creation
This commit is contained in:
parent
4af5a8c483
commit
49fd7e9f1e
|
@ -356,6 +356,9 @@ table.dragshadow td.size {
|
|||
width: 100%;
|
||||
height: 85px;
|
||||
}
|
||||
.oc-dialog .fileexists .conflict.template {
|
||||
display: none;
|
||||
}
|
||||
.oc-dialog .fileexists .conflict .filename {
|
||||
color:#777;
|
||||
word-break: break-all;
|
||||
|
@ -377,11 +380,11 @@ table.dragshadow td.size {
|
|||
float: left;
|
||||
width: 235px;
|
||||
}
|
||||
.oc-dialog .fileexists .conflict-wrapper {
|
||||
.oc-dialog .fileexists .conflicts {
|
||||
overflow-y:scroll;
|
||||
max-height: 225px;
|
||||
}
|
||||
.oc-dialog .fileexists .conflict-wrapper input[type='checkbox'] {
|
||||
.oc-dialog .fileexists .conflict input[type='checkbox'] {
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
|
|
@ -579,13 +579,14 @@ $(document).ready(function(){
|
|||
currentUploads += 1;
|
||||
uploadtext.attr('currentUploads', currentUploads);
|
||||
|
||||
var translatedText = n('files', 'Uploading %n file', 'Uploading %n files', currentUploads);
|
||||
if(currentUploads === 1) {
|
||||
var img = OC.imagePath('core', 'loading.gif');
|
||||
data.context.find('td.filename').attr('style','background-image:url('+img+')');
|
||||
uploadtext.text(t('files', '1 file uploading'));
|
||||
uploadtext.text(translatedText);
|
||||
uploadtext.show();
|
||||
} else {
|
||||
uploadtext.text(currentUploads + ' ' + t('files', 'files uploading'));
|
||||
uploadtext.text(translatedText);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -652,8 +653,9 @@ $(document).ready(function(){
|
|||
// update file data
|
||||
data.context.attr('data-mime',file.mime).attr('data-id',file.id);
|
||||
|
||||
getMimeIcon(file.mime, function(path){
|
||||
data.context.find('td.filename').attr('style','background-image:url('+path+')');
|
||||
var path = getPathForPreview(file.name);
|
||||
lazyLoadPreview(path, file.mime, function(previewpath){
|
||||
data.context.find('td.filename').attr('style','background-image:url('+previewpath+')');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,26 @@
|
|||
<div id="{dialog_name}" title="{title}" class="fileexists">
|
||||
<span class="why">{why}<!-- Which files do you want to keep --></span><br/>
|
||||
<span class="what">{what}<!-- If you select both versions, the copied file will have a number added to its name. --></span><br/>
|
||||
<br/>
|
||||
<table>
|
||||
<th><label><input class="allnewfiles" type="checkbox" />New Files<span class="count"></span></label></th>
|
||||
<th><label><input class="allexistingfiles" type="checkbox" />Already existing files<span class="count"></span></label></th>
|
||||
</table>
|
||||
<div class="conflicts">
|
||||
<div class="conflict template">
|
||||
<div class="filename"></div>
|
||||
<div class="replacement">
|
||||
<input type="checkbox" />
|
||||
<span class="svg icon"></span>
|
||||
<div class="mtime"></div>
|
||||
<div class="size"></div>
|
||||
</div>
|
||||
<div class="original">
|
||||
<input type="checkbox" />
|
||||
<span class="svg icon"></span>
|
||||
<div class="mtime"></div>
|
||||
<div class="size"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -220,28 +220,24 @@ var OCdialogs = {
|
|||
*/
|
||||
fileexists:function(data, original, replacement, controller) {
|
||||
var self = this;
|
||||
var selection = controller.getSelection(data.originalFiles);
|
||||
if (selection.defaultAction) {
|
||||
controller[selection.defaultAction](data);
|
||||
} else {
|
||||
var dialog_name = 'oc-dialog-fileexists-content';
|
||||
var dialog_id = '#' + dialog_name;
|
||||
if (this._fileexistsshown) {
|
||||
// add row
|
||||
var conflict = $(dialog_id+ ' .conflict').last().clone();
|
||||
conflict.find('.name').text(original.name);
|
||||
var addConflict = function(conflicts, original, replacement) {
|
||||
|
||||
var conflict = conflicts.find('.conflict.template').clone();
|
||||
|
||||
conflict.find('.filename').text(original.name);
|
||||
conflict.find('.original .size').text(humanFileSize(original.size));
|
||||
conflict.find('.original .mtime').text(formatDate(original.mtime*1000));
|
||||
conflict.find('.replacement .size').text(humanFileSize(replacement.size));
|
||||
conflict.find('.replacement .mtime').text(formatDate(replacement.lastModifiedDate));
|
||||
getMimeIcon(original.type,function(path){
|
||||
conflict.find('.original .icon').css('background-image','url('+path+')');
|
||||
var path = getPathForPreview(original.name);
|
||||
lazyLoadPreview(path, original.type, function(previewpath){
|
||||
conflict.find('.original .icon').css('background-image','url('+previewpath+')');
|
||||
});
|
||||
getMimeIcon(replacement.type,function(path){
|
||||
conflict.find('.replacement .icon').css('background-image','url('+path+')');
|
||||
});
|
||||
$(dialog_id+' .conflict').last().after(conflict);
|
||||
$(dialog_id).parent().children('.oc-dialog-title').text(t('files','{count} file conflicts',{count:$(dialog_id+ ' .conflict').length}));
|
||||
conflict.removeClass('template');
|
||||
conflicts.append(conflict);
|
||||
|
||||
//set more recent mtime bold
|
||||
if (replacement.lastModifiedDate.getTime() > original.mtime*1000) {
|
||||
|
@ -249,7 +245,7 @@ var OCdialogs = {
|
|||
} else if (replacement.lastModifiedDate.getTime() < original.mtime*1000) {
|
||||
conflict.find('.original .mtime').css('font-weight', 'bold');
|
||||
} else {
|
||||
//TODO add to same mtime colletion?
|
||||
//TODO add to same mtime collection?
|
||||
}
|
||||
|
||||
// set bigger size bold
|
||||
|
@ -258,7 +254,7 @@ var OCdialogs = {
|
|||
} else if (replacement.size < original.size) {
|
||||
conflict.find('.original .size').css('font-weight', 'bold');
|
||||
} else {
|
||||
//TODO add to same size colletion?
|
||||
//TODO add to same size collection?
|
||||
}
|
||||
|
||||
//add checkbox toggling actions
|
||||
|
@ -269,50 +265,42 @@ var OCdialogs = {
|
|||
|
||||
//TODO show skip action for files with same size and mtime
|
||||
|
||||
};
|
||||
var selection = controller.getSelection(data.originalFiles);
|
||||
if (selection.defaultAction) {
|
||||
controller[selection.defaultAction](data);
|
||||
} else {
|
||||
var dialog_name = 'oc-dialog-fileexists-content';
|
||||
var dialog_id = '#' + dialog_name;
|
||||
if (this._fileexistsshown) {
|
||||
// add conflict
|
||||
|
||||
var conflicts = $(dialog_id+ ' .conflicts');
|
||||
addConflict(conflicts, original, replacement);
|
||||
|
||||
var title = t('files','{count} file conflicts',{count:$(dialog_id+ ' .conflict:not(.template)').length});
|
||||
$(dialog_id).parent().children('.oc-dialog-title').text(title);
|
||||
|
||||
//recalculate dimensions
|
||||
$(window).trigger('resize');
|
||||
|
||||
} else {
|
||||
//create dialog
|
||||
this._fileexistsshown = true;
|
||||
$.when(this._getFileExistsTemplate()).then(function($tmpl) {
|
||||
var title = t('files','One file conflict');
|
||||
var original_size = humanFileSize(original.size);
|
||||
var original_mtime = formatDate(original.mtime*1000);
|
||||
var replacement_size= humanFileSize(replacement.size);
|
||||
var replacement_mtime = formatDate(replacement.lastModifiedDate);
|
||||
var $dlg = $tmpl.octemplate({
|
||||
dialog_name: dialog_name,
|
||||
title: title,
|
||||
type: 'fileexists',
|
||||
|
||||
why: t('files','Which files do you want to keep?'),
|
||||
what: t('files','If you select both versions, the copied file will have a number added to its name.'),
|
||||
filename: original.name,
|
||||
|
||||
original_size: original_size,
|
||||
original_mtime: original_mtime,
|
||||
|
||||
replacement_size: replacement_size,
|
||||
replacement_mtime: replacement_mtime
|
||||
what: t('files','If you select both versions, the copied file will have a number added to its name.')
|
||||
});
|
||||
$('body').append($dlg);
|
||||
|
||||
getMimeIcon(original.type,function(path){
|
||||
$(dialog_id + ' .original .icon').css('background-image','url('+path+')');
|
||||
});
|
||||
getMimeIcon(replacement.type,function(path){
|
||||
$(dialog_id + ' .replacement .icon').css('background-image','url('+path+')');
|
||||
});
|
||||
$(dialog_id + ' #newname').val(original.name);
|
||||
|
||||
$(dialog_id + ' #newname').on('keyup', function(e){
|
||||
if ($(dialog_id + ' #newname').val() === original.name) {
|
||||
$(dialog_id + ' + div .rename').removeClass('primary').hide();
|
||||
$(dialog_id + ' + div .replace').addClass('primary').show();
|
||||
} else {
|
||||
$(dialog_id + ' + div .rename').addClass('primary').show();
|
||||
$(dialog_id + ' + div .replace').removeClass('primary').hide();
|
||||
}
|
||||
});
|
||||
var conflicts = $($dlg).find('.conflicts');
|
||||
addConflict(conflicts, original, replacement);
|
||||
|
||||
buttonlist = [{
|
||||
text: t('core', 'Cancel'),
|
||||
|
@ -346,57 +334,27 @@ var OCdialogs = {
|
|||
closeButton: null
|
||||
});
|
||||
|
||||
$(dialog_id + ' + div .rename').hide();
|
||||
$(dialog_id + ' #newname').hide();
|
||||
|
||||
$(dialog_id + ' #newnamecb').on('change', function(){
|
||||
if ($(dialog_id + ' #newnamecb').prop('checked')) {
|
||||
$(dialog_id + ' #newname').fadeIn();
|
||||
} else {
|
||||
$(dialog_id + ' #newname').fadeOut();
|
||||
$(dialog_id + ' #newname').val(original.name);
|
||||
}
|
||||
});
|
||||
$(dialog_id).css('height','auto');
|
||||
|
||||
var conflict = $(dialog_id + ' .conflict').last();
|
||||
//set more recent mtime bold
|
||||
if (replacement.lastModifiedDate.getTime() > original.mtime*1000) {
|
||||
conflict.find('.replacement .mtime').css('font-weight','bold');
|
||||
} else if (replacement.lastModifiedDate.getTime() < original.mtime*1000) {
|
||||
conflict.find('.original .mtime').css('font-weight','bold');
|
||||
} else {
|
||||
//TODO add to same mtime colletion?
|
||||
}
|
||||
|
||||
// set bigger size bold
|
||||
if (replacement.size > original.size) {
|
||||
conflict.find('.replacement .size').css('font-weight','bold');
|
||||
} else if (replacement.size < original.size) {
|
||||
conflict.find('.original .size').css('font-weight','bold');
|
||||
} else {
|
||||
//TODO add to same size colletion?
|
||||
}
|
||||
|
||||
//add checkbox toggling actions
|
||||
//add checkbox toggling actions
|
||||
$(dialog_id).find('.allnewfiles').on('click', function() {
|
||||
var checkboxes = $(dialog_id).find('.replacement input[type="checkbox"]');
|
||||
var checkboxes = $(dialog_id).find('.conflict:not(.template) .replacement input[type="checkbox"]');
|
||||
checkboxes.prop('checked', $(this).prop('checked'));
|
||||
});
|
||||
$(dialog_id).find('.allexistingfiles').on('click', function() {
|
||||
var checkboxes = $(dialog_id).find('.original input[type="checkbox"]');
|
||||
var checkboxes = $(dialog_id).find('.conflict:not(.template) .original input[type="checkbox"]');
|
||||
checkboxes.prop('checked', $(this).prop('checked'));
|
||||
});
|
||||
conflict.find('.replacement,.original').on('click', function(){
|
||||
|
||||
$(dialog_id).find('.conflicts').on('click', '.replacement,.original', function() {
|
||||
var checkbox = $(this).find('input[type="checkbox"]');
|
||||
checkbox.prop('checked', !checkbox.prop('checked'));
|
||||
});
|
||||
|
||||
//update counters
|
||||
$(dialog_id).on('click', '.replacement,.allnewfiles', function() {
|
||||
var count = $(dialog_id).find('.replacement input[type="checkbox"]:checked').length;
|
||||
if (count === $(dialog_id+ ' .conflict').length) {
|
||||
var count = $(dialog_id).find('.conflict:not(.template) .replacement input[type="checkbox"]:checked').length;
|
||||
if (count === $(dialog_id+ ' .conflict:not(.template)').length) {
|
||||
$(dialog_id).find('.allnewfiles').prop('checked', true);
|
||||
$(dialog_id).find('.allnewfiles + .count').text(t('files','(all selected)'));
|
||||
} else if (count > 0) {
|
||||
|
@ -408,8 +366,8 @@ var OCdialogs = {
|
|||
}
|
||||
});
|
||||
$(dialog_id).on('click', '.original,.allexistingfiles', function(){
|
||||
var count = $(dialog_id).find('.original input[type="checkbox"]:checked').length;
|
||||
if (count === $(dialog_id+ ' .conflict').length) {
|
||||
var count = $(dialog_id).find('.conflict:not(.template) .original input[type="checkbox"]:checked').length;
|
||||
if (count === $(dialog_id+ ' .conflict:not(.template)').length) {
|
||||
$(dialog_id).find('.allexistingfiles').prop('checked', true);
|
||||
$(dialog_id).find('.allexistingfiles + .count').text(t('files','(all selected)'));
|
||||
} else if (count > 0) {
|
||||
|
|
Loading…
Reference in New Issue