up.network up:request:late

DOM event

This event is emitted when AJAX requests are taking long to finish.

By default Unpoly will wait 400 ms for an AJAX request to finish before emitting up:request:late. You may configure this delay like this:

up.network.config.badResponseTime = 1000 // milliseconds

Once all responses have been received, an up:request:recover will be emitted.

Note that if additional requests are made while Unpoly is already busy waiting, no additional up:request:late events will be triggered.

Loading indicators

By default the up:request:late event will cause a progress bar to appear at the top edge of the screen.

If you don't like the default progress bar, you can listen to the up:request:late and up:request:recover events to implement a custom loading indicator that appears during long-running requests.

To build a custom loading indicator, please an element like this in your application layout:

<loading-indicator>Please wait!</loading-indicator>

Now add a compiler that hides the <loading-indicator> element while there are no long-running requests:

// Disable the default progress bar
up.network.config.progressBar = false

up.compiler('loading-indicator', function(indicator) {
  function show() { up.element.show(indicator) }
  function hide() { up.element.hide(indicator) }

  hide()

  return [
    up.on('up:request:late', show),
    up.on('up:request:recover', hide)
  ]
})