import { Utility } from '../../core/utility';
import './navbar.sass';


export const LANGUAGE_SELECT_UTIL_SELECTOR = '[uw-language-select]';
const LANGUAGE_SELECT_INITIALIZED_CLASS = 'language-select--initialized';


@Utility({
  selector: LANGUAGE_SELECT_UTIL_SELECTOR,
})
export class LanguageSelectUtil {
  _element;
  checkbox;
  
  constructor(element) {
    if (!element) {
      throw new Error('Language Select utility needs to be passed an element!');
    }

    if (element.classList.contains(LANGUAGE_SELECT_INITIALIZED_CLASS)) {
      return false;
    }

    this._element = element;
    this.checkbox = element.querySelector('#lang-checkbox');

    window.addEventListener('click', event => this.close(event));

    element.classList.add(LANGUAGE_SELECT_INITIALIZED_CLASS);
  }

  close(event) {
    if (!this._element.contains(event.target) && window.document.contains(event.target)) {
      this.checkbox.checked = false;
    }
  }

  destroy() {
    // TODO
  }

}


export const NavbarUtils = [
  LanguageSelectUtil,
];
