mail/src/tpl/action-bar.html

59 lines
3.2 KiB
HTML

<div class="action-bar" ng-controller="ActionBarCtrl">
<div class="action-bar__primary">
<button class="btn btn--light-dropdown" ng-hide="state.read.open" wo-dropdown="#dropdown-checkmessages">
<svg role="presentation"><use xlink:href="#icon-check" />Check messages</svg>
<svg class="btn__dropdown" role="presentation"><use xlink:href="#icon-dropdown" /></svg>
</button>
<button class="btn btn--light" wo-touch="state.read.open ? deleteMessage(state.mailList.selected) : deleteCheckedMessages()">Delete</button>
<button class="btn btn--light" wo-touch="state.read.open ? moveMessage(state.mailList.selected, getJunkFolder()) : moveCheckedMessages(getJunkFolder())">Spam</button>
<button class="btn btn--light-dropdown" wo-dropdown="#dropdown-folder">
<svg><use xlink:href="#icon-folder" /><title>Folder</title></svg>
<svg class="btn__dropdown" role="presentation"><use xlink:href="#icon-dropdown" /></svg>
</button>
</div><!--/action-bar__primary-->
<div class="action-bar__secondary">
<button class="btn btn--light-dropdown" wo-dropdown="#dropdown-more">
More
<svg class="btn__dropdown" role="presentation"><use xlink:href="#icon-dropdown" /></svg>
</button>
</div><!--/action-bar__secondary-->
<div class="action-bar__search">
<div class="search search--light">
<svg><use xlink:href="#icon-search" /><title>Search</title></svg>
<input class="input-text" type="text" ng-model="searchText"
ng-change="displaySearchResults(searchText)"
placeholder="Search" wo-focus-me="state.mailList.searching">
</div>
</div><!--/action-bar__search-->
<!-- dropdowns -->
<ul id="dropdown-folder" class="dropdown">
<li ng-repeat="folder in account.folders">
<button wo-touch="state.read.open ? moveMessage(state.mailList.selected, folder) : moveCheckedMessages(folder)">
<svg><use xlink:href="#icon-folder" /></svg>
{{folder.wellknown ? folder.type : folder.name}}
</button>
</li>
</ul><!--/dropdown-->
<ul id="dropdown-checkmessages" class="dropdown">
<li><button wo-touch="check(CHECKALL)">All</button></li>
<li><button wo-touch="check(CHECKNONE)">None</button></li>
<li><button wo-touch="check(CHECKENCRYPTED)">Encrypted</button></li>
<li><button wo-touch="check(CHECKUNENCRYPTED)">Unencrypted</button></li>
<li><button wo-touch="check(CHECKUNREAD)">Unread</button></li>
<li><button wo-touch="check(CHECKREAD)">Read</button></li>
<li><button wo-touch="check(CHECKFLAGGED)">Starred</button></li>
<li><button wo-touch="check(CHECKUNFLAGGED)">Unstarred</button></li>
</ul><!--/checkmessages-->
<ul id="dropdown-more" class="dropdown">
<li><button wo-touch="state.read.open ? markMessage(state.mailList.selected, false) : markCheckedMessages(false)">Mark as read</button></li>
<li><button wo-touch="state.read.open ? markMessage(state.mailList.selected, true) : markCheckedMessages(true)">Mark as unread</button></li>
<li><button wo-touch="state.read.open ? flagMessage(state.mailList.selected, true) : flagCheckedMessages(true)">Add star</button></li>
<li><button wo-touch="state.read.open ? flagMessage(state.mailList.selected, false) : flagCheckedMessages(false)">Remove star</button></li>
</ul><!--/dropdown-->
</div>