import { Controller } from "@hotwired/stimulus"

function show (element) {
  element.classList.add('block');
  element.classList.remove('hidden');
}

function  hide (element) {
  element.classList.remove('block');
  element.classList.add('hidden');
}

export default class extends Controller {
  static targets = [ 'mobileMenu', 'iconMobileMenuOpen', 'iconMobileMenuClose' ];

  connect() {
    this.mobileMenuTarget.classList.add('hidden');
  }

  toggleMobileNav() {
    if (this.mobileMenuTarget.classList.contains('hidden')) {
      show(this.mobileMenuTarget);
      show(this.iconMobileMenuCloseTarget);
      hide(this.iconMobileMenuOpenTarget);
    } else {
      hide(this.mobileMenuTarget);
      hide(this.iconMobileMenuCloseTarget);
      show(this.iconMobileMenuOpenTarget);
    }
  }
}