--- a/client/src/components/SlateEditor.js Wed Jun 21 14:12:45 2017 +0200
+++ b/client/src/components/SlateEditor.js Thu Jun 22 10:47:10 2017 +0200
@@ -1,6 +1,7 @@
import { Editor, Plain, Raw } from 'slate'
import React from 'react'
import Portal from 'react-portal'
+import { Button } from 'react-bootstrap'
import moment from 'moment'
import Immutable from 'immutable'
import HtmlSerializer from '../HtmlSerializer'
@@ -83,6 +84,7 @@
hoveringMenu: null,
isPortalOpen: false,
categories: Immutable.List([]),
+ isCheckboxChecked: false,
};
}
@@ -197,12 +199,11 @@
onKeyDown = (e, data, state) => {
- if (data.key === 'enter') {
- if (typeof this.props.onEnterKeyDown === 'function') {
- e.preventDefault();
- this.props.onEnterKeyDown();
- return state;
- }
+ if (data.key === 'enter' && this.props.isChecked && typeof this.props.onEnterKeyDown === 'function') {
+ e.preventDefault();
+ this.props.onEnterKeyDown();
+
+ return state;
}
if (!data.isMod) return
@@ -376,6 +377,18 @@
});
}
+ onButtonClick = () => {
+ if (typeof this.props.onButtonClick === 'function') {
+ this.props.onButtonClick();
+ }
+ }
+
+ onCheckboxChange = (e) => {
+ if (typeof this.props.onCheckboxChange === 'function') {
+ this.props.onCheckboxChange(e);
+ }
+ }
+
/**
* Render.
*
@@ -407,6 +420,14 @@
{this.renderBlockButton('numbered-list', 'format_list_numbered')}
{this.renderBlockButton('bulleted-list', 'format_list_bulleted')}
+ <div>
+ <div className="checkbox">
+ <label>
+ <input type="checkbox" checked={this.props.isChecked} onChange={this.onCheckboxChange} /> <kbd>Enter</kbd> = add note
+ </label>
+ </div>
+ <Button bsStyle="primary" disabled={this.props.isButtonDisabled} onClick={this.onButtonClick}>Add note</Button>
+ </div>
</div>
)
}