/**
 * Header component
 *
 * Generated by coz on 8/6/2016,
 * from a template provided by apeman-asset-templates.
 *
 * @class Header
 */
'use strict'

import React, { Component } from 'react'
import defineDebug from 'debug'
import classnames from 'classnames'
import { autobind } from 'breact'
import { get } from 'bwindow'
import HeaderNotice from './header_notice'
import HeaderDropdown from './header_dropdown'
import HeaderTab from './header_tab'
import HeaderLogo from './header_logo'
import HeaderMenu from './header_menu'
import {
  ApContainer, ApHeader
} from 'apeman-react-basic'

import { asConnected, asServed, forSpin, forToggle, ofVerified, combine } from '../../wrappers'

import { SessionFields, StackWays } from 'ore-fol-enums'

const { NEEDS_VERIFY_SESSION } = SessionFields
const { PULL_UP_WAY } = StackWays

const debug = defineDebug('project:fragment:header')

let { triggerResize: resizeHeader } = ApHeader.events
let resizeHeaderWithDelay = () => setTimeout(resizeHeader, 300)

/** @lends Header */
class Header extends Component {
  constructor (props) {
    super(props)
    const s = this
    autobind(s)
  }

  render () {
    const s = this
    const {
      props
    } = s
    let {
      lang,
      signed
    } = props
    return (
      <ApHeader className={ classnames('header', { 'header-reversed': props.reversed }) }>
        <ApContainer relative>
          {
            signed ? (
                <HeaderDropdown lang={ lang }
                                onSignout={ s.handleSignout }
                                signed={ signed }
                                visible={ props.dropdownToggle }
                                onTurn={ s.handleDropdownTurn }
                                onAccount={ s.handleAccount }
                                onAdmin={ s.handleAdmin }
                />
              ) : (
                <HeaderMenu lang={ lang }
                            onSignin={ s.handleSignin }
                            onSignup={ s.handleSignup }
                            menuHidden={ props.menuHidden }
                />
              )
          }
          <HeaderLogo />
          <HeaderTab lang={ lang }
                     onPop={ s.handleTabPop }
                     onSelect={ s.handleTabSelect }
                     selectedTab={ props.selectedTab }
                     tabHidden={ props.tabHidden }
          />
        </ApContainer>
        <HeaderNotice lang={ lang }
                      spinning={ props.noticeSpinning }
                      needsVerify={ props.needsVerify }
                      onVerifySend={ s.handleVerifySend }
                      noticeHidden={ props.noticeHidden }
                      onLayout={ resizeHeaderWithDelay }
        />
      </ApHeader>
    )
  }

  // --------------------
  // Life Cycle
  // --------------------
  componentWillReceiveProps (nextProps) {
    const s = this
    const { props } = s
    let { signed } = props
    let { signed: nextSigned } = nextProps
    let signedChanged = signed !== nextSigned
    if (signedChanged) {
      resizeHeaderWithDelay()
    }
  }

  // --------------------
  // Handlers
  // --------------------

  handleTabPop () {
    const s = this
    const { popAllViews } = s.service('viewService')
    const { props } = s
    let { mainStackName } = props
    popAllViews(mainStackName)
  }

  handleTabSelect ({ tab }) {
    const s = this
    const { showSpin } = s.service('spinService')
    showSpin('root-spin')
  }

  handleDropdownTurn (flg) {
    const s = this
    let duplicate = s.props.dropdownToggle === flg
    if (duplicate) {
      return
    }
    return s.applyToggleTurn({ dropdownToggle: flg })
  }

  handleSignout () {
    const s = this
    const { props } = s
    s.pushViewToModal('SignSignout', {}).then(() =>
      s.applyToggleTurn({ dropdownToggle: false })
    )
  }

  handleSignin () {
    const s = this
    s.pushViewToModal('SignSignin')
  }

  handleSignup () {
    const s = this
    s.pushViewToModal('SignSignup')
  }

  handleAccount () {
    const s = this
    s.pushViewToModal('AccountDetail')
  }

  handleAdmin () {
    const s = this
    const location = get('location')
    const { urlForAdmins } = s.service('urlService')
    location.href = urlForAdmins()
  }

  handleVerifySend () {
    const s = this
    const { l } = s
    const { infoToast } = s.service('toastService')
    s.applySpinWhile({
      noticeSpinning: () =>
        s.sendVerify()
    }).then(() => {
      infoToast(l('toasts.VERIFY_EMAIL_SENT'))
    })
  }

  // --------------------
  // Custom Methods
  // --------------------

  pushViewToModal (viewName, params) {
    const s = this
    const { props } = s
    const { pushView } = s.service('viewService')
    let { modalStackName } = props
    return pushView(modalStackName, viewName, params, {
      way: PULL_UP_WAY
    })
  }
}

export default combine(
  forSpin(),
  forToggle(),
  ofVerified(),
  asServed(),
  asConnected(
    (state, { signed, srvc }) => {
      const { getLang } = srvc.localeService
      const { getSession } = srvc.sessionService
      return {
        lang: getLang(),
        needsVerify: !!signed && getSession(NEEDS_VERIFY_SESSION)
      }
    }
  )
)(Header)