[Sommaire] [Imprimer]

   1  // $Id: progress.js,v 1.14 2006/12/14 14:21:36 dries Exp $
   2  
   3  /**
   4   * A progressbar object. Initialized with the given id. Must be inserted into
   5   * the DOM afterwards through progressBar.element.
   6   *
   7   * method is the function which will perform the HTTP request to get the
   8   * progress bar state. Either "GET" or "POST".
   9   *
  10   * e.g. pb = new progressBar('myProgressBar');
  11   *      some_element.appendChild(pb.element);
  12   */
  13  Drupal.progressBar = function (id, updateCallback, method, errorCallback) {
  14    var pb = this;
  15    this.id = id;
  16    this.method = method || "GET";
  17    this.updateCallback = updateCallback;
  18    this.errorCallback = errorCallback;
  19  
  20    this.element = document.createElement('div');
  21    this.element.id = id;
  22    this.element.className = 'progress';
  23    $(this.element).html('<div class="percentage"></div>'+
  24                         '<div class="message">&nbsp;</div>'+
  25                         '<div class="bar"><div class="filled"></div></div>');
  26  }
  27  
  28  /**
  29   * Set the percentage and status message for the progressbar.
  30   */
  31  Drupal.progressBar.prototype.setProgress = function (percentage, message) {
  32    if (percentage >= 0 && percentage <= 100) {
  33      $('div.filled', this.element).css('width', percentage +'%');
  34      $('div.percentage', this.element).html(percentage +'%');
  35    }
  36    $('div.message', this.element).html(message);
  37    if (this.updateCallback) {
  38      this.updateCallback(percentage, message, this);
  39    }
  40  }
  41  
  42  /**
  43   * Start monitoring progress via Ajax.
  44   */
  45  Drupal.progressBar.prototype.startMonitoring = function (uri, delay) {
  46    this.delay = delay;
  47    this.uri = uri;
  48    this.sendPing();
  49  }
  50  
  51  /**
  52   * Stop monitoring progress via Ajax.
  53   */
  54  Drupal.progressBar.prototype.stopMonitoring = function () {
  55    clearTimeout(this.timer);
  56    // This allows monitoring to be stopped from within the callback
  57    this.uri = null;
  58  }
  59  
  60  /**
  61   * Request progress data from server.
  62   */
  63  Drupal.progressBar.prototype.sendPing = function () {
  64    if (this.timer) {
  65      clearTimeout(this.timer);
  66    }
  67    if (this.uri) {
  68      var pb = this;
  69      // When doing a post request, you need non-null data. Otherwise a
  70      // HTTP 411 or HTTP 406 (with Apache mod_security) error may result.
  71      $.ajax({
  72        type: this.method,
  73        url: this.uri,
  74        data: '',
  75        success: function (data) {
  76          // Parse response
  77          var progress = Drupal.parseJson(data);
  78          // Display errors
  79          if (progress.status == 0) {
  80            pb.displayError(progress.data);
  81            return;
  82          }
  83          // Update display
  84          pb.setProgress(progress.percentage, progress.message);
  85          // Schedule next timer
  86          pb.timer = setTimeout(function() { pb.sendPing(); }, pb.delay);
  87        },
  88        error: function (xmlhttp) {
  89          pb.displayError('An HTTP error '+ xmlhttp.status +' occured.\n'+ pb.uri);
  90        }
  91      });
  92    }
  93  }
  94  
  95  /**
  96   * Display errors on the page.
  97   */
  98  Drupal.progressBar.prototype.displayError = function (string) {
  99    var error = document.createElement('div');
 100    error.className = 'error';
 101    error.innerHTML = string;
 102  
 103    $(this.element).before(error).hide();
 104  
 105    if (this.errorCallback) {
 106      this.errorCallback(this);
 107    }
 108  }