Backgrid pagination works again.
This commit is contained in:
Mark McDowall
parent
bf499ed98a
commit
1809aefea2
|
|
@ -3,22 +3,22 @@
|
|||
<JSRemoteDebuggerConfigurationSettings>
|
||||
<option name="engineId" value="chrome" />
|
||||
<option name="fileUrl" value="http://localhost:8989" />
|
||||
<mapping url="http://localhost:8989/Calendar" local-file="$PROJECT_DIR$/Calendar" />
|
||||
<mapping url="http://localhost:8989/MainMenuView.js" local-file="$PROJECT_DIR$/MainMenuView.js" />
|
||||
<mapping url="http://localhost:8989/Settings" local-file="$PROJECT_DIR$/Settings" />
|
||||
<mapping url="http://localhost:8989/Upcoming" local-file="$PROJECT_DIR$/Upcoming" />
|
||||
<mapping url="http://localhost:8989/app.js" local-file="$PROJECT_DIR$/app.js" />
|
||||
<mapping url="http://localhost:8989/Mixins" local-file="$PROJECT_DIR$/Mixins" />
|
||||
<mapping url="http://localhost:8989/Missing" local-file="$PROJECT_DIR$/Missing" />
|
||||
<mapping url="http://localhost:8989/Quality" local-file="$PROJECT_DIR$/Quality" />
|
||||
<mapping url="http://localhost:8989/Config.js" local-file="$PROJECT_DIR$/Config.js" />
|
||||
<mapping url="http://localhost:8989/Shared" local-file="$PROJECT_DIR$/Shared" />
|
||||
<mapping url="http://localhost:8989/AddSeries" local-file="$PROJECT_DIR$/AddSeries" />
|
||||
<mapping url="http://localhost:8989/HeaderView.js" local-file="$PROJECT_DIR$/HeaderView.js" />
|
||||
<mapping url="http://localhost:8989" local-file="$PROJECT_DIR$" />
|
||||
<mapping url="http://localhost:8989/Routing.js" local-file="$PROJECT_DIR$/Routing.js" />
|
||||
<mapping url="http://localhost:8989/Controller.js" local-file="$PROJECT_DIR$/Controller.js" />
|
||||
<mapping url="http://localhost:8989/Series" local-file="$PROJECT_DIR$/Series" />
|
||||
<mapping local-file="$PROJECT_DIR$/Calendar" url="http://localhost:8989/Calendar" />
|
||||
<mapping local-file="$PROJECT_DIR$/MainMenuView.js" url="http://localhost:8989/MainMenuView.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Settings" url="http://localhost:8989/Settings" />
|
||||
<mapping local-file="$PROJECT_DIR$/Upcoming" url="http://localhost:8989/Upcoming" />
|
||||
<mapping local-file="$PROJECT_DIR$/app.js" url="http://localhost:8989/app.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Mixins" url="http://localhost:8989/Mixins" />
|
||||
<mapping local-file="$PROJECT_DIR$/Missing" url="http://localhost:8989/Missing" />
|
||||
<mapping local-file="$PROJECT_DIR$/Quality" url="http://localhost:8989/Quality" />
|
||||
<mapping local-file="$PROJECT_DIR$/Config.js" url="http://localhost:8989/Config.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Shared" url="http://localhost:8989/Shared" />
|
||||
<mapping local-file="$PROJECT_DIR$/AddSeries" url="http://localhost:8989/AddSeries" />
|
||||
<mapping local-file="$PROJECT_DIR$/HeaderView.js" url="http://localhost:8989/HeaderView.js" />
|
||||
<mapping local-file="$PROJECT_DIR$" url="http://localhost:8989" />
|
||||
<mapping local-file="$PROJECT_DIR$/Routing.js" url="http://localhost:8989/Routing.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Controller.js" url="http://localhost:8989/Controller.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Series" url="http://localhost:8989/Series" />
|
||||
</JSRemoteDebuggerConfigurationSettings>
|
||||
<RunnerSettings RunnerId="JavascriptDebugRunner" />
|
||||
<ConfigurationWrapper RunnerId="JavascriptDebugRunner" />
|
||||
|
|
|
|||
|
|
@ -3,22 +3,22 @@
|
|||
<JSRemoteDebuggerConfigurationSettings>
|
||||
<option name="engineId" value="firefox" />
|
||||
<option name="fileUrl" value="http://localhost:8989" />
|
||||
<mapping url="http://localhost:8989/Calendar" local-file="$PROJECT_DIR$/Calendar" />
|
||||
<mapping url="http://localhost:8989/MainMenuView.js" local-file="$PROJECT_DIR$/MainMenuView.js" />
|
||||
<mapping url="http://localhost:8989/Settings" local-file="$PROJECT_DIR$/Settings" />
|
||||
<mapping url="http://localhost:8989/Upcoming" local-file="$PROJECT_DIR$/Upcoming" />
|
||||
<mapping url="http://localhost:8989/app.js" local-file="$PROJECT_DIR$/app.js" />
|
||||
<mapping url="http://localhost:8989/Mixins" local-file="$PROJECT_DIR$/Mixins" />
|
||||
<mapping url="http://localhost:8989/Missing" local-file="$PROJECT_DIR$/Missing" />
|
||||
<mapping url="http://localhost:8989/Config.js" local-file="$PROJECT_DIR$/Config.js" />
|
||||
<mapping url="http://localhost:8989/Quality" local-file="$PROJECT_DIR$/Quality" />
|
||||
<mapping url="http://localhost:8989/AddSeries" local-file="$PROJECT_DIR$/AddSeries" />
|
||||
<mapping url="http://localhost:8989/Shared" local-file="$PROJECT_DIR$/Shared" />
|
||||
<mapping url="http://localhost:8989/HeaderView.js" local-file="$PROJECT_DIR$/HeaderView.js" />
|
||||
<mapping url="http://localhost:8989" local-file="$PROJECT_DIR$" />
|
||||
<mapping url="http://localhost:8989/Routing.js" local-file="$PROJECT_DIR$/Routing.js" />
|
||||
<mapping url="http://localhost:8989/Controller.js" local-file="$PROJECT_DIR$/Controller.js" />
|
||||
<mapping url="http://localhost:8989/Series" local-file="$PROJECT_DIR$/Series" />
|
||||
<mapping local-file="$PROJECT_DIR$/Calendar" url="http://localhost:8989/Calendar" />
|
||||
<mapping local-file="$PROJECT_DIR$/MainMenuView.js" url="http://localhost:8989/MainMenuView.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Settings" url="http://localhost:8989/Settings" />
|
||||
<mapping local-file="$PROJECT_DIR$/Upcoming" url="http://localhost:8989/Upcoming" />
|
||||
<mapping local-file="$PROJECT_DIR$/app.js" url="http://localhost:8989/app.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Mixins" url="http://localhost:8989/Mixins" />
|
||||
<mapping local-file="$PROJECT_DIR$/Missing" url="http://localhost:8989/Missing" />
|
||||
<mapping local-file="$PROJECT_DIR$/Config.js" url="http://localhost:8989/Config.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Quality" url="http://localhost:8989/Quality" />
|
||||
<mapping local-file="$PROJECT_DIR$/AddSeries" url="http://localhost:8989/AddSeries" />
|
||||
<mapping local-file="$PROJECT_DIR$/Shared" url="http://localhost:8989/Shared" />
|
||||
<mapping local-file="$PROJECT_DIR$/HeaderView.js" url="http://localhost:8989/HeaderView.js" />
|
||||
<mapping local-file="$PROJECT_DIR$" url="http://localhost:8989" />
|
||||
<mapping local-file="$PROJECT_DIR$/Routing.js" url="http://localhost:8989/Routing.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Controller.js" url="http://localhost:8989/Controller.js" />
|
||||
<mapping local-file="$PROJECT_DIR$/Series" url="http://localhost:8989/Series" />
|
||||
</JSRemoteDebuggerConfigurationSettings>
|
||||
<RunnerSettings RunnerId="JavascriptDebugRunner" />
|
||||
<ConfigurationWrapper RunnerId="JavascriptDebugRunner" />
|
||||
|
|
|
|||
|
|
@ -1,58 +0,0 @@
|
|||
/*
|
||||
backgrid-paginator
|
||||
http://github.com/wyuenho/backgrid
|
||||
|
||||
Copyright (c) 2013 Jimmy Yuen Ho Wong and contributors
|
||||
Licensed under the MIT @license.
|
||||
*/
|
||||
|
||||
.backgrid-paginator {
|
||||
text-align: center;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border-top: none;
|
||||
-webkit-border-radius: 0 0 4px 4px;
|
||||
-moz-border-radius: 0 0 4px 4px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
margin: 5px 0;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul > li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul > li > a,
|
||||
.backgrid-paginator ul > li > span {
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
line-height: 30px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul > li > a:hover,
|
||||
.backgrid-paginator ul > .active > a,
|
||||
.backgrid-paginator ul > .active > span {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul > .active > a,
|
||||
.backgrid-paginator ul > .active > span {
|
||||
color: #999999;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.backgrid-paginator ul > .disabled > span,
|
||||
.backgrid-paginator ul > .disabled > a,
|
||||
.backgrid-paginator ul > .disabled > a:hover {
|
||||
color: #999999;
|
||||
cursor: default;
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
.backgrid-paginator {
|
||||
text-align: center;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border-top: none;
|
||||
-webkit-border-radius: 0 0 4px 4px;
|
||||
-moz-border-radius: 0 0 4px 4px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
|
||||
ul {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
margin: 5px 0;
|
||||
*zoom: 1;
|
||||
|
||||
li {
|
||||
display: inline;
|
||||
|
||||
i, span {
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
line-height: 30px;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
i, span {
|
||||
background-color: #f5f5f5;
|
||||
color: #999999;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
.disabled {
|
||||
i, span {
|
||||
color: #999999;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<link href="/Content/Messenger/messenger.future.css" rel='stylesheet' type='text/css'/>
|
||||
<link href="/content/theme.css" rel='stylesheet' type='text/css'>
|
||||
<link href="/content/fullcalendar.css" rel='stylesheet' type='text/css'>
|
||||
<link href="/content/backbone.backgrid.paginator.css" rel='stylesheet' type='text/css'/>
|
||||
<link href="/content/backbone.css" rel='stylesheet' type='text/css'/>
|
||||
<link href="/content/backbone.backgrid.filter.css" rel='stylesheet' type='text/css'/>
|
||||
<link href="/content/bootstrap.toggle-switch.css" rel='stylesheet' type='text/css'/>
|
||||
<link href="/AddSeries/addseries.css" rel='stylesheet' type='text/css'/>
|
||||
|
|
|
|||
|
|
@ -119,18 +119,19 @@ Backgrid.NzbDroneHeaderCell = Backgrid.HeaderCell.extend({
|
|||
|
||||
Backgrid.NzbDronePaginator = Backgrid.Extension.Paginator.extend({
|
||||
|
||||
template: 'Shared/BackgridPaginatorTemplate',
|
||||
|
||||
events: {
|
||||
"click a": "changePage",
|
||||
"click i": "preventLinkClick"
|
||||
"click .pager-btn": "changePage"
|
||||
},
|
||||
|
||||
windowSize: 1,
|
||||
|
||||
fastForwardHandleLabels: {
|
||||
first: '<i class="icon-fast-backward"></i>',
|
||||
prev : '<i class="icon-backward"></i>',
|
||||
next : '<i class="icon-forward"></i>',
|
||||
last : '<i class="icon-fast-forward"></i>'
|
||||
first: 'icon-fast-backward',
|
||||
prev : 'icon-backward',
|
||||
next : 'icon-forward',
|
||||
last : 'icon-fast-forward'
|
||||
},
|
||||
|
||||
changePage: function (e) {
|
||||
|
|
@ -142,31 +143,27 @@ Backgrid.NzbDronePaginator = Backgrid.Extension.Paginator.extend({
|
|||
return;
|
||||
}
|
||||
|
||||
if (!$(target).is('a')) {
|
||||
target = target.parent('a');
|
||||
}
|
||||
|
||||
var label = target.html();
|
||||
var label = target.attr('data-action');
|
||||
var ffLabels = this.fastForwardHandleLabels;
|
||||
|
||||
var collection = this.collection;
|
||||
|
||||
if (ffLabels) {
|
||||
switch (label) {
|
||||
case ffLabels.first:
|
||||
case 'first':
|
||||
collection.getFirstPage();
|
||||
return;
|
||||
case ffLabels.prev:
|
||||
case 'prev':
|
||||
if (collection.hasPrevious()) {
|
||||
collection.getPreviousPage();
|
||||
}
|
||||
return;
|
||||
case ffLabels.next:
|
||||
case 'next':
|
||||
if (collection.hasNext()) {
|
||||
collection.getNextPage();
|
||||
}
|
||||
return;
|
||||
case ffLabels.last:
|
||||
case 'last':
|
||||
collection.getLastPage();
|
||||
return;
|
||||
}
|
||||
|
|
@ -177,7 +174,82 @@ Backgrid.NzbDronePaginator = Backgrid.Extension.Paginator.extend({
|
|||
collection.getPage(state.firstPage === 0 ? pageIndex - 1 :pageIndex);
|
||||
},
|
||||
|
||||
preventLinkClick: function (e) {
|
||||
e.preventDefault();
|
||||
makeHandles: function () {
|
||||
|
||||
var handles = [];
|
||||
var collection = this.collection;
|
||||
var state = collection.state;
|
||||
|
||||
// convert all indices to 0-based here
|
||||
var firstPage = state.firstPage;
|
||||
var lastPage = +state.lastPage;
|
||||
lastPage = Math.max(0, firstPage ? lastPage - 1 : lastPage);
|
||||
var currentPage = Math.max(state.currentPage, state.firstPage);
|
||||
currentPage = firstPage ? currentPage - 1 : currentPage;
|
||||
var windowStart = Math.floor(currentPage / this.windowSize) * this.windowSize;
|
||||
var windowEnd = Math.min(lastPage + 1, windowStart + this.windowSize);
|
||||
|
||||
if (collection.mode !== "infinite") {
|
||||
for (var i = windowStart; i < windowEnd; i++) {
|
||||
handles.push({
|
||||
label: i + 1,
|
||||
title: "No. " + (i + 1),
|
||||
className: currentPage === i ? "active" : undefined,
|
||||
pageNumber: i + 1
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var ffLabels = this.fastForwardHandleLabels;
|
||||
if (ffLabels) {
|
||||
|
||||
if (ffLabels.prev) {
|
||||
handles.unshift({
|
||||
label: ffLabels.prev,
|
||||
className: collection.hasPrevious() ? void 0 : "disabled",
|
||||
action: 'prev'
|
||||
});
|
||||
}
|
||||
|
||||
if (ffLabels.first) {
|
||||
handles.unshift({
|
||||
label: ffLabels.first,
|
||||
className: collection.hasPrevious() ? void 0 : "disabled",
|
||||
action: 'first'
|
||||
});
|
||||
}
|
||||
|
||||
if (ffLabels.next) {
|
||||
handles.push({
|
||||
label: ffLabels.next,
|
||||
className: collection.hasNext() ? void 0 : "disabled",
|
||||
action: 'next'
|
||||
});
|
||||
}
|
||||
|
||||
if (ffLabels.last) {
|
||||
handles.push({
|
||||
label: ffLabels.last,
|
||||
className: collection.hasNext() ? void 0 : "disabled",
|
||||
action: 'last'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return handles;
|
||||
},
|
||||
|
||||
render: function () {
|
||||
this.$el.empty();
|
||||
|
||||
var templateFunction = Marionette.TemplateCache.get(this.template);
|
||||
|
||||
this.$el.html(templateFunction({
|
||||
handles: this.makeHandles()
|
||||
}));
|
||||
|
||||
this.delegateEvents();
|
||||
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
<ul>
|
||||
{{debug}}
|
||||
{{#each handles}}
|
||||
<li {{#if className}}class="{{className}}"{{/if}}>
|
||||
{{#if pageNumber}}
|
||||
<span>{{label}}</span>
|
||||
{{else}}
|
||||
<i class="pager-btn clickable {{label}}" data-action="{{action}}"></i>
|
||||
{{/if}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
Loading…
Reference in New Issue