snippet.js

function GAImporter() {
  this.busy = false;
  this.poller = setInterval(this.pollJob, 5000);
  
  this.pollJob = function() {
    if (!this.busy) {
      this.busy = true;
      this.checkJob();
      this.busy = false;
    }    
  };
  
  this.checkJob = function() {
    $.getJSON('/admin/play_golf_offers/check_job/', { 
        play_golf_offer_spreadsheet_id: id, 
        t: (new Date()).getTime() 
      },
      function(json){
        // If the job isn't running anymore
        if (json.state !== "running" && json.state !== "pending") {
          // Stop polling
          clearInterval(this.poll);
        }
        this.showJobStatus(json);
      });
  };
  
  this.showJobStatus = function(json) {
    var activity = $("#activity"),
        html = "";
    switch(json.state) {
      case "running":
        html += '<h2><img src="/images/spinner.gif" alt="" width="16" height="16" /> Processing data&hellip;</h2>';
        break;      
      case "pending":
        html += '<h2><img src="/images/spinner.gif" alt="" width="16" height="16" /> Import will begin shortly&hellip;</h2>';
        break;
      case "failed":
        html += '<h2><img src="/images/exclamation.png" alt="" width="16" height="16" /> Import failed</h2>\
                 <p>' + json.message + '</p>\
                 <a href="/admin/play_golf_offers/" title="">Return to offers listing</a>';
        break;
      case "finished":
        html += '<h2><img src="/images/tick.png" alt="" width="16" height="16" /> Finished processing data</h2>\
                 <p>' + json.message + '</p>\
                 <a href="/admin/play_golf_offers/" title="">Return to offers listing</a>';
        break;
      default:
        html += '<a href="/admin/play_golf_offers/" title="">Return to offers listing</a>';
    }
    // Append the update
    $(activity).html(html);
    // Log for more info's sake
    console.log(json);    
  };

};


$(function() {
  var importer = new GAImporter();
});