<%= javascript_include_tag "lib/jquery-ui-1.12.1/jquery-ui" %>
<%= stylesheet_link_tag "lib/jquery-ui-1.12.1/jquery-ui" %>
<div class="form-horizontal">
    <form method="get" action="<%= "/#{I18n.locale}/admin/site_panel/edit_site" %>">
        <div class="control-group">
            <label class="control-label">Server</label>
            <div class="controls"><%=@site_construct.server_type%></div>
        </div>
        <div class="control-group">
            <label class="control-label" for="enable_redirect_default_domain"><%= t("client_management.redirect_to_default_domain_name") %></label>
            <div class="controls">
                <% %>
                <%= select_tag "site_construct[enable_redirect_default_domain]", options_for_select((0..2).to_a.collect{ |i| [I18n.t("client_management.option.#{i}") + (i == 0 ? ": #{@site_construct.default_enable_redirect_default_domain ? I18n.t("client_management.option.2") : I18n.t("client_management.option.1")}" : ""), i.to_s] }, @site_construct.enable_redirect_default_domain) ,:id=>"enable_redirect_default_domain" %>
            </div>
        </div>
        <%= hidden_field_tag "site_construct[default_domain_idx]", "-1" %>
        <div class="control-group">
            <label class="control-label">Domain name</label>
            <div class="controls">
                <% @site_construct.domain_name.split(' ').each_with_index do |domain_name,i| %>
                <div class="domain_group">
                    <%= check_box_tag "site_construct[default_domain_idx]", i, (@site_construct.default_domain_idx == i), :class=>"default_domain_idx", :title=>t("client_management.set_to_default_domain_name") %>
                    <%= text_field_tag nil,domain_name,:class=>'domain_name',onchange: 'domain_name_change()',:oninput=>'replace_domain_input(this)' %>
                    <% if i != 0 %>
                        <button class="btn btn-danger" onclick="delete_domain(this)">
                            delete domain
                        </button>
                    <% end %>
                </div>
                <% end %>
                <%= button_tag 'add domain',:type => 'button', :id => 'add_root_domain',class: 'btn btn-info',:style => 'margin-top: 1em;' %>
                <%= hidden_field_tag 'site_construct[domain_name]',@site_construct.domain_name,id: 'site_construct_domain_name' %>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label">Port</label>
            <div class="controls">
                <div class="port_block">
                  <%= number_field_tag("site_construct[port][]",@site_construct.get_port, :min => 1, :id => nil) %>
                  <div style="clear: both;"></div>
                </div>
                <div id="append_port_block">
                    <% @site_construct.port[1..-1].to_a.each do |port| %>
                        <div class="port_block">
                          <span class="remove_btn">X</span>
                          <%= number_field_tag("site_construct[port][]",port, :min => 1, :id => nil) %>
                          <div style="clear: both;"></div>
                        </div>
                    <% end %>
                </div>
                <button class="btn btn-primary" id="add_port" type="button">Add Port</button>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label">Site type</label>
            <div class="controls"><%=@site_construct.site_type%></div>
        </div>
        <% if @site_construct.site_type == "School"%>
            <div class="control-group">
                <label class="control-label">School name</label>
                <div class="controls"><%=@site_construct.school_name%></div>
            </div>
        <% end %>
        <div class="control-group">
            <label class="control-label">Site name</label>
            <div class="controls"><%=@site_construct.site_name%></div>
        </div>
        <div class="control-group">
            <label class="control-label">Database name</label>
            <div class="controls"><%=@site_construct.db_name%></div>
        </div>
        <div class="control-group">
            <label class="control-label">Nginx file</label>
            <div class="controls"><%=@site_construct.nginx_file%></div>
        </div>
        <div class="control-group">
            <label class="control-label">Site path</label>
            <div class="controls"><%=@site_construct.full_site_path%></div>
        </div>
        <div class="control-group">
            <div class="controls">
                <%= hidden_field_tag 'id',@site_construct.id %>
                <%= hidden_field_tag 'type','change_server_name' %>
                <a href="<%=admin_site_panel_sites_list_path%>" class="btn btn-primary"><%=t(:back)%></a>
                <input type="submit" value="<%=t("client_management.change_setting")%>" class="btn btn-primary btn-danger">
            </div>
        </div>
    </form>
