updated to go-ipfs 0.4

lib/boards-api.js

@@ -9,6 +9,7 @@ Needs to be browserified to work in the browser
 // EventEmitter used to communicate with clients
 var EventEmitter = require('wolfy87-eventemitter')
 var asyncjs = require('async')
+var semver = require('semver')
 
 function asObj (str, done) {
   if (str.toString) str = str.toString()
@@ -64,6 +65,12 @@ function BoardsAPI (ipfs) {
   this.resolvingIPNS = {}
   this.ee = new EventEmitter()
   if (window && window.localStorage !== undefined) {
+    this.ee.on('init', e => {
+      if (e) {
+        console.log('init failed')
+        this.init_error = e
+      }
+    })
     // Use localStorage to store the IPNS cache
     var stored = window.localStorage.getItem('ipfs-boards-user-cache')
     try {
@@ -77,6 +84,17 @@ function BoardsAPI (ipfs) {
   }
 }
 
+BoardsAPI.prototype.createProfile = function (profile) {
+  console.log('creating profile')
+  this.ipfs.add(new Buffer(JSON.stringify(profile)), (err, res) => {
+    console.log('added profile to IPFS:', err, res.Hash)
+    var profilepath = '/ipfs/' + res.Hash
+    this.ipfs.files.mv([profilepath, '/ipns/local/profile.json'], (err, res) => {
+      console.log('mv', err, res)
+    })
+  })
+}
+
 BoardsAPI.prototype.backupCache = function () {
   if (window && window.localStorage !== undefined) {
     // Use localStorage to store the IPNS cache
@@ -528,9 +546,19 @@ BoardsAPI.prototype.init = function (done) {
             } else {
               this.ipfs_version = res.Version
               console.log('IPFS Version is', res.Version)
-              this.ee.emit('init', undefined)
+              if (semver.satisfies(this.ipfs_version, '~0.4.0')) {
-              this.isInit = true
+                console.log('IPFS version is supported')
-              if (done && done.apply) done(null)
+                this.ee.emit('init', undefined)
+                this.isInit = true
+                delete this.init_error
+                if (done && done.apply) done(null)
+              } else {
+                var e = { Message: 'IPFS Version not supported. This app supports go-ipfs 0.4.x' }
+                if (done && done.apply) done(e)
+                console.log('Error:', e.Message)
+                this.ee.emit('error', e)
+                this.ee.emit('init', e)
+              }
             }
           })
         }

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "description": "decentralized discussion board",
   "scripts": {
-    "serve": "webpack-dev-server --progress --hot --devtool eval-source --no-info",
+    "serve": "webpack-dev-server --progress --no-info --hot --watch --devtool eval-source",
     "build": "webpack --progress"
   },
   "repository": {
@@ -24,7 +24,7 @@
     "babel-plugin-transform-runtime": "~6.3.13",
     "babel-preset-es2015": "~6.3.13",
     "babel-preset-react": "~6.3.13",
-    "babel-runtime": "^6.3.13",
+    "babel-runtime": "~5.8.23",
     "css-loader": "~0.23.0",
     "eslint": "~1.10.3",
     "eslint-config-standard": "^4.4.0",
@@ -37,7 +37,7 @@
     "html-loader": "^0.4.0",
     "html-webpack-plugin": "~1.7.0",
     "https-browserify": "0.0.1",
-    "ipfs-api": "2.9.13",
+    "ipfs-api": "github:ipfs/js-ipfs-api#ba85b3b",
     "json-loader": "~0.5.4",
     "lodash.sortedindex": "~3.1.1",
     "markdown-loader": "^0.1.7",
@@ -46,6 +46,7 @@
     "react-dom": "~0.14.3",
     "react-markdown": "~1.1.1",
     "react-router": "~1.0.2",
+    "semver": "^5.1.0",
     "stream-http": "~2.0.2",
     "style-loader": "~0.13.0",
     "webpack": "~1.12.9",

webapp/pages/getipfs.jsx

@@ -4,23 +4,35 @@ var Icon = require('icon.jsx')
 
 module.exports = React.createClass({
   getInitialState: function () {
-    return { connected: false, error: false, long: false }
+    return {}
+  },
+  componentWillReceiveProps: function (props) {
+    if (props.api) {
+      this.checkStatus(props.api)
+    }
   },
   componentDidMount: function () {
-    var boards = this.props.api
+    this.checkStatus(this.props.api)
+  },
+  checkStatus: function (boards) {
     if (boards) {
       if (!this.isMounted()) return
       if (boards.isInit) {
         this.setState({ connected: true })
       } else {
-        boards.getEventEmitter().on('init', err => {
+        if (boards.init_error) {
-          if (!this.isMounted()) return
+          this.setState({ error: boards.init_error })
-          if (err) {
+        } else {
-            this.setState({ error: true })
+          boards.getEventEmitter().on('init', error => {
-          } else {
+            if (!this.isMounted()) return
-            this.setState({ connected: true })
+            if (error) {
-          }
+              this.setState({ error })
-        })
+            } else {
+              this.setState({ connected: true })
+              clearTimeout(this.timer)
+            }
+          })
+        }
       }
     } else this.startTimer()
   },
@@ -29,8 +41,11 @@ module.exports = React.createClass({
   },
   startTimer: function () {
     this.timer = setTimeout(_ => {
-      console.log('Connection to go-ipfs has timed out (probably due to CORS)')
+      if (this.isMounted()) {
-      if (this.isMounted()) this.setState({ long: true })
+        console.log('Connection to go-ipfs has timed out (probably due to CORS)')
+        this.setState({ long: true })
+        this.checkStatus()
+      }
     }, 5000)
   },
   render: function () {
@@ -40,6 +55,10 @@ module.exports = React.createClass({
       <div className="">
         <h1><Icon name="ban"/> Connection to IPFS not available</h1>
         <h4 className="light">Sorry, but at the moment an external application is needed to try the Prototype</h4>
+        <hr/>
+        <h5>Error Message</h5>
+        <p>{this.state.error.Message || this.state.error || 'connection to go-ipfs failed'}</p>
+        <hr/>
         <p>You don't have an IPFS node running at <code>{opt.addr}:{opt.port}</code> or it is not reachable.
         The IPFS Boards prototype requires a full IPFS node. Please start one by following the
         <a href="https://github.com/ipfs/go-ipfs"><code>go-ipfs</code> documentation.</a></p>

webapp/pages/profile.jsx

@@ -41,8 +41,8 @@ module.exports = function (boardsAPI) {
         if (!this.isMounted()) return true
         if (err) {
           this.setState({
-            name: <Icon name="ban" />,
+            name: <span><Icon name="ban" /> Error</span>,
-            description: err
+            error: err
           })
         } else {
           this.setState({ name: res.name, description: res.description })
@@ -56,12 +56,23 @@ module.exports = function (boardsAPI) {
         this.setState({ init: true })
       }
     },
+    newProfile: function () {
+      var boards = this.state.api
+      boards.createProfile({
+        name: 'Default Name',
+        description: 'Default Profile Description'
+      })
+    },
     linkToEditor: function () {
       var uid = this.props.params.userid
       if (uid === 'me' && this.state.id) uid = this.state.id
       if (uid === this.state.id) {
-        return <div>
+        return <div className="your-profile">
           <h6>This is your profile</h6>
+          {this.state.error ? <div>
+            <b>Oops</b>. Looks like your profile is not valid
+            <button className="new-profile button button-primary" onClick={this.newProfile}>New Profile</button>
+          </div> : <div></div>}
           <hr/>
         </div>
       }
@@ -74,7 +85,7 @@ module.exports = function (boardsAPI) {
         return (<div className="profile">
           {this.linkToEditor()}
           <h1>{this.state.name}</h1>
-          <Markdown source={this.state.description} skipHtml={true} />
+          <Markdown source={this.state.erro ? this.state.error : this.state.description} skipHtml={true} />
           <hr/>
           <div className="light breaker">@{uid}</div>
           {this.state.boards.map(n => {

webapp/style.css

@@ -166,6 +166,15 @@ a:hover {
   margin-right: 1rem;
 }
 
+.your-profile {
+  text-align: center
+}
+
+.new-profile {
+  display: block;
+  margin: 3rem auto;
+}
+
 @media (min-width: 400px) {
   /* larger than mobile */
   .settings .buttons {

webpack.config.js

@@ -61,7 +61,7 @@ var config = {
   },
   externals: {
     net: '{}',
-    fs: '{}',
+    fs: '{ lstat: function(){} }',
     tls: '{}',
     console: '{}',
     'require-dir': '{}'