renderStatus()

in src/viz/src/App.js [746:836]

• 91 lines of code
• 16 McCabe index (conditional complexity)

  renderStatus() {
    if (this.state.error) {
      return <div><h2>Thrift service return error message</h2><h3>{this.state.error}</h3></div>;
    }
    if (this.state.meta_task === null) {
      return this.renderLoadingStatus('Loading the scene...');
    }
    if (this.state.loading_solution) {
      return this.renderLoadingStatus('Loading solution...');
    }
    if (!this.state.simulation_requested) {
      const if_actions_on = (button) => (this.state.show_user_input_buttons ? button : "");
      const if_solution_on = (button) => if_actions_on(this.state.meta_task.task.solutions ? button : "");
      const if_has_user_input = (button) => if_actions_on(this.state.has_user_input ? button : "");
      const if_last_input = (button) => ifdev(
        button,
        this.getLastAction() ? button : ""
      );
      const proddev_version = <div>
        {this.renderDescription(true)}
        <div className='load_action_wrapper'>
          {if_actions_on("Load action:")}
          <Button.Group>
            {if_actions_on(if_last_input(<Button onClick={this.onLoadLastInputClick.bind(this)}>Last</Button>))}
            {ifdev(if_solution_on(<Button onClick={this.onLoadSolutionClick.bind(this)}>Solution</Button>))}
            {this.renderTierSolutionButton()}
          </Button.Group>
        </div>
        <Button.Group>
          <Button primary onClick={this.onSimulationRequestClick.bind(this, false, false)}>Go!</Button>
          {ifdev(<Button onClick={this.onSimulationRequestClick.bind(this, false, true)}>Go Dilate!</Button>)}
          {ifdev(if_actions_on(<Button onClick={this.onSimulationRequestClick.bind(this, true, false)}>w/ last</Button>))}
        </Button.Group>
        {this.renderDrawingInstructions()}
      </div>;
      const demo_version = <div>
          {this.renderDescription(true)}
          <Button.Group size="tiny" className='buttonblock'>
            {if_has_user_input(<Button onClick={this.onCleanActions.bind(this)}>Clean actions</Button>)}
            {this.renderTierSolutionButton()}
            <Button primary onClick={this.onSimulationRequestClick.bind(this, false, false)}>Simulate</Button>
          </Button.Group>
          {this.renderDrawingInstructions()}
      </div>;
      return ifproddev(proddev_version, demo_version);
    }
    if (!this.state.task_simulation) {
      return this.renderLoadingStatus('Getting simulation from the server...');
    }
    if (!this.state.task_simulation.sceneList) {
      return <div>
        Empty simulation recieved from the server.<br />
      </div>;
    }
    const tick = this.state.cycle_id % this.state.task_simulation.sceneList.length;
    const fps = Math.floor(this.state.cycle_id * 1000 / (Date.now() - this.state.start_ts));
    const solvedFrame = this.state.task_simulation.solvedStateList[tick]
    const solvedTask = this.state.task_simulation.isSolution
    if (window.phyre_config.mode === 'demo') {
      let demoStatus;
      if (this.state.has_occlusion === "yes") {
        demoStatus =  <span>The action is <b>invalid</b>: it occludes scene bodies.</span>
      } else if (solvedTask) {
          demoStatus = <span>The action <b>solves</b> the task.</span>
      } else {
          demoStatus = <span>The action <b>doesn't solve</b> the task.</span>
      }
      return <div>
        <div className='simulation-result'>
        {demoStatus}
        {" "}Frame: {tick}{ifdev(" Fps: " + fps)}
        </div>
        <Button.Group size="tiny" className='buttonblock'>
          <Button onClick={this.reloadLevel.bind(this)}>Reload level</Button>
        </Button.Group>
        <div className='instructions'>{this.renderDescription(false)}</div>
      </div>;
    }
    return <div>
      {this.renderDescription(false)}
      <div>
      Tick: {tick} Fps: {fps}
      {" "}Solved now: {solvedFrame ? "True" : "False"}
      {" "}<b>(solution={solvedTask ? "yes" : "no"},
      {" "}occlusion={this.state.has_occlusion})</b>
      </div>
      <br />
      <Button onClick={this.reloadLevel.bind(this)}>Reload level</Button>
      {ifdev(<Button onClick={this.saveSolution.bind(this)}>Save solution</Button>)}
    </div>;
  }