var React = require('react')
var Markdown = require('markdown.jsx')
var Icon = require('icon.jsx')
var Link = require('react-router').Link
var Clock = require('clock.jsx')
var UserID = require('userID.jsx')

module.exports = React.createClass({
  getInitialState: function(){
    return { moment: false }
  },
  componentDidMount: function(){
    require.ensure(['moment'],_ => {
      if(this.isMounted()) this.setState({ moment: require('moment') })
    })
  },
  postLink: function(){
    if(this.props.post.op){
      if(this.props.board){
        return '/@'+this.props.post.op+'/'+this.props.board+'/'+this.props.post.hash
      } else {
        return '/@'+this.props.post.op+'/post/'+this.props.post.hash
      }
    } else {
      return '/post/'+this.props.post.hash
    }
  },
  render: function(){
    return <div key={this.props.post.title} className="post">
      <div className="content">
        <h5>{this.props.post.title}</h5><hr/>
        <Markdown source={this.props.post.text} /><hr/>
        <div className="icons">
          <UserID id={this.props.post.op} api={this.props.api} ></UserID>
          <Clock className="not-first" date={this.props.post.date} />
          <Icon name="comments" className="not-first" /> <Link className="nounderline" to={this.postLink()}>View</Link>
        </div>
      </div>
    </div>
  }
})