import {AfterViewInit, Component, OnInit} from '@angular/core';
import {VesselsService} from '../../service/vessels.service';
import {Vessels} from '../../model/vessels';

declare var $: any;

@Component({
  selector: 'app-list-vessel',
  templateUrl: './list-vessel.component.html',
  styleUrls: ['./list-vessel.component.scss']
})
export class ListVesselComponent implements OnInit {
  vessels: Vessels;

  constructor(private vesselsService: VesselsService) {
  }

  ngOnInit(): void {
    this.vesselsService.currentVessels.subscribe(vessels => {
      setTimeout(() =>
        this.vessels = vessels
      );
    });

    $(document).ready(() => {
      $('#myInput').on('keyup', function(): void {
        const value = $(this).val().toLowerCase();
        $('#list-tab a').filter(function(): void {
          $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
        });
      });
    });
  }

  // ngAfterViewInit(): void {
  //   this.vesselsService.currentVessels.subscribe(vessels => {
  //     setTimeout(() =>
  //       this.vessels = vessels
  //     );
  //   });
  // }

}