Skip to content
This repository has been archived by the owner on Nov 9, 2017. It is now read-only.

Commit

Permalink
HAWKULAR-247: Url list pagination
Browse files Browse the repository at this point in the history
  • Loading branch information
Viliam Rockai committed May 28, 2015
1 parent dad695a commit 713f255
Show file tree
Hide file tree
Showing 4 changed files with 163 additions and 21 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -78,24 +78,7 @@ <h2 ng-show="vm.resourceList.length > 0" class="text-center hk-fade-in">Current
</div>
</div>

<div class="text-center hk-fade-in">
<ul class="pagination" ng-show="vm.resourceList.length > 0">
<li>
<a href="#" ng-click="vm.setPage(vm.resCurPage-1)">
<span class="i fa fa-angle-left"></span>
</a>
</li>
<li ng-class="{'active' : vm.resCurPage === 0}"><a href="#" ng-click="vm.setPage(0)">1</a></li>
<li ng-class="{'active' : vm.resCurPage === 1}"><a href="#" ng-click="vm.setPage(1)">2</a></li>
<li ng-class="{'active' : vm.resCurPage === 2}"><a href="#" ng-click="vm.setPage(2)">3</a></li>
<li ng-class="{'active' : vm.resCurPage === 3}"><a href="#" ng-click="vm.setPage(3)">4</a></li>
<li ng-class="{'active' : vm.resCurPage === 4}"><a href="#" ng-click="vm.setPage(4)">5</a></li>
<li>
<a href="#" ng-click="vm.setPage(vm.resCurPage+1)">
<span class="i fa fa-angle-right"></span>
</a>
</li>
</ul>
</div>
<hk-pagination resource-list="vm.resourceList" current-page="vm.resCurPage" page-setter="vm.setPage(pageNumber)"
per-page="vm.resPerPage" headers="vm.headerLinks"></hk-pagination>

</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<div class="text-center hk-fade-in">
<ul class="pagination" ng-show="goTos.length > 1">
<li>
<a href="#" ng-click="setPage(currentPage - 1)">
<span class="i fa fa-angle-left"></span>
</a>
</li>
<li ng-repeat="i in goTos track by $index"
ng-class="{'active' : currentPage === {{$index}}}">
<a href="#" ng-click="setPage($index)">{{$index+1}}</a>
</li>
<li>
<a href="#" ng-click="setPage(currentPage + 1)">
<span class="i fa fa-angle-right"></span>
</a>
</li>
</ul>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,15 @@

/// <reference path="metricsPlugin.ts"/>
/// <reference path="alertsManager.ts"/>
/// <reference path="pagination.ts"/>
/// <reference path="errorManager.ts"/>

