md-collection-pagination - npm Package Compare versions

Comparing version 1.0.1 to 1.0.3

dist/md-collection-pagination.js

@@ -14,10 +14,10 @@ (function webpackUniversalModuleDefinition(root, factory) {
 /******/ 	var installedModules = {};
-
+/******/
 /******/ 	// The require function
 /******/ 	function __webpack_require__(moduleId) {
-
+/******/
 /******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId])
+/******/ 		if(installedModules[moduleId]) {
 /******/ 			return installedModules[moduleId].exports;
-
+/******/ 		}
 /******/ 		// Create a new module (and put it into the cache)
@@ -29,23 +29,23 @@ /******/ 		var module = installedModules[moduleId] = {
 /******/ 		};
-
+/******/
 /******/ 		// Execute the module function
 /******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-
+/******/
 /******/ 		// Flag the module as loaded
 /******/ 		module.l = true;
-
+/******/
 /******/ 		// Return the exports of the module
 /******/ 		return module.exports;
 /******/ 	}
-
-
+/******/
+/******/
 /******/ 	// expose the modules object (__webpack_modules__)
 /******/ 	__webpack_require__.m = modules;
-
+/******/
 /******/ 	// expose the module cache
 /******/ 	__webpack_require__.c = installedModules;
-
+/******/
 /******/ 	// identity function for calling harmony imports with the correct context
 /******/ 	__webpack_require__.i = function(value) { return value; };
-
+/******/
 /******/ 	// define getter function for harmony exports
@@ -61,3 +61,3 @@ /******/ 	__webpack_require__.d = function(exports, name, getter) {
 /******/ 	};
-
+/******/
 /******/ 	// getDefaultExport function for compatibility with non-harmony modules
@@ -71,11 +71,11 @@ /******/ 	__webpack_require__.n = function(module) {
 /******/ 	};
-
+/******/
 /******/ 	// Object.prototype.hasOwnProperty.call
 /******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-
+/******/
 /******/ 	// __webpack_public_path__
 /******/ 	__webpack_require__.p = "";
-
+/******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 5);
+/******/ 	return __webpack_require__(__webpack_require__.s = 4);
 /******/ })
@@ -94,3 +94,3 @@ /************************************************************************/
 
-var _template = __webpack_require__(4);
+var _template = __webpack_require__(5);
 
@@ -152,4 +152,4 @@ var _template2 = _interopRequireDefault(_template);
     value: function $onChanges() {
-      this.perPage = this.perPage || 5;
-      this.shownIndexesCount = this.navigationLength || 5;
+      this.perPage = parseInt(this.perPage) || 5;
+      this.shownIndexesCount = parseInt(this.navigationLength) || 5;
       this.lastIndex = Math.ceil(this.collection.length / this.perPage) - 1;
@@ -210,8 +210,2 @@ this.allIndexes = [];
 /* 4 */
-/***/ (function(module, exports) {
-
-module.exports = "<section layout=\"row\" layout-align=\"center center\" layout-wrap ng-show=\"vm.allIndexes.length > 1\">\n  <md-button class=\"md-icon-button md-raised md-primary\" ng-click=\"vm.beginning()\">\n    <<\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-click=\"vm.previousIndexes()\" ng-hide=\"vm.indexesOffset === 0\">\n    ...\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-class=\"{ 'md-accent': index === vm.selectedIndex }\"\n             ng-click=\"vm.select(index)\" ng-repeat=\"index in vm.allIndexes | limitTo : vm.shownIndexesCount : vm.indexesOffset\">\n    {{ index + 1 }}\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-click=\"vm.nextIndexes()\"\n             ng-show=\"vm.indexesOffset + vm.shownIndexesCount <= vm.lastIndex\">\n    ...\n  </md-button>\n  <md-button class=\"md-icon-button md-raised md-primary\" ng-click=\"vm.end()\">\n    >>\n  </md-button>\n</section>\n";
-
-/***/ }),
-/* 5 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -240,4 +234,10 @@
 
+/***/ }),
+/* 5 */
+/***/ (function(module, exports) {
+
+module.exports = "<section layout=\"row\" layout-align=\"center center\" layout-wrap ng-show=\"vm.allIndexes.length > 1\">\n  <md-button class=\"md-icon-button md-raised md-primary\" ng-click=\"vm.beginning()\">\n    <<\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-click=\"vm.previousIndexes()\" ng-hide=\"vm.indexesOffset === 0\">\n    ...\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-class=\"{ 'md-accent': index === vm.selectedIndex }\"\n             ng-click=\"vm.select(index)\" ng-repeat=\"index in vm.allIndexes | limitTo : vm.shownIndexesCount : vm.indexesOffset\">\n    {{ index + 1 }}\n  </md-button>\n  <md-button class=\"md-icon-button md-raised\" ng-click=\"vm.nextIndexes()\"\n             ng-show=\"vm.indexesOffset + vm.shownIndexesCount <= vm.lastIndex\">\n    ...\n  </md-button>\n  <md-button class=\"md-icon-button md-raised md-primary\" ng-click=\"vm.end()\">\n    >>\n  </md-button>\n</section>\n";
+
 /***/ })
 /******/ ]);
 });

