https://shop.holzlandbeese.de/standard/compressed/loader-overlay-3f3711beed6f1ac1e3e72ba94b7b4693.js

1import {LoaderOverlayStateService} from '/standard/compressed/loader-overlay-state-service-6abb58fb677874fff44321a0034a9f23.js';
2
3export class LoaderOverlay extends HTMLElement {
4    constructor() {
5        super();
6
7        this._animationEl = this.querySelector(".js-loader-overlay-animation");
8        this._stateService = this._initStateService();
9    }
10
11    connectedCallback() {
12        this._renderAnimation();
13        this._handleIsLoadingStateEvent();
14    }
15
16    get stateService() {
17        return this._stateService;
18    }
19
20    _initStateService() {
21        return new LoaderOverlayStateService();
22    }
23
24    _handleIsLoadingStateEvent() {
25        this._stateService.subscribeLatest(() => {
26            const isLoading = this._stateService.isLoading;
27
28            this.classList.toggle("d-none", !isLoading)
29            this.classList.toggle("d-flex", !!isLoading)
30
31            if(!!isLoading) {
32                this._lottieLoadingAnimation.play();
33            } else {
34                this._lottieLoadingAnimation.stop();
35            }
36
37        }, "isLoading")
38    }
39
40    _renderAnimation() {
41        this._lottieLoadingAnimation = bodymovin.loadAnimation({
42            container: this._animationEl,
43            path: "/img/lottie/loader.json",
44            renderer: "svg",
45            loop: true,
46            autoplay: true,
47            name: "Loading"
48        })
49    }
50}
51
52customElements.define("mysign-loader-overlay", LoaderOverlay)