<div class="modal fade"
     id="parse-records-modal"
     aria-labelledby="parse-modal-title"
     role="dialog">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close" onClick="pageReload()"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="parse-modal-title"><%= t('repositories.modal_parse.title') %></h4>
      </div>
      <%= bootstrap_form_tag(url: import_records_repository_path(@import_data.repository, format: :json),
                             html: {'data-type' => 'json', id: 'form-import'},
                             remote: true) do |f|%>
      <%= f.hidden_field :team_id, value: current_team.id %>
      <div class="modal-body">
        <p><%= t("repositories.parse_sheet.help_text") %></p>
        <div style="overflow-x: scroll">
          <table class="table parse-records-table" style="display: block">
            <thead>
              <th style="min-width: 100px">
                <p><%= t("repositories.parse_sheet.scinote_columns_html") %></p>
                <p style="margin-bottom: 0px"><%= t("repositories.parse_sheet.file_columns") %></p>
              </th>
              <% @import_data.header.each.with_index do |th, index| %>
                <th style="min-width: 150px" title="<%= th %>">
                  <%= f.select("mappings[#{index.to_s}]",
                               options_from_collection_for_select(@import_data.available_fields,
                                                                  :first,
                                                                  :last),
                               include_blank: t('repositories.parse_sheet.do_not_include_column'),
                               hide_label: true) %>
                  <br />
                  <% if th.nil? %>
                    <i><%= t('repositories.import_records.no_header_name') %></i>
                  <% else %>
                    <% if th.length > Constants::NAME_TRUNCATION_LENGTH_DROPDOWN %>
                      <div class="modal-tooltip">
                        <%= truncate(th, length: Constants::NAME_TRUNCATION_LENGTH_DROPDOWN) %>
                      </div>
                    <% else %>
                      <%= th %>
                    <% end %>
                  <% end %>
                </th>
              <% end %>
            </thead>
            <tbody>
              <tr>
                <td>
                  <p><%= t('repositories.parse_sheet.example_value') %></p>
                </td>
                <% @import_data.columns.each do |td| %>
                  <td>
                    <%= td %>
                  </td>
                <% end %>
              </tr>
            </tbody>
          </table>
        </div>
        <%= hidden_field_tag 'file_id', @temp_file.id %>

        <div id="import-errors-container">
        </div>
        <div class="alert alert-info" role="alert">
          <ul>
            <li><%=t 'repositories.modal_parse.warning_1', limit: Constants::REPOSITORY_LIST_ITEMS_PER_COLUMN %></li>
            <li><%=t 'repositories.modal_parse.warning_2' %></li>
          </ul>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal" onClick="pageReload()"><%= t('general.cancel')%></button>
        <input type="submit" class="btn btn-success" value="<%= t('repositories.modal_parse.import') %>">
      </div>
      <% end %>
    </div>
  </div>
</div>
