mail/src/tpl/action-bar.html

45 lines
2.4 KiB
HTML

<div class="action-bar" ng-controller="ActionBarCtrl">
<div class="action-bar__primary">
<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>
<span ng-show="folder.wellknown">{{folder.type === 'Flagged' ? 'Starred' : folder.type}}</span>
<span ng-show="!folder.wellknown">{{folder.name}}</span>
</button>
</li>
</ul><!--/dropdown-->
<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>