module HawkularMetrics {


export class AddUrlController {
/// this is for minification purposes
public static $inject = ['$location', '$scope', '$rootScope', '$interval', '$log', '$filter', '$modal', 'HawkularInventory', 'HawkularMetric', 'HawkularAlert', 'HawkularAlertsManager','HawkularErrorManager', '$q', 'md5'];
public static $inject = ['$location', '$scope', '$rootScope', '$interval', '$log', '$filter', '$modal', 'HawkularInventory', 'HawkularMetric', 'HawkularAlert', 'HawkularAlertsManager','HawkularErrorManager', '$q', 'md5', 'HkHeaderParser'];

private httpUriPart = 'http://';
public addProgress: boolean = false;
Expand All @@ -33,6 +34,7 @@ module HawkularMetrics {
public lastUpdateTimestamp:Date = new Date();
private resPerPage = 5;
public resCurPage = 0;
public headerLinks = {};

constructor(private $location:ng.ILocationService,
private $scope:any,
Expand All @@ -48,7 +50,9 @@ module HawkularMetrics {
private HawkularErrorManager: HawkularMetrics.IHawkularErrorManager,
private $q: ng.IQService,
private md5: any,
public resourceUrl:string) {
private HkHeaderParser: HawkularMetrics.IHkHeaderParser,
public resourceUrl:string
) {
$scope.vm = this;
this.resourceUrl = this.httpUriPart;

Expand Down Expand Up @@ -170,6 +174,8 @@ module HawkularMetrics {
var tenantId:TenantId = currentTenantId || this.$rootScope.currentPersona.id;
this.HawkularInventory.ResourceOfType.query({tenantId: tenantId, resourceTypeId: 'URL', per_page: this.resPerPage, page: this.resCurPage}, (aResourceList, getResponseHeaders) => {
// FIXME: hack.. make expanded out of list
this.headerLinks = this.HkHeaderParser.parse(getResponseHeaders());

var pages = getResponseHeaders().link ? getResponseHeaders().link.split(', ') : [];
for (var p = 0; p < pages.length; p++) {
if (pages[p].indexOf('')) {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
///
/// Copyright 2015 Red Hat, Inc. and/or its affiliates
/// and other contributors as indicated by the @author tags.
///
/// Licensed under the Apache License, Version 2.0 (the "License");
/// you may not use this file except in compliance with the License.
/// You may obtain a copy of the License at
///
/// http://www.apache.org/licenses/LICENSE-2.0
///
/// Unless required by applicable law or agreed to in writing, software
/// distributed under the License is distributed on an "AS IS" BASIS,
/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
/// See the License for the specific language governing permissions and
/// limitations under the License.
///

/// <reference path="metricsPlugin.ts"/>
/// <reference path="../../includes.ts"/>

module HawkularMetrics {

export interface IHkHeaderParser {
parse(headers: any): any;
}

export class HkHeaderParser implements IHkHeaderParser {

public static $inject = [];

private PARAMETER_EXPRESSION = /(rel)="(\w+)"/;
private total = 0;

private parseLinkHeader(value): any {
var relationLinks = {};

if (!value) {
return relationLinks;
}

var links = value.split(', ');

for (var i = 0; i < links.length; i++) {
var linkParts = links[i].split('>');
var linkHref = linkParts[0].substring(1);
var linkRelationParameterString = linkParts[1];
var linkRelationParameterParts = this.PARAMETER_EXPRESSION.exec(linkRelationParameterString);

// Get the relation name for current Link
if (linkRelationParameterParts && linkRelationParameterParts[1] === 'rel' && linkRelationParameterParts[2]) {
//debugger;
relationLinks[linkRelationParameterParts[2]] = {
href: linkHref
};

// Get the parameters (page, per_page, ...) of current link
relationLinks[linkRelationParameterParts[2]]['params'] = {};

var linkHrefParts = linkHref.split('?');
var linkHrefParametersString = linkHrefParts[1];
var hrefParamsPairStringParts = linkHrefParametersString.split('&');
for (var j = 0; j < hrefParamsPairStringParts.length; j++) {
var parameterPair = hrefParamsPairStringParts[j];
var parameterPairParts = parameterPair.split('=');

if (parameterPairParts[0] && parameterPairParts[1]) {
relationLinks[linkRelationParameterParts[2]]['params'][parameterPairParts[0]] = parameterPairParts[1];
}
}
}
}
return relationLinks;
}

parse(headers: any): any {
return {
total: headers['x-total-count'],
rel: this.parseLinkHeader(headers.link)
};
}
};

_module.service('HkHeaderParser', HkHeaderParser);

class HkPagination {
public link: (scope: any, element: ng.IAugmentedJQuery, attrs: ng.IAttributes) => void;
public templateUrl = 'plugins/metrics/html/url-pagination.html';
public scope = {
resourceList: '=',
currentPage: '=',
linkHeader: '=',
pageSetter: '&',
perPage: '=',
headers: '='
};
public replace = 'true';

constructor(/*list of dependencies*/) {
this.link = (scope: any, element: ng.IAugmentedJQuery, attrs: ng.IAttributes) => {

scope.setPage = function(pageNumber){
var pagesNumber = Math.ceil((scope.headers.total || 1) / scope.perPage);

if (pageNumber < 1) {
scope.pageSetter({pageNumber: 0});
} else if (pageNumber >= pagesNumber) {
scope.pageSetter({pageNumber: pagesNumber - 1});
} else {
scope.pageSetter({pageNumber: pageNumber});
}
};

scope.goTos = [0];
scope.$watchGroup(['headers', 'perPage'], () => {
var pagesNumber = Math.ceil((scope.headers.total || 1) / scope.perPage);
console.log('pagesNumber', pagesNumber);
scope.goTos = new Array(pagesNumber);
});

};
}

public static Factory() {
var directive = () => {
return new HkPagination();
};

directive['$inject'] = [];

return directive;
}
}

_module.directive('hkPagination', HkPagination.Factory());
}

0 comments on commit 713f255

Please sign in to comment.