2014-09-23 09:41:37 -04:00
|
|
|
<div class="mail-list" ng-controller="MailListCtrl">
|
2013-09-18 12:47:18 -04:00
|
|
|
|
2014-09-23 09:41:37 -04:00
|
|
|
<header wo-touch="state.nav.toggle(true); $event.stopPropagation()">
|
|
|
|
<div>
|
|
|
|
<button class="btn-navicon">
|
|
|
|
<svg><use xlink:href="#icon-navicon" /><title>Toggle Navigation</title></svg>
|
|
|
|
</button>
|
2014-11-04 15:17:03 -05:00
|
|
|
<h2>{{state.nav.currentFolder.wellknown ? state.nav.currentFolder.type : state.nav.currentFolder.name}}</h2>
|
2014-09-23 09:41:37 -04:00
|
|
|
</div>
|
2014-06-27 07:05:05 -04:00
|
|
|
|
2014-10-16 09:10:00 -04:00
|
|
|
<button class="btn-icon-light" title="New mail" wo-touch="state.writer.write(); $event.stopPropagation()">
|
2014-09-23 09:41:37 -04:00
|
|
|
<svg><use xlink:href="#icon-write" /><title>New mail</title></svg>
|
|
|
|
</button>
|
|
|
|
</header>
|
2014-11-26 11:57:14 -05:00
|
|
|
|
2014-09-23 09:41:37 -04:00
|
|
|
<div class="mail-list__search">
|
|
|
|
<div class="search">
|
|
|
|
<svg><use xlink:href="#icon-search" /><title>Search</title></svg>
|
|
|
|
<input class="input-text" type="text" ng-model="searchText"
|
|
|
|
ng-change="displaySearchResults(searchText)"
|
2014-11-27 10:23:42 -05:00
|
|
|
placeholder="Search" wo-focus-me="state.mailList.searching">
|
2014-09-23 09:41:37 -04:00
|
|
|
</div>
|
2013-12-06 03:55:44 -05:00
|
|
|
</div>
|
|
|
|
|
2014-09-23 09:41:37 -04:00
|
|
|
<div class="mail-list__scroll-canvas" list-scroll="displayMessages">
|
|
|
|
<ul class="mail-list__entries" infinite-scroll="displayMore()"
|
2014-07-16 06:47:25 -04:00
|
|
|
infinite-scroll-distance="1" infinite-scroll-parent="true">
|
2014-09-23 09:41:37 -04:00
|
|
|
<li class="mail-list-entry"
|
|
|
|
ng-class="{'mail-list-entry--active': email === state.mailList.selected, 'mail-list-entry--unread': email.unread, 'mail-list-entry--attachment': email.attachments !== undefined && email.attachments.length > 0}"
|
2014-12-02 10:12:42 -05:00
|
|
|
wo-touch="navigate(email)"
|
2015-02-13 10:18:10 -05:00
|
|
|
ng-repeat="email in displayMessages track by email.uid">
|
2014-09-23 09:41:37 -04:00
|
|
|
<ul class="mail-list-entry__flags">
|
|
|
|
<li class="mail-list-entry__flags-unread"></li>
|
2014-11-05 08:26:09 -05:00
|
|
|
<li class="mail-list-entry__flags-checked" wo-touch="$event.stopPropagation()">
|
2014-09-23 09:41:37 -04:00
|
|
|
<label class="checkbox">
|
2014-11-05 08:26:09 -05:00
|
|
|
<input type="checkbox" ng-model="email.checked">
|
2014-09-23 09:41:37 -04:00
|
|
|
<span><svg role="presentation"><use xlink:href="#icon-check" /></svg></span>
|
|
|
|
</label>
|
|
|
|
</li>
|
2015-04-07 09:59:41 -04:00
|
|
|
<li ng-show="email.from" class="mail-list-entry__flags-flagged" wo-touch="flag(email, !email.flagged); $event.stopPropagation()">
|
2014-12-03 09:31:05 -05:00
|
|
|
<svg ng-show="email.flagged"><use xlink:href="#icon-star_filled" /><title>Starred</title></svg>
|
|
|
|
<svg ng-show="!email.flagged"><use xlink:href="#icon-star" /><title>Not Starred</title></svg>
|
2014-09-23 09:41:37 -04:00
|
|
|
</li>
|
|
|
|
<li class="mail-list-entry__flags-encrypted">
|
2015-04-22 11:48:38 -04:00
|
|
|
<svg ng-show="email.encrypted" wo-tooltip="#encrypted-info"><use xlink:href="#icon-encrypted" /></svg>
|
2014-09-23 09:41:37 -04:00
|
|
|
</li>
|
|
|
|
<li class="mail-list-entry__flags-answered" ng-show="!email.unread && email.answered">
|
|
|
|
<svg><use xlink:href="#icon-reply" /><title>Answered</title></svg>
|
|
|
|
</li>
|
|
|
|
<li class="mail-list-entry__flags-attachment">
|
|
|
|
<svg><use xlink:href="#icon-attachment" /><title>Attachments</title></svg>
|
|
|
|
</li>
|
2014-06-16 06:18:31 -04:00
|
|
|
</ul>
|
2015-04-07 10:45:51 -04:00
|
|
|
<h3 class="mail-list-entry__name">
|
|
|
|
<span ng-show="!email.from" class="spinner"></span>
|
|
|
|
{{email.from[0].name || email.from[0].address}}
|
|
|
|
</h3>
|
2014-11-10 12:10:10 -05:00
|
|
|
<div class="mail-list-entry__subject">
|
2015-04-07 09:59:41 -04:00
|
|
|
<strong>{{email.from ? (email.subject || 'No subject') : ''}}</strong>
|
2014-11-10 12:10:10 -05:00
|
|
|
<span>
|
|
|
|
{{email.body ? email.body.substr(0, 200) : ''}}
|
|
|
|
</span>
|
|
|
|
</div>
|
2014-09-23 09:41:37 -04:00
|
|
|
<div class="mail-list-entry__attachment">
|
|
|
|
<svg><use xlink:href="#icon-attachment" /><title>Attachments</title></svg>
|
|
|
|
</div>
|
2014-12-01 04:04:20 -05:00
|
|
|
<time class="mail-list-entry__time">{{ formatDate(email.sentDate) }}</time>
|
2014-09-23 09:41:37 -04:00
|
|
|
<div class="mail-list-entry__excerpt">{{email.body ? email.body.substr(0, 200) : ''}}</div>
|
|
|
|
<div class="mail-list-entry__encrypted">
|
2014-11-27 12:28:03 -05:00
|
|
|
<svg ng-show="email.encrypted"><use xlink:href="#icon-encrypted" /><title>Encrypted</title></svg>
|
2014-09-23 09:41:37 -04:00
|
|
|
</div>
|
2013-10-27 06:32:12 -04:00
|
|
|
</li>
|
2014-09-23 09:41:37 -04:00
|
|
|
</ul>
|
2013-10-27 06:32:12 -04:00
|
|
|
</div>
|
2013-09-27 11:48:21 -04:00
|
|
|
|
2014-11-26 11:57:14 -05:00
|
|
|
<footer ng-include="'tpl/status-display.html'"></footer>
|
2015-04-22 11:48:38 -04:00
|
|
|
|
|
|
|
<!-- tooltips -->
|
|
|
|
<div id="encrypted-info" class="tooltip">
|
|
|
|
<div class="tooltip__arrow"></div>
|
|
|
|
<div class="tooltip__content">Message is encrypted.</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div><!--/mail-list-->
|