import React from 'react'

import Input from './input'

class Details extends React.Component{
  render(){
    if(!this.props.display) return ""

    let ret = []
    let keys = Object.keys(this.props.task)
    for(let i in Object.keys(this.props.task)){
      let key = keys[i]
      console.log(key, this.props.task[key])
      ret.push(<span key={'lable.' + key} class="task-key">{key}</span>)
      switch (key) {
        case "lable":
          ret.push(<Input
                      key='input.lable'
                      type='text'
                      value={this.props.task[key]}
                      id="lable"
                      update={this.props.update} />)
          break;
        case "progress":
          ret.push(<Input
                      key='input.progress'
                      type='range'
                      value={this.props.task[key]}
                      range="0:1:0.05"
                      id="progress"
                      update={this.props.update} />)
          break;
        default:
          ret.push(<span key={'input.'+key} class="task-value">{this.props.task[key]}</span>)
      }
    }
    ret.push(<Input key="input.submit" type='submit' lable="close" submit={this.props.close} />)
    return <div class="task-proppertys">{ret}</div>
  }
}

export default Details