import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { faSlidersH } from '@fortawesome/free-solid-svg-icons';

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss'],
})
export class NavbarComponent implements OnInit {

  @Output() search_change = new EventEmitter();

  icon_settings = faSlidersH;
  filters_is_visible: boolean = false;
  search: string = '';


  constructor() {}

  ngOnInit(): void {}

  showFilters() {
    const filters: any = document.querySelector('.discover__filters');
    const carousel: any = document.querySelector('.carousel_size');
    if (!this.filters_is_visible) {
      console.log('Run show filters');
      filters.classList.add('discover__filters-show');
      this.filters_is_visible = true;
      carousel.classList.add('carousel_size_show');
      console.log('listo');
    } else {
      console.log('Run hide filters');
      filters.classList.remove('discover__filters-show');
      this.filters_is_visible = false;
      carousel.classList.remove('carousel_size_show');
    }
  }

  handlePatternSearch = ($event: string) => {
    this.search_change.emit($event);
  }

}