'use babel'
/** @jsx etch.dom */

import etch from 'etch'
import UiComponent from '../ui/component'

import ContextVariableView from './context-variable-view'
import helpers from '../helpers'

export default class ContextVariableListView extends UiComponent {

  render () {
    const {context,services,state,variableContext} = this.props;
    const path = (variableContext.parent) ? variableContext.parent + '.' + variableContext.identifer : variableContext.identifier;
    const variables = variableContext.variables.map((variable,index) => {
      return <ContextVariableView key={variable.identifier + ":" + index} services={services} context={context} variable={variable} parent={path} />
    });

    const labels = variableContext.labels.map((label,index) => {
      return <span className={label.classes}>{label.text}</span>
    });
/*
        console.log(labels.length); //ex. 1
        console.log(JSON.stringify(labels)); //ex. [{"tag":"span","props":{"className":"variable php syntax--php syntax--type"},"children":[{"text":"Locals"}]}]
        console.log(labels); //ex. Array(1)
        console.log(labels[0]); //ex. {tag: "span", props: {…}, children: Array(1)}
        console.log(labels[0]["tag"]); //ex. span
        console.log(labels[0]["props"]); //ex. {className: "variable php syntax--php syntax--type"}
        console.log(labels[0]["props"]["className"]); //ex. variable php syntax--php syntax--type
        console.log(labels[0]["children"]); //ex. Array(1)
        console.log(labels[0]["children"][0]); //ex. {text:"Locals"}
        console.log(labels[0]["children"][0]["text"]); //ex. Locals
        console.log(variables); //ex. Array(5)
        console.log(path); //ex. Locals
*/
        locals_flg = true; //keep Locals opened : true
        locals_variables_flg = true; //keep variables in Locals opened : true
        superglobals_flg = true; //keep Superglobals opened : true
        superglobals_variables_flg = true; //keep variables in Superglobals opened : true
        user_defined_constants_flg = true; //keep User defined constantslocals opened : true
        user_defined_constants_variables_flg = true; //keep variables in User defined constantslocals opened : true

        if ((path=="Locals" && locals_flg)
            || (path=="Locals.undefined" && locals_variables_flg)
            || (path=="Superglobals" && superglobals_flg)
            || (path=="Superglobals.undefined" && superglobals_variables_flg)
            || (path=="User defined constants" && user_defined_constants_flg)
            || (path=="User defined constants.undefined" && user_defined_constants_variables_flg)) {
            return <li className="context-variable-list-view">
                <details open>
                    <summary>
                    {labels}
            </summary>
            <ul>
                    {variables}
            </ul>
            </details>
            </li>
        } else {
            return <li className="context-variable-list-view">
                <details data-name="dataname">
                    <summary>
                    {labels}
            </summary>
            <ul>
                    {variables}
            </ul>
            </details>
            </li>
        }

        return <li className="context-variable-list-view">
          <details data-name="dataname">
            <summary>
              {labels}
            </summary>
            <ul>
            {variables}
            </ul>
          </details>
        </li>
    }

  init ()  {
    super.init()
  }

}