<% # encoding: utf-8 %>
<% institutions = t('survey_b.institutions') %>
<h1><%= @period.title %></h1>
<div>
  <section>
    <div class="o-question">
      <%= form_for :answer, :url => panel_survey_b_front_end_survey_b_index_path(:standalone => true), :html => {:class => 'survey_b clear'} do |f| %>
        <div class="o-question-description">
          <%= @setting.description.gsub("\n", '<br />').html_safe %>
        </div>
        <ol class="o-question-list">
          <li class="question-item institution_check">
            <%= f.label :institution_check, t('survey_b.institution_check_label'), :class => "o-question-title" %>
            <%= f.fields_for :institution_check do |cf| %>
              <% institutions.each do |key, institution_name| %>
                <div style="display: inline; margin-right: 60px;">
                  <%= cf.check_box key, :'data-institution' => key %>
                  <%= cf.label key, institution_name, :style => "display:inline" %>
                </div>
              <% end %>
            <% end %>
          </li>
          <% institutions.each do |key, institution_name| %>
            <li class="question-item <%= key%>_group_wrapper hide">
              <%= f.label "#{key}_group", t('survey_b.institution_group_label', :institution => institution_name), :class => "o-question-title" %>
              <%= f.fields_for key do |rgf| %>
                <table class="o-question-group view-grid">
                  <thead>
                    <tr>
                      <th></th>
                      <% t('survey_b.degrees').each do |degree| %>
                        <th>
                          <%= degree %>
                        </th>
                      <% end %>
                    </tr>
                  </thead>
                  <tbody>
                    <% j = 0 %>
                    <% t('survey_b.questions').each do |q_key, question| %>
                      <tr<%= (' class="odd"').html_safe if (j % 2 == 0) %>>
                        <th class="o-question-title" style="text-align: right;">
                          <%= question %>
                        </th>
                        <% t('survey_b.degrees').each_with_index do |degree, d| %>
                          <td>
                            <%= rgf.radio_button q_key, d %>
                          </td>
                        <% end %>
                      </tr>
                      <% j += 1 %>
                    <% end %>
                  </tbody>
                </table>
              <% end %>
            </li>
          <% end %>
          <li class"question-item">
            <%= f.label :quality_question, t('survey_b.quality_question_label'), :class => "o-question-title" %>
            <ul class="o-question-group view-list">
              <% t('survey_b.quality_question_options').each_with_index do |option, i| %>
                <li>
                <%= f.radio_button :quality_question, i %>
                <%= f.label "quality_question_#{i}", option, :class => 'o-question-option' %>
                </li>
              <% end %>
            </ul>
          </li>
          <% [:good_institutions, :bad_institutions].each do |item| %>
            <li class"question-item">
              <%= f.label item, t("survey_b.#{item.to_s}_label"), :class => "o-question-title" %>
              <%= f.fields_for item do |cf| %>
                <% institutions.each do |key, institution_name| %>
                  <div style="display: inline; margin-right: 60px;">
                    <%= cf.check_box key, :'data-institution' => key %>
                    <%= cf.label key, institution_name, :style => "display:inline" %>
                  </div>
                <% end %>
              <% end %>
            </li>
          <% end %>
          <li class"question-item">
            <%= f.label :rate_question, t('survey_b.rate_question_label'), :class => "o-question-title" %>
            <ul class="o-question-group view-list">
              <% t('survey_b.rate_question_options').each_with_index do |option, i| %>
                <li>
                <%= f.radio_button :rate_question, i %>
                <%= f.label "quality_question_#{i}", option, :class => 'o-question-option' %>
                </li>
              <% end %>
            </ul>
          </li>
          <li class"question-item">
            <%= f.label :person_question, t('survey_b.person_question_label'), :class => "o-question-title" %>
            <ul class="o-question-group view-list">
              <% t('survey_b.person_question_options').each_with_index do |option, i| %>
                <li>
                <%= f.radio_button :person_question, i %>
                <%= f.label "quality_question_#{i}", option, :class => 'o-question-option' %>
                </li>
              <% end %>
            </ul>
          </li>
          <li class"question-item">
            <p><%= t('survey_b.comment_question_notice') %></p>
            <%= f.label :comment_question, t('survey_b.comment_question_label'), :class => "o-question-title" %>
            <%= f.text_area :comment_question, :rows => 5 %>
          </li>
          <li class"question-item">
            <p><%== t('survey_b.contact_notice') %></p>
            <% [:contact_name, :contact_phone, :contact_e_mail].each do |item| %>
              <%= f.label :item, t("survey_b.#{item.to_s}_label"), :class => "o-question-title" %>
              <%= f.text_field item %>
            <% end %>
          </li>
        </ol>
        <div class="o-question-action">
          <%= f.submit t('submit'), :class => 'survey-submit' %>
        </div>
      <% end %>
    </div>
  </section>
</div>
<% content_for :page_stylesheets do %>
  <link href='/assets/questionnaire.css' rel='stylesheet' type='text/css' />
<% end %>
<script type="text/javascript" src="/assets/jquery.form.js"></script>
<script type="text/javascript">
  $('form.survey_b').ajaxForm({
    beforeSubmit: function(a,f,o) {
      o.dataType = 'script';
    },
    success: function(data) {
    }
  });
  $('.institution_check input[type=checkbox]').on('click', function(){
    $institution_group_wrapper = $('.' + $(this).attr('data-institution') + '_group_wrapper');
    if ( $(this).attr('checked') ) {
      $institution_group_wrapper.show();
    } else {
      $institution_group_wrapper.hide();
    }
  });

</script>