<%= javascript_include_tag('/assets/client_management/jquery.validate.min') %>
<%
  relation_field = "#{type.pluralize}"
  records = f.object.send(relation_field)
%>
<div id="<%=type%>">
  <!-- Add -->
  <div>
    <% if f.object.super_user_changed %>
      <a href="javascript:void(0)" class="btn btn-success apply_change_users" data-id="<%=f.object.id%>" data-is-server="<%=f.object.class == SiteServer%>"><%= t('client_management.apply_change') %></a>
      <hr>
    <% end %>
  </div>
  <div class="add-target">
    <% records.each do |record| %>
    <%= f.fields_for relation_field, record  do |f| %>
      <%= render :partial => "super_manager_form_block", :locals=>{:f=>f} %>
    <% end %>
  <% end %>
  </div>
  <p class="add-btn">
    <%= hidden_field_tag "#{relation_field}_count", records.count %>
    <a class="btn btn-primary create_super_manager <%=type%>" href="#"><%= t("client_management.create_super_manager") %></a>
  </p>
</div>
<style type="text/css">
  .block_remove_btn{
    color: red;
    margin-right: 0.3em;
    background: transparent;
    border: 1px solid red;
    margin-bottom: 1em;
    padding: 0.4em 0.8em;
    cursor: pointer;
  }
  .block_remove_btn:hover{
    font-size: 1.3em;
    top: 0.3em;
    position: relative;
  }
  .user_form_block{
    border: 0.3em solid #666;
    margin-bottom: 0.5em;
    padding-bottom: 1em;
  }
  .main-forms fieldset .form-actions{
    background: #fff;
  }
  #info_texts{
    white-space: pre;
  }
</style>
<script type="text/javascript">
  $(document).ready(function(){
    function validate_password(){
      $('.super_manager_form').validate();
    }
    validate_password();
    $(document).on('click', ".create_super_manager.<%=type%>", function(){
      var new_id = $(this).prev().attr('value');
      var old_id = new RegExp("new_<%=relation_field%>", "g");
      var on = $('.language-nav li.active').index();
      var le = $(this).parent('.add-btn').prev('.add-target').children('.start-line').length;
      $(this).prev().attr('value', parseInt(new_id) + 1);
      $(this).parent().siblings('.add-target').append(("<%= escape_javascript(add_attribute 'super_manager_form_block', f, relation_field) %>").replace(old_id, new_id));
      $(this).parent('.add-btn').prev('.add-target').children('.start-line').eq(le).children('.input-append').find('.tab-content').each(function() {
        $(this).children('.tab-pane').eq(on).addClass('in active').siblings().removeClass('in active');
      });
      formTip();
      validate_password();
    });
    $(document).on('click','.block_remove_btn',function(){
      var user_form_block = $(this).parents('.user_form_block').eq(0);
      if(user_form_block.hasClass("new_record")){
        user_form_block.remove()
      }else{
        if(window.confirm('<%=t("client_management.are_you_sure_to_delete")%>')){
          user_form_block.addClass('hide');
          user_form_block.find('.should_destroy').val('true');
        }
      }
    })
  })

</script>