universal_table/app/views/admin/universal_tables/index.html.erb

<% content_for :page_specific_javascript do %>
	<%= javascript_include_tag "lib/jquery.form" %>
<% end %>
<div id="index_table">
  <%= render 'index'%>
</div>

<div id="downloadModal" data-backdrop="static" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="downloadModalLabel" aria-hidden="true">
  <div class="modal-header">
    <h3 id="downloadModalLabel">Download</h3>
  </div>
  <div class="modal-body">
    <p id="wait-zone" style="text-align: center;">
    	Please wait while we prepare your download. This may take a while.
    	<br />
    	<img src="/assets/spin.gif" />
    </p>
    <p id="link-zone" style="display: none; text-align: center;">
      Please click the link below to download.
      <br />
      <a href="" id="download-link" target="_blank">Download</a>
    </p>
  </div>
  <div class="modal-footer">
    <button class="btn" id="modal-close-btn" style="display:none;" data-dismiss="modal" aria-hidden="true">Close</button>
  </div>
</div>
<div id="importModal" data-backdrop="static" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="importModalLabel" aria-hidden="true">
  <div class="modal-header">
    <h3 id="importModalLabel">Import</h3>
  </div>
  <div class="modal-body">
    <div id="import-wait-zone" style="text-align: center;">
    	<span class="msg">Please wait while we import your data. This may take a while.</span>
    	<br />
    	<img src="/assets/spin.gif" />
      <br />
      <div style="text-align: center;">Importing <span class="current-number">0</span> / <span class="total-number">0</span></div>
    </div>
    <div id="import-complete-zone" style="text-align: center; display:none;">
      <span class="msg">Imported successfully!!!</span>
    </div>
    <div id="import-error-zone" style="text-align: center; display:none;">
      <span class="msg"></span>
    </div>
  </div>
  <div class="modal-footer">
    <button class="btn" id="import-modal-close-btn" style="display:none;" data-dismiss="modal" aria-hidden="true">Close</button>
  </div>
</div>
<script type="text/javascript" src="/assets/lib/process.manager.js"></script>
<script type="text/javascript">
  var importModal = $("#importModal"),
    checkForImportThread = null,
    importWaitZone = $("#import-wait-zone"),
    importModalBtn = $("#import-modal-close-btn"),
    importCompleteZone = $("#import-complete-zone"),
    importErrorZone = $("#import-error-zone"),
    currentNumber = importWaitZone.find(".current-number"),
    totalNumber = importWaitZone.find(".total-number"),
    firstData = null,
    processManager = new ProcessManager();
	$("form.import_from_excel_form").on("submit",function(){
		var form = this;
        tableID = $(this).find("input[name=universal_table_id]").val()
		if($(this).find("input[type=file]").val() != ""){
      importModal.modal("show");
      importWaitZone.show();
      importModalBtn.hide();
      importErrorZone.hide();
      importCompleteZone.hide();
      totalNumber.text("0");
      currentNumber.text("0");
      importWaitZone.find("img").show();
			$(this).ajaxSubmit({
				dataType : "json",
				success : function(data){
          firstData = data;
					if(data.success){
           totalNumber.text(data.totalCount);
            checkForImportThread = new Process(function(){
              $.ajax({
                url : "/admin/universal_tables/checkforimportthread",
                type : "get",
                data : {"utable_id" : tableID},
                dataType : "json"
              }).done(function(threadData){
                currentNumber.text(threadData.currentCount);
                if(threadData.currentCount >= firstData.totalCount){
                  checkForImportThread.kill();
                  importWaitZone.hide();
                  importCompleteZone.show();
                  importWaitZone.find("img").hide();
                  importModalBtn.show();
                  $("tr#table_" + threadData.id + " td:eq(2)").text(threadData.totalCount);
                }
              })
            })
            checkForImportThread.setTimeInterval(3000);
            checkForImportThread.setRepeat(Process.CONSTANTS.REPEAT_INFINITE);
            processManager.queue(checkForImportThread);
					}else{
            importWaitZone.hide();
						importErrorZone.show();
            importModalBtn.show();
            importErrorZone.find(".msg").text(data.msg);
					}
					form.reset();
				}
			})
		}
		return false;
	})
</script>
<script type="text/javascript">

  var downloadModal = $("#downloadModal"),
    checkForThread = null,
    waitZone = $("#wait-zone"),
    linkZone = $("#link-zone"),
    downloadLink = $("a#download-link"),
    modalBtn = $("#modal-close-btn");

  $(document).on("click", ".export-xls", function(){
    var link = $(this).attr("href"),
        title = null,
        id = $(this).data("table-id");
    
    linkZone.hide();    
    waitZone.show();
    modalBtn.hide();
    $.ajax({
      url : link,
      type : "get",
      dataType : "json"
    }).done(function(data){
      title = data.title;
      checkForThread = new Process(function(){
        $.ajax({
          url : "/admin/universal_tables/checkforthread",
          type : "get",
          data : {"utable_id" : id, "utable_title" : title},
          dataType : "json"
        }).done(function(data){
          if(!data.status){
            downloadLink.attr("href", "/uploads/utable_export/" + id + "/" + title + ".xlsx");
            waitZone.hide();
            linkZone.show();
            modalBtn.show();
            checkForThread.kill();
          }
        })
      })
      checkForThread.setTimeInterval(1000);
      checkForThread.setRepeat(Process.CONSTANTS.REPEAT_INFINITE);
      processManager.queue(checkForThread);
    })
    downloadModal.modal("show");
    return false;
  })

</script>