client/src/components/NoteInput.js
changeset 125 c653f49fabfb
parent 80 b3a02ea6d097
child 138 a1fb2ced3049
equal deleted inserted replaced
124:c77570164050 125:c653f49fabfb
     1 import React, { Component } from 'react';
     1 import React, { Component } from 'react';
     2 import { connect } from 'react-redux';
       
     3 import { bindActionCreators } from 'redux';
       
     4 import { Form, FormControl } from 'react-bootstrap';
     2 import { Form, FormControl } from 'react-bootstrap';
     5 
     3 
     6 import PropTypes from 'prop-types';
     4 import PropTypes from 'prop-types';
     7 import SlateEditor from './SlateEditor';
     5 import SlateEditor from './SlateEditor';
     8 import * as notesActions from '../actions/notesActions';
       
     9 import * as userActions from '../actions/userActions';
       
    10 import { now } from '../utils';
     6 import { now } from '../utils';
    11 
     7 
    12 
     8 
    13 class NoteInput extends Component {
     9 class NoteInput extends Component {
    14 
    10 
    32     const raw = this.refs.editor.asRaw();
    28     const raw = this.refs.editor.asRaw();
    33     const html = this.refs.editor.asHtml();
    29     const html = this.refs.editor.asHtml();
    34     const categories = this.refs.editor.asCategories();
    30     const categories = this.refs.editor.asCategories();
    35     const marginComment = this.marginComment.value;
    31     const marginComment = this.marginComment.value;
    36 
    32 
    37     this.props.notesActions.addNote(this.props.session, {
    33     this.props.addNote(this.props.session, {
    38       plain: plain,
    34       plain: plain,
    39       raw: raw,
    35       raw: raw,
    40       html: html,
    36       html: html,
    41       startedAt: this.state.startedAt,
    37       startedAt: this.state.startedAt,
    42       finishedAt: now(),
    38       finishedAt: now(),
    47     this.refs.editor.clear();
    43     this.refs.editor.clear();
    48     setTimeout(() => this.refs.editor.focus(), 250);
    44     setTimeout(() => this.refs.editor.focus(), 250);
    49   }
    45   }
    50 
    46 
    51   onCheckboxChange = (e) => {
    47   onCheckboxChange = (e) => {
    52     this.props.userActions.setAutoSubmit(e.target.checked);
    48     this.props.setAutoSubmit(e.target.checked);
    53   }
    49   }
    54 
    50 
    55   componentDidMount() {
    51   componentDidMount() {
    56     const text = this.refs.editor.asPlain();
    52     const text = this.refs.editor.asPlain();
    57     this.setState({ buttonDisabled: text.length === 0 });
    53     this.setState({ buttonDisabled: text.length === 0 });
    82       </Form>
    78       </Form>
    83     );
    79     );
    84   }
    80   }
    85 }
    81 }
    86 
    82 
    87 function mapStateToProps(state, props) {
       
    88   return {
       
    89     autoSubmit: state.autoSubmit
       
    90   };
       
    91 }
       
    92 
       
    93 function mapDispatchToProps(dispatch) {
       
    94   return {
       
    95     notesActions: bindActionCreators(notesActions, dispatch),
       
    96     userActions: bindActionCreators(userActions, dispatch),
       
    97   }
       
    98 }
       
    99 
       
   100 NoteInput.propTypes = {
    83 NoteInput.propTypes = {
   101   addNote: PropTypes.func.isRequired
    84   addNote: PropTypes.func.isRequired
   102 };
    85 };
   103 
    86 
   104 export default connect(mapStateToProps, mapDispatchToProps)(NoteInput);
    87 export default NoteInput;