fixed some bugs in five token editors

1. fixed the typo of question mark in puncuation editor 2. added type determine statement in 5 token editors 3. added determine statement of the values in length array
KimQ0126 · Jul 25, 2018 · e21c753 · e21c753
1 parent d829542
commit e21c753
Show file tree

Hide file tree

Showing 11 changed files with 51 additions and 19 deletions.
diff --git a/build/asset-manifest.json b/build/asset-manifest.json
@@ -1,6 +1,6 @@
 {
   "main.css": "static/css/main.35bdd23a.css",
   "main.css.map": "static/css/main.35bdd23a.css.map",
-  "main.js": "static/js/main.cde7e942.js",
-  "main.js.map": "static/js/main.cde7e942.js.map"
+  "main.js": "static/js/main.bb996afb.js",
+  "main.js.map": "static/js/main.bb996afb.js.map"
 }
diff --git a/build/index.html b/build/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="./manifest.json"><link rel="shortcut icon" href="./favicon.ico"><title>React App</title><link href="./static/css/main.35bdd23a.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"/><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/><div id="root"></div><script type="text/javascript" src="./static/js/main.cde7e942.js"></script></body></html>
+<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="./manifest.json"><link rel="shortcut icon" href="./favicon.ico"><title>React App</title><link href="./static/css/main.35bdd23a.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"/><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/><div id="root"></div><script type="text/javascript" src="./static/js/main.bb996afb.js"></script></body></html>
diff --git a/build/service-worker.js b/build/service-worker.js
diff --git a/build/static/js/main.cde7e942.js → build/static/js/main.bb996afb.js b/build/static/js/main.cde7e942.js → build/static/js/main.bb996afb.js
diff --git a/build/static/js/main.bb996afb.js.map b/build/static/js/main.bb996afb.js.map
diff --git a/build/static/js/main.cde7e942.js.map b/build/static/js/main.cde7e942.js.map
diff --git a/src/components/LineBreakEditor.js b/src/components/LineBreakEditor.js
@@ -67,12 +67,14 @@ class LineBreakEditor extends Component {
   }
 
   componentWillMount() {
-    if (this.props.is_new === 0) {
+    if (this.props.token_data.type === 'linebreak' && this.props.is_new === 0) {
       this.setState({
         token_data: this.props.token_data,
         output: this.props.token_data.is_in_output,
         required: this.props.token_data.is_required,
         length: this.props.token_data.length[0]
+          ? this.props.token_data.length[0]
+          : ''
       });
     } else {
       this.resetState();

diff --git a/src/components/NumberEditor.js b/src/components/NumberEditor.js
@@ -86,15 +86,21 @@ class NumberEditor extends Component {
   }
 
   componentWillMount() {
-    if (this.props.is_new === 0) {
+    if (this.props.token_data.type === 'number' && this.props.is_new === 0) {
       this.setState({
         token_data: this.props.token_data,
         output: this.props.token_data.is_in_output,
         required: this.props.token_data.is_required,
         numbers: this.props.token_data.numbers.join(' '),
-        length1: this.props.token_data.length[0],
-        length2: this.props.token_data.length[1],
-        length3: this.props.token_data.length[2],
+        length1: this.props.token_data.length[0]
+          ? this.props.token_data.length[0]
+          : '',
+        length2: this.props.token_data.length[1]
+          ? this.props.token_data.length[1]
+          : '',
+        length3: this.props.token_data.length[2]
+          ? this.props.token_data.length[2]
+          : '',
         max: this.props.token_data.maximum,
         min: this.props.token_data.minimum
       });
@@ -126,12 +132,18 @@ class NumberEditor extends Component {
       } else {
         if (this.state.length1 !== '') {
           temp['length'][0] = this.state.length1;
+        } else {
+          temp['length'][0] = '';
         }
         if (this.state.length2 !== '') {
           temp['length'][1] = this.state.length2;
+        } else {
+          temp['length'][1] = '';
         }
         if (this.state.length3 !== '') {
           temp['length'][2] = this.state.length3;
+        } else {
+          temp['length'][2] = '';
         }
       }
       temp['type'] = 'number';

diff --git a/src/components/PuncEditor.js b/src/components/PuncEditor.js
@@ -122,7 +122,10 @@ class PuncEditor extends Component {
   }
 
   componentWillMount() {
-    if (this.props.is_new === 0) {
+    if (
+      this.props.token_data.type === 'punctuation' &&
+      this.props.is_new === 0
+    ) {
       this.setState({
         token_data: this.props.token_data,
         output: this.props.token_data.is_in_output,
@@ -184,7 +187,7 @@ class PuncEditor extends Component {
     if (this.state.punctuation_comma) allPunct.push(',');
     if (this.state.punctuation_period) allPunct.push('.');
     if (this.state.punctuation_semicomma) allPunct.push(';');
-    if (this.state.punctuation_qmark) allPunct.push(')');
+    if (this.state.punctuation_qmark) allPunct.push('?');
     if (this.state.punctuation_tilde) allPunct.push('~');
     if (this.state.punctuation_colon) allPunct.push(':');
     if (this.state.punctuation_2quote) allPunct.push('"');

diff --git a/src/components/ShapeEditor.js b/src/components/ShapeEditor.js
@@ -121,7 +121,7 @@ class ShapeEditor extends Component {
   }
 
   componentWillMount() {
-    if (this.props.is_new === 0) {
+    if (this.props.token_data.type === 'shape' && this.props.is_new === 0) {
       this.setState({
         token_data: this.props.token_data,
         output: this.props.token_data.is_in_output,

diff --git a/src/components/WordEditor.js b/src/components/WordEditor.js
@@ -150,7 +150,7 @@ class WordEditor extends Component {
   }
 
   componentWillMount() {
-    if (this.props.is_new === 0) {
+    if (this.props.token_data.type === 'word' && this.props.is_new === 0) {
       this.setState({
         token_data: this.props.token_data,
         output: this.props.token_data.is_in_output,
@@ -238,9 +238,15 @@ class WordEditor extends Component {
           this.props.token_data.capitalization.indexOf('mixed') > -1
             ? true
             : false,
-        length1: this.props.token_data.length[0],
-        length2: this.props.token_data.length[1],
-        length3: this.props.token_data.length[2],
+        length1: this.props.token_data.length[0]
+          ? this.props.token_data.length[0]
+          : '',
+        length2: this.props.token_data.length[1]
+          ? this.props.token_data.length[1]
+          : '',
+        length3: this.props.token_data.length[2]
+          ? this.props.token_data.length[2]
+          : '',
         prefix: this.props.token_data.prefix,
         suffix: this.props.token_data.suffix,
         notinvocabulary:
@@ -282,12 +288,18 @@ class WordEditor extends Component {
       } else {
         if (this.state.length1 !== '') {
           temp['length'][0] = this.state.length1;
+        } else {
+          temp['length'][0] = '';
         }
         if (this.state.length2 !== '') {
           temp['length'][1] = this.state.length2;
+        } else {
+          temp['length'][1] = '';
         }
         if (this.state.length3 !== '') {
           temp['length'][2] = this.state.length3;
+        } else {
+          temp['length'][2] = '';
         }
       }
       temp['type'] = 'word';
@@ -600,20 +612,23 @@ class WordEditor extends Component {
                 value={this.state.length1}
                 className={classes.textField}
                 margin="normal"
+                onChange={this.handleValChange('length1')}
               />
               <TextField
                 label="Length 2"
                 id="margin-normal"
                 value={this.state.length2}
                 className={classes.textField}
                 margin="normal"
+                onChange={this.handleValChange('length2')}
               />
               <TextField
                 label="Length 3"
                 id="margin-normal"
                 value={this.state.length3}
                 className={classes.textField}
                 margin="normal"
+                onChange={this.handleValChange('length3')}
               />
             </FormGroup>
           </FormControl>