'use strict'

import $ from 'jquery'

import Events from '../_events'
import CookieUI from './_ui.cookie'

const FlyoutUI = (($) => {
  const W = window
  const D = document
  const $Body = $('body')

  const NAME = 'FlyoutUI'
  const COOKIE = `${NAME}-hide`
  const TIMEOUT = 2000

  class FlyoutUI {
    static init () {
      console.log(`${NAME}: init`)
      const ui = this

      ui.$modal = $(`.flyout-${NAME}`)

      if (!ui.$modal.length) {
        return false
      }

      const $close = ui.$modal.find(`.flyout-${NAME}__close`)
      ui.$modal.data(NAME, ui)

      if ($close.length) {
        $close.on('click', () => {
          ui.hide()
        })
      }

      const hide = CookieUI.get(COOKIE)

      if (!$close.length || !hide || hide !== 'true') {
        setTimeout(() => {
          ui.show()
        }, TIMEOUT)
      }
    }

    static show (callback) {
      const ui = this

      ui.$modal.addClass(`flyout-${NAME}__active`)
    }

    static hide (callback) {
      const ui = this

      CookieUI.set(COOKIE, 'true', 1)
      ui.$modal.removeClass(`flyout-${NAME}__active`)
    }
  }

  $(W).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
    FlyoutUI.init()
  })

  W.FlyoutUI = FlyoutUI

  return FlyoutUI
})($)

export default FlyoutUI