mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-28 11:39:21 +03:00
Interface redesign (attachments, new preview pane layout)
This commit is contained in:
parent
6755a0ce51
commit
e3e7c1d963
64 changed files with 1286 additions and 1009 deletions
|
|
@ -51,6 +51,9 @@
|
|||
|
||||
var
|
||||
self = this,
|
||||
fResizeSub = function () {
|
||||
Utils.windowResize();
|
||||
},
|
||||
fCcAndBccCheckHelper = function (aValue) {
|
||||
if (false === self.showCcAndBcc() && 0 < aValue.length)
|
||||
{
|
||||
|
|
@ -89,6 +92,7 @@
|
|||
|
||||
this.emptyToError = ko.observable(false);
|
||||
this.attachmentsInProcessError = ko.observable(false);
|
||||
this.attachmentsInErrorError = ko.observable(false);
|
||||
this.showCcAndBcc = ko.observable(false);
|
||||
|
||||
this.cc.subscribe(fCcAndBccCheckHelper, this);
|
||||
|
|
@ -101,21 +105,45 @@
|
|||
this.attachments = ko.observableArray([]);
|
||||
|
||||
this.attachmentsInProcess = this.attachments.filter(function (oItem) {
|
||||
return oItem && '' === oItem.tempName();
|
||||
return oItem && !oItem.complete();
|
||||
});
|
||||
|
||||
this.attachmentsInReady = this.attachments.filter(function (oItem) {
|
||||
return oItem && '' !== oItem.tempName();
|
||||
return oItem && oItem.complete();
|
||||
});
|
||||
|
||||
this.attachments.subscribe(function () {
|
||||
this.triggerForResize();
|
||||
this.attachmentsInError = this.attachments.filter(function (oItem) {
|
||||
return oItem && '' !== oItem.error();
|
||||
});
|
||||
|
||||
this.attachmentsCount = ko.computed(function () {
|
||||
return this.attachments().length;
|
||||
}, this);
|
||||
|
||||
this.attachmentsInErrorCount = ko.computed(function () {
|
||||
return this.attachmentsInError().length;
|
||||
}, this);
|
||||
|
||||
this.attachmentsInProcessCount = ko.computed(function () {
|
||||
return this.attachmentsInProcess().length;
|
||||
}, this);
|
||||
|
||||
this.isDraftFolderMessage = ko.computed(function () {
|
||||
return '' !== this.draftFolder() && '' !== this.draftUid();
|
||||
}, this);
|
||||
|
||||
this.attachmentsPlace = ko.observable(false);
|
||||
|
||||
this.attachments.subscribe(fResizeSub);
|
||||
this.attachmentsPlace.subscribe(fResizeSub);
|
||||
|
||||
this.attachmentsInErrorCount.subscribe(function (iN) {
|
||||
if (0 === iN)
|
||||
{
|
||||
this.attachmentsInErrorError(false);
|
||||
}
|
||||
}, this);
|
||||
|
||||
this.composeUploaderButton = ko.observable(null);
|
||||
this.composeUploaderDropPlace = ko.observable(null);
|
||||
this.dragAndDropEnabled = ko.observable(false);
|
||||
|
|
@ -227,6 +255,7 @@
|
|||
this.saveMessageResponse = _.bind(this.saveMessageResponse, this);
|
||||
|
||||
this.sendCommand = Utils.createCommand(this, function () {
|
||||
|
||||
var
|
||||
sTo = Utils.trim(this.to()),
|
||||
sSentFolder = Data.sentFolder(),
|
||||
|
|
@ -236,6 +265,12 @@
|
|||
if (0 < this.attachmentsInProcess().length)
|
||||
{
|
||||
this.attachmentsInProcessError(true);
|
||||
this.attachmentsPlace(true);
|
||||
}
|
||||
else if (0 < this.attachmentsInError().length)
|
||||
{
|
||||
this.attachmentsInErrorError(true);
|
||||
this.attachmentsPlace(true);
|
||||
}
|
||||
else if (0 === sTo.length)
|
||||
{
|
||||
|
|
@ -1111,6 +1146,7 @@
|
|||
if (oAttachment)
|
||||
{
|
||||
oAttachment.tempName(sTempName);
|
||||
oAttachment.waiting(false).uploading(false).complete(true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1118,7 +1154,7 @@
|
|||
}
|
||||
else
|
||||
{
|
||||
self.setMessageAttachmentFailedDowbloadText();
|
||||
self.setMessageAttachmentFailedDownloadText();
|
||||
}
|
||||
|
||||
}, aDownloads);
|
||||
|
|
@ -1480,7 +1516,7 @@
|
|||
|
||||
if (oItem)
|
||||
{
|
||||
oItem.progress(' - ' + window.Math.floor(iLoaded / iTotal * 100) + '%');
|
||||
oItem.progress(window.Math.floor(iLoaded / iTotal * 100));
|
||||
}
|
||||
|
||||
}, this))
|
||||
|
|
@ -1499,9 +1535,14 @@
|
|||
|
||||
this.attachments.push(oAttachment);
|
||||
|
||||
this.attachmentsPlace(true);
|
||||
|
||||
if (0 < mSize && 0 < iAttachmentSizeLimit && iAttachmentSizeLimit < mSize)
|
||||
{
|
||||
oAttachment.error(Utils.i18n('UPLOAD/ERROR_FILE_IS_TOO_BIG'));
|
||||
oAttachment
|
||||
.waiting(false).uploading(true).complete(true)
|
||||
.error(Utils.i18n('UPLOAD/ERROR_FILE_IS_TOO_BIG'));
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
|
@ -1529,8 +1570,7 @@
|
|||
|
||||
if (oItem)
|
||||
{
|
||||
oItem.waiting(false);
|
||||
oItem.uploading(true);
|
||||
oItem.waiting(false).uploading(true).complete(false);
|
||||
}
|
||||
|
||||
}, this))
|
||||
|
|
@ -1562,6 +1602,7 @@
|
|||
oAttachment
|
||||
.waiting(false)
|
||||
.uploading(false)
|
||||
.complete(true)
|
||||
.error(sError)
|
||||
;
|
||||
}
|
||||
|
|
@ -1570,6 +1611,7 @@
|
|||
oAttachment
|
||||
.waiting(false)
|
||||
.uploading(false)
|
||||
.complete(true)
|
||||
;
|
||||
|
||||
oAttachment.initByUploadJson(oAttachmentJson);
|
||||
|
|
@ -1639,7 +1681,7 @@
|
|||
|
||||
oAttachment.fromMessage = true;
|
||||
oAttachment.cancel = this.cancelAttachmentHelper(oMessage.requestHash);
|
||||
oAttachment.waiting(false).uploading(true);
|
||||
oAttachment.waiting(false).uploading(true).complete(true);
|
||||
|
||||
this.attachments.push(oAttachment);
|
||||
}
|
||||
|
|
@ -1663,13 +1705,15 @@
|
|||
|
||||
oAttachment.fromMessage = false;
|
||||
oAttachment.cancel = this.cancelAttachmentHelper(oDropboxFile['link']);
|
||||
oAttachment.waiting(false).uploading(true);
|
||||
oAttachment.waiting(false).uploading(true).complete(false);
|
||||
|
||||
this.attachments.push(oAttachment);
|
||||
|
||||
this.attachmentsPlace(true);
|
||||
|
||||
if (0 < mSize && 0 < iAttachmentSizeLimit && iAttachmentSizeLimit < mSize)
|
||||
{
|
||||
oAttachment.uploading(false);
|
||||
oAttachment.uploading(false).complete(true);
|
||||
oAttachment.error(Utils.i18n('UPLOAD/ERROR_FILE_IS_TOO_BIG'));
|
||||
return false;
|
||||
}
|
||||
|
|
@ -1677,7 +1721,7 @@
|
|||
Remote.composeUploadExternals(function (sResult, oData) {
|
||||
|
||||
var bResult = false;
|
||||
oAttachment.uploading(false);
|
||||
oAttachment.uploading(false).complete(true);
|
||||
|
||||
if (Enums.StorageResultType.Success === sResult && oData && oData.Result)
|
||||
{
|
||||
|
|
@ -1717,13 +1761,15 @@
|
|||
|
||||
oAttachment.fromMessage = false;
|
||||
oAttachment.cancel = this.cancelAttachmentHelper(oDriveFile['downloadUrl']);
|
||||
oAttachment.waiting(false).uploading(true);
|
||||
oAttachment.waiting(false).uploading(true).complete(false);
|
||||
|
||||
this.attachments.push(oAttachment);
|
||||
|
||||
this.attachmentsPlace(true);
|
||||
|
||||
if (0 < mSize && 0 < iAttachmentSizeLimit && iAttachmentSizeLimit < mSize)
|
||||
{
|
||||
oAttachment.uploading(false);
|
||||
oAttachment.uploading(false).complete(true);
|
||||
oAttachment.error(Utils.i18n('UPLOAD/ERROR_FILE_IS_TOO_BIG'));
|
||||
return false;
|
||||
}
|
||||
|
|
@ -1731,7 +1777,7 @@
|
|||
Remote.composeUploadDrive(function (sResult, oData) {
|
||||
|
||||
var bResult = false;
|
||||
oAttachment.uploading(false);
|
||||
oAttachment.uploading(false).complete(true);
|
||||
|
||||
if (Enums.StorageResultType.Success === sResult && oData && oData.Result)
|
||||
{
|
||||
|
|
@ -1803,7 +1849,7 @@
|
|||
|
||||
oAttachment.fromMessage = true;
|
||||
oAttachment.cancel = this.cancelAttachmentHelper(oItem.download);
|
||||
oAttachment.waiting(false).uploading(true);
|
||||
oAttachment.waiting(false).uploading(true).complete(false);
|
||||
|
||||
this.attachments.push(oAttachment);
|
||||
}
|
||||
|
|
@ -1825,7 +1871,7 @@
|
|||
}
|
||||
};
|
||||
|
||||
ComposePopupView.prototype.setMessageAttachmentFailedDowbloadText = function ()
|
||||
ComposePopupView.prototype.setMessageAttachmentFailedDownloadText = function ()
|
||||
{
|
||||
_.each(this.attachments(), function(oAttachment) {
|
||||
if (oAttachment && oAttachment.fromMessage)
|
||||
|
|
@ -1833,6 +1879,7 @@
|
|||
oAttachment
|
||||
.waiting(false)
|
||||
.uploading(false)
|
||||
.complete(true)
|
||||
.error(Utils.getUploadErrorDescByCode(Enums.UploadErrorCode.FileNoUploaded))
|
||||
;
|
||||
}
|
||||
|
|
@ -1869,6 +1916,8 @@
|
|||
this.requestReadReceipt(false);
|
||||
this.markAsImportant(false);
|
||||
|
||||
this.attachmentsPlace(false);
|
||||
|
||||
this.aDraftInfo = null;
|
||||
this.sInReplyTo = '';
|
||||
this.bFromDraft = false;
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@
|
|||
this.dragOverBodyArea = ko.observable(null);
|
||||
|
||||
this.messageListItemTemplate = ko.computed(function () {
|
||||
return Enums.Layout.NoPreview !== Data.layout() ?
|
||||
return Enums.Layout.SidePreview === Data.layout() ?
|
||||
'MailMessageListItem' : 'MailMessageListItemNoPreviewPane';
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -345,27 +345,8 @@
|
|||
}
|
||||
}, this);
|
||||
|
||||
// $('.attachmentsPlace', oDom).magnificPopup({
|
||||
// 'delegate': '.attachmentImagePreview:visible',
|
||||
// 'type': 'image',
|
||||
// 'gallery': {
|
||||
// 'enabled': true,
|
||||
// 'preload': [1, 1],
|
||||
// 'navigateByImgClick': true
|
||||
// },
|
||||
// 'callbacks': {
|
||||
// 'open': function() {
|
||||
// Globals.useKeyboardShortcuts(false);
|
||||
// },
|
||||
// 'close': function() {
|
||||
// Globals.useKeyboardShortcuts(true);
|
||||
// }
|
||||
// },
|
||||
// 'mainClass': 'mfp-fade',
|
||||
// 'removalDelay': 400
|
||||
// });
|
||||
|
||||
this.pswpDom = $('.pswp', oDom)[0];
|
||||
|
||||
if (this.pswpDom)
|
||||
{
|
||||
oDom
|
||||
|
|
@ -375,18 +356,31 @@
|
|||
oPs = null,
|
||||
oEl = oEvent.currentTarget || null,
|
||||
aItems = []
|
||||
// fThumbBoundsFn = function (index) {
|
||||
// var oRes = null, oEl = aItems[index], oPos = null;
|
||||
// if (oEl && oEl.el)
|
||||
// {
|
||||
// oPos = oEl.el.find('.iconBG').offset();
|
||||
// oRes = oPos && oPos.top && oPos.left ?
|
||||
// {x: oPos.left, y: oPos.top, w: 60} : null;
|
||||
// }
|
||||
//
|
||||
// return oRes;
|
||||
// }
|
||||
;
|
||||
|
||||
oDom.find('.attachmentImagePreview[data-index]').each(function (index, oSubElement) {
|
||||
|
||||
var $oItem = $(oSubElement);
|
||||
var
|
||||
$oItem = $(oSubElement)
|
||||
;
|
||||
|
||||
aItems.push({
|
||||
w: 600, h: 400,
|
||||
// 'el': $oItem,
|
||||
'w': 600, 'h': 400,
|
||||
'src': $oItem.attr('href'),
|
||||
'title': $oItem.attr('title') || ''
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
if (aItems && 0 < aItems.length)
|
||||
|
|
@ -400,6 +394,7 @@
|
|||
'errorMsg': '<div class="pswp__error-msg">' + sErrorMessage + '</div>',
|
||||
'showHideOpacity': true,
|
||||
'tapToToggleControls': false,
|
||||
// 'getThumbBoundsFn': fThumbBoundsFn,
|
||||
'timeToIdle': 0,
|
||||
'timeToIdleOutside': 0,
|
||||
'history': false,
|
||||
|
|
@ -414,7 +409,7 @@
|
|||
item.w = item.img.width;
|
||||
item.h = item.img.height;
|
||||
|
||||
oPs.updateSize();
|
||||
oPs.updateSize(true);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -434,13 +429,13 @@
|
|||
// setup maito protocol
|
||||
return !(!!oEvent && 3 !== oEvent['which'] && Utils.mailToHelper($(this).attr('href'), require('View/Popup/Compose')));
|
||||
})
|
||||
.on('click', '.attachmentsPlace .attachmentPreview', function (oEvent) {
|
||||
.on('click', '.attachmentsPlace .attachmentIconParent', function (oEvent) {
|
||||
if (oEvent && oEvent.stopPropagation)
|
||||
{
|
||||
oEvent.stopPropagation();
|
||||
}
|
||||
})
|
||||
.on('click', '.attachmentsPlace .attachmentItem', function () {
|
||||
.on('click', '.attachmentsPlace .attachmentItem .attachmentNameParent', function () {
|
||||
|
||||
var
|
||||
oAttachment = ko.dataFor(this)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue