[ext.js] drop-in solution for automatic ajax error handling

here's the new (experimental) code used in our system for handling ajax connection errors.
it's something like the one used by gmail - when it experiences connection problems, small banner pops up, saying that there's no connection to server, etc.

this script does following:
when response status is not 200 (OK), banner with error message pops up, than script starts to poll server every 4 seconds (you may change that). when connection is up again - script will handle response, hide the banner, and call real callback supplied to Ext.data.Connection.

and since Ext.Ajax.request is really a call to Ext.data.Connection.request - it will work too (just like all other stuff).

usage: include the javascript after ext-all.js, add following css. done!
improvement suggestions are welcome!

.ajaxerrorbannerwrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2em;
}
.ajaxerrorbanner {
  margin: 0px auto;
  width: 20em;
  height: 2em;
  background-color: #e33;
  color: #000;
  text-align: center;
  font-weight: bold;
  padding-top: 0.5em;
}

and the javascript:

// experimental Ext.data.Connection override
var conn_request = Ext.data.Connection.prototype.request;
var ajax_error_banner = null;
Ext.override (Ext.data.Connection, {
   request: function (options) {
       var fail = options.failure;
       var success = options.success;
       var conn = this;
       options.success = function (response, options) {
           if (ajax_error_banner) {
               ajax_error_banner.style.display = 'none';
           }
           if (success)
               success.call (options.scope, response, options);
       }
       options.failure = function (response, options) {
           if (response.status != 200) {
               if (!ajax_error_banner) {
                   var wrap = document.createElement ('DIV');
                   wrap.className = 'ajaxerrorbannerwrap';
                   ajax_error_banner = document.createElement ('DIV');
                   ajax_error_banner.className = 'ajaxerrorbanner';
                   ajax_error_banner.innerHTML = 'Connecting to server failed. Please wait for retry.';
                   wrap.appendChild (ajax_error_banner);
                   document.body.appendChild (wrap);
               }
               else {
                   ajax_error_banner.style.display = 'block';
               }
               // start polling
               var task = {
                   conn: conn,
                   options: options,
                   run: function () {
                       this.conn.request (this.options);
                   },
                   interval: 4000,
                   scope: task,
                   repeat: 1
               };
               var runner = new Ext.util.TaskRunner();
               runner.start(task);
           }
           else {
               if (ajax_error_banner) {
                   ajax_error_banner.style.display = 'none';
               }
               if (fail)
                   fail.call (options.scope, response, options);
           }
       }
       conn_request.call (this, options);
   }
});