Merge pull request #143 from pierotofy/domainvalues

Added support for enum types on task options

app/static/app/js/Console.jsx

@@ -15,7 +15,7 @@ class Console extends React.Component {
 
     if (typeof props.children === "string"){
       this.state.lines = props.children.split('\n');
-      if (this.props.onAddLines) this.props.onAddLines(this.state.lines);
+      if (props.onAddLines) props.onAddLines(this.state.lines);
     }
 
     this.autoscroll = props.autoscroll === true;

app/static/app/js/components/ProcessingNodeOption.jsx

@@ -16,7 +16,10 @@ class ProcessingNodeOption extends React.Component {
       React.PropTypes.bool
     ]),
     type: React.PropTypes.string,
-    domain: React.PropTypes.string,
+    domain: React.PropTypes.oneOfType([
+      React.PropTypes.string,
+      React.PropTypes.array
+    ]),
     help: React.PropTypes.string,
   };
 
@@ -30,6 +33,8 @@ class ProcessingNodeOption extends React.Component {
     this.resetToDefault = this.resetToDefault.bind(this);
     this.handleInputChange = this.handleInputChange.bind(this);
     this.handleCheckboxChange = this.handleCheckboxChange.bind(this);
+    this.handleSelectChange = this.handleSelectChange.bind(this);
+    this.isEnumType = this.isEnumType.bind(this);
   }
 
   getValue(){
@@ -49,13 +54,38 @@ class ProcessingNodeOption extends React.Component {
     this.setState({value: e.target.value});
   }
 
+  handleSelectChange(e){
+    this.setState({value: this.state.value !== this.props.defaultValue ? e.target.value : ""});
+  }
+
   handleCheckboxChange(e){
     this.setState({value: this.state.value === "" ? true : ""});
   }
 
+  isEnumType(){
+    return this.props.type === 'enum' && Array.isArray(this.props.domain);
+  }
+
   render() {
     let inputControl = "";
     if (this.props.type !== 'bool'){
+      if (this.isEnumType()){
+        // Enum
+        let selectValue = this.state.value !== "" ? 
+                          this.state.value : 
+                          this.props.defaultValue; 
+        inputControl = (
+            <select
+              className="form-control"
+              value={selectValue}
+              onChange={this.handleSelectChange}>
+                {this.props.domain.map(val => 
+                  <option value={val} key={val}>{val}</option>
+                )}
+            </select>
+          );
+      }else{
+        // String, numbers, etc.
         inputControl = (
             <input type="text" 
               className="form-control"
@@ -63,7 +93,9 @@ class ProcessingNodeOption extends React.Component {
               value={this.state.value}
               onChange={this.handleInputChange} />
           );
+      }
     }else{
+      // Boolean
       inputControl = (
           <div className="checkbox">
             <label>
@@ -77,7 +109,7 @@ class ProcessingNodeOption extends React.Component {
 
     return (
       <div className="processing-node-option form-inline form-group form-horizontal" ref={this.setTooltips}>
-        <label>{this.props.name} {(this.props.domain ? `(${this.props.domain})` : "")}</label><br/>
+        <label>{this.props.name} {(!this.isEnumType() && this.props.domain ? `(${this.props.domain})` : "")}</label><br/>
         {inputControl}
         <button type="submit" className="btn glyphicon glyphicon-info-sign btn-info" data-toggle="tooltip" data-placement="top" title={this.props.help} onClick={e => e.preventDefault()}></button>
         <button type="submit" className="btn glyphicon glyphicon glyphicon-repeat btn-default" data-toggle="tooltip" data-placement="top" title="Reset to default" onClick={this.resetToDefault}></button>

app/static/app/js/css/ProcessingNodeOption.scss

@@ -11,4 +11,8 @@
         margin-left: 0;
         margin-right: 0;
     }
+
+    select.form-control{
+        min-width: 204px;
+    }
 }