<ul class="dropdowns">
    <li class="dropdown" ng-class="{'has-filter': !query.filters.sort.isDefault}">
        <a class="dropdown-toggle btn btn-default" bs-dropdown>
            Order: <strong>{{query.filters.sort.title}}</strong>
        </a>
        <a class="btn btn-default" pfm-eat-click ng-click="clearFilter('sort')"><i class="fa fa-remove"></i></a>
        <ul class="dropdown-menu">
            <li ng-repeat="filter in ::filters.sort.values track by $index" ng-class="{selected: filter == query.filters.sort}">
                <a pfm-eat-click href="#" ng-click="setFilter('sort', filter)">{{::filter.title}}</a>
            </li>
        </ul>
    </li>
</ul>

<div class="pagination" ng-if="totalPages > 1">
    <ul>
        <li ng-class="{disabled: !prevPage}"><a href="#" ng-click="gotoPage(prevPage);" pfm-eat-click>Prev</a></li>
        <li ng-repeat="page in pages track by page" ng-class="{active: page == currentPage}">
            <a href="#" ng-click="gotoPage(page);" pfm-eat-click>{{page}}</a>
        </li>
        <li ng-class="{disabled: !nextPage}"><a href="#" ng-click="gotoPage(nextPage);" pfm-eat-click>Next</a></li>
        <li class="pagination-jump">
            <a href="#" ng-click="showPageSelector();" ng-hide="pageSelectorShown" pfm-eat-click>Jump&hellip;</a>
            <form ng-submit="jumpToPage(inputPageNumber)" ng-show="pageSelectorShown">
                <input type="number" id="pagination-jump-destination" ng-model="inputPageNumber" ng-blur="hidePageSelector()" />
                <input type="submit" />
            </form>
        </li>
    </ul>
</div>

<ui-view></ui-view>
