New thread list logic (step 2)

This commit is contained in:
RainLoop Team 2015-04-21 02:39:14 +04:00
parent b656b6365b
commit 03d26bc4c6
18 changed files with 139 additions and 517 deletions

View file

@ -42,12 +42,12 @@
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_CHECK_ALL"></td><td>Ctrl + A, Cmd + A</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_ARCHIVE"></td><td>Z</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_DELETE"></td><td>Delete, Shift + Delete, #</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_OPEN_THREAD"></td><td>T</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_MOVE"></td><td>M</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_READ"></td><td>Q</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_UNREAD"></td><td>U</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_IMPORTANT"></td><td>I</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_SEARCH"></td><td>/</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_CANCEL_SEARCH"></td><td>Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_FULLSCREEN_ENTER"></td><td>Enter</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_VIEW_MESSAGE_ENTER"></td><td>Enter</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_SWITCH_TO_MESSAGE"></td><td>&rarr;, Tab</td></tr>
@ -60,14 +60,12 @@
<table class="table table-striped table-bordered">
<tbody>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_FULLSCREEN_TOGGLE">Toggle fullscreen mode</td><td>Enter</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_BLOCKQUOTES_TOGGLE">Toggle message blockquotes</td><td>B</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_THREAD_NEXT">Next message in thread</td><td>Ctrl + &larr;, Cmd + &larr;</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_THREAD_PREV">Previous message in thread</td><td>Ctrl + &rarr;, Cmd + &rarr;</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_PRINT">Print</td><td>Ctrl + P, Cmd + P</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_EXIT_FULLSCREEN">Exit fullscreen mode</td><td>Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_CLOSE_MESSAGE">Close message (No preview pane layout)</td><td>Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_SWITCH_TO_LIST">Switch focus back to message list</td><td>Tab, Shift + Tab, Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_FULLSCREEN_TOGGLE"></td><td>Enter</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_BLOCKQUOTES_TOGGLE"></td><td>B</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_PRINT"></td><td>Ctrl + P, Cmd + P</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_EXIT_FULLSCREEN"></td><td>Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_CLOSE_MESSAGE"></td><td>Esc</td></tr>
<tr><td class="i18n" data-i18n="SHORTCUTS_HELP/LABEL_SWITCH_TO_LIST"></td><td>Tab, Shift + Tab, Esc</td></tr>
</tbody>
</table>

View file

@ -137,12 +137,14 @@
<div class="b-content" data-bind="nano: true, initDom: dragOverBodyArea">
<div class="content g-scrollbox">
<div class="content-wrapper">
<div class="listThreadUidDesc" data-bind="visible: '' !== messageListEndThreadUid(), click: cancelThreadUid">
<i class="icon-left" data-bind="click: cancelThreadUid"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="MESSAGE_LIST/BACK_TO_MESSAGE_LIST"></span>
</div>
<div class="listSearchDesc" data-bind="visible: '' !== messageListSearchDesc()">
<a class="close-custom" data-bind="click: cancelSearch">&times;</a>
<!-- <a class="btn btn-small pull-right searchCancelButton" data-bind="click: cancelSearch">
<i class="icon-remove"></i>
</a>-->
<span data-bind="text: messageListSearchDesc"></span>:
<span data-bind="text: messageListSearchDesc"></span>
</div>
<div class="listDragOver" data-bind="css: {'viewAppendArea': dragOver() && '' === messageListError() && !popupVisibility(), 'dragOverEnter': dragOverEnter }, initDom: dragOverArea">
<i class="icon-down e-icon"></i>

View file

@ -18,15 +18,20 @@
<div class="dateParent actionHandle dragHandle">
<span class="date" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></span>
</div>
<div class="threadsParent" data-bind="visible: 1 < threadsLen()">
<span class="threads-len">
<span class="threads-len-data">
<span data-bind="text: threadsLen"></span>
<i class="icon-right-mini"></i>
</span>
</span>
</div>
<div class="checkedParent">
<i class="checkboxMessage" data-bind="css: checked() ? 'checkboxMessage icon-checkbox-checked' : 'checkboxMessage icon-checkbox-unchecked'"></i>
</div>
<div class="senderParent actionHandle dragHandle">
<span class="replyFlag"><i class="icon-reply"></i>&nbsp;</span>
<span class="forwardFlag"><i class="icon-forward"></i>&nbsp;</span>
<span class="threads-len" data-bind="visible: 1 < threadsLen()">
<span class="threads-len-data" data-bind="text: threadsLen"></span>
</span>
<span class="sender" data-bind="text: senderEmailsString, attr: {'title': senderClearEmailsString}"></span>
&nbsp;
</div>

View file

