Creo en nosotros. Wikipedia.
ShareCodeTreeCode

Goose, la red social libre

PleasOn - Menu QR
ShareCode
Permalink: http://www.treeweb.es/u/974/ 01/02/2011

ShareCode

HTMLCSSJSVista previa
1 /*/////////////////////////////////////////////////////////////////////////////2  //3  AJAX DEFINITION (BEGIN) //4  */5 /**6  * Description: Manage ajax connections with a queue model.7  * Author: gerardooscarjt@gmail.com8  * Date: 2013/31/019  * Typical use:10 11 var ajax = new Ajax();12 ajax.setUrl('http://example.com/path');13 ajax.setMethod('post');14 ajax.setData({'name':'a','age':'22'};15 ajax.callback.done = function(xhr) {16  // ...17 };18 ajax.callback.error = function(xhr) {19  // ...20 };21 ajax.send();22 23 */24 var Ajax = function() {25  26  Ajax.prototype.requests.push(this);27  28  this._id = Ajax.prototype.id_generator;29  Ajax.prototype.id_generator++;30  31  this.callback = {32  done:null,33  error:null,34  progress:null,35  presend:null36  };37  38  39  40  this._method = 'get';41  this._async = true;42  this._url = '';43  this._data = null;44  this._retries = 3;45  this._xhr = null;46  47 }48 49 Ajax.prototype.requests = [];50 Ajax.prototype.queue = [];51 Ajax.prototype.id_generator = 0;52 Ajax.prototype.concurrency_limit = 4;53 54 /// METHOD ///55 Ajax.prototype.setMethod = function(method) {56  if (!this.isQueued())57  this._method = method;58 };59 Ajax.prototype.getMethod = function(method) {60  return this._method;61 };62 63 /// URL ///64 Ajax.prototype.setUrl = function(url) {65  if (!this.isQueued())66  this._url = url;67 };68 Ajax.prototype.getUrl = function() {69  return this._url;70 };71 72 /// DATA ///73 Ajax.prototype.setData = function(data) {74  if (!this.isQueued())75  this._data = data;76 };77 Ajax.prototype.getData = function () {78  return this._data;79 };80 81 /// IS QUEUED ///82 Ajax.prototype.isQueued = function () {83  return Ajax.prototype.queue.indexOf(this) > -1;84 };85 86 Ajax.prototype.send = function() {87  if (!this.isQueued()) {88  logger.log(this._id + ' no está en la cola: encolando...');89  ajax_stats[this._id] = {};90  ajax_stats[this._id].delay = new Date().getTime();91  Ajax.prototype.queue.push(this);92  Ajax._move();93  } else {94  logger.log('ya está en la cola'); 95  }96  logger.show();97 };98 99 100 /// STATIC METHODS ///101 102 // Abort all current requests103 Ajax._abort_all = function() {104  alert('aborting all requests');105 };106 107 /* Move queue */108 Ajax._move = function() {109  110  if (window.navigator.onLine) {111  while (Ajax.prototype.concurrency_limit > 0 && Ajax.prototype.queue.length > 0) {112  var a = Ajax.prototype.queue.shift();113  a._send();114  logger.log('Desencolado '+a._id);115  Ajax.prototype.concurrency_limit--;116  }117  }118 };119 120 /// PRIVATE METHODS (I WOULD LIKE) ///121 Ajax.prototype._send = function() {122  var that = this;123  124  logger.log('Send request for '+this._id);125  126  this._xhr = new XMLHttpRequest({mozSystem:true});127  128  this._xhr.open(this._method, this._url, this._async);129  130  this._xhr.onreadystatechange = function(event) {131  if(that._xhr.readyState == XMLHttpRequest.DONE) {132  logger.log('DONE! ' + that._id +' (delay '+that._xhr.responseText+')');133  ajax_stats[that._id].request = new Date().getTime();134  ajax_stats[that._id].server_delay = that._xhr.responseText;135  Ajax.prototype.concurrency_limit++;136  Ajax._move();137  }138  };139  140  this._xhr.onerror = function(event) {141  logger.log('ERROR! ' + that._id);142  Ajax.prototype.concurrency_limit++;143  Ajax._move();144  };145  146  this._xhr.send();147  ajax_stats[this._id].waiting = new Date().getTime();148  149  150 };151 152 // Initialize onLine and offLine events153 window.addEventListener('online', function() {154  Ajax._move();155 }, true);156 157 window.addEventListener('offline', function() {158  Ajax._abort_all();159 }, true);160 161  /*162  AJAX DEFINITION (END) //163  //164 /////////////////////////////////////////////////////////////////////////////*/165 166 167 168 var ajax_stats_start = new Date().getTime();169 var ajax_stats = {};170 171 172 173 window.addEventListener('load', function(){174  //test1(); 175 }, true);176 177 178 /**179  * Launch 10 ajax calls180 */181 function test1() {182  183  ajax_stats_start = new Date().getTime();184  185 186  logger.show();187 188  for (var i=0; i<10; i++) {189  var ajax = new Ajax();190  ajax.setUrl('http://www.treeweb.es/request?e='+ajax._id);191  ajax.callback.done = function(xhr) {192  logger.log('Completed '+ajax._id);193  };194  ajax.send();195  logger.log('Launched '+ajax._id);196  }197 198  logger.log(Ajax.prototype.queue);199 200 201 }202 203 function see_stats() {204  205  var s = '';206  207  for (k in ajax_stats) {208  s +=209  '<tr>'210  + '<td>' + (k) + ' (server delay ' + ajax_stats[k].server_delay + ')' + '</td>'211  + '<td>' + (ajax_stats[k].delay - ajax_stats_start) + '</td>'212  + '<td>' + (ajax_stats[k].waiting - ajax_stats[k].delay) + '</td>'213  + '<td>' + (ajax_stats[k].request - ajax_stats[k].waiting) + '</td>'214  + '</tr>';215  }216  217  218  var h = '<tr> <td>id</td> <td>delay</td> <td>waiting</td> <td>request</td> </tr>';219  s = '<table>' + h + s + '</table>';220  221  logger.log(s);222  logger.show();223 }224 225 function see_chart() {226  227  var deltas = {};228  229  for (k in ajax_stats) {230  deltas[k] = {231  'delay' : (),232  'waiting' : (),233  'request' : ()234  };235  }236  237  238  239  240  // Calc maximum time:241  var max_t = -1;242  for (k in ajax_stats)243  if (ajax_stats[k].request > max_t)244  max_t = ajax_stats[k].request;245  246  alert(max_t);247  248  249  var s = '';250  251  for (k in ajax_stats) {252  s +=253  '<div style="height:20px; ">'254  + '<div style="width: 200px; display:inline-block; height:100%;">'255  + (k) + ' (server delay ' + ajax_stats[k].server_delay + ')' + '</div>'256  257  + '<div style="display:inline-block; height:100%; background:navy; width:'+258  (100 * Math.floor(1000*(ajax_stats[k].delay - ajax_stats_start) / max_t ) / 1000) + '%"></div>' 259  260  + '<div style="display:inline-block; height:100%; background:orange; width:'+261  (100 * Math.floor(1000*(ajax_stats[k].waiting - ajax_stats[k].delay) / max_t ) / 1000) +'%"></div>'262  263  + '<div style="display:inline-block; height:100%; background:gold; width:'+264  (100 * Math.floor(1000*(ajax_stats[k].request - ajax_stats[k].waiting) / max_t ) / 1000) +'%"></div>'265  + '</div>';266  }267  268  269  s = '<div>' + s + '</div>';270  271  logger.log(s);272  logger.show();273 }274 275 
Enlace Duplicar
Enlace
El enlace para compartir es: