Lab React interactive

gistfile1.js

export default class PressureInteractive extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      properties: {
        temperature: 200
      }
      outputs: {
        pressure: 0
      }
    };
  }
  
  onStart() {
    this.refs.lab.script.start();
  }
  
  onStop() {
    this.refs.lab.script.stop();
  }
  
  onPressureChange(e) {
    // (This won't work, we would need to use React helpers)
    this.setState({properties: {pressure: e.target.value}});
  }
  
  render() {
    return (
      <div className="interactive">
        <LabFrameTop about="..."/>
        // this.props.interactiveDef - Lab JSON
        <LabComponent ref="lab" interactiveDef={this.props.interactiveDef} outputs={this.state.outputs} properties={this.state.properties}/>
        <div>Pressure value: {this.state.outputs.pressure}</div>
        <div>Temperature<input type="text" value={this.state.properties.pressure} onChange={this.onPressureChange}/></div>
        <LabFrameBottom onStart={this.onStart} onStop={this.onStop}/>
      </div>
    );
  }
}