Noteから外部Linkを開くときにBrowserを使う

browser/main/Components/MarkdownPreview.jsx

@@ -0,0 +1,43 @@
+var React = require('react')
+
+var Markdown = require('../Mixins/Markdown')
+var ExternalLink = require('../Mixins/ExternalLink')
+
+module.exports = React.createClass({
+  mixins: [Markdown, ExternalLink],
+  propTypes: {
+    className: React.PropTypes.string,
+    content: React.PropTypes.string
+  },
+  componentDidMount: function () {
+    this.addListener()
+  },
+  componentDidUpdate: function () {
+    this.addListener()
+  },
+  componentWillUnmount: function () {
+    this.removeListener()
+  },
+  componentWillUpdate: function () {
+    this.removeListener()
+  },
+  addListener: function () {
+    var anchors = React.findDOMNode(this).querySelectorAll('a')
+
+    for (var i = 0; i < anchors.length; i++) {
+      anchors[i].addEventListener('click', this.openExternal)
+    }
+  },
+  removeListener: function () {
+    var anchors = React.findDOMNode(this).querySelectorAll('a')
+
+    for (var i = 0; i < anchors.length; i++) {
+      anchors[i].removeEventListener('click', this.openExternal)
+    }
+  },
+  render: function () {
+    return (
+      <div className={'MarkdownPreview' + (this.props.className != null ? ' ' + this.props.className : '')} dangerouslySetInnerHTML={{__html: ' ' + this.markdown(this.props.content)}}/>
+    )
+  }
+})

browser/main/Components/NoteForm.jsx

@@ -10,6 +10,7 @@ var Markdown = require('../Mixins/Markdown')
 var PlanetStore = require('../Stores/PlanetStore')
 
 var CodeEditor = require('./CodeEditor')
+var MarkdownPreview = require('./MarkdownPreview')
 
 var getOptions = function (input, callback) {
   Hq.searchTag(input)
@@ -33,7 +34,7 @@ var EDIT_MODE = 0
 var PREVIEW_MODE = 1
 
 module.exports = React.createClass({
-  mixins: [LinkedState, ReactRouter.State, Markdown],
+  mixins: [LinkedState, Markdown],
   propTypes: {
     planet: React.PropTypes.object,
     close: React.PropTypes.func,
@@ -108,7 +109,7 @@ module.exports = React.createClass({
     ) : (
       <div className='form-group relative'>
         <div className='previewMode'>Preview mode</div>
-        <div className='marked' dangerouslySetInnerHTML={{__html: ' ' + this.markdown(this.state.note.content)}}></div>
+        <MarkdownPreview className='marked' content={this.state.note.content}/>
       </div>
     )
 

browser/main/Components/PlanetArticleDetail.jsx

@@ -7,13 +7,13 @@ var CodeEditModal = require('../Components/CodeEditModal')
 var CodeDeleteModal = require('../Components/CodeDeleteModal')
 var NoteEditModal = require('../Components/NoteEditModal')
 var NoteDeleteModal = require('../Components/NoteDeleteModal')
+var MarkdownPreview = require('../Components/MarkdownPreview')
 
 var Modal = require('../Mixins/Modal')
 var ForceUpdate = require('../Mixins/ForceUpdate')
-var Markdown = require('../Mixins/Markdown')
 
 module.exports = React.createClass({
-  mixins: [ForceUpdate(60000), Markdown, Modal],
+  mixins: [ForceUpdate(60000), Modal],
   propTypes: {
     article: React.PropTypes.object,
     showOnlyWithTag: React.PropTypes.func,
@@ -91,7 +91,7 @@ module.exports = React.createClass({
         </div>
         <div className='viewer-body'>
           <div className='tags'><i className='fa fa-tags'/>{tags}</div>
-          <div className='content' dangerouslySetInnerHTML={{__html: ' ' + this.markdown(article.content)}}></div>
+          <MarkdownPreview className='content' content={article.content}/>
         </div>
       </div>
     )