client/src/components/SlateEditor.js
changeset 79 772b73e31069
parent 74 043477fd5c5c
child 80 b3a02ea6d097
equal deleted inserted replaced
78:49c5ea36d0a4 79:772b73e31069
    75     });
    75     });
    76 
    76 
    77     plugins.push(annotationPlugin);
    77     plugins.push(annotationPlugin);
    78 
    78 
    79     this.state = {
    79     this.state = {
    80       state: Plain.deserialize(''),
    80       state: props.note ? Raw.deserialize(props.note.raw) : Plain.deserialize(''),
    81       startedAt: null,
    81       startedAt: null,
    82       finishedAt: null,
    82       finishedAt: null,
    83       currentSelectionText: '',
    83       currentSelectionText: '',
    84       hoveringMenu: null,
    84       hoveringMenu: null,
    85       isPortalOpen: false,
    85       isPortalOpen: false,
   418         {this.renderMarkButton('underlined', 'format_underlined')}
   418         {this.renderMarkButton('underlined', 'format_underlined')}
   419         {this.renderMarkButton('category', 'label')}
   419         {this.renderMarkButton('category', 'label')}
   420 
   420 
   421         {this.renderBlockButton('numbered-list', 'format_list_numbered')}
   421         {this.renderBlockButton('numbered-list', 'format_list_numbered')}
   422         {this.renderBlockButton('bulleted-list', 'format_list_bulleted')}
   422         {this.renderBlockButton('bulleted-list', 'format_list_bulleted')}
   423         <div>
   423 
   424           <div className="checkbox">
   424         {this.renderToolbarButtons()}
   425             <label>
       
   426               <input type="checkbox" checked={this.props.isChecked} onChange={this.onCheckboxChange} /> <kbd>Enter</kbd> = add note
       
   427             </label>
       
   428           </div>
       
   429           <Button bsStyle="primary" disabled={this.props.isButtonDisabled} onClick={this.onButtonClick}>Add note</Button>
       
   430         </div>
       
   431       </div>
   425       </div>
   432     )
   426     )
       
   427   }
       
   428 
       
   429   renderToolbarButtons = () => {
       
   430     if (!this.props.withButtons) {
       
   431       return (
       
   432         <div />
       
   433       )
       
   434     }
       
   435 
       
   436     return (
       
   437       <div>
       
   438         <div className="checkbox">
       
   439           <label>
       
   440             <input type="checkbox" checked={this.props.isChecked} onChange={this.onCheckboxChange} /> <kbd>Enter</kbd> = add note
       
   441           </label>
       
   442         </div>
       
   443         <Button bsStyle="primary" disabled={this.props.isButtonDisabled} onClick={this.onButtonClick}>Add note</Button>
       
   444       </div>
       
   445     );
   433   }
   446   }
   434 
   447 
   435   /**
   448   /**
   436    * Render a mark-toggling toolbar button.
   449    * Render a mark-toggling toolbar button.
   437    *
   450    *