<% select_keys = [] %>
<% fields_values = @fields_values.map{|i,fields_values| 
    "<div class=\"fields_value_block\">" + fields_values.map.with_index{|v,ii| "<label class=\"checkbox-inline\">" + check_box_tag("seminar_main[seminar_reviews_attributes][new_index][default_topics_values][new_value_index][]",ii,false,{:id=>nil}) + "#{v}</label>" }.join("") + 
    "</div>"
} %>
<%= form_for @seminar, url: update_reviewer_setting_admin_seminar_path(@seminar.id), html: {class: "form-horizontal main-forms"} do |f| %>
  <fieldset>
    <% count = 0 %>
    <% @seminar_reviews.each_with_index do |seminar_review,i| %>
        <% next if seminar_review.review.nil? %>
        <%= f.fields_for :seminar_reviews,seminar_review do |f| %>
            <h4><%= seminar_review.review.name rescue "" %></h4>
            <div class="control-group">
                <label class="control-label muted"><%= t('seminar.assign_fields') %></label>
                <div class="controls">
                    <% seminar_review.default_topics.each_with_index do |v,ii| %>
                        <div class="border-block">
                            <span class="remove_btn">X</span>
                            <%= select_tag("seminar_main[seminar_reviews_attributes][#{count}][default_topics][]" , options_for_select(@fields_translations.zip(@fields),v),{:class=>"select_field_types","data-index"=>count}) %>
                            <% select_index = @fields.index(v) %>
                            <% checked_values = seminar_review.default_topics_values[ii] %>
                            <div class="fields_value_block">
                                <% @fields_values[select_index].each_with_index do |v,iii| %>
                                    <% checked = checked_values.include?(iii.to_s) rescue false %>
                                    <label class="checkbox-inline">
                                        <%= check_box_tag("seminar_main[seminar_reviews_attributes][#{count}][default_topics_values][#{ii}][]",iii,checked,{:id=>nil}) + v %>
                                    </label>
                                <% end if select_index.present? %>
                            </div>
                        </div>
                    <% end %>
                    <% select_keys << select_tag("seminar_main[seminar_reviews_attributes][#{count}][default_topics][]" , options_for_select(@fields_translations.zip(@fields)),{:class=>"select_field_types","data-index"=>count}) %>
                    <button class="btn btn-primary add_assign_fields" type="button" data-index=<%=count%>><%=t('seminar.add_assign_fields')%></button>
                </div>
            </div>
        <% end %>
        <% count += 1 %>
    <% end %>
    <div class="form-actions">
      <%= f.submit t('submit'), class: 'btn btn-primary' %>
      <input type="hidden" name="referer_url" value="<%= get_referer_url %>">
      <%= link_to t('cancel'), admin_seminars_path, :class=>"btn" %>  
    </div>
  </fieldset>
<% end %>
<script type="text/javascript">
    function init_reviews(){
        $(".select_field_types").off("change").on("change",function(){
            var selectedIndex = $(this).prop("selectedIndex");
            var index = $(this).data("index");
            var length = $(this).parent().parent().find(".border-block").length - 1;
            $(this).siblings(".fields_value_block").html(fields_values[selectedIndex].replaceAll("new_index",index).replaceAll("new_value_index",length))
        })
        $(".remove_btn").off("click").on("click",function(){
            if(window.confirm("<%=t('seminar.are_you_want_to_remove')%>"))
                $(this).parent().remove();
        })
    }
    $(document).ready(function(){
        select_keys = <%= select_keys.to_s.html_safe %>;
        fields_values = <%= fields_values.to_s.html_safe %>;
        $(".add_assign_fields").click(function(){
            var index = $(this).data("index");
            var div_block = $("<div class=\"border-block\"><span class=\"remove_btn\">X</span></div>");
            div_block.append(select_keys[index]);
            var length = $(this).siblings(".border-block").length;
            div_block.append(fields_values[0].replaceAll("new_index",index).replaceAll("new_value_index",length));
            $(this).before(div_block);
            init_reviews();
        })
        init_reviews();
    })
</script>
<style type="text/css">
    .checkbox-inline{
        display: inline-block;
        position: relative;
        padding-top: 0.4375em;
        margin-top: 0;
        margin-bottom: 0;
        padding-left: 1.25em;
    }
    .border-block{
        position: relative;
        border: 0.2em solid;
        padding: 1.3em 0 1.3em 1.3em;
    }
    .remove_btn{
        position: absolute;
        top: 0;
        left: 0;
        color: red;
        background-color: #333333;
        width: 1.3em;
        text-align: center;
        font-weight: bold;
        cursor: pointer;
    }
</style>