dist/md-collection-pagination.min.js

@@ -1,1 +0,1 @@
-!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("angular"),require("angular-material")):"function"==typeof define&&define.amd?define(["angular","angular-material"],n):"object"==typeof exports?exports.mdCollectionPagination=n(require("angular"),require("angular-material")):e.mdCollectionPagination=n(e.angular,e["angular-material"])}(this,function(e,n){return function(e){function n(i){if(t[i])return t[i].exports;var o=t[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}var t={};return n.m=e,n.c=t,n.i=function(e){return e},n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:i})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n(n.s=5)}([function(e,n,t){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(n,"__esModule",{value:!0});var o=t(4),s=i(o),a=t(3),u=i(a);n.default={template:s.default,controller:u.default,controllerAs:"vm",bindings:{collection:"<",paginatedCollection:"=",perPage:"<",navigationLength:"<"}}},function(n,t){n.exports=e},function(e,t){e.exports=n},function(e,n,t){"use strict";function i(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(n,"__esModule",{value:!0});var o=function(){function e(e,n){for(var t=0;t<n.length;t++){var i=n[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(n,t,i){return t&&e(n.prototype,t),i&&e(n,i),n}}(),s=function(){function e(){i(this,e)}return o(e,[{key:"$onChanges",value:function(){this.perPage=this.perPage||5,this.shownIndexesCount=this.navigationLength||5,this.lastIndex=Math.ceil(this.collection.length/this.perPage)-1,this.allIndexes=[];for(var e=0;e<=this.lastIndex;this.allIndexes.push(e++));this.beginning()}},{key:"beginning",value:function(){this.selectedIndex=0,this.indexesOffset=0,this.update()}},{key:"end",value:function(){for(this.selectedIndex=this.lastIndex;this.indexesOffset+this.shownIndexesCount<=this.lastIndex;)this.indexesOffset+=this.shownIndexesCount;this.update()}},{key:"select",value:function(e){this.selectedIndex=e,this.update()}},{key:"previousIndexes",value:function(){this.selectedIndex=this.indexesOffset-1,this.indexesOffset-=this.shownIndexesCount,this.update()}},{key:"nextIndexes",value:function(){this.indexesOffset+=this.shownIndexesCount,this.selectedIndex=this.indexesOffset,this.update()}},{key:"update",value:function(){var e=this.selectedIndex*this.perPage;this.paginatedCollection=this.collection.slice(e,e+this.perPage)}}]),e}();n.default=s},function(e,n){e.exports='<section layout="row" layout-align="center center" layout-wrap ng-show="vm.allIndexes.length > 1">\n  <md-button class="md-icon-button md-raised md-primary" ng-click="vm.beginning()">\n    <<\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-click="vm.previousIndexes()" ng-hide="vm.indexesOffset === 0">\n    ...\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-class="{ \'md-accent\': index === vm.selectedIndex }"\n             ng-click="vm.select(index)" ng-repeat="index in vm.allIndexes | limitTo : vm.shownIndexesCount : vm.indexesOffset">\n    {{ index + 1 }}\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-click="vm.nextIndexes()"\n             ng-show="vm.indexesOffset + vm.shownIndexesCount <= vm.lastIndex">\n    ...\n  </md-button>\n  <md-button class="md-icon-button md-raised md-primary" ng-click="vm.end()">\n    >>\n  </md-button>\n</section>\n'},function(e,n,t){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(n,"__esModule",{value:!0});var o=t(1),s=i(o);t(2);var a=t(0),u=i(a);n.default=s.default.module("mdCollectionPagination",["ng","ngMaterial"]).component("mdCollectionPagination",u.default).name}])});
+!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("angular"),require("angular-material")):"function"==typeof define&&define.amd?define(["angular","angular-material"],n):"object"==typeof exports?exports.mdCollectionPagination=n(require("angular"),require("angular-material")):e.mdCollectionPagination=n(e.angular,e["angular-material"])}(this,function(e,n){return function(e){function n(i){if(t[i])return t[i].exports;var o=t[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}var t={};return n.m=e,n.c=t,n.i=function(e){return e},n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:i})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n(n.s=4)}([function(e,n,t){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(n,"__esModule",{value:!0});var o=t(5),s=i(o),a=t(3),u=i(a);n.default={template:s.default,controller:u.default,controllerAs:"vm",bindings:{collection:"<",paginatedCollection:"=",perPage:"<",navigationLength:"<"}}},function(n,t){n.exports=e},function(e,t){e.exports=n},function(e,n,t){"use strict";function i(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(n,"__esModule",{value:!0});var o=function(){function e(e,n){for(var t=0;t<n.length;t++){var i=n[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(n,t,i){return t&&e(n.prototype,t),i&&e(n,i),n}}(),s=function(){function e(){i(this,e)}return o(e,[{key:"$onChanges",value:function(){this.perPage=parseInt(this.perPage)||5,this.shownIndexesCount=parseInt(this.navigationLength)||5,this.lastIndex=Math.ceil(this.collection.length/this.perPage)-1,this.allIndexes=[];for(var e=0;e<=this.lastIndex;this.allIndexes.push(e++));this.beginning()}},{key:"beginning",value:function(){this.selectedIndex=0,this.indexesOffset=0,this.update()}},{key:"end",value:function(){for(this.selectedIndex=this.lastIndex;this.indexesOffset+this.shownIndexesCount<=this.lastIndex;)this.indexesOffset+=this.shownIndexesCount;this.update()}},{key:"select",value:function(e){this.selectedIndex=e,this.update()}},{key:"previousIndexes",value:function(){this.selectedIndex=this.indexesOffset-1,this.indexesOffset-=this.shownIndexesCount,this.update()}},{key:"nextIndexes",value:function(){this.indexesOffset+=this.shownIndexesCount,this.selectedIndex=this.indexesOffset,this.update()}},{key:"update",value:function(){var e=this.selectedIndex*this.perPage;this.paginatedCollection=this.collection.slice(e,e+this.perPage)}}]),e}();n.default=s},function(e,n,t){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(n,"__esModule",{value:!0});var o=t(1),s=i(o);t(2);var a=t(0),u=i(a);n.default=s.default.module("mdCollectionPagination",["ng","ngMaterial"]).component("mdCollectionPagination",u.default).name},function(e,n){e.exports='<section layout="row" layout-align="center center" layout-wrap ng-show="vm.allIndexes.length > 1">\n  <md-button class="md-icon-button md-raised md-primary" ng-click="vm.beginning()">\n    <<\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-click="vm.previousIndexes()" ng-hide="vm.indexesOffset === 0">\n    ...\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-class="{ \'md-accent\': index === vm.selectedIndex }"\n             ng-click="vm.select(index)" ng-repeat="index in vm.allIndexes | limitTo : vm.shownIndexesCount : vm.indexesOffset">\n    {{ index + 1 }}\n  </md-button>\n  <md-button class="md-icon-button md-raised" ng-click="vm.nextIndexes()"\n             ng-show="vm.indexesOffset + vm.shownIndexesCount <= vm.lastIndex">\n    ...\n  </md-button>\n  <md-button class="md-icon-button md-raised md-primary" ng-click="vm.end()">\n    >>\n  </md-button>\n</section>\n'}])});

package.json

 {
   "name": "md-collection-pagination",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Angular Material Design component for paginating a collection.",
@@ -21,3 +21,6 @@ "main": "dist/md-collection-pagination.js",
     "test": "karma start spec/karma.conf.js --single-run",
-    "test:watch": "karma start spec/karma.conf.js --auto-watch"
+    "test:watch": "karma start spec/karma.conf.js --auto-watch",
+    "preversion": "npm test",
+    "version": "npm run build && git add -A dist",
+    "postversion": "git push && git push --tags"
   },
@@ -33,2 +36,3 @@ "devDependencies": {
     "babel-preset-es2015": "^6.22.0",
+    "expose-loader": "^0.7.3",
     "html-loader": "^0.4.4",
@@ -35,0 +39,0 @@ "jasmine": "^2.5.3",

README.md

@@ -61,3 +61,3 @@ # md-collection-pagination
 | `paginated-collection` | `Array` | The variable to be updated with a subset of the `collection`. |
-| `per-page` | `Number` | The maximum amount of items to be displayed at once, present in the `paginated-collection`. Default: `5`. |
-| `navigation-length` | `Number` | The maximum amount of numbers to be displayed within the navigation. Default: `5`. |
+| `per-page` | `Number` | `String` | The maximum amount of items to be displayed at once, present in the `paginated-collection`. Default: `5`. |
+| `navigation-length` | `Number` | `String` | The maximum amount of numbers to be displayed within the navigation. Default: `5`. |

spec/karma.conf.js

 const webpack = require('webpack');
 const webpackConfig = require('../webpack.config');
 
+webpackConfig.module.rules.push({
+   /* Expose jQuery globally to make it visible to Angular. */
+  test: require.resolve('jquery'), loader: 'expose-loader?jQuery'
+});
+
 module.exports = config => {
@@ -5,0 +10,0 @@ config.set({

spec/md-collection-pagination.spec.js

@@ -19,6 +19,6 @@ import $ from 'jquery';
     $rootScope.collection = Array.from({ length: 100 }, (_, index) => index + 1);
-    mdCollectionPagination = $($compile(`
+    mdCollectionPagination = $compile(`
       <md-collection-pagination collection="collection" paginated-collection="paginatedCollection">
       </md-collection-pagination>
-    `)($rootScope));
+    `)($rootScope);
     $rootScope.$digest();
@@ -123,2 +123,40 @@ });
   });
+
+  describe('custom options', () => {
+    let directiveModel;
+    beforeEach(() => {
+      directiveModel = mdCollectionPagination.isolateScope().vm;
+      $rootScope.collection = [1, 2, 3, 4, 5, 6];
+    });
+
+    describe('perPage', () => {
+      it('defines the count of items to be displayed at once', () => {
+        directiveModel.perPage = 2;
+        $rootScope.$digest();
+        expect($rootScope.paginatedCollection.length).toEqual(2);
+        expectNavigationToEqual('<<', '1', '2', '3', '>>');
+      });
+
+      it('accepts a string', () => {
+        directiveModel.perPage = '2';
+        $rootScope.$digest();
+        expect($rootScope.paginatedCollection.length).toEqual(2);
+        expectNavigationToEqual('<<', '1', '2', '3', '>>');
+      });
+    });
+
+    describe('navigationLength', () => {
+      it('defines the count of navigation buttons with page numbers', () => {
+        directiveModel.navigationLength = 2;
+        $rootScope.$digest();
+        expectNavigationToEqual('<<', '1', '2', '>>');
+      });
+
+      it('accepts a string', () => {
+        directiveModel.navigationLength = '2';
+        $rootScope.$digest();
+        expectNavigationToEqual('<<', '1', '2', '>>');
+      });
+    });
+  });
 });

src/component/controller.js

 export default class CollectionPaginationController {
   $onChanges() {
-    this.perPage = this.perPage || 5;
-    this.shownIndexesCount = this.navigationLength || 5;
+    this.perPage = parseInt(this.perPage) || 5;
+    this.shownIndexesCount = parseInt(this.navigationLength) || 5;
     this.lastIndex = Math.ceil(this.collection.length / this.perPage) - 1;
@@ -6,0 +6,0 @@ this.allIndexes = [];

No alert changes

Improved metrics

Total package byte prevSize

25195

7.52%

Lines of code

451

13.03%

Worsened metrics

Dev dependency count

18

5.88%

Number of downloads

14

-30%

No dependency changes