client/src/components/NoteInput.js
author ymh <ymh.work@gmail.com>
Wed, 31 May 2017 18:08:22 +0200
changeset 8 6f572b6b6be3
parent 5 5c91bfa8fcde
child 12 48ddaa42b810
permissions -rw-r--r--
try to make tests work again
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
1
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     1
import React, {Component} from 'react';
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     2
8
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
     3
import { Form, FormGroup, Button } from 'react-bootstrap';
2
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
     4
1
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     5
import PropTypes from 'prop-types';
5
5c91bfa8fcde Introduce SlateJS.
Alexandre Segura <mex.zktk@gmail.com>
parents: 2
diff changeset
     6
import SlateEditor from './SlateEditor';
1
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     7
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     8
class NoteInput extends Component {
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
     9
  constructor(props) {
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    10
    super(props);
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    11
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    12
    this.state = {value: ''};
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    13
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    14
    this.onAddNoteClick = this.onAddNoteClick.bind(this);
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    15
    this.handleChange = this.handleChange.bind(this);
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    16
  }
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    17
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    18
  handleChange(event) {
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    19
    this.setState({value : event.target.value});
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    20
  }
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    21
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    22
  onAddNoteClick(event) {
8
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    23
    //const text = this.refs.editor.asPlain();
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    24
    if(this.state.value && this.state.value.length > 0) {
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    25
      this.props.addNote(this.state.value);
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    26
      this.refs.editor.clear();
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    27
    }
1
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    28
  }
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    29
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    30
  render() {
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    31
    return (
2
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
    32
      <Form>
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
    33
        <FormGroup>
8
6f572b6b6be3 try to make tests work again
ymh <ymh.work@gmail.com>
parents: 5
diff changeset
    34
          <SlateEditor ref="editor" onChange={this.handleChange} />
2
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
    35
        </FormGroup>
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
    36
        <Button type="button" onClick={this.onAddNoteClick}>Add Note</Button>
b52921a63e77 add scss + bootstrap
ymh <ymh.work@gmail.com>
parents: 1
diff changeset
    37
      </Form>
1
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    38
    );
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    39
  }
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    40
}
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    41
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    42
NoteInput.propTypes = {
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    43
  addNote: PropTypes.func.isRequired
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    44
};
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    45
431977d7c9a6 add first react application skeleton
ymh <ymh.work@gmail.com>
parents:
diff changeset
    46
export default NoteInput;