snappymail/rainloop/v/0.0.0/app/templates/Views/User/MailMessageView.html
2015-04-21 02:39:14 +04:00

409 lines
22 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- ko template: { name: 'PhotoSwipe' } --><!-- /ko -->
<div id="rl-sub-right">
<div class="messageView" data-bind="css: {'message-selected': isMessageSelected, 'message-focused': messageFocused}">
<div class="toolbar top-toolbar g-ui-user-select-none" data-bind="visible: !usePreviewPane()">
<nobr>
<div class="messageButtons btn-toolbar">
<div class="btn-group" data-tooltip-join="top" data-bind="tooltip: 'MESSAGE/BUTTON_CLOSE'">
<a class="btn single btn-dark-disabled-border buttonClose" data-bind="command: closeMessage">
<i class="icon-remove"></i>
</a>
</div>
<div class="btn-group">&nbsp;</div>
<div class="btn-group" data-tooltip-join="top" data-bind="visible: isDraftFolder(), tooltip: 'MESSAGE/BUTTON_EDIT'">
<a class="btn single btn-success buttonEdit" data-bind="command: messageEditCommand">
<i class="icon-pencil icon-white"></i>
</a>
</div>
<div class="btn-group" data-bind="visible: !usePreviewPane()">&nbsp;</div>
<div class="btn-group" data-bind="visible: !usePreviewPane()">
<a class="btn first btn-dark-disabled-border button-archive" data-tooltip-join="top" data-bind="visible: !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled(), command: archiveCommand, tooltip: 'MESSAGE/BUTTON_ARCHIVE'">
<i class="icon-archive"></i>
</a>
<a class="btn btn-dark-disabled-border button-spam" data-tooltip-join="top" data-bind="visible: !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled(), command: spamCommand, tooltip: 'MESSAGE/BUTTON_SPAM'">
<i class="icon-angry-smiley"></i>
</a>
<a class="btn btn-dark-disabled-border button-not-spam" data-tooltip-join="top" data-bind="visible: !isDraftFolder() && !isSentFolder() && isSpamFolder() && !isSpamDisabled(), command: notSpamCommand, tooltip: 'MESSAGE/BUTTON_NOT_SPAM'">
<i class="icon-happy-smiley"></i>
</a>
<a class="btn last btn-dark-disabled-border button-delete" data-tooltip-join="top" data-bind="command: deleteCommand, tooltip: 'MESSAGE/BUTTON_DELETE'">
<i class="icon-trash"></i>
</a>
</div>
<div class="btn-group">&nbsp;</div>
<div class="btn-group" data-bind="visible: !usePreviewPane()">
<a class="btn btn-thin first btn-dark-disabled-border buttonUp" data-bind="command: goUpCommand">
<i class="icon-left-middle"></i>
</a>
<a class="btn btn-thin last btn-dark-disabled-border buttonDown" data-bind="command: goDownCommand">
<i class="icon-right-middle"></i>
</a>
</div>
</div>
</nobr>
</div>
<div class="b-content b-message-view-wrapper thm-message-view-background-color">
<div>
<div class="b-message-view-checked-helper" data-bind="visible: !message() && '' === messageError() && hasCheckedMessages()">
<span data-bind="text: printableCheckedMessageCount()"></span>
<i class="icon-mail"></i>
</div>
<div class="b-message-view-desc" data-bind="visible: !message() && '' === messageError() && !hasCheckedMessages()">
<span class="i18n" data-i18n="MESSAGE/MESSAGE_VIEW_DESC"></span>
</div>
<div class="b-message-view-desc error" data-bind="visible: !message() && '' !== messageError()">
<span class="text" data-bind="text: messageError()"></span>
</div>
<div class="message-fixed-button-toolbar clearfix" data-bind="visible: message">
<nobr>
<div class="btn-group pull-right">
<div class="btn-group pull-right" data-bind="registrateBootstrapDropdown: true">
<a class="btn btn-thin last btn-dark-disabled-border dropdown-toggle buttonMore"
id="more-view-dropdown-id" href="#" tabindex="-1"
data-toggle="dropdown" data-tooltip-join="bottom"
style="margin-left: -1px;"
data-bind="command: messageVisibilityCommand, tooltip: 'MESSAGE/BUTTON_MORE'">
<span class="caret"></span>
</a>
<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="more-view-dropdown-id">
<li class="e-item" role="presentation"
data-bind="visible: 'reply' !== lastReplyAction() && !isDraftFolder()">
<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: replyCommand">
<i class="icon-reply"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_REPLY"></span>
</a>
</li>
<li class="e-item" role="presentation"
data-bind="visible: 'replyall' !== lastReplyAction() && !isDraftFolder()">
<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: replyAllCommand">
<i class="icon-reply-all"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_REPLY_ALL"></span>
</a>
</li>
<li class="e-item" role="presentation"
data-bind="visible: 'forward' !== lastReplyAction() && !isDraftFolder()">
<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: forwardCommand">
<i class="icon-forward"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_FORWARD"></span>
</a>
</li>
<li class="e-item" role="presentation" data-bind="visible: !isDraftFolder()">
<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: editAsNewCommand">
<i class="icon-pencil"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_EDIT_AS_NEW"></span>
</a>
</li>
<li class="e-item" role="presentation" data-bind="visible: !isDraftFolder()">
<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: forwardAsAttachmentCommand">
<i class="icon-forward"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_FORWARD_AS_ATTACHMENT"></span>
</a>
</li>
<li class="divider" role="presentation" data-bind="visible: !isDraftFolder()"></li>
<li class="e-item" role="presentation" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled()">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: archiveCommand">
<i class="icon-archive"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_ARCHIVE"></span>
</a>
</li>
<li class="e-item" role="presentation" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled()">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: spamCommand">
<i class="icon-angry-smiley"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_SPAM"></span>
</a>
</li>
<li class="e-item" role="presentation" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isSentFolder() && isSpamFolder() && !isSpamDisabled()">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: notSpamCommand">
<i class="icon-happy-smiley"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_NOT_SPAM"></span>
</a>
</li>
<li class="e-item" role="presentation" data-bind="visible: usePreviewPane()">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: deleteCommand">
<i class="icon-trash"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_DELETE"></span>
</a>
</li>
<li class="divider" role="presentation" data-bind="visible: usePreviewPane()"></li>
<li class="e-item" role="presentation">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="click: function () { if (message()) { message().printMessage(); }} ">
<i class="icon-print"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/MENU_PRINT"></span>
</a>
</li>
<li class="e-item" role="presentation">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="click: function () { if (message()) { message().viewPopupMessage(); }}">
<i class="icon-popup"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/BUTTON_IN_NEW_WINDOW"></span>
</a>
</li>
<li class="divider" role="presentation"></li>
<li class="e-item" role="presentation">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="link: viewViewLink()">
<i class="icon-file-code"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/MENU_VIEW_ORIGINAL"></span>
</a>
</li>
<li class="e-item" role="presentation">
<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="link: viewDownloadLink()">
<i class="icon-download"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/MENU_DOWNLOAD_ORIGINAL"></span>
</a>
</li>
</ul>
</div>
<a class="btn first btn-dark-disabled-border buttonReply pull-right" data-tooltip-join="bottom"
data-bind="visible: 'reply' === lastReplyAction(), command: replyCommand, tooltip: 'MESSAGE/BUTTON_REPLY'">
<i class="icon-reply"></i>
</a>
<a class="btn first btn-dark-disabled-border buttonReplyAll pull-right" data-tooltip-join="bottom"
data-bind="visible: 'replyall' === lastReplyAction(), command: replyAllCommand, tooltip: 'MESSAGE/BUTTON_REPLY_ALL'">
<i class="icon-reply-all"></i>
</a>
<a class="btn first btn-dark-disabled-border buttonForward pull-right" data-tooltip-join="bottom"
data-bind="visible: 'forward' === lastReplyAction(), command: forwardCommand, tooltip: 'MESSAGE/BUTTON_FORWARD'">
<i class="icon-forward"></i>
</a>
</div>
<div class="btn-group pull-right" data-bind="visible: isDraftFolder()" style="margin-right: 5px">
<a class="btn single btn-success buttonEdit" data-bind="command: messageEditCommand">
<i class="icon-pencil icon-white"></i>
</a>
</div>
</nobr>
</div>
<div data-bind="visible: message">
<div class="messageItemHeader" data-bind="css: {'emptySubject': '' === viewSubject()}">
<div>
<img class="fromPic" data-bind="visible: viewUserPicVisible, attr: {'src': viewUserPic() }">
<div style="overflow: hidden;">
<div class="subjectParent" data-bind="event: { 'dblclick': toggleFullScreen }">
<span class="flagParent">
<i class="icon-star-empty flagOff" data-bind="css: {'icon-star flagOn': viewIsFlagged, 'icon-star-empty flagOff': !viewIsFlagged()}"></i>
</span>
<b style="color: red; margin-right: 5px" data-bind="visible: viewIsImportant">!</b>
<span class="subject" data-bind="text: viewSubject, title: viewSubject"></span>
<span class="i18n emptySubjectText" data-i18n="MESSAGE/EMPTY_SUBJECT_TEXT"></span>
</div>
<div class="senderParent">
<div class="g-ui-user-select-none" style="float: left; cursor: pointer; margin-left: 1px;" data-bind="click: function() { showFullInfo(!showFullInfo()); }">
<i class="icon-right-dir" data-bind="css: showFullInfo() ? 'icon-down-dir' : 'icon-right-dir'"></i>
</div>
<div class="informationShort" data-bind="event: { 'dblclick': toggleFullScreen }">
<span data-bind="visible: !isDraftOrSentFolder()">
<span class="from" data-bind="html: viewFromShort, title: viewFrom"></span>
&nbsp;
<i data-bind="css: viewFromDkimStatusIconClass, title: viewFromDkimStatusTitle" />
</span>
<span data-bind="visible: isDraftOrSentFolder()">
<span class="i18n uiLabel labelTo" data-i18n="MESSAGE/LABEL_TO"></span>:
<span class="to" data-bind="html: viewToShort, title: viewTo"></span>
</span>
<span data-bind="visible: 0 < viewTimeStamp()">
(<span class="date" data-moment-format="FULL" data-bind="moment: viewTimeStamp"></span>)
</span>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="informationFull" data-bind="visible: showFullInfo()">
<div>
<div class="pull-left" data-bind="visible: '' !== viewFrom()">
<span class="i18n uiLabel labelFrom" data-i18n="MESSAGE/LABEL_FROM"></span>:
&nbsp;
<span class="from" data-bind="text: viewFrom, title: viewFrom"></span>
</div>
<div class="pull-right" data-bind="visible: '' !== viewSize()">
<span class="size" data-bind="text: viewSize"></span>
</div>
<div class="clearfix"></div>
</div>
<div data-bind="visible: '' !== viewTo()">
<span class="i18n uiLabel labelTo" data-i18n="MESSAGE/LABEL_TO"></span>:
&nbsp;
<span class="to" data-bind="text: viewTo, title: viewTo"></span>
</div>
<div data-bind="visible: '' !== viewCc()">
<span class="i18n uiLabel labelCc" data-i18n="MESSAGE/LABEL_CC"></span>:
&nbsp;
<span class="cc" data-bind="text: viewCc, title: viewCc"></span>
</div>
<div data-bind="visible: '' !== viewBcc()">
<span class="i18n uiLabel labelBcc" data-i18n="MESSAGE/LABEL_BCC"></span>:
&nbsp;
<span class="bcc" data-bind="text: viewBcc, title: viewBcc"></span>
</div>
<div data-bind="visible: '' !== viewReplyTo()">
<span class="i18n uiLabel labelBcc" data-i18n="MESSAGE/LABEL_REPLY_TO"></span>:
&nbsp;
<span class="bcc" data-bind="text: viewReplyTo, title: viewReplyTo"></span>
</div>
<div data-bind="visible: 0 < viewTimeStamp()">
<span class="i18n uiLabel labelBcc" data-i18n="MESSAGE/LABEL_DATE"></span>:
&nbsp;
<span class="date" data-moment-format="FULL" data-bind="moment: viewTimeStamp"></span>
&nbsp;
(<span class="date" data-moment-format="FROMNOW" data-bind="moment: viewTimeStamp"></span>)
</div>
</div>
</div>
</div>
<div class="messageItem fixIndex" data-bind="css: viewLineAsCss(), nano: true, attr: {'style': 'top:' + viewBodyTopValue() + 'px' }">
<div class="content g-scrollbox" tabindex="0" data-bind="hasfocus: messageDomFocused, css: { 'focused': messageDomFocused }">
<div class="content-wrapper">
<div>
<span class="buttonUp" data-bind="click: scrollMessageToTop">
<i class="icon-up"></i>
</span>
<span class="buttonFull" data-bind="click: fullScreen">
<i class="icon-arrows-out"></i>
</span>
<span class="buttonUnFull" data-bind="click: unFullScreen">
<i class="icon-arrows-in"></i>
</span>
<div class="line-loading e-strip-animation" data-bind="visible: messageLoadingThrottle()"></div>
<div class="loading g-ui-min-height-300" data-bind="visible: messageLoadingThrottle()">
<span class="i18n text" data-i18n="MESSAGE/MESSAGE_LOADING"></span><span class="textLoadingAnimationD1">.</span><span class="textLoadingAnimationD2">.</span><span class="textLoadingAnimationD3">.</span>
</div>
</div>
<div class="g-ui-min-height-300" data-bind="visible: !messageLoadingThrottle()">
<div class="showImages" data-bind="visible: message() && message().hasImages(), click: function() { showImages(message()); }">
<i class="icon-image"></i>
&nbsp;&nbsp;
<span class="i18n text" data-i18n="MESSAGE/BUTTON_SHOW_IMAGES"></span>
</div>
<div class="readReceipt" data-bind="visible: message() && !isDraftOrSentFolder() && '' !== message().readReceipt() && !message().isReadReceipt(), click: function() { readReceipt(message()); }">
<i class="icon-mail"></i>
&nbsp;&nbsp;
<span class="i18n text" data-i18n="MESSAGE/BUTTON_NOTIFY_READ_RECEIPT"></span>
</div>
<div class="pgpInfo" data-bind="visible: isPgpStatusVerifyVisible(), css: {'success': isPgpStatusVerifySuccess()}">
<i class="icon-key"></i>
&nbsp;&nbsp;
<span data-bind="text: pgpStatusVerifyMessage()"></span>
</div>
<div class="pgpSigned" data-bind="visible: message() && message().isPgpSigned() && isPgpActionVisible(), click: function() { verifyPgpSignedClearMessage(message()); }">
<i class="icon-lock"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/PGP_SIGNED_MESSAGE_DESC"></span>
</div>
<div class="pgpEncrypted" data-bind="visible: message() && message().isPgpEncrypted() && isPgpActionVisible()">
<i class="icon-lock"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE/PGP_ENCRYPTED_MESSAGE_DESC" data-bind="click: function() { decryptPgpEncryptedMessage(message()); }"></span>
&nbsp;&nbsp;
<input type="password" class="i18n span3 inputPgpPassword"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
style="margin-bottom: 0" data-i18n="[placeholder]MESSAGE/PGP_PASSWORD_INPUT_PLACEHOLDER" data-bind="value: viewPgpPassword, onEnter: function() { decryptPgpEncryptedMessage(message()); }" />
</div>
<div class="attachmentsPlace" data-bind="visible: message() && message().hasVisibleAttachments(), css: {'selection-mode' : showAttachmnetControls}">
<ul class="attachmentList" data-bind="foreach: message() ? message().attachments() : []">
<li class="attachmentItem clearfix" draggable="true" data-tooltip-join="top"
data-bind="visible: !isLinked, event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}">
<div class="attachmentIconParent pull-left" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }">
<div class="hidePreview">
<div class="iconMain">
<i class="attachmentIcon attachmentMainIcon" data-bind="css: iconClass()"></i>
<i class="attachmentIconText attachmentMainIconText" data-bind="text: iconText()"></i>
</div>
</div>
<div class="showPreview">
<a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain(), 'data-index': $index }" target="_blank">
<div class="iconMain">
<i class="attachmentIcon attachmentMainIcon" data-bind="css: iconClass()"></i>
<i class="attachmentIconText attachmentMainIconText" data-bind="text: iconText()"></i>
</div>
<div class="iconBG" data-bind="attr: { 'style': linkThumbnailPreviewStyle() }"></div>
<div class="iconPreview">
<i class="attachmentIcon icon-eye show-hover"></i>
</div>
</a>
</div>
<div class="showPreplay">
<div class="iconMain">
<i class="attachmentIcon attachmentMainIcon" data-bind="css: iconClass()"></i>
</div>
<div class="iconPreview">
<i class="attachmentIcon icon-play show-hover"></i>
</div>
</div>
</div>
<div class="attachmentNameParent">
<div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">
<span class="attachmentName" data-bind="text: fileName"></span>&nbsp;
</div>
<div>
<span class="attachmentSize" data-bind="text: friendlySize"></span>&nbsp;
</div>
</div>
<div class="checkedParent">
<i class="checkboxAttachment icon-checkbox-unchecked"
data-bind="css: checked() ? 'checkboxMessage icon-checkbox-checked' : 'checkboxMessage icon-checkbox-unchecked',
click: function () { checked(!checked()); return false }"></i>
</div>
</li>
</ul>
<i class="icon-cog controls-handle" data-bind="visible: allowAttachmnetControls() && !showAttachmnetControls(), click: function () { showAttachmnetControls(true) }"></i>
</div>
<div class="attachmentsControls"
data-bind="visible: showAttachmnetControls() && message() && message().hasVisibleAttachments()">
<i class="icon-file-zip"
data-bind="css: {'icon-file-zip': !downloadAsZipLoading(), 'icon-spinner animated': downloadAsZipLoading()}"></i>
&nbsp;&nbsp;
<span class="g-ui-link" data-bind="click: downloadAsZip">Download as zip</span>
&nbsp;&nbsp;&nbsp;&nbsp;
<i class="icon-cloud-up"
data-bind="css: {'icon-cloud-up': !saveToOwnCloudLoading(), 'icon-spinner animated': saveToOwnCloudLoading()}"></i>
&nbsp;&nbsp;
<span class="g-ui-link" data-bind="click: saveToOwnCloud">Save to ownCloud</span>
&nbsp;&nbsp;&nbsp;&nbsp;
<i class="icon-dropbox"
data-bind="css: {'icon-dropbox': !saveToDropboxLoading(), 'icon-spinner animated': saveToDropboxLoading()}"></i>
&nbsp;&nbsp;
<span class="g-ui-link" data-bind="click: saveToDropbox">Save to Dropbox</span>
<!-- // --->
<button type="button" class="close" style="margin-right: 5px;"
data-bind="click: function () { showAttachmnetControls(false); }">×</button>
</div>
<div class="bodyText g-ui-min-height-300" data-bind="initDom: messagesBodiesDom"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>