Class ProgressPreloader

Page preloader for calculating and displaying the loading progress of resources (images, videos, custom elements). Provides smooth progress transitions.

Documentation

Hierarchy (View Summary)

Constructors

Accessors

  • get isDestroyed(): boolean

    Checks if the module has been destroyed.

    Returns boolean

  • get name(): string

    The name of the module, derived from the class name

    Returns string

  • get prefix(): string

    Optional prefix for classnames used by the module

    Returns string

Methods

  • Adds a class name on an element, and keeps track of it for removal when the module is destroyed.

    Parameters

    • element: Element

      The target DOM element.

    • className: string

      The class name to toggle.

    Returns void

  • Helper function to generate classnames with the module's prefix.

    Parameters

    • ...classNames: string[]

      The class names to generate.

    Returns string

    A string of class names with the module's prefix applied.

  • Retrieves the default static properties.

    Returns {
        __staticProp: true;
        container: HTMLElement;
        customSelector: string;
        endDuration: number;
        hide: number | false;
        ignoreClassName: string;
        lerp: number;
        preloadImages: boolean;
        preloadVideos: boolean;
        resourceContainer: HTMLElement;
    }

    • __staticProp: true
    • container: HTMLElement

      The container for the preloader. Set it to null if you only need the preloader logic.

    • customSelector: string

      Selector for custom resources to preload. Elements should include data-weight and data-loaded attributes. Example: data-weight="10" for a weight of 10, data-loaded="10" when loaded.

      '.js-preload'
      
    • endDuration: number

      Duration (ms) to complete the preloader if resources are loaded but progress < 1.

      500
      
    • hide: number | false

      Defines whether to automatically hide the preloader container.

      • false: Disables the hiding animation, allowing you to manage it manually.
      • number: Specifies the animation duration in milliseconds. This works only if the container is an HTML element.
      250
      
    • ignoreClassName: string

      Class name for elements to exclude from preloading.

      'js-preload-ignore'
      
    • lerp: number

      Linear interpolation factor for smooth progress updates. 1 disables interpolation for instant updates.

      0.1
      
    • preloadImages: boolean

      Enables automatic preloading of images.

      true
      
    • preloadVideos: boolean

      Enables automatic preloading of videos.

      false
      
    • resourceContainer: HTMLElement

      Container source for preloader resources.

      null
      
  • Adds a custom resource

    Parameters

    • id: string | Element

      The custom resource element or identifier to preload.

    • weight: number = 1

      The resource weight

    Returns void

  • Hides the preloader with a custom animation duration.

    Parameters

    • duration: number

      The duration of the hide animation (in milliseconds). Applies only when the container is used.

    • Optionalcallback: () => void

      The callback to execute when the hide animation is complete.

    Returns undefined | () => void

    Returns an action destructor.

  • Adds a callback on the module's destruction.

    Parameters

    • action: () => void

      The function to execute during destruction.

    Returns void

  • Registers a callback for when the preloader is fully hidden.

    Parameters

    • action: () => void

      The callback function to execute.

    Returns () => void

    A destructor.

  • Registers a callback for when the preloader starts hiding.

    Parameters

    • action: () => void

      The callback function to execute.

    Returns () => void

    A destructor.

  • Emits a resource load event and updates the count of loaded resources.

    Parameters

    • id: string | Element

      The resource element or identifier being loaded.

    • OptionalloadedWeight: number

    Returns void