{"_id":"ovh-angular-pagination-front","_rev":"33-beef1675903200d70ea4cd946a3925cf","name":"ovh-angular-pagination-front","dist-tags":{"latest":"7.0.0"},"versions":{"5.0.0":{"name":"ovh-angular-pagination-front","version":"5.0.0","author":{"name":"OVH SAS"},"license":"BSD-3-Clause","_id":"ovh-angular-pagination-front@5.0.0","maintainers":[{"name":"frisouilles","email":"kevin.bonduelle@corp.ovh.com"}],"homepage":"https://github.com/ovh-ux/ovh-angular-pagination-front#readme","bugs":{"url":"https://github.com/ovh-ux/ovh-angular-pagination-front/issues"},"dist":{"shasum":"83bb392c63c1b845c88febbc1298bc2419630287","tarball":"https://registry.npmjs.org/ovh-angular-pagination-front/-/ovh-angular-pagination-front-5.0.0.tgz","integrity":"sha512-tpTDDkw9ZdXgP8ZmddYjEudAT2+zQ/UZj978JPf3/nUBJob+sunqX1+eFpUWc8O8vBzIjOuE/WEmEwwIZJMCoA==","signatures":[{"sig":"MEQCIGNT6WCrOxtX010YAKgDV7sOAeF14W+vMEXKowfwP9FaAiBgrIPasCFWKCGf8rv0+fI3YYA0Y+/+Xq2jyPVh8YnWrQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"./dist/ovh-angular-pagination-front.min.js","_from":".","_shasum":"83bb392c63c1b845c88febbc1298bc2419630287","gitHead":"5a7cd87dcd3985ae6b237758860598f4110eec8f","scripts":{},"_npmUser":{"name":"frisouilles","email":"kevin.bonduelle@corp.ovh.com"},"repository":{"url":"git+https://github.com/ovh-ux/ovh-angular-pagination-front.git","type":"git"},"_npmVersion":"4.1.2","description":"Angular directive to paginate in front end","directories":{},"_nodeVersion":"7.7.1","dependencies":{},"devDependencies":{"grunt":"0.4.x","karma":"~0.13.0","lodash":"~3.0.1","matchdep":"^0.3.0","grunt-bump":"~0.5.0","grunt-jscs":"^2.8.0","grunt-karma":"~0.12.0","grunt-ngdocs":"^0.2.5","jasmine-core":"^2.4.1","grunt-postcss":"^0.8.0","grunt-wiredep":"^3.0.1","karma-jasmine":"~0.3.0","jshint-stylish":"~2.0.0","grunt-complexity":"~0.1.0","autoprefixer-core":"^5.2.1","grunt-ng-annotate":"~0.10.0","grunt-contrib-copy":"~0.7.0","grunt-contrib-less":"^1.3.0","phantomjs-prebuilt":"^2.1.7","grunt-contrib-clean":"~0.6.0","grunt-contrib-watch":"~0.6.1","karma-spec-reporter":"0.0.26","grunt-contrib-concat":"~0.5.0","grunt-contrib-cssmin":"^1.0.1","grunt-contrib-jshint":"~0.11.0","grunt-contrib-uglify":"~0.9.0","grunt-contrib-connect":"^1.0.2","grunt-contrib-csslint":"~0.4.0","jasmine-spec-reporter":"^2.4.0","grunt-angular-templates":"^1.0.3","karma-phantomjs-launcher":"^1.0.0","karma-ng-html2js-preprocessor":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ovh-angular-pagination-front-5.0.0.tgz_1498226777855_0.5223360513336957","host":"s3://npm-registry-packages"}},"6.0.0":{"name":"ovh-angular-pagination-front","version":"6.0.0","keywords":["angular","paginate","pagination"],"author":{"name":"OVH SAS"},"license":"BSD-3-Clause","_id":"ovh-angular-pagination-front@6.0.0","maintainers":[{"name":"antleblanc","email":"ant.leblanc@gmail.com"},{"name":"ovh","email":"npm@ovh.net"},{"name":"frisouilles","email":"kevin.bonduelle@corp.ovh.com"},{"name":"neolitec","email":"kev.manson@gmail.com"},{"name":"ovh-ux-cds","email":"kevin.bonduelle+ovh-ux-cds@corp.ovh.com"},{"name":"bnjjj","email":"benjamin.coenen@hotmail.com"},{"name":"jleveugle","email":"joffrey.leveugle@gmail.com"},{"name":"cyrille.meichel","email":"cyrille.meichel@corp.ovh.com"},{"name":"gioindahouz","email":"giovanni.clement@gmail.com"},{"name":"lizardk","email":"cyril.biencourt@corp.ovh.com"}],"homepage":"https://github.com/ovh-ux/ovh-angular-pagination-front#readme","bugs":{"url":"https://github.com/ovh-ux/ovh-angular-pagination-front/issues"},"dist":{"shasum":"ac310848bddc1e0fea81b01cab0c0159a9ca128b","tarball":"https://registry.npmjs.org/ovh-angular-pagination-front/-/ovh-angular-pagination-front-6.0.0.tgz","integrity":"sha512-hkeYGnXk2llEKFAuZp4p67UY/xFhcV70aUwUjXIOgMTYM5onDtbyzybwTJqfzLJQAZHttc+Q9AoRgE1OP9Q22A==","signatures":[{"sig":"MEUCIQCPxxgkt2rbgd8tMUgmUy3Cw4CaSWF6BgVkcxOlzVLNnAIgan6V7EQShVXi0vcyCLZcx6S6GNkkcaLS+2ZXdJAj20c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"./dist/ovh-angular-pagination-front.min.js","_from":".","_shasum":"ac310848bddc1e0fea81b01cab0c0159a9ca128b","gitHead":"d8fdbdf04a4e9b77df682332e5d9cb60aa19c9fa","scripts":{"test":"grunt test"},"_npmUser":{"name":"ovh-ux-cds","email":"kevin.bonduelle+ovh-ux-cds@corp.ovh.com"},"repository":{"url":"git+https://github.com/ovh-ux/ovh-angular-pagination-front.git","type":"git"},"_npmVersion":"4.1.2","description":"Angular directive to paginate in front end","directories":{},"_nodeVersion":"7.5.0","dependencies":{},"devDependencies":{"grunt":"0.4.x","karma":"~0.13.0","eslint":"^4.0.0","lodash":"~3.0.1","matchdep":"^0.3.0","grunt-bump":"~0.5.0","grunt-karma":"~0.12.0","grunt-eslint":"^20.0.0","grunt-ngdocs":"^0.2.5","jasmine-core":"^2.4.1","grunt-postcss":"^0.8.0","grunt-wiredep":"^3.0.1","karma-jasmine":"~0.3.0","grunt-complexity":"~0.1.0","autoprefixer-core":"^5.2.1","eslint-config-ovh":"^0.1.1","grunt-ng-annotate":"~0.10.0","grunt-contrib-copy":"~0.7.0","grunt-contrib-less":"^1.3.0","phantomjs-prebuilt":"^2.1.7","grunt-contrib-clean":"~0.6.0","grunt-contrib-watch":"~0.6.1","karma-spec-reporter":"0.0.26","grunt-contrib-concat":"~0.5.0","grunt-contrib-cssmin":"^1.0.1","grunt-contrib-uglify":"~0.9.0","grunt-contrib-connect":"^1.0.2","grunt-contrib-csslint":"~0.4.0","jasmine-spec-reporter":"^2.4.0","grunt-angular-templates":"^1.0.3","karma-phantomjs-launcher":"^1.0.0","karma-ng-html2js-preprocessor":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ovh-angular-pagination-front-6.0.0.tgz_1506512271399_0.9543882419820875","host":"s3://npm-registry-packages"}},"7.0.0":{"name":"ovh-angular-pagination-front","version":"7.0.0","keywords":["angular","paginate","pagination"],"author":{"name":"OVH SAS"},"license":"BSD-3-Clause","_id":"ovh-angular-pagination-front@7.0.0","maintainers":[{"name":"antleblanc","email":"ant.leblanc@gmail.com"},{"name":"ovh","email":"npm@ovh.net"},{"name":"frisouilles","email":"kevin.bonduelle@corp.ovh.com"},{"name":"jimmyfortin","email":"jimmy.fortin@gmail.com"},{"name":"neolitec","email":"kev.manson@gmail.com"},{"name":"ovh-ux-cds","email":"kevin.bonduelle+ovh-ux-cds@corp.ovh.com"},{"name":"bnjjj","email":"benjamin.coenen@hotmail.com"},{"name":"jleveugle","email":"joffrey.leveugle@gmail.com"},{"name":"cyrille.meichel","email":"cyrille.meichel@corp.ovh.com"},{"name":"gioindahouz","email":"giovanni.clement@gmail.com"},{"name":"lizardk","email":"cyril.biencourt@corp.ovh.com"}],"homepage":"https://github.com/ovh-ux/ovh-angular-pagination-front#readme","bugs":{"url":"https://github.com/ovh-ux/ovh-angular-pagination-front/issues"},"dist":{"shasum":"484d333f357cdb2ea0abd3f76ae35491d2b8aae0","tarball":"https://registry.npmjs.org/ovh-angular-pagination-front/-/ovh-angular-pagination-front-7.0.0.tgz","integrity":"sha512-FWiQN3siY+G+httS2jcqu/ZT9QLhQE5TmpdnJReUvJa7rKz8IcCD617OPO4IAA99QcdxjjYqN7zxwwaPE0bhrQ==","signatures":[{"sig":"MEUCIQD/RZDEn7oPzarL54nZzIbqM6zKo/FBaAhyOsCY4ptCTQIgMOGjj8W9UU3nqRmSGzveYGNBMIKeZxQGCKArzlyQmYI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"./dist/ovh-angular-pagination-front.min.js","_from":".","_shasum":"484d333f357cdb2ea0abd3f76ae35491d2b8aae0","gitHead":"1d2cc2cef1f123267bae1e0936e808e14494560e","scripts":{"test":"grunt test"},"_npmUser":{"name":"ovh-ux-cds","email":"kevin.bonduelle+ovh-ux-cds@corp.ovh.com"},"repository":{"url":"git+https://github.com/ovh-ux/ovh-angular-pagination-front.git","type":"git"},"_npmVersion":"4.1.2","description":"Angular directive to paginate in front end","directories":{},"_nodeVersion":"7.5.0","dependencies":{},"devDependencies":{"grunt":"0.4.x","karma":"~0.13.0","eslint":"^4.0.0","lodash":"~3.0.1","matchdep":"^0.3.0","grunt-bump":"~0.5.0","grunt-karma":"~0.12.0","grunt-eslint":"^20.0.0","grunt-ngdocs":"^0.2.5","jasmine-core":"^2.4.1","grunt-postcss":"^0.8.0","grunt-wiredep":"^3.0.1","karma-jasmine":"~0.3.0","grunt-complexity":"~0.1.0","autoprefixer-core":"^5.2.1","eslint-config-ovh":"^0.1.1","grunt-ng-annotate":"~0.10.0","grunt-contrib-copy":"~0.7.0","grunt-contrib-less":"^1.3.0","phantomjs-prebuilt":"^2.1.7","grunt-contrib-clean":"~0.6.0","grunt-contrib-watch":"~0.6.1","karma-spec-reporter":"0.0.26","grunt-contrib-concat":"~0.5.0","grunt-contrib-cssmin":"^1.0.1","grunt-contrib-uglify":"~0.9.0","grunt-contrib-connect":"^1.0.2","grunt-contrib-csslint":"~0.4.0","jasmine-spec-reporter":"^2.4.0","grunt-angular-templates":"^1.0.3","karma-phantomjs-launcher":"^1.0.0","karma-ng-html2js-preprocessor":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ovh-angular-pagination-front-7.0.0.tgz_1515669003756_0.15706115518696606","host":"s3://npm-registry-packages"}}},"time":{"created":"2017-06-23T14:06:19.798Z","modified":"2025-12-18T14:47:45.625Z","5.0.0":"2017-06-23T14:06:19.798Z","6.0.0":"2017-09-27T11:37:52.831Z","7.0.0":"2018-01-11T11:10:05.162Z"},"bugs":{"url":"https://github.com/ovh-ux/ovh-angular-pagination-front/issues"},"author":{"name":"OVH SAS"},"license":"BSD-3-Clause","homepage":"https://github.com/ovh-ux/ovh-angular-pagination-front#readme","keywords":["angular","paginate","pagination"],"repository":{"url":"git+https://github.com/ovh-ux/ovh-angular-pagination-front.git","type":"git"},"description":"Angular directive to paginate in front end","maintainers":[{"email":"jean-christophe.alleman@corp.ovh.com","name":"jisay"},{"email":"jean-philippe.blary@corp.ovh.com","name":"blary_jp"},{"email":"ant.leblanc@gmail.com","name":"antleblanc"},{"email":"tech.ux.ext@ovh.com","name":"ovh-ux-cds"},{"email":"cyril.biencourt@corp.ovh.com","name":"lizardk"},{"email":"opensource@ovh.net","name":"ovh"},{"email":"mariejones962@gmail.com","name":"marie-j"},{"email":"anooparveti@gmail.com","name":"anooparveti"},{"email":"helabenkhalfallah@hotmail.fr","name":"helabenkhalfallah"},{"email":"benjamin.coenen@hotmail.com","name":"bnjjj"},{"email":"giovanni.clement@gmail.com","name":"gioindahouz"},{"email":"k.ung@rduk.fr","name":"khuang"},{"email":"joffrey.leveugle@gmail.com","name":"jleveugle"},{"email":"axel.peter@live.com","name":"axelpeter"},{"email":"cyrille.bourgois@gmail.com","name":"cbourgois"}],"readme":"# ovh-angular-pagination-front\n\n![githubbanner](https://user-images.githubusercontent.com/3379410/27423240-3f944bc4-5731-11e7-87bb-3ff603aff8a7.png)\n\n[![Maintenance](https://img.shields.io/maintenance/yes/2018.svg)]() [![Chat on gitter](https://img.shields.io/gitter/room/ovh/ux.svg)](https://gitter.im/ovh/ux) [![Build Status](https://travis-ci.org/ovh-ux/ovh-angular-pagination-front.svg)](https://travis-ci.org/ovh-ux/ovh-angular-pagination-front)\n\n[![NPM](https://nodei.co/npm/ovh-angular-pagination-front.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/ovh-angular-pagination-front/)\n\n> Angular directive to paginate in front end\n\n* data-ovh-angular-pagination-front\nthe directive tag\n\n* data-items=\"tasksId\" required\nall item to paginate\n\n* data-paginated-items=\"tasksDetails\" required readonly\nitem show in the current page\n\n* data-current-page=\"currentPage\" optional\nthe current page to show / shown\n\n* data-nb-pages=\"nbPages\" optional readonly\ntotal pages\n\n* data-items-per-page=\"itemsPerPage\" required\ndefines items per page\n\n* data-transform-item=\"transformItem(item)\" optional\nfunction to transform showed item\n\n* data-on-transform-item-get-promise=\"getPromise(promise)\" optional, arguments must be named \"promise\"\nto get the promise\n\n* data-on-transform-item-notify=\"onTransformItemNotify(item)\" optional, argument must be named item\nto do job on modification\n\n* data-on-transform-item-done=\"onTransformItemDone(items)\" optional, argument must be name items\nto do jop after all transformation\n\n* data-page-placeholder=\"{{tr('pagination_page', [currentPage, nbPages])}}\" required\nlabel for select page\n\n* data-item-per-page-placeholder=\"{{tr('pagination_display')}}\" required\nlabel for item per page\n\n* data-refresh=\"launchRefresh\" optional\nif launchRefresh change, table reload details\n\n* data-go-to-page=\"false\" optional\nif set, input field to change page will not be displayed\n\n# Dependances\n\n* ui.bootstrap : use for pagination. [Visit angular-ui bootstrap](http://angular-ui.github.io/bootstrap/)\n\n# example\n\n\n## app module\n\n```javascript\nangular.module(\"app\", [...,'ovh-angular-pagination-front',....];\n```\n\n\n## js controller\n\n```javascript\nangular.module('controllers').controller('controllers.Domain.Tasks',\n['$scope', 'Domain', '$filter',\n\nfunction ($scope, Domain) {\n    \"use strict\";\n\n    // Set items count by page\n    $scope.itemsPerPage = 10;\n\n    $scope.tasksId = [];\n\n    $scope.tasksDetails = [];\n\n    // To load a specifique page\n    $scope.currentPage = 5;\n\n    $scope.loaders = {\n        tasks : true\n    };\n\n    /*\n     * First get all id\n     */\n\n    Domain.getTasks().then(function (tasks) {\n        $scope.tasksId = tasks;\n    });\n\n\n    /*\n     * if you want transform item must return transformated item\n     * item is the current item to transform\n     */\n    $scope.transformItem = function (item) {\n        console.log('transform item', item);\n        return Domain.getTask(item); //please do not forget .$promise if you use $Ressource\n    };\n\n    /*\n     * call when a item of current page is transformed\n     * taskDetails contains the transformated items\n     */\n    $scope.onTransformItemNotify = function (taskDetails) {\n        console.log('onTransformItemNotify', taskDetails);\n        $scope.tasksDetails.push(taskDetails);\n    };\n\n    /*\n     * call when all item of current page are transformed\n     * tasksDetails contains transformated item\n     */\n    $scope.onTransformItemDone = function (tasksDetails) {\n        console.log('onTransformItemDone', tasksDetails);\n        $scope.loaders.tasks = false;\n    };\n\n    /*\n     * if you want use the promise create by the directive\n     */\n    $scope.getPromise= function (promise) {\n        console.log('getPromise', promise);\n        promise.then(\n            function () {\n                console.log('success', arguments);\n            },\n            function () {\n                console.log('error', arguments);\n            },\n            function () {\n                console.log('notify',arguments);\n            }\n        );\n    };\n}\n\n]);\n```\n\n## html view\n\n```html\n<table class=\"table pretty\">\n    <thead>\n        <tr>\n            <th class=\"center\">\n                <span data-i18n-static=\"domain_tab_TASKS_function\"></span>\n            </th>\n            <th class=\"center\">\n                <span data-i18n-static=\"domain_tab_TASKS_todoDate\"></span>\n            </th>\n            <th class=\"center\">\n                <span data-i18n-static=\"domain_tab_TASKS_state\"></span>\n            </th>\n        </tr>\n    </thead>\n    <tbody>\n        <!--loader-->\n        <tr data-ng-show=\"loaders.tasks\">\n            <td colspan=\"3\" class=\"center\">\n                <div class=\"loader\"></div>\n            </td>\n        </tr>\n        <!-- no tasks -->\n        <tr data-ng-show=\"!tasks.length && !loaders.tasks\">\n            <td colspan=\"3\" class=\"center\">\n                <span data-i18n-static=\"domain_tab_TASKS_no_tasks\"></span>\n            </td>\n        </tr>\n        <!--tasks-->\n        <tr data-ng-repeat=\"task in tasksDetails\">\n            <td>\n                {{task.function}}\n            </td>\n            <td>\n                {{task.todoDate | date:'longDate'}}\n            </td>\n            <td>\n                <i data-ng-class=\"{\n                    'state-pending' : 'DOING',\n                    'state-error'   : 'ERROR',\n                    'state-done'    : 'DONE',\n                    'state-cancel'  : 'CANCELLED',\n                    'state-pending' : 'TODO',\n                    'state-pending' : 'INIT'\n                }\"></i>\n            </td>\n\n        </tr>\n    </tbody>\n</table>\n\n<div class=\"table table-pretty\"\n     data-ovh-angular-pagination-front\n     data-items=\"tasksId\"\n     data-paginated-items=\"tasksDetails\"\n     data-current-page=\"currentPage\"\n     data-nb-pages=\"nbPages\"\n     data-items-per-page=\"itemsPerPage\"\n     data-transform-item=\"transformItem(item)\"\n     data-on-transform-item-get-promise=\"getPromise(promise)\"\n     data-on-transform-item-notify=\"onTransformItemNotify(item)\"\n     data-on-transform-item-done=\"onTransformItemDone(items)\"\n     data-page-placeholder=\"{{tr('pagination_page', [currentPage, nbPages])}}\"\n     data-item-per-page-placeholder=\"{{tr('pagination_display')}}\"></div>\n\n```\n\n## Style\n\n```css\n.pagination-container {\n\tul {\n\t\t&.pagination {\n\t\t\t.box-shadow(none);\n\t\t\tli {\n\t\t\t\ta {\n\t\t\t\t\t.color-fn(@defaultPaginationFont);\n\t\t\t\t\tfont-size: @fontSizeMini;\n\t\t\t\t}\n\t\t\t\t&:hover a {\n\t\t\t\t\t.background-color-fn(@defaultPaginationHoverBackground);\n\t\t\t\t\t.color-fn(@defaultPaginationHoverFont);\n\t\t\t\t}\n\t\t\t\t&.active a {\n\t\t\t\t\t.background-color-fn(@defaultPaginationActiveBackground);\n\t\t\t\t\t.color-fn(@defaultPaginationActiveFont);\n\t\t\t\t\tfont-size: @fontSizeDefault;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t.pagination-page-goto {\n\t\t.background-color-fn(@defaultPaginationGoToBackground);\n\t\t.color-fn(@defaultPaginationGoToFont);\n\t\t&:hover {\n\t\t\t.background-color-fn(@defaultPaginationGoToHoverBackground);\n\t\t\t.color-fn(@defaultPaginationGoToHoverFont);\n\t\t}\n\t}\n\n\t.pagination-page-input {\n\t\t.rounded(0px);\n\t\t.border-color-fn(@defaultPaginationGoToPageBorder);\n\t\t.background-color-fn(@defaultPaginationGoToPageBackground);\n\t\t.color-fn(@defaultPaginationGoToPageFont);\n\t}\n\n\t.pagination-page-size {\n\t\tfont-size: @fontSizeMini;\n\t\t.rounded(0px);\n\t}\n}\n\n```\n# Related links\n \n * Contribute: https://github.com/ovh-ux/ovh-angular-pagination-front/CONTRIBUTING.md\n * Report bugs: https://github.com/ovh-ux/ovh-angular-pagination-front/issues\n * Get latest version: https://github.com/ovh-ux/ovh-angular-pagination-front\n \n# License\n \nSee https://github.com/ovh-ux/ovh-angular-pagination-front/blob/master/LICENSE\n","readmeFilename":"README.md"}