(js) Improve display of msgs with many recipients

pull/201/head
Francis Lachapelle 2016-02-26 15:19:33 -05:00
parent ea91767410
commit 163e4637aa
5 changed files with 59 additions and 14 deletions

1
NEWS
View File

@ -19,6 +19,7 @@ Enhancements
- [web] warn when double-booking attendees and offer force save option
- [web] list search now displays a warning regarding the minlength constraint
- [web] loading an LDAP-based addressbook is now instantaneous when listRequiresDot is disabled (#438, #3464)
- [web] improve display of messages with many recipients
- [eas] now support EAS MIME truncation
Bug fixes

View File

@ -22,6 +22,7 @@
"Options" = "Options";
"Close" = "Close";
"Size" = "Size";
/* Tooltips */
"Send this message now" = "Send this message now";
"Select a recipient from an Address Book" = "Select a recipient from an Address Book";
@ -40,6 +41,7 @@
"Unread" = "Unread";
"Flagged" = "Flagged";
"Search multiple mailboxes" = "Search multiple mailboxes";
/* Main Frame */
"Home" = "Home";
"Calendar" = "Calendar";
@ -47,6 +49,7 @@
"Mail" = "Mail";
"Right Administration" = "Right Administration";
"Help" = "Help";
/* Mail account main windows */
"Welcome to the SOGo Mailer. Use the folder tree on the left to browse your mail accounts!" = "Welcome to the SOGo Mailer. Use the folder tree on the left to browse your mail accounts!";
"Read messages" = "Read messages";
@ -54,10 +57,13 @@
"Share" = "Share";
"Account" = "Account";
"Shared Account" = "Shared Account";
/* A mailbox is selected, but no message (only shown on large screens) */
"No message selected" = "No message selected";
/* No mailbox is selected (usually resulting from an IMAP connection problem) */
"No mailbox selected" = "No mailbox selected";
/* acls */
"Access rights to" = "Access rights to";
"For user" = "For user";
@ -77,6 +83,7 @@
"Saved Messages.zip" = "Saved Messages.zip";
"Update" = "Update";
"Cancel" = "Cancel";
/* Mail edition */
"From" = "From";
"Subject" = "Subject";
@ -111,12 +118,14 @@
"This mail is being sent from an unsecure network!" = "This mail is being sent from an unsecure network!";
"Address Book" = "Address Book";
"Search For" = "Search For";
/* Popup "show" */
"all" = "all";
"read" = "read";
"unread" = "unread";
"deleted" = "deleted";
"flagged" = "flagged";
/* MailListView */
"Sender" = "Sender";
"Subject or Sender" = "Subject or Sender";
@ -137,6 +146,7 @@
"Mark Unread" = "Mark Unread";
"Mark Read" = "Mark Read";
"Untitled" = "Untitled";
/* Tree */
"SentFolderName" = "Sent";
"TrashFolderName" = "Trash";
@ -145,15 +155,19 @@
"JunkFolderName" = "Junk";
"SieveFolderName" = "Filters";
"Folders" = "Folders"; /* title line */
/* MailMoveToPopUp */
"MoveTo" = "Move …";
/* Address Popup menu */
"Add to Address Book..." = "Add to Address Book...";
"Compose Mail To" = "Compose Mail To";
"Create Filter From Message..." = "Create Filter From Message...";
/* Image Popup menu */
"Save Image" = "Save Image";
"Save Attachment" = "Save Attachment";
/* Mailbox popup menus */
"Open in New Mail Window" = "Open in New Mail Window";
"Copy Folder Location" = "Copy Folder Location";
@ -170,11 +184,13 @@
"Get Messages for Account" = "Get Messages for Account";
"Properties..." = "Properties...";
"Delegation..." = "Delegation...";
/* Use This Folder menu */
"Sent Messages" = "Sent Messages";
"Drafts" = "Drafts";
"Deleted Messages" = "Deleted Messages";
"Junk Messages" = "Junk Messages";
/* Message list popup menu */
"Open Message In New Window" = "Open Message In New Window";
"Reply to Sender Only" = "Reply to Sender Only";
@ -199,11 +215,21 @@
"Delete Selected Messages" = "Delete Selected Messages";
"Mark the selected messages as junk" = "Mark the selected messages as junk";
"Mark the selected messages as not junk" = "Mark the selected messages as not junk";
/* Text appended to the recipients list when there are too many recipients */
"and %{0} more..." = "and %{0} more...";
/* Button label to hide extended list of recipients */
"Hide" = "Hide";
/* Number of selected messages in list */
"selected" = "selected";
"This Folder" = "This Folder";
/* Label popup menu */
"None" = "None";
/* Mark popup menu */
"As Read" = "As Read";
"Thread As Read" = "Thread As Read";
@ -224,6 +250,7 @@
"results found" = "results found";
"result found" = "result found";
"Please specify at least one filter" = "Please specify at least one filter";
/* Folder operations */
"Name" = "Name";
"Enter the new name of your folder"
@ -256,9 +283,11 @@
= "Moving a message into its own folder is impossible!";
"Copying a message into its own folder is impossible!"
= "Copying a message into its own folder is impossible!";
/* Message operations */
"The messages could not be moved to the trash folder. Would you like to delete them immediately?"
= "The messages could not be moved to the trash folder. Would you like to delete them immediately?";
/* Message editing */
"error_missingsubject" = "The message has no subject. Are you sure you want to send it?";
"error_missingrecipients" = "Please specify at least one recipient.";
@ -273,6 +302,7 @@
"cannot send message: (smtp) all recipients discarded" = "Cannot send message: all recipients are invalid.";
"cannot send message (smtp) - recipients discarded" = "Cannot send message. The following addresses are invalid";
"cannot send message: (smtp) error when connecting" = "Cannot send message: error when connecting to the SMTP server.";
/* Contacts list in mail editor */
"Email" = "Email";
"More mail options" = "More mail options";

View File

@ -125,19 +125,25 @@
</div>
</div>
</div>
<div class="msg-recipients" layout="column" flex="50">
<div class="msg-recipients" layout="column" flex="50" flex-xs="100">
<div class="pseudo-input-container--compact">
<label class="pseudo-input-label">
<var:string label:value="To"/>
</label>
<div class="pseudo-input-field" ng-hide="viewer.$showDetailedRecipients">
<a href="#" ng-click="viewer.showDetailedRecipients($event)">{{viewer.message.$shortRecipients()}}</a>
<div class="pseudo-input-field"
ng-hide="viewer.$showDetailedRecipients">
<a href="#" ng-click="viewer.toggleDetailedRecipients($event)">{{viewer.message.$shortRecipients(5)}}</a>
</div>
<div class="pseudo-input-field" ng-show="viewer.$showDetailedRecipients">
<span ng-repeat="recipient in viewer.message.to">
<a href="#" ng-bind="recipient.full"
ng-click="viewer.newMessage($event, recipient)"><!-- recipient --></a>
</span>
<md-button style="float: right"
label:aria-label="Hide"
ng-click="viewer.toggleDetailedRecipients($event)">
<var:string label:value="Hide"/>
</md-button>
</div>
</div>
<div class="pseudo-input-container--compact" ng-show="viewer.$showDetailedRecipients">

View File

@ -160,12 +160,15 @@
// Build long representation of email addresses
_.each(['from', 'to', 'cc', 'bcc', 'reply-to'], function(type) {
_.each(_this[type], function(data, i) {
_.each(_this[type], function(data) {
if (data.name && data.name != data.email) {
data.full = data.name + ' <' + data.email + '>';
// If we have "Alice Foo" as name, we grab "Alice"
if (data.name.split(' ').length)
if (data.name.length < 10)
// Name is already short
data.shortname = data.name;
else if (data.name.split(' ').length)
// If we have "Alice Foo" as name, we grab "Alice"
data.shortname = data.name.split(' ')[0].replace('\'','');
}
else if (data.email) {
@ -190,17 +193,22 @@
* @desc Format all recipients into a very compact string
* @returns a compacted string of all recipients
*/
Message.prototype.$shortRecipients = function() {
var _this = this;
var result = [];
Message.prototype.$shortRecipients = function(max) {
var _this = this, result = [], count = 0, total = 0;
// Build long representation of email addresses
// Build short representation of email addresses
_.each(['to', 'cc', 'bcc'], function(type) {
total += _this[type]? _this[type].length : 0;
_.each(_this[type], function(data, i) {
result.push(data.shortname);
if (count < max)
result.push(data.shortname);
count++;
});
});
if (total > max)
result.push(l('and %{0} more...', (total - max)));
return result.join(', ');
};

View File

@ -22,7 +22,7 @@
vm.tags = { searchText: '', selected: '' };
vm.showFlags = stateMessage.flags && stateMessage.flags.length > 0;
vm.$showDetailedRecipients = false;
vm.showDetailedRecipients = showDetailedRecipients;
vm.toggleDetailedRecipients = toggleDetailedRecipients;
vm.doDelete = doDelete;
vm.close = close;
vm.reply = reply;
@ -87,8 +87,8 @@
return ctrls;
}
function showDetailedRecipients($event) {
vm.$showDetailedRecipients = true;
function toggleDetailedRecipients($event) {
vm.$showDetailedRecipients = !vm.$showDetailedRecipients;
$event.stopPropagation();
$event.preventDefault();
}