{% extends 'base.html' %}

{% block styles %}
  {{ super() }}
  {% include 'datatable-styles.html' %}
{% endblock styles %}

{% block content %}
  {{ super() }}
  {% from 'args-table.html' import args_table %}
  {% from 'caption.html' import caption %}
  {% from 'content-grid.html' import content_grid %}
  {% from 'metadata.html' import list_metadata %}
  {% from 'raster-plot-img.html' import raster_plot_img %}
  {% from 'wide-table.html' import wide_table %}

  <h2 class="section-header">Results</h2>
  {{ accordion_section(
    'Water Yield',
    content_grid([
      (content_grid([
        (caption(raster_group_caption, pre_caption=True), 100),
        (raster_plot_img(wyield_img_src, 'Estimated water yield'), 100),
        (raster_plot_img(precip_aet_img_src,
                         'Precipitation and Actual Evapotranspiration'), 100),
        (caption(wyield_raster_caption, definition_list=True), 100),
      ]), 100),
    ])
  ) }}

  {% set watershed_results_inner = [ 
    (content_grid([
      (wide_table(watershed_table | safe, font_size_px=16), 100),
      (caption(watershed_table_caption, definition_list=True), 100),
      (caption(table_columns_note), 100)
    ]), 100)
  ] %}

  {% if watershed_map_params %}
    {% set _ = watershed_results_inner.append(
      (content_grid([
        ('<div id="w_wyield_vol"></div>', 100),
        (caption(watershed_map_params['caption'], watershed_map_params['sources']), 100)
      ]), 100),
    ) %}
  {% endif %}
  {% if valuation_results %}
    {% set _ = watershed_results_inner.extend([
      (content_grid([
        ('<div id="hp_energy"></div>', 100),
        (caption(valuation_results['energy_caption'], valuation_results['source_list']), 100)
      ]), 50),
      (content_grid([
        ('<div id="hp_val"></div>', 100),
        (caption(valuation_results['val_caption'], valuation_results['source_list']), 100)
      ]), 50),
    ]) %}
  {% endif %}

  {{ accordion_section(
    'Results Aggregated by Watershed',
    content_grid(watershed_results_inner)
  ) }}

  {% if subwatershed_results %}
    {{ accordion_section(
      'Results Aggregated by Subwatershed',
      content_grid([
        (content_grid([
          (wide_table(subwatershed_results['table'] | safe, font_size_px=16), 100),
          (caption(subwatershed_results['table_caption'],
                   definition_list=True), 100),
          (caption(table_columns_note), 100)
        ]), 100),
        (content_grid([
          ('<div id="sw_wyield_vol"></div>', 100),
          (caption(subwatershed_results['map_caption'],
                   subwatershed_results['map_sources']), 100)
        ]), 100),
      ])
    ) }}
  {% endif %}

  {{ accordion_section(
    'Output Raster Stats',
    content_grid([
      (stats_table_note, 100),
      (wide_table(
        output_raster_stats_table | safe,
        font_size_px=16
      ), 100)
    ])
  )}}

  <h2 class="section-header">Inputs</h2>
  {{ accordion_section(
    'Arguments',
    args_table(args_dict),
  )}}

  {{ accordion_section(
    'Land Use/Land Cover Input',
    content_grid([
      (caption(raster_group_caption, pre_caption=True), 100),
      (raster_plot_img(lulc_img_src, 'LULC Input'), 60),
      (wide_table(lulc_legend_html | safe), 40),
      (caption(lulc_caption, definition_list=True), 100),
    ])
  )}}

  {{ accordion_section(
    'Other Raster Inputs',
    content_grid([
      (caption(raster_group_caption, pre_caption=True), 100),
      (raster_plot_img(inputs_img_src, 'Raster Inputs'), 100),
      (caption(inputs_caption, definition_list=True), 100)
    ])
  ) }}

  {{ accordion_section(
    'Input Raster Stats',
    content_grid([
      (stats_table_note, 100),
      (wide_table(
        input_raster_stats_table | safe,
        font_size_px=16
      ), 100)
    ])
  )}}

  <h2 class="section-header">Metadata</h2>
  {{
    accordion_section(
      'Output Filenames and Descriptions',
      list_metadata(model_spec_outputs),
      expanded=False
    )
  }}

{% endblock content %}

{% from 'vegalite-plot.html' import embed_vega %}
{% block scripts %}
  {{ super() }}
  {% include 'datatable-js.html' %}
  {% include "vega-dependencies.html" %}
  {% include 'vega-embed-js.html' %}
  {% set chart_spec_id_list = [] %}
  {% if watershed_map_params %}
    {% set chart_spec_id_list = chart_spec_id_list + [
      (watershed_map_params['json'], 'w_wyield_vol')] %}
  {% endif %}
  {% if subwatershed_results %}
    {% set chart_spec_id_list = chart_spec_id_list + [
      (subwatershed_results['map_json'], 'sw_wyield_vol')] %}
  {% endif %}
  {% if valuation_results %}
    {% set chart_spec_id_list = chart_spec_id_list + [
      (valuation_results['energy_json'], 'hp_energy'),
      (valuation_results['val_json'], 'hp_val')]
    %}
  {% endif %}
  {{ embed_vega(chart_spec_id_list) }}
{% endblock scripts %}