Browse Source

refactor dialog creation

tags/v6.0.0alpha2
Jörn Friedrich Dreyer 10 years ago
parent
commit
49fd7e9f1e
4 changed files with 84 additions and 95 deletions
  1. 5
    2
      apps/files/css/files.css
  2. 7
    5
      apps/files/js/filelist.js
  3. 26
    0
      apps/files/templates/fileexists.html
  4. 46
    88
      core/js/oc-dialogs.js

+ 5
- 2
apps/files/css/files.css View File

@@ -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;
}


+ 7
- 5
apps/files/js/filelist.js View File

@@ -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);
}
}
@@ -634,7 +635,7 @@ $(document).ready(function(){
} else {

// add as stand-alone row to filelist
var size=t('files','Pending');
var size=t('files', 'Pending');
if (data.files[0].size>=0){
size=data.files[0].size;
}
@@ -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+')');
});
}
}

+ 26
- 0
apps/files/templates/fileexists.html View File

@@ -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>

+ 46
- 88
core/js/oc-dialogs.js View File

@@ -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,16 +245,16 @@ 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
if (replacement.size > original.size) {
conflict.find('.replacement .size').css('font-weight','bold');
conflict.find('.replacement .size').css('font-weight', 'bold');
} else if (replacement.size < original.size) {
conflict.find('.original .size').css('font-weight','bold');
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"]');
$(dialog_id).find('.allnewfiles').on('click', function() {
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"]');
$(dialog_id).find('.allexistingfiles').on('click', function() {
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) {
$(dialog_id).on('click', '.replacement,.allnewfiles', function() {
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…
Cancel
Save