service-website/src/components/SentimentAnalysis.js

   1 import React, {Component} from "react";
   2 import SearchTermsInput from "./SearchTermsInput";
   3 import {Map} from "immutable";
   4
   5 class SentimentAnalysis extends Component {
   6     constructor(props, context) {
   7         super(props, context);
   8         this.state = {
   9             terms: new Map(),
  10             nextTermId: 0,
  11         };
  12         this.handleSubmit = this.handleSubmit.bind(this);
  13         this.handleTermChange = this.handleTermChange.bind(this);
  14         this.handleAddTerm = this.handleAddTerm.bind(this);
  15         this.handleRemoveTerm = this.handleRemoveTerm.bind(this);
  16         this.addEmptyTerm = this.addEmptyTerm.bind(this);
  17     }
  18
  19     componentDidMount() {
  20         const terms = this.state.terms;
  21         if (terms.length === 0) {
  22             this.addEmptyTerm();
  23         }
  24     }
  25
  26     handleSubmit(event) {
  27         event.preventDefault();
  28         const target = event.target;
  29         console.log(target);
  30         const terms = this.state.terms;
  31         terms.forEach((term) => {
  32             console.log(term);
  33         });
  34     }
  35
  36     handleTermChange(id, value) {
  37         const terms = this.state.terms;
  38         this.setState({
  39             terms: terms.set(id, value),
  40         });
  41     }
  42
  43     handleAddTerm(event) {
  44         this.addEmptyTerm();
  45     }
  46
  47     handleRemoveTerm(id) {
  48         const terms = this.state.terms;
  49         this.setState({
  50             terms: terms.delete(id),
  51         });
  52     }
  53
  54     addEmptyTerm() {
  55         const terms = this.state.terms;
  56         const termId = this.state.nextTermId;
  57         this.setState({
  58             terms: terms.set(termId, ''),
  59             nextTermId: termId + 1,
  60         });
  61     }
  62
  63     render() {
  64         return (
  65             <div className="sentiment-analysis">
  66                 <form onSubmit={this.handleSubmit}>
  67                     <label>Search Terms</label>
  68                     <SearchTermsInput terms={this.state.terms}
  69                                       onTermChange={this.handleTermChange}
  70                                       onAddTerm={this.handleAddTerm}
  71                                       onRemoveTerm={this.handleRemoveTerm}/>
  72                     <input type="submit" value="Submit"/>
  73                 </form>
  74             </div>
  75         );
  76     }
  77 }
  78
  79 SentimentAnalysis.propTypes = {};
  80
  81 export default SentimentAnalysis;