import React from 'react'
import ReactDOM from 'react-dom'
import Header from './Header'
import Footer from './Footer'
if (typeof window !== 'undefined') {
  /* eslint-disable global-require */
  require('../../static/style')
  // Expose to iframe
  window.react = React
  window['react-dom'] = ReactDOM
}

export default class Layout extends React.Component {
  static contextTypes = {
    router: React.PropTypes.object.isRequired
  }
  componentDidMount () {
    if (typeof window.ga !== 'undefined') {
      this.context.router.listen(loc => {
        window.ga('send', 'pageview', loc.pathname + loc.search)
      })
    }

    const nprogressHiddenStyle = document.getElementById('nprogress-style')
    if (nprogressHiddenStyle) {
      this.timer = setTimeout(() => {
        nprogressHiddenStyle.parentNode.removeChild(nprogressHiddenStyle)
      }, 0)
    }
  }

  componentWillUnmount () {
    clearTimeout(this.timer)
  }
  render () {
    const { children, ...restProps } = this.props
    return (
      <div className='page-wrapper'>
        <Header {...restProps} />
        {children}
        <Footer {...restProps} />
      </div>
    )
  }
}