From 6cb606566992a94f39aa5aae06a10e7382c6371a Mon Sep 17 00:00:00 2001 From: Mark McDowall Date: Tue, 30 Apr 2013 20:14:54 -0700 Subject: [PATCH] Adding backgrid paginator --- Gruntfile.js | 1 + UI/Content/backbone.backgrid.paginator.css | 58 ++++++++++++++++++++++ UI/Index.html | 2 + UI/Missing/Collection.js | 2 +- UI/Missing/MissingLayout.js | 7 ++- 5 files changed, 68 insertions(+), 2 deletions(-) create mode 100644 UI/Content/backbone.backgrid.paginator.css diff --git a/Gruntfile.js b/Gruntfile.js index 48cf3b101..d8fadad10 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -21,6 +21,7 @@ module.exports = function (grunt) { 'UI/JsLibraries/underscore.js' : 'http://underscorejs.org/underscore.js', 'UI/JsLibraries/backbone.pageable.js' : 'http://raw.github.com/wyuenho/backbone-pageable/master/lib/backbone-pageable.js', 'UI/JsLibraries/backbone.backgrid.js' : 'http://raw.github.com/wyuenho/backgrid/master/lib/backgrid.js', + 'UI/JsLibraries/backbone.backgrid.paginator' : 'http://raw.github.com/wyuenho/backgrid/master/lib/extensions/paginator/backgrid-paginator.js', 'UI/JsLibraries/messenger.js' : 'http://raw.github.com/HubSpot/messenger/master/build/js/messenger.js', 'UI/Content/messenger.css' : 'http://raw.github.com/HubSpot/messenger/master/build/css/messenger.css', 'UI/Content/bootstrap.toggle-switch.css' : 'http://raw.github.com/ghinda/css-toggle-switch/gh-pages/toggle-switch.css', diff --git a/UI/Content/backbone.backgrid.paginator.css b/UI/Content/backbone.backgrid.paginator.css new file mode 100644 index 000000000..6437a0d19 --- /dev/null +++ b/UI/Content/backbone.backgrid.paginator.css @@ -0,0 +1,58 @@ +/* + 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; +} diff --git a/UI/Index.html b/UI/Index.html index 01d1fbf37..b834817c7 100644 --- a/UI/Index.html +++ b/UI/Index.html @@ -16,6 +16,7 @@ + @@ -102,6 +103,7 @@ + diff --git a/UI/Missing/Collection.js b/UI/Missing/Collection.js index 26d6b3e5f..4d8837510 100644 --- a/UI/Missing/Collection.js +++ b/UI/Missing/Collection.js @@ -1,5 +1,5 @@ "use strict"; -define(['app'], function () { +define(['app', 'Series/EpisodeModel'], function () { NzbDrone.Missing.Collection = Backbone.PageableCollection.extend({ url : NzbDrone.Constants.ApiRoot + '/missing', model : NzbDrone.Series.EpisodeModel, diff --git a/UI/Missing/MissingLayout.js b/UI/Missing/MissingLayout.js index b52ff7f8b..a04b654a0 100644 --- a/UI/Missing/MissingLayout.js +++ b/UI/Missing/MissingLayout.js @@ -64,7 +64,12 @@ define([ row : NzbDrone.Missing.Row, columns : columns, collection: this.missingCollection, - className : 'table table-hover' + className : 'table table-hover', + state: { + pageSize: 10, + sortKey: "airDate", + order: 1 + } })); },