var React = require('react') var GetIPFS = require('getipfs.jsx') var Icon = require('icon.jsx') var Link = require('react-router').Link var { Error, Loading, Saving, Success } = require('status-components.jsx') module.exports = function (boardsAPI) { return React.createClass({ getInitialState () { return { } }, componentDidMount () { boardsAPI.use(boards => { boards.init() boards.getEventEmitter().on('init', err => { if (!err && this.isMounted()) { this.init(boards) } }) if (this.isMounted() && boards.isInit) { this.init(boards) } }) }, init (boards) { if (this.state.init) return this.setState({ api: boards, userid: boards.getMyID(), init: true }) if (this.props.params.posthash) this.downloadPost(boards) }, downloadPost (boards) { this.setState({ loading: true }) boards.downloadPost(this.props.params.posthash, (err, hash, date, post) => { if (err) { this.setState({ error: err, loading: false }) } else { console.log(post) this.setState({ loading: false, title: post.title, text: post.text }) } }) }, handleChange (event) { var obj = {} obj[event.target.id] = event.target.value this.setState(obj) }, skip () { this.setState({ loading: false, updating: false, error: false, success: false }) }, refresh () { boardsAPI.use(b => this.downloadPost(b)) }, save () { this.setState({ updating: true }) var post = { text: this.state.text } if (this.state.title && this.state.title.length > 0) { post.title = this.state.title } boardsAPI.use(boards => { boards.createPost(post, this.props.params.boardname, err => { this.setState({ error: err, updating: false }) // Should redirect to new post hash }) }) }, delete () { this.setState({ deleting: true }) boardsAPI.use(boards => { boards.deletePost(this.props.params.posthash, this.props.params.boardname, err => { if (!err) console.log('Post deleted') this.setState({ deleting: false, error: err, success: true }) }) }) }, additionalButtons () { if (this.state.api && this.props.params.posthash) { var url = '/@' + this.state.api.getMyID() + '/' + this.props.params.boardname + '/' + this.props.params.posthash return <span> <button onClick={this.refresh} className="button not-first">Refresh</button> <Link to={url} className="button not-first">View</Link> <button onClick={this.delete} className="button not-first">Delete</button> </span> } else { return <span></span> } }, render () { if (this.state.api) { if (this.state.error) { return <Error error={this.state.error} > <button className="button button-primary center-block" onClick={this.skip}>Continue</button> </Error> } else if (this.state.deleting) { return <Loading title="Deleting Post"> <p>Pressing the Skip button will not abort the Delete operation.</p> <button className="button button-primary center-block" onClick={this.skip}>Skip</button> </Loading> } else if (this.state.loading) { return <Loading title="Downloading Post"> <button className="button button-primary center-block" onClick={this.skip}>Skip</button> </Loading> } else if (this.state.updating) { return <Saving> <p>Pressing the Skip button will not abort the publish operation.</p> <button className="button button-primary center-block" onClick={this.skip}>Skip</button> </Saving> } else if (this.state.success) { return <Success title="Post Deleted"> <p><b>Note:</b> due to a bug in go-ipfs, you may need to wait up to a minute for changes to appear.</p> </Success> } else { return ( <div className="editor"> <h2><Icon name="pencil" className="light" /> {this.props.params.posthash ? ' Edit Post' : ' New Post'} </h2> <p>This App uses IPFS to store your Posts. When you are offline, other users or servers that viewed your text will serve it to others.</p> <p><b>Warning:</b> due to a bug in go-ipfs, it may take up to a minute for your changes to be visibile. Your Post will not appear or appear unchanged during this time.</p> <div> <label htmlFor="title">Title</label> <input className="u-full-width" type="text" id="title" value={this.state.title} onChange={this.handleChange} placeholder="Choose a title" /> </div> <div> <label htmlFor="text">Content</label> <textarea className="u-full-width" id="text" value={this.state.text} onChange={this.handleChange} placeholder="Write your post. Markdown is supported :)" /> </div> <div className="buttons"> <button className="button button-primary" onClick={this.save}>Publish</button> {this.additionalButtons()} </div> </div> ) } } else return <GetIPFS api={this.state.api} /> } }) }