import { Component, Input } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-list-paginate',
  templateUrl: './list-paginate.component.html',
  styleUrls: ['./list-paginate.component.styl']
})
export class ListPaginateComponent {
  @Input()
  page: number;

  @Input()
  pages: number;

  constructor(private router: Router) { }

  public get pageNums(): number[] {
    // This function calculates the buttons for the pagination so that the
    // current page number is always in the center unless it is near the beginning
    // or the end.
    const starti = Math.min(Math.max(this.page - 2, 1), this.pages - 4);
    return [...Array(5)].map((p, i) => starti + i);
  }

  public navigate(num: number): void {
    // This function navigates to a page number that is clamped
    this.router.navigate(['/list'], { queryParams: {
      page: Math.min(Math.max(num, 1), this.pages),
    } });
  }
}