Compose Loader
This is a simple system for displaying loading indicators with state. This exists to unify the system for displaying a loading state, reusing the same elements with standardized classnames and message defaults.
Usage
var Loader = // Use default styles and messages Loader // Show loading state; message default: "Hang tight…"Loader // Show success state; message default: "Got it!"Loader // Show failure state; message default: "Hold up!" // Show loading message, overriding more optionsLoader // Manually remove loader from DOM (required for `loading` style message // which doesn't auto remove by defaultLoader
This will inject a div into the DOM at the end of body
element unless you overwrite the parent
selector for the loader.
Here are the default options.
parent : 'body' // Selector for inserting loader html className : 'loader' // Base classname loading : 'Loading…' // class name for loading state success : 'Success!' // class name for success state failure : 'An error occurred' // class name for failure state removeAfter : 800 // Milliseconds to auto remove success and failure messages
You can change the defaults for loader like this:
// Override defaults, changing base classname for all future instances of loaderLoader // Override loading message for only this instance of the loadervar widget = Loader