</div>
<% if params[:status] == "changing" %>
    <script type="text/javascript">
        var timeout_id;
        var status_relation = {"creating":"<span style=\"color: skyblue;\">creating</span>","error":"<span style=\"color: red;\">error</span>","finish": "<span style=\"color: darkseagreen;\">finish</span>","closed":"<span style=\"color: red;\">closed</span>"};
        function see_infos(id){
          id = id || "<%=params[:id]%>";
          if(!close_info){
            var request = $.post("<%=admin_site_panel_site_infos_path%>",{"id":id});
            request.done(function(data){
              var infos = request.responseJSON.infos;
              var status = request.responseJSON.status;
              if($("#info_texts").length == 0)
                return infos.join("<br>")
              else{
                $("#info_texts").html(infos.join("<br>"));
                if(status == "")
                  var status_text = "not yet create";
                else
                  var status_text = status_relation[status];
                if(status == "finish"){
                  var new_params_text = window.location.search.replace(/[&?]status=[^&]*/,'');
                  close_info = true;
                  window.location.href = window.location.href.replace(window.location.search,new_params_text);
                }
                $(".see_infos[data-id="+id+"]").parent().siblings(".site_status").html(status_text);
                timeout_id = window.setTimeout(see_infos(id),1000);
              }
            }).fail(function() {
              window.location.reload();
            })
          }else{
            window.clearTimeout(timeout_id);
          }
        };
        function show_infos_dialog(){
          close_info = true;
          window.clearTimeout(timeout_id);
          close_info = false;
          if($("#dialog-confirm").length == 0){
            $("#main-wrap").before("<div id='dialog-confirm' title='site infos'>"+
                          "<div style='clear:both;'></div><div id='info_texts'>"+see_infos()+"</div><div id='msg_end' style='height:0px; overflow:hidden'></div>"+
                          "</div>");
          }else{
            see_infos();
          };
          $( "#dialog-confirm" ).dialog({
            resizable: true,
            minHeight: 300,
            maxHeight: 400,
            modal: true,
            width: '80%',
            close: function(){$( this ).dialog( "close" );close_info = true;},
            buttons: {
            "<%= t('client_management.confirm') %>": function(){$( this ).dialog( "close" );close_info = true;},
            "stop update": function(){close_info = true;}
            }
          });
        }
        show_infos_dialog();
    </script>
<% end %>
<style type="text/css">
  .remove_btn{
    float: left;
    color: red;
    line-height: 2rem;
    cursor: pointer;
    font-weight: bold;
  }
  .remove_btn:hover{
    font-size: 1.3em;
  }
</style>
<script type="text/javascript">
    function unique(array) {
        return $.grep(array, function(el, index) {
            return index == $.inArray(el, array);
        });
    }
    function domain_name_change(){
        $('#site_construct_domain_name').val(unique(
          $.map($('.domain_name'),function(v,i){
            return $(v).val()
          })
        ).join(' '))
    }
    $('#add_root_domain').click(function(){
        var first_domain_group = $('.domain_group').first()
        var clone_domain_group = $(first_domain_group).clone()
        clone_domain_group.find('input[type="text"]').val('')
        clone_domain_group.find('.default_domain_idx').val($(".default_domain_idx").length);
        clone_domain_group.append("<button class=\"btn btn-danger\" onclick=\"delete_domain(this)\">delete domain</button>")
        $('.domain_group').last().after(clone_domain_group)
      })
    function delete_domain(ele){
        $('.domain_group').eq($(ele).parents('.domain_group').index('.domain_group')).remove()
        domain_name_change()
        $(".default_domain_idx").each(function(i,v){
            $(v).val(i);
        })
    }
    function replace_domain_input(ele){
        var correct_val = $(ele).val().match(/([0-9]||[a-z]||[-_.])*/gi).join("");
        $(ele).val(correct_val.replace("_","-"));
    }
    $(document).on("click",".remove_btn",function(event){
        $(this).parent().remove();
    })
    $("#add_port").click(function(){
        var clone_input = $(this).siblings(".port_block").eq(0).clone();
        var $div = $("<div></div>");
        $div.append("<span class=\"remove_btn\">X</span>").append(clone_input);
        $(this).siblings("#append_port_block").append($div)
    })
</script>