<% javascript 'admin.js' %>

<h1>
  <%= @phase.template.title %>
</h1>

<div class="content">
  <div class="tabbed-area">
    <!-- render navigation tabs for the template-->
    <%= render partial: "templates/admin_nav_tabs", locals: {template: @phase.template, active: @phase.id, edit: @edit, current: @current} %>

    <div class="tab-panels project-tabs-body" role="tabpanel">
      <!-- phase main container -->
      <div id="phase-<%= @phase.id %>-panel" class="tab-panel active project-tabs-body"
           aria-hidden="false" aria-labelledby="phase-<%= @phase.id %>-tab">

        <div class="accordion">
          <h2><%= _('Phase details')%><span class="fa fa-minus" aria-hidden="true"> </span></h2>
          
          <!--phase details -->
          <div class="phase_details">
            <div class="phase_details_body">

              <!-- display phase details-->
              <div id="show_phase_div">
                <%= render partial: "phases/show_phase", locals: {phase: @phase}%>
              </div>
              <% if @phase.modifiable && @edit %>
                <div id="edit_phase_div" style="display: none">
                  <%= render partial: "phases/edit_phase", locals: {phase: @phase}%>
                </div>
              <% end %>
            </div>
          </div>
          
          <!-- sections, questions and guidance details-->
          <% @sections.order("number ASC").each do |section| %>
            <h2><%= section.title %><span class="fa fa-plus" aria-hidden="true"></span></h2>
            <div>
              <% if @edit && section.modifiable %>
                <%= render partial: 'sections/edit_section', locals: {section: section, edit: @edit, phase: @phase} %>
              <% else %>
                <%= render partial: 'sections/show_section', locals: {section: section}%>
              <% end %>
            </div>
          <% end %>
          
          <% if @edit || @phase.template.customization_of.present? %>
            <h2><%= _('Add section') %><span class="fa fa-plus" aria-hidden="true"></span></h2>
            <!-- add section block -->
            <div id="add_section_block_div" style="display: none">
              <%= render partial: 'sections/add_section', locals: {phase: @phase} %>
            </div>
          <% end %>
        </div>
      </div>
    </div>
  </div>
</div>


<!-- TODO: Tinymce is having a JS error on load ... need to fix it -->
<!--<%= tinymce :content_css => asset_path('application.css') %>-->