function PlayerListNavigator(pageNoArea, playerListManager) {
	var self = this;
	this.playerListManager = playerListManager;
	this.pagination = pageNoArea;
	// console.log(parent);

	this.activePageNo = 1;
	this.lastPageNo = 1;
}

PlayerListNavigator.prototype.updateNavigator = function(activePageNo, lastPageNo) {
	this.activePageNo = activePageNo;
	this.lastPageNo = lastPageNo;

	$(this.pagination).empty();
	this.makePagination();
	this.applyClickEvent();
	this.disableNavButtons();
}

PlayerListNavigator.prototype.makePagination = function() {
	// left arrows
	var paginationLeftArrows = '\
		<li class="page-item">\
			<a class="page-link" href="javascript:void(0);" aria-label="First">\
				<span aria-hidden="true">&laquo;</span>\
				<span class="sr-only">First</span>\
			</a>\
		</li>\
\
		<li class="page-item">\
			<a class="page-link" href="javascript:void(0);" aria-label="Previous">\
				<span aria-hidden="true">&lt;</span>\
				<span class="sr-only">Previous</span>\
			</a>\
		</li>\
\
		<li>&nbsp</li>\
\		';
	$(this.pagination).append(paginationLeftArrows);

	// numbers
	var pageGroupNo = this.getPageGroupNo(this.activePageNo);
	var startNo = pageGroupNo * 10 + 1;
	var endNo = (pageGroupNo + 1) * 10 > this.lastPageNo ? this.lastPageNo : (pageGroupNo + 1) * 10;
	for(var pageNo = startNo; pageNo < endNo + 1; pageNo++) {
		var pageContent = "";
		if(pageNo == this.activePageNo) {
			pageContent = '<li class="page-item disabled"><a class="page-link" href="javascript:void(0);" aria-label="'
				+ pageNo + '">' + pageNo + '</a></li>';
		} else {
			pageContent = '<li class="page-item"><a class="page-link" href="javascript:void(0);" aria-label="'
				+ pageNo + '">' + pageNo + '</a></li>';
		}
		$(this.pagination).append(pageContent);
	}

	// right arrows
	var paginationRightArrows = '\
		<li>&nbsp</li>\
\
		<li class="page-item">\
			<a class="page-link" href="javascript:void(0);" aria-label="Next">\
				<span aria-hidden="true">&gt;</span>\
				<span class="sr-only">Next</span>\
			</a>\
		</li>\
\
		<li class="page-item">\
			<a class="page-link" href="javascript:void(0);" aria-label="Last">\
				<span aria-hidden="true">&raquo;</span>\
				<span class="sr-only">Last</span>\
			</a>\
		</li>\
	';
	$(this.pagination).append(paginationRightArrows);
}

PlayerListNavigator.prototype.getPageGroupNo = function(index) {
	var pageGroupNo = Math.floor( (index - 1) / 10 );
	var lastPageGroupNo = Math.floor( (this.lastPageNo - 1) / 10 );

	if(pageGroupNo < 0)
		return 0;
	else if(pageGroupNo > lastPageGroupNo)
		return lastPageGroupNo;
	else
		return pageGroupNo;
}

PlayerListNavigator.prototype.applyClickEvent = function() {
	var self = this;

	$("[aria-label='First']").click(function() {
		self.onClickPageNo("first");
	});

	$("[aria-label='Previous']").click(function() {
		self.onClickPageNo("previous");
	});

	for(var pageNo = 1; pageNo < this.lastPageNo + 1; pageNo++) {
		$("[aria-label='" + pageNo + "']").click(function() {
			var selectedPageNo = $(this).attr("aria-label");
			self.onClickPageNo(selectedPageNo);
		});
	}

	$("[aria-label='Next']").click(function() {
		self.onClickPageNo("next");
	});

	$("[aria-label='Last']").click(function() {
		self.onClickPageNo("last");
	});
}

PlayerListNavigator.prototype.disableNavButtons = function() {
	/*
	console.log(this.activePageNo);
	console.log(this.lastPageNo);
	console.log($("[aria-label='First']").parent());

	if(this.activePageNo === 1 || this.lastPageNo === 1)
		$("[aria-label='First']").parent().prop("disabled", true);
	else
		$("[aria-label='First']").parent().prop("disabled", false);

	if(this.activePageNo === 1 || this.lastPageNo === 1)
		$("[aria-label='Previous']").parent().prop("disabled", true);
	else
		$("[aria-label='Previous']").parent().prop("disabled", false);

	for(var pageNo = 1; pageNo < this.lastPageNo + 1; pageNo++) {
		if(this.activePageNo === pageNo)
			$("[aria-label='" + pageNo + "']").parent().prop("disabled", true);
		else
			$("[aria-label='" + pageNo + "']").parent().prop("disabled", false);
	}

	if(this.activePageNo === this.lastPageNo)
		$("[aria-label='Next']").parent().prop("disabled", true);
	else
		$("[aria-label='Next']").parent().prop("disabled", false);

	if(this.activePageNo === this.lastPageNo)
		$("[aria-label='Last']").parent().prop("disabled", true);
	else
		$("[aria-label='Last']").parent().prop("disabled", false);
	*/
}

PlayerListNavigator.prototype.onClickPageNo = function(pageNo) {
	// console.log(pageNo);
	switch(pageNo) {
		case "first":
		this.activePageNo = 1;
		break;

		case "previous":
		this.activePageNo = this.getPrevGroupPage();
		break;

		case "next":
		this.activePageNo = this.getNextGroupPage();
		break;

		case "last":
		this.activePageNo = this.lastPageNo;
		break;

		default:
		this.activePageNo = pageNo;
	}

	// console.log(this.activePageNo);
	this.playerListManager.onClickPageNo(this.activePageNo);
}

PlayerListNavigator.prototype.getPrevGroupPage = function() {
	var savedPageNo = this.activePageNo;
	var savedPageGroupNo = this.getPageGroupNo(savedPageNo);

	var pageNo = this.activePageNo - 10;
	var pageGroupNo = this.getPageGroupNo(pageNo);

	if(pageGroupNo < savedPageGroupNo) {
		var prevGroupLastPageNo = (pageGroupNo + 1) * 10;
		return prevGroupLastPageNo;
	}
	return pageGroupNo * 10 + 1;
}

PlayerListNavigator.prototype.getNextGroupPage = function() {
	var savedPageNo = this.activePageNo;
	var savedPageGroupNo = this.getPageGroupNo(savedPageNo);

	var pageNo = this.activePageNo + 10;
	var pageGroupNo = this.getPageGroupNo(pageNo);

	if(pageGroupNo > savedPageGroupNo) {
		var prevGroupLastPageNo = pageGroupNo * 10 + 1;
		return prevGroupLastPageNo;
	}
	return this.lastPageNo;
}