A lightweight class allowing the user to display a loading spinner until they are done with something.

On its own, it is just a configurable UI.

There are several convenient utility functions to setup the loading screen for common operations, such as awaitPromise for an event you only want to fire off once succeed or fail, awaitPromiseFunction for something that you want the user to be able to try again with, or awaitScriptLoad for initializing an application.

The LoadingScreen.visible property determines whether the loading screen is part of the document body and therefore visible or not.

The LoadingScreen.state property determines whether it is playing the spinner animation or displaying an error message.

The LoadingScreen.errorDialog property allows you to customize what happens when something goes wrong.

Constructors

Accessors

  • get root(): HTMLElement
  • Returns HTMLElement

    Highest ranking parent of all HTML elements the loading screen is made from.

  • get visible(): boolean
  • Returns boolean

    True if loading screen is currently a child of another element, presumably the document body.

  • set visible(visible: boolean): void
  • Parameters

    • visible: boolean

      Allows user to control whether loading screen is currently a child of another element, presumably the document body.

      Setting it to true will add it to document.body, setting it to false will remove it from its parent.

      Call will be ignored if it is already in the desired state.

    Returns void

Methods

  • Parameters

    • listener: (visible: boolean) => void

      A listener that will be fired whenever the value of property visible is changed.

    Returns void

  • Parameters

    • listener: (visible: boolean) => void

      A listener that should stop listening on visibility.

    Returns boolean

    true if listener was removed, false if listener does not exist.