<table class="table table-striped table-hover main-list">
  <thead>
    <tr class="sort-header">
    <% @table_fields.each do |f| %>
      <%= thead(f) %>
    <% end %>
    </tr>
  </thead>
  <tbody>
  <% @pages.each do |page| %>
    <tr>
      <td><%= page.page_id %></td>
      <td>
        <a href="/<%= I18n.locale %><%= page.url %>" target="_blank"><%= page.name %></a>
        <div class="quick-edit">
          <ul class="nav nav-pills">
            <% if can_edit_or_delete?(page) %>
              <li><a href="/admin/page_contents/new?page_id=<%= page.id.to_s %>"><%= t(:edit) %></a></li>
            <% end %>
          </ul>
        </div>
      </td>
      <td><a href="/admin/page_contents/<%= page.id.to_s %>/view" ><%= page.page_contexts.last.version rescue nil %></a></td>
      <td><%= format_value page.page_contexts.last.updated_at rescue nil %></td>
      <td><%= User.find(page.page_contexts.last.update_user_id).user_name rescue nil %></td>
      <td>
        <%= select_tag("category_id",options_for_select(@categories, (page.category_id.to_s rescue "")), prompt: "Select a category", class: "category_select", style: "margin-bottom:0;") %>
        <button <%= !page.category_id.nil? ? "data-page-category-id=#{page.category_id.to_s}" : "" %> data-page-id="<%= page.id.to_s %>" id="save_category" class="btn btn-primary hide">Save</button>
      </td>
    </tr>
  <% end %>
  </tbody>
</table>

<%=
  content_tag :div, class: "bottomnav clearfix" do
    content_tag :div, paginate(@pages), class: "pagination pagination-centered"
  end
%>

<script type="text/javascript">
(function(){
  var category_id = null,
      button = $("button#save_category");
  $("select.category_select").on("change",function(){
    category_id = $(this).val()
    if(category_id != ""){
      if(button.data("page-category-id") != category_id){
        $("button#save_category").removeClass("hide");
      }else{
        $("button#save_category").addClass("hide");
      }
    }else{
      $("button#save_category").addClass("hide");
    }
  })
  button.on("click",function(){
    var page_id  = $(this).data("page-id");
    if(category_id != null){
      $.ajax({
        url : "/admin/page_contents/save_category",
        dataType : "json",
        type: "post",
        data : {"category_id" : category_id, "page_id" : page_id}
      }).done(function(data){
        if(data.success){
           button.addClass("hide");
        }
      })
    }
  })
})();
</script>