pass boolean for track changes and toggle in editor

app/components/BookBuilder/Division.jsx

@@ -43,7 +43,8 @@ export class Division extends React.Component {
       status: 'unpublished',
       author: '',
       source: '',
-      comments: {}
+      comments: {},
+      trackChanges: false
     }
 
     add(book, newChapter)

app/components/SimpleEditor/SimpleEditor.jsx

@@ -18,6 +18,11 @@ export default class SimpleEditor extends React.Component {
   constructor (props) {
     super(props)
     this.save = this.save.bind(this)
+    this.toggleTrackChangesStatus = this.toggleTrackChangesStatus.bind(this)
+
+    this.state = {
+      trackChanges: props.fragment.trackChanges
+    }
   }
 
   createSession () {
@@ -42,6 +47,15 @@ export default class SimpleEditor extends React.Component {
     }
   }
 
+  toggleTrackChangesStatus () {
+    const { fragment, update } = this.props
+    fragment.trackChanges = !fragment.trackChanges
+    update(fragment)
+    this.setState({
+      trackChanges: fragment.trackChanges
+    })
+  }
+
   save (source, changes, callback) {
     const { onSave } = this.props
     const config = this.state.config
@@ -101,6 +115,7 @@ export default class SimpleEditor extends React.Component {
 
   render () {
     const { canEdit } = this.props
+
     let viewMode = !canEdit
     ? (
       <Alert bsStyle='warning' className='view-mode'>
@@ -109,9 +124,25 @@ export default class SimpleEditor extends React.Component {
     )
     : null
 
+    let trackChangeStatus = 'Off'
+    let trackChangesIconClass = 'fa-eye-slash'
+
+    if (this.state.trackChanges === true) {
+      trackChangeStatus = 'On'
+      trackChangesIconClass = 'fa-eye'
+    }
+
+    let trackChanges =
+      <Alert bsStyle='warning' className='track-changes'>
+        <span>
+          <i className={'fa ' + trackChangesIconClass} onClick={this.toggleTrackChangesStatus} />
+          Track Changes is {trackChangeStatus}
+        </span>
+      </Alert>
+
     return (
       <div className='editor-wrapper'>
-        {viewMode}
+        {viewMode} {trackChanges}
       </div>
     )
   }
@@ -123,6 +154,7 @@ SimpleEditor.propTypes = {
   fragment: React.PropTypes.object.isRequired,
   history: React.PropTypes.object.isRequired,
   onSave: React.PropTypes.func.isRequired,
+  update: React.PropTypes.func.isRequired,
   updateComments: React.PropTypes.func.isRequired,
   user: React.PropTypes.object.isRequired
 }

app/components/SimpleEditor/SimpleEditor.scss

@@ -38,6 +38,27 @@ $white: #fff;
       top: 10px;
     }
   }
+
+  .track-changes {
+    height: 44px;
+    position: fixed;
+    right: 0;
+    text-align: center;
+    width: 20%;
+    z-index: 9999;
+
+    span {
+      font-size: 14px;
+      position: relative;
+      top: 10px;
+
+      i {
+        font-size: 20px;
+        padding-right: 10px;
+        cursor: pointer;
+      }
+    }
+  }
 }
 
 .sc-prose-editor {

app/components/SimpleEditor/SimpleEditorWrapper.jsx

@@ -12,6 +12,7 @@ export class SimpleEditorWrapper extends React.Component {
     super(props)
 
     this.save = this.save.bind(this)
+    this.update = this.update.bind(this)
     this.updateComments = this.updateComments.bind(this)
 
     this._checkRights = this._checkRights.bind(this)
@@ -65,9 +66,10 @@ export class SimpleEditorWrapper extends React.Component {
     updateFragment(book, fragment)
   }
 
-  // componentDidUpdate () {
-  //   this._checkRights()
-  // }
+  componentDidUpdate () {
+    console.log('did update wrapper')
+    // this._checkRights()
+  }
 
   _checkRights () {
     const { fragment, user } = this.props
@@ -99,10 +101,17 @@ export class SimpleEditorWrapper extends React.Component {
     updateFragment(book, fragment)
   }
 
+  update (newChapter) {
+    const { book } = this.props
+    const { updateFragment } = this.props.actions
+    updateFragment(book, newChapter)
+  }
+
   render () {
+    console.log('render wrapper')
     const { book, fragment, history, user } = this.props
-    // console.log(fragment)
 
+    // TODO -- merge update and updateComments
     return (
       <SimpleEditor
         book={book}
@@ -110,6 +119,7 @@ export class SimpleEditorWrapper extends React.Component {
         fragment={fragment}
         history={history}
         onSave={this.save}
+        update={this.update}
         updateComments={this.updateComments}
         user={user}
       />
@@ -122,7 +132,8 @@ SimpleEditorWrapper.propTypes = {
   book: React.PropTypes.object.isRequired,
   fragment: React.PropTypes.object.isRequired,
   history: React.PropTypes.object.isRequired,
-  user: React.PropTypes.object.isRequired
+  user: React.PropTypes.object.isRequired,
+  update: React.PropTypes.func.isRequired
 }
 
 function mapStateToProps (state, ownProps) {