<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="icon" type="image/x-icon" href="/favicon.png" />
    <title>Reset SilverBullet</title>
    <style>
        html,
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            border: 0;
            margin: 0;
        }

        footer {
            margin-top: 10px;
        }

        header {
            background-color: #e1e1e1;
            border-bottom: #cacaca 1px solid;
        }

        h1 {
            margin: 0;
            margin: 0 auto;
            max-width: 800px;
            padding: 8px;
            font-size: 28px;
            font-weight: normal;
        }

        form {
            max-width: 800px;
            margin: 0 auto;
            padding: 10px;
        }

        input {
            font-size: 18px;
        }

        form>div {
            margin-bottom: 5px;
        }

        .error-message {
            color: red;
        }
    </style>

</head>

<body>
    <header>
        <h1>Logout</h1>
    </header>
    <button onclick="resetAll()">Logout</button>
    <button onclick="javascript:location='/'">Cancel</button>

    <script>
        function resetAll() {
            if (indexedDB.databases) {
                // get a list of all existing IndexedDB databases
                indexedDB.databases().then((databases) => {
                    // loop through the list and delete each database
                    return Promise.all(
                        databases.map((database) => {
                            console.log("Now deleting", database.name);
                            return new Promise((resolve) => {
                                return indexedDB.deleteDatabase(database.name).onsuccess = resolve;
                            });
                        })
                    );
                }).then(() => {
                    alert("Flushed local data, you're now logged out");
                    location.href = "/.auth?logout";
                });
            } else {
                alert("Cannot flush local data (Firefox user?), will now log you out");
                location.href = "/.auth?logout";
            }

            if (navigator.serviceWorker) {
                navigator.serviceWorker.ready.then((registration) => {
                    registration.active.postMessage({ type: 'flushCache' });
                });

                navigator.serviceWorker.addEventListener('message', (event) => {
                    if (event.data.type === 'cacheFlushed') {
                        console.log('Cache flushed');
                        navigator.serviceWorker.getRegistrations().then((registrations) => {
                            for (const registration of registrations) {
                                registration.unregister();
                            }
                        });

                    }
                });
            }
        }
    </script>
</body>

</html>