const m = require('mithril')
const popper = require('@popperjs/core')
const tempus = require('@eonasdan/tempus-dominus')

const Input = {
  oninit: function(vnode) {
    this.tempus = null
    this.subscription = null
  },

  onremove: function(vnode) {
    if (!this.tempus) return
    this.tempus.dispose()
    this.tempus = null
  },

  getInput: function(vnode) {
    switch (vnode.attrs.utility) {
      case 'datetime':
        return m('input', {
          type: 'text',
          oncreate: (e) => {
            this.tempus = new tempus.TempusDominus(e.dom, {
              defaultDate: vnode.attrs.form[vnode.attrs.formKey],
              viewDate: vnode.attrs.form[vnode.attrs.formKey],
              localization: {
                locale: 'is',
                startOfTheWeek: 0,
                hourCycle: 'h23',
                dateFormats: {
                  LTS: 'H:mm:ss',
                  LT: 'H:mm',
                  L: 'dd.MM.yyyy',
                  LL: 'd [de] MMMM [de] yyyy',
                  LLL: 'd [de] MMMM [de] yyyy H:mm',
                  LLLL: 'dddd, d [de] MMMM [de] yyyy H:mm',
                },
              },
            })
            this.subscription = this.tempus.subscribe(tempus.Namespace.events.change, (e) => {
              console.log(e);
            });
          },
        })
      default:
        return m('input', {
          type: vnode.attrs.type || 'text',
          value: vnode.attrs.form[vnode.attrs.formKey],
          oninput: (e) => { vnode.attrs.form[vnode.attrs.formKey] = e.currentTarget.value },
        })
    }
  },

  view: function(vnode) {
    let input = m('input', {
      type: vnode.attrs.type || 'text',
      value: vnode.attrs.form[vnode.attrs.formKey],
      oninput: (e) => { vnode.attrs.form[vnode.attrs.formKey] = e.currentTarget.value },
    })

    if (vnode.attrs.utility === 'datetime') {

    }

    return [
      m('label', vnode.attrs.label),
      this.getInput(vnode),
    ]
  },
}

module.exports = Input