var React = require('react')
var Icon = require('icon.jsx')

module.exports = React.createClass({
  getInitialState: function(){
    return { moment: false, text: '...' }
  },
  componentDidMount: function(){
    require.ensure(['moment'],_ => {
      if(this.isMounted()){
        var moment = require('moment')
        this.setState({
          moment: moment,
          interval: setInterval(this.upDate,60*1000),
          text: moment.unix(this.props.date).fromNow()
        })
      }
    })
  },
  upDate: function(){
    if(this.isMounted())
      this.setState({ text: this.state.moment.unix(this.props.date).fromNow() })
    else
      clearInterval(this.state.interval)
  },
  getDate: function(){
    if(this.state.moment)
      return this.state.text
    else
      return <Icon name="refresh" className="fa-spin" />
  },
  render: function(){
    return <div className="clock"><Icon name="clock-o" className={this.props.className} /> {this.getDate()}</div>
  }
})