import {Component, OnInit, EventEmitter} from '@angular/core';
import {ResourcesRetrieveService} from '../services/resources-retrieve.service';
import * as moment from 'moment';

@Component({
  selector: 'app-resources',
  templateUrl: './resources.component.html',
  styleUrls: ['./resources.component.css']
})
export class ResourcesComponent implements OnInit {
  public DocumentsAll: Array<any>;
  public Documents: Array<any>;
  public DocumentCount: number;

  public initialSlice: number = 10;
  public pageNum: number = 0;

  public sliceCurrent: number;
  public sliceRewind: number;
  public sliceForward: number;


  constructor(private resourcesRetrieveService: ResourcesRetrieveService) {

  }

  async ngOnInit() {
    await this.getDocuments();
    this.checkDocumentCount();

    if (this.DocumentCount > 10){
     this.Documents = this.DocumentsAll.slice(0, this.initialSlice);
     this.pageNum = 0;
     this.sliceCurrent = 10;
    }
  }

  public async getDocuments() {
    await this.resourcesRetrieveService.httpGetResources().then((res) =>{
      this.DocumentsAll = res['data']['resources'];
    }).catch((err) =>{
      console.log(err);
    })
  }

  public checkDocumentCount(){
    this.DocumentCount = this.DocumentsAll.length;
  }

  public navToFirstPage(){
    this.Documents = this.DocumentsAll.slice(0, this.initialSlice);
    this.sliceCurrent = 10;
    this.pageNum = 0;
  }

  public navToPreviousPage(){
    if (this.pageNum) {
      this.sliceRewind = this.sliceCurrent - 20;
      this.sliceCurrent = this.sliceCurrent - 10;
      this.Documents = this.DocumentsAll.slice(this.sliceRewind, this.sliceCurrent);
      console.log(this.sliceRewind + " and " + this.sliceCurrent );
      this.sliceCurrent = this.sliceRewind + 10;
      console.log(this.sliceCurrent)
      this.pageNum--;
    }
    else{
      this.Documents = this.DocumentsAll.slice(0, this.initialSlice);
      this.pageNum = 0;
    }
  }

  public navToNextPage(){
    if (this.sliceCurrent <= this.DocumentCount) {
    this.sliceForward = this.sliceCurrent + 10;
    this.Documents = this.DocumentsAll.slice(this.sliceCurrent, this.sliceForward);
    console.log(this.sliceCurrent + " and " + this.sliceForward );
    this.sliceCurrent = this.sliceForward;
    console.log(this.sliceCurrent);
    this.pageNum++;
  }
  else{
    this.Documents = this.DocumentsAll.slice(this.sliceCurrent, this.sliceForward);
    }
  }

  public navToLastPage(){
   this.Documents = this.DocumentsAll.slice(this.DocumentCount - 10,this.DocumentCount)
    //console.log((this.DocumentCount - 10 )+ " and " + Math.round(10* this.DocumentCount) / 10))
  }


  public filterTable() {
    let input, filter, table, tr, td, i;
    input = document.getElementById("search-input");
    filter = input.value.toUpperCase();
    table = document.getElementById("document-table");
    tr = table.getElementsByTagName("tr");

    for (i = 0; i < tr.length; i++) {
      td = tr[i].getElementsByTagName("td")[0];
      if (td) {
        if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
          tr[i].style.display = "";
        } else {
          tr[i].style.display = "none";
        }
      }
    }
  }

  public reformatDateString(dateTimeString: string): string {
    return moment(dateTimeString, 'YYYY-MM-DD HH:mm:ss').format('DD/MM/YY');
  }
}