@ -7,6 +7,14 @@
<div class="dateParent actionHandle dragHandle">
<span class="date" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></span>
</div>
<div class="threadsParent" data-bind="visible: 1 < threadsLen()">
<span class="threads-len">
<span class="threads-len-data">
<span data-bind="text: threadsLen"></span>
<i class="icon-right-mini"></i>
</span>
</span>
</div>
<div class="checkedParent">
<i class="checkboxMessage" data-bind="css: checked() ? 'checkboxMessage icon-checkbox-checked' : 'checkboxMessage icon-checkbox-unchecked'"></i>
</div>
@ -24,9 +32,6 @@
<div class="senderParent actionHandle dragHandle">
<span class="replyFlag"><i class="icon-reply"></i>&nbsp;</span>
<span class="forwardFlag"><i class="icon-forward"></i>&nbsp;</span>
<span class="threads-len" data-bind="visible: 1 < threadsLen()">
<span class="threads-len-data" data-bind="text: threadsLen"></span>
</span>
<span class="sender" data-bind="text: senderEmailsString, attr: {'title': senderClearEmailsString}"></span>
&nbsp;
</div>

View file

@ -188,67 +188,6 @@
</a>
</div>
<div class="btn-group thread-controls pull-right g-ui-user-select-none" style="margin-right: 5px"
data-bind="visible: viewThreadsControlVisibility">
<a class="btn last btn-thin pull-right" data-tooltip-join="bottom"
data-bind="command: threadBackCommand, tooltip: 'MESSAGE/BUTTON_THREAD_PREV'">
<i class="icon-right-middle"></i>
</a>
<div class="btn-group pull-right" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: threadsDropdownTrigger">
<a class="btn btn-thin btn-dark-disabled-border dropdown-toggle" id="thread-list-view-dropdown-id" data-toggle="dropdown"
href="#" tabindex="-1" data-tooltip-join="bottom"
style="margin-left: -1px; margin-right: -1px;"
data-bind="command: threadListCommand, tooltip: 'MESSAGE/BUTTON_THREAD_LIST'"
>
<i class="icon-list"
data-bind="css: {'icon-list': !messageListOfThreadsLoading(), 'icon-spinner animated': messageListOfThreadsLoading()}"></i>
</a>
<ul class="dropdown-menu pull-right g-ui-menu thread-list"
role="menu" aria-labelledby="thread-list-view-dropdown-id"
style="min-width: 400px; max-width: 400px; width: 400px; padding: 0"
data-bind="css: {'hide-more': !viewThreadMessages.showMore() }"
>
<div data-bind="visible: '' !== viewThreadMessages.error()" style="color: red; text-align: center; padding: 10px">
<spam data-bind="text: viewThreadMessages.error"></spam>
</div>
<div data-bind="visible: messageListOfThreadsLoading" style="text-align: center; padding: 10px">
<i class="icon-spinner animated" />
</div>
<div data-bind="foreach: viewThreadMessages, visible: !messageListOfThreadsLoading()">
<li class="e-item thread-list-message real-msg" role="presentation" data-bind="css: {'selected': selected, 'more-that': $parent.viewThreadMessages.limit < $index() }">
<a class="e-link menuitem" href="#" tabindex="-1" onclick="return false;">
<span class="flagParent pull-right" style="margin-left: 5px; margin-right: 0px;">
<i class="icon-star-empty flagOff" data-bind="css: {'icon-star flagOn': flagged, 'icon-star-empty flagOff': !flagged()}"></i>
</span>
<span class="thread-date pull-right" data-moment-format="SHORT" data-bind="moment: timestamp"></span>
<div style="text-overflow: ellipsis; overflow: hidden;">
<span class="thread-from" data-bind="text: fromAsString"></span>
&nbsp;
</div>
<div style="text-overflow: ellipsis; overflow: hidden;">
<span class="thread-subject" data-bind="text: subject"></span>
&nbsp;
</div>
</a>
</li>
</div>
<div data-bind="visible: !viewThreadMessages.showMore() && !messageListOfThreadsLoading()">
<li class="e-item thread-list-message" role="presentation">
<a class="e-link menuitem more-threads" href="#" tabindex="-1"
onclick="return false"
data-i18n="MESSAGE/BUTTON_THREAD_MORE"></a>
</li>
</div>
</ul>
</div>
<a class="btn first btn-thin pull-right" data-tooltip-join="bottom"
data-bind="command: threadForwardCommand, tooltip: 'MESSAGE/BUTTON_THREAD_NEXT'">
<i class="icon-left-middle"></i>
</a>
</div>
</nobr>
</div>
@ -261,9 +200,6 @@
<span class="flagParent">
<i class="icon-star-empty flagOff" data-bind="css: {'icon-star flagOn': viewIsFlagged, 'icon-star-empty flagOff': !viewIsFlagged()}"></i>
</span>
<span class="thread-counter" data-bind="visible: viewThreadsControlVisibility"
style="font-weight: normal; margin-right: 5px">(<span
data-bind="text: viewThreadsControlDesc"></span>)</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>