<!DOCTYPE html>
<html>

<head>

    <style>
        .init-loader {
            text-align: center;
        }
    </style>

    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>Operator</title>
    <base href="/" />
    <link href="css/bootstrap5-lite.css" rel="stylesheet" />
    <script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
    <link href="css/fontawesome/css/all.min.css" rel="stylesheet" />
    <script src="css/fontawesome/js/all.min.js"></script>
    <link href="css/site.css" rel="stylesheet" />
    <link href="css/styles.css" rel="stylesheet" />
    <link href="manifest.json" rel="manifest" />
    <link rel="apple-touch-icon" sizes="512x512" href="icon-512.png" />
    <script src="_content/Cloudcrate.AspNetCore.Blazor.Browser.Storage/Storage.js"></script>
    <script src="js/user.script.js"></script>
</head>

<body>
    <div id="app">
        <div class="init-loader">
            <h2>
                Пожалуйста подождите, загрузка...
            </h2>

            <div style="margin-top:50px;margin-left:50px;margin-right:50px;border-color:#ddd;border-width:1px;border-style:solid;border-radius:.5rem;">
                <div id="progress-bar" style="width:0%;background-color:#ff8561;border-radius:.5rem;color:#fff;padding:10px;font-size:20px;"></div>
            </div>
            <div id="progress-filename" style="margin-top:10px;color:#ae9d9a;">
            </div>
        </div>
    </div>

    <script src="_framework/blazor.webassembly.js" autostart="false"></script>
    <script>
        if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('service-worker.js').then((registration) => {
                registration.onupdatefound = (d) => {
                    var firstInstall = !navigator.serviceWorker.controller;
                    console.info("Service worker: updatefound, firstInstall=" + firstInstall);

                    const installingWorker = registration.installing;
                    installingWorker.onstatechange = (event) => {
                        console.log("Service worker: statechanged, state=" + installingWorker.state);
                        if (installingWorker.state === 'installed') {
                            if (!firstInstall) {
                                window.location.reload();
                            }
                        }
                    };
                };
            });
        } else {
            console.error("Service workers are not supported.");
        }
    </script>
    <script>
        var i = 0;
        var allResourcesBeingLoaded = [];
        Blazor.start({ // start manually with loadBootResource
            loadBootResource: function (type, name, defaultUri, integrity) {
                if (type == "dotnetjs")
                    return defaultUri;

                var f = fetch(defaultUri, {
                    cache: 'no-cache',
                    integrity: integrity,
                    headers: {}
                });

                allResourcesBeingLoaded.push(f);
                f.then((r) => {
                    i++;
                    var app = document.getElementsByTagName("app")[0];
                    var l = allResourcesBeingLoaded.length;
                    const pgr = parseInt((i * 100.0) / l);

                    var elemBar = document.getElementById("progress-bar");
                    elemBar.style.width = pgr + '%';
                    elemBar.innerHTML = pgr + '%';

                    var elemText = document.getElementById("progress-filename");
                    elemText.innerHTML = "Загружено " + i + " файлов из " + l;
                });
                return f;
            }
        });
    </script>
</body>

</html>
