epaper/app/views/admin/e_paper_subscribers/_index.html.erb

<% if @thread %>
  <div id="threadModal" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="threadModal" aria-hidden="false">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h3 id="threadModal"><%=t("e_paper.#{@thread.key}")%></h3>
        </div>
        <div class="modal-body">
          <div class="thread-status"><%= @thread.status[:status] %></div>
          <div><span class="thread-current-count"><%= @thread.status[:current_count].to_i %></span>/<span class="thread-all-count"><%= @thread.status[:all_count].to_i %></span></div>
          <span class="thread-finish_percent"><%= @thread.status[:finish_percent].to_i %></span> % finished
        </div>
        <div class="modal-footer">
          <button class="btn" id="modal-close-btn" style="width: 4em;" data-dismiss="modal" aria-hidden="true"><%=t('close')%></button>
        </div>
      </div>
    </div>
  </div>
<% end %>
<table class="table main-list">
  <thead>
    <tr class="sort-header">
    <% @table_fields.each do |f| %>
      <%= thead(f) %>
    <% end %>
    </tr>
  </thead>
  <tbody>
  <% @subscribers.each do |subscriber| %>	
  	<tr>
  		<td>
  			<%= subscriber.email rescue "" %>
  			<div class="quick-edit">
  			  <ul class="nav nav-pills">
  			      <li><a class="delete text-error" href="<%= admin_e_paper_subscriber_path(subscriber.id) %>" data-method="delete" data-confirm="Are you sure?"><%= t(:delete_) %></a></li>
  			  </ul>
  			</div>
  		</td>
			<td>
				<%= subscriber.subscribed ? "Subscribed" : "Unsubscribed" %>
			</td>
			<td>
				<%= t(subscriber.language) %>
			</td>
  	</tr>
	<% end %>
  </tbody>
</table>
<div class="bottomnav clearfix" style="left: 81px;">
  <%= content_tag(:div, paginate(@subscribers), class: "pagination pagination-centered") %>
  <div class="pull-right">
    <%= 
      content_tag(:div, link_to(t("e_paper.export"), admin_e_paper_subscribers_export_excel_path + '.xlsx', :class=>"btn btn-success"), class: "pull-right")
    %>
    <div class="dropup upload-button pull-right">
      <% if @thread %>
        <button class="show_progress btn btn-primary" type="button"><%= t("e_paper.show_progress") %></button>
      <% end %>
      <button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown">
        <i class="icon-upload-alt icon-white"></i><%= t('personal_journal.upload') %>
        <span class="caret"></span>
      </button>
      <div class="dropdown-menu upload-box">
        <form action="<%=admin_e_paper_subscribers_import_from_excel_path%>" method="post" enctype="multipart/form-data">
          <%= hidden_field_tag :authenticity_token, form_authenticity_token %>
          <input type="file" name="import_file" >
            <button class="btn btn-primary" type="submit"><%= t(:submit) %></button>
            <a class="" href="<%=admin_e_paper_subscribers_download_excel_format_path%>.xlsx">Download excel format</a>
        </form>
      </div>
    </div>
  </div>
</div>
<script>
  $(document).ready(function(){
    function update_thread(){
      $.post("<%=admin_threads_get_status_path%>",{"id": "<%=params[:thread_id]%>"}).done(function(data){
        var finish_percent = data["finish_percent"];
        var current_count = data["current_count"];
        var all_count = data["all_count"];
        var is_finish = (data["status"] == "finish");
        if(finish_percent){
          $("#threadModal .modal-body .thread-status").text(data["status"]);
          if(data["status"] != 'Processing'){
            $("#threadModal .modal-body .thread-current-count").text(current_count);
            $("#threadModal .modal-body .thread-all-count").text(all_count);
          }
          $("#threadModal .modal-body .thread-finish_percent").text(finish_percent)
        }
        if(!is_finish){
          window.time_out_id = window.setTimeout(update_thread, 1000);
        }else{
          if(window.time_out_id)
            window.clearTimeout(window.time_out_id);
          window.setTimeout(function(){
            $("#threadModal").modal("hide");
            alert(data["status"]);
          }, 3000);
          return;
        }
      });
    }
    if($("#threadModal").length != 0){
      $("#threadModal").on('hidden.bs.modal',function(){
        window.clearTimeout(window.time_out_id);
      })
      $("#threadModal").on('shown.bs.modal',function(){
        window.time_out_id = window.setTimeout(update_thread, 1000);
      })
      $("#threadModal").modal("show");
      $(".show_progress").click(function(){
        $("#threadModal").modal("show");
      })
    }
  })
</script>