|
1 // $Id: progress.js,v 1.20 2008/01/04 11:53:21 goba 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="bar"><div class="filled"></div></div>'+ |
|
24 '<div class="percentage"></div>'+ |
|
25 '<div class="message"> </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 dataType: 'json', |
|
76 success: function (progress) { |
|
77 // Display errors |
|
78 if (progress.status == 0) { |
|
79 pb.displayError(progress.data); |
|
80 return; |
|
81 } |
|
82 // Update display |
|
83 pb.setProgress(progress.percentage, progress.message); |
|
84 // Schedule next timer |
|
85 pb.timer = setTimeout(function() { pb.sendPing(); }, pb.delay); |
|
86 }, |
|
87 error: function (xmlhttp) { |
|
88 pb.displayError(Drupal.ahahError(xmlhttp, pb.uri)); |
|
89 } |
|
90 }); |
|
91 } |
|
92 }; |
|
93 |
|
94 /** |
|
95 * Display errors on the page. |
|
96 */ |
|
97 Drupal.progressBar.prototype.displayError = function (string) { |
|
98 var error = document.createElement('div'); |
|
99 error.className = 'error'; |
|
100 error.innerHTML = string; |
|
101 |
|
102 $(this.element).before(error).hide(); |
|
103 |
|
104 if (this.errorCallback) { |
|
105 this.errorCallback(this); |
|
106 } |
|
107 }; |