vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add repository list pagination

Browse source 
Also changes our binds to be bind-once, which should significantly reduce memory and increase performance for large lists

Fixes #1856
This commit is contained in:
Joseph Schorr 2016-09-21 14:23:32 -04:00
parent 502fa23d31
commit e4ad25ea81
6 changed files with 55 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

35
static/directives/repo-list-table.html
View file

@ -1,11 +1,24 @@
<div class="repo-list-table-element">
<div class="cor-loader" ng-if="isLoading"></div>
<div ng-if="orderedRepositories.entries.length == 0 && !isLoading">
<div class="co-top-bar">
<span class="co-filter-box">
<span class="page-controls" total-count="orderedRepositories.entries.length" current-page="options.page" page-size="reposPerPage"></span>
<input class="form-control" type="text" ng-model="options.filter" placeholder="Filter Repositories..." style="margin-right: 10px;">
</span>
</div>
<div ng-if="orderedRepositories.entries.length == 0 && !isLoading && !options.filter">
<div class="empty-primary-msg" ng-if="namespaces.length != 1">You do not have any viewable repositories.</div>
<div class="empty-primary-msg" ng-if="namespaces.length == 1">This namespace doesn't have any viewable repositories.</div>
<div class="empty-secondary-msg">Either no repositories exist yet or you may not have permission to view any. If you have permission, try <a href="/new">creating a new repository</a>.</div>
</div>
<div ng-if="orderedRepositories.entries.length == 0 && !isLoading && options.filter">
<div class="empty-primary-msg">No matching repositories</div>
<div class="empty-secondary-msg">There are not matching repositories for the entered filter</div>
</div>
<table class="co-table" ng-if="orderedRepositories.entries.length && !isLoading">
<thead>
<td class="hidden-xs"
@ -31,26 +44,26 @@
</thead>
<tbody>
<tr ng-repeat="repository in orderedRepositories.entries">
<tr ng-repeat="repository in orderedRepositories.entries | slice:(reposPerPage * options.page):(reposPerPage * (options.page + 1))">
<td class="repo-name-icon">
<span class="avatar" size="24" data="getAvatarData(repository.namespace)"></span>
<a href="/repository/{{ repository.namespace }}/{{ repository.name }}">
<span class="namespace">{{ repository.namespace }}</span>
<span class="name">{{ repository.name }}</span>
<span class="avatar" size="24" data="::getAvatarData(repository.namespace)"></span>
<a href="/repository/{{ ::repository.namespace }}/{{ ::repository.name }}">
<span class="namespace">{{ ::repository.namespace }}</span>
<span class="name">{{ ::repository.name }}</span>
</a>
</td>
<td class="last-modified">
<span ng-if="repository.last_modified">
{{ repository.last_modified * 1000 | amCalendar }}
<span ng-if="::repository.last_modified">
{{ ::repository.last_modified * 1000 | amCalendar }}
</span>
<span class="empty" ng-if="!repository.last_modified">(Empty Repository)</span>
<span class="empty" ng-if="::!repository.last_modified">(Empty Repository)</span>
</td>
<td class="popularity hidden-xs">
<span class="strength-indicator" value="repository.popularity" maximum="maxPopularity"
<span class="strength-indicator" value="::repository.popularity" maximum="::maxPopularity"
log-base="10"></span>
</td>
<td ng-show="loggedIn">
<span class="repo-star" repository="repository"
<span class="repo-star" repository="::repository"
star-toggled="starToggled({'repository': repository})"></span>
</td>
</tr>

2
static/directives/repo-list-view.html
View file

@ -1,6 +1,6 @@
<div class="repo-list-view-element">
<!-- Toggle -->
<div class="repo-list-toggleb btn-group" ng-show="!loading">
<div class="repo-list-toggleb btn-group" ng-show="!loading && optionAllowed">
<i class="btn btn-default fa fa-th-large" ng-class="!showAsList ? 'active' : ''"
ng-click="setShowAsList(false)" title="Grid View" data-container="body" bs-tooltip></i>
<i class="btn btn-default fa fa-th-list" ng-class="showAsList ? 'active' : ''"