import flatpickr from 'flatpickr';
import { Utility } from '../../core/utility';

const DATEPICKER_UTIL_SELECTOR = 'input[type="date"], input[type="time"], input[type="datetime-local"]';

const DATEPICKER_INITIALIZED_CLASS = 'datepicker--initialized';

const DATEPICKER_CONFIG = {
  'datetime-local': {
    enableTime: true,
    altInput: true,
    altFormat: 'j. F Y, H:i', // maybe interpolate these formats for locale
    dateFormat: 'Y-m-dTH:i',
    time_24hr: true,
  },
  'date': {
    altFormat: 'j. F Y',
    dateFormat: 'Y-m-d',
    altInput: true,
  },
  'time': {
    enableTime: true,
    noCalendar: true,
    altFormat: 'H:i',
    dateFormat: 'H:i',
    altInput: true,
    time_24hr: true,
  },
};

@Utility({
  selector: DATEPICKER_UTIL_SELECTOR,
})
export class Datepicker {

  flatpickrInstance;

  constructor(element) {
    if (!element) {
      throw new Error('Datepicker utility needs to be passed an element!');
    }

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

    const flatpickrConfig = DATEPICKER_CONFIG[element.getAttribute('type')];

    if (!flatpickrConfig) {
      throw new Error('Datepicker utility called on unsupported element!');
    }

    this.flatpickrInstance = flatpickr(element, flatpickrConfig);

    // mark initialized
    element.classList.add(DATEPICKER_INITIALIZED_CLASS);
  }

  destroy() {
    this.flatpickrInstance.destroy();
  }
}