{% extends "base.html" %}

{% macro block_open(name, title) %}

{% endmacro %}

{% macro tagList(name, tags, style) %}
<h5>{{name}}</h5> 
<ul class="tags {{ styles(style) }}">
{% for tag in tags %}
    <li>{{tag}}</li>
{% endfor %}
</ul>
{% endmacro %}


{% macro render_metadata(metadata) %}
<h5>Metadata</h5> 
<ul class="tags">
{% for key,value in metadata.items() %}
    <li><var>{{key}}</var> : "{{value}}"</li>
{% endfor %}
</ul>
{% endmacro %}

{% macro translate(list) %}
  {% set tt = list.get_with_context(context)%}
  <ul class="{{ styles('translate-list') }}">
  {% for t in tt %}
  <li><span class="{{ styles('trans-code') }}">{{ t.code }}</span><span class="{{ styles('trans-text') }}">{{ t.value_as_text(context) }}</span></li>
  {% endfor %}
  </ul>
{% endmacro %}

{% macro render_item(item) %}
<div class="survey-item">
  <h3><var class="{{ styles('key') }} ">{{item['key']}}</var></h3>
  {% if item['metadata'] %}
    {{ render_metadata(item['metadata']) }}
  {% endif %}
  {% if item['follows'] %}
    {{ tagList('Follows', item['follows'], 'follows') }}
    </div>
  {% endif %} {# follows #}
  {% if item['condition'] %}
    <div class="condition">
        <h5>Condition</h5>
        {{ render_expression(item['condition']) }}
    </div>
  {% endif %} {# condition #}
  
  {% if item.is_group() %}
    <div class="items">
    {% for sub in item.items %}
        {{ render_item(sub) }}
    {% endfor %}
    </div>
    <div class="selection-method">
    <h5>Selection method</h5>
    {{ render_expression(item.selection) }}
    </div>
  {% else %}
    {% if item.type %}
    <div class="item-type">Type : {{ item.type }}</div>
    {% endif %}
    {% if item.components %}
    <div class="item-components">
    <h5>Components</h5>
    {{ render_item_components(item.components) }}
    </div>
    {% endif %}
    <div class="item-validations">
    <h5>Validations</h5>
    {{ render_validations(item.validations) }}
    </div>
  {% endif %} {# is_group #}
</div>
{% endmacro %}

{% macro render_item_components(components) %}

{% set comp_type= components.get_type() %}

<div class="{{ styles('component-'  ~ comp_type ) }}">
   {% if components.key %}
     <var class="{{ styles('key') }}">{{components.key}}</var>
   {% endif %}
   
   {% if components.is_group() %}
        {% set rr=components.items_by_roles() %}
        {% for role, comps in rr.items() %}
            <div class="{{ styles('components') }} role-{{ role }}">
            <div>
            <span class="{{ styles('role') }}">{{ role }}</span>
            {% if components.order %}(<span class="order">order {{ render_expression(components.order) }}</span>){% endif %}
            </div>
            {% for comp in comps %}
                {{ render_item_components(comp) }}
            {% endfor %}
            </div>
        {% endfor %}  
        
    {% endif %}

    {% if components.is_response() %}
       {% if components.dtype %}
            <div class="{{ styles('component-dtype') }}"><code>{{components.dtype}}</code></div>
       {% endif %}
       {% if components.props %}
        <div class="{{ styles('component-properties') }}">
            <dl>
                {% for name, value in components.props.items() %}
                <dt>{{name}}</dt>
                <dd>{{value}}</dd>
                {% endfor %}
            </dl>
        </div>
        {% endif %}
    {% endif %}

    {% if components.style %} 
        {<dl class="{{ styles('style') }} ">
           {% for key, value in components.style.items() %}
            <dt>{{ key }}</dt><dd> {{ value }}</dd>
           {% endfor %}
        </dl>}
    {% endif %}
    {% if components.content %}
        <div class="component-content">
            {{ translate(components.content) }}
        </div>
    {% endif %}

    {% if components.disabled %}
        <div>
            <h6>Disabled</h6>
        {{ render_expression(components.disabled) }}
        </div> 
    {% endif %}
    
    {% if components.description %}
         <div>
            <h6>Description</h6>
            {{ translate(components.description) }}
        </div>
    {% endif %}
    
    {% if components.displayCondition %}
         <div>
            <h6>displayCondition</h6>
            {{ render_expression(components.displayCondition) }}
        </div>
    {% endif %}
  
   {% if components.properties %}
         <div>
            <h6>Properties</h6>
            <ul class="list-unstyled">
            {% for name, p  in components.properties.items() %}
                <li>{{ name }} {{ render_expression(p) }}</li>
            {% endfor %}
            </ul>
        </div>
   {% endif %}

</div>
{% endmacro %}

{% macro render_validations(validations) %}
{% if validations %}
    <dl class="row">
    {% for v in validations %}
        <dt class="col-2">{{ v['key'] }} <span class="badge badge-danger">{{ v['type'] }}</dt>
        <dd class="col-10">{{ render_expression(v['rule']) }}</dd>
    {% endfor %}
    </dl>
{% endif %}
{% endmacro %}


{% macro render_expression(expr) %}
 {% if expr %}
    {% if expr.is_expression() -%}
      <span class="expr-name">{{ expr.name }}</span>(
      {% for p in expr.params -%}
        <span class="expr-param-item">
        {% set np = expr.param_name(loop.index0) %}
        {% if np %}<span class="expr-param-name">{{np}}</span>={%endif%}    
        <span class="expr-param">{{ render_expression(p) }}</span>
        </span>
        {% if not loop.last %},{% endif %} 
      {% endfor %})
    {% else %} {# is_expression #} 
     {% if expr.is_numeric() %} <span class="expr-scalar-num">{{ expr }}</span>{% else %}<span class="expr-scalar-str">"{{ expr }}"</span>{% endif %}
    {% endif %}  {# is_expression #} 
 {% endif %} {# expr #}
{% endmacro %}

{% set definition = survey.survey_definition %}
  
{% block survey %}
<h1>Survey <em>{{ definition.key }}</em> (<span class="{{ styles('item-version') }}">{{ survey.version_id }}</span>)</h1>
  <dl class="survey-props row">
     <dt class="col-3">name</dt> 
     <dd class="col-9">{{ translate(survey.props.name) }}</dd>
     <dt class="col-3">description</dt>
     <dd class="col-9">{{ translate(survey.props.description)}}</dd>
     {% if "typicalDuration" in survey.props %}
     <dt class="col-3">typicalDuration</dt>
     <dd class="col-9">{{ translate(survey.props.typicalDuration) }}</dd>
     {% endif %}
  </dl>
  {% if survey.metadata %}
    {{ render_metadata(survey.metadata) }}
  {% endif %}
  <div class="survey-definition">
  <h2>Survey Definition</h2>
  {% if survey['published'] %}
    Published on {{ survey['published'].to_time() }}
  {% endif %}
  {% if survey['unpublished'] %}
    Published on {{ survey['unpublished'].to_time() }}
  {% endif %}
  {{ render_item(definition) }}

  {% if survey['prefillRules'] %}
    <h3>Prefill Rules</h3>
    <ul class="list-group">
    {% for rule in survey['prefillRules'] %}
      <li class="list-group-item prefill-rule">
        {{ render_expression(rule) }}
      </li>
    {% endfor %}
    </ul>
  {% endif %}

  {% if survey['contextRules'] %}
    <h3>Context Rules</h3>
    {% if ctx['mode'] %}
      <p>Mode : {{ render_expression(ctx['mode']) }} </p> 
    {% endif %} 
    {% set ctx = survey['contextRules'] %}
    {% if ctx['previousResponses'] %}
    <h4>Previous Responses</h4>
    <ul class="list-group">
    {% for rule in ctx['previousResponses'] %}
      <li class="list-group-item prefill-rule">
        {{ render_expression(rule) }}
      </li>
    {% endfor %}
    </ul>
    {% endif %} 
  {% endif %}
  </div>
{% endblock survey %}