123 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			123 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<head>
 | 
						|
    <link rel="stylesheet" href="./style.css" type="text/css" />
 | 
						|
 | 
						|
    <style>
 | 
						|
        .wrapper {
 | 
						|
            display: flex;
 | 
						|
            flex-direction: column;
 | 
						|
            justify-content: space-between;
 | 
						|
            box-sizing: border-box;
 | 
						|
            min-height: 100%;
 | 
						|
            padding: 1em;
 | 
						|
        }
 | 
						|
 | 
						|
        h1 {
 | 
						|
            text-align: center;
 | 
						|
        }
 | 
						|
 | 
						|
        .buttons {
 | 
						|
            display: grid;
 | 
						|
            grid-template-columns: 1fr 1fr;
 | 
						|
            gap: 0.5em;
 | 
						|
            margin-top: 0.25em;
 | 
						|
        }
 | 
						|
 | 
						|
        button {
 | 
						|
            cursor: pointer;
 | 
						|
            padding: 0.5em;
 | 
						|
            color: var(--fg);
 | 
						|
            border: none;
 | 
						|
            border-radius: 3px;
 | 
						|
            font-weight: bold;
 | 
						|
            transition: filter 0.2 ease-in-out;
 | 
						|
        }
 | 
						|
 | 
						|
        button:hover,
 | 
						|
        button:active {
 | 
						|
            filter: brightness(0.9);
 | 
						|
        }
 | 
						|
 | 
						|
        .green {
 | 
						|
            background-color: #248046;
 | 
						|
        }
 | 
						|
 | 
						|
        .red {
 | 
						|
            background-color: #ed4245;
 | 
						|
        }
 | 
						|
    </style>
 | 
						|
</head>
 | 
						|
 | 
						|
<body>
 | 
						|
    <div class="wrapper">
 | 
						|
        <section>
 | 
						|
            <h1>Update Available</h1>
 | 
						|
            <p>There's a new update for Aerocord! Update now to get new fixes and features!</p>
 | 
						|
            <p>
 | 
						|
                Current: <span id="current"></span>
 | 
						|
                <br />
 | 
						|
                Latest: <span id="latest"></span>
 | 
						|
            </p>
 | 
						|
 | 
						|
            <h2>Changelog</h2>
 | 
						|
            <p id="changelog">Loading...</p>
 | 
						|
        </section>
 | 
						|
 | 
						|
        <section>
 | 
						|
            <label id="disable-remind">
 | 
						|
                <input type="checkbox" />
 | 
						|
                <span>Do not remind again for </span>
 | 
						|
            </label>
 | 
						|
 | 
						|
            <div class="buttons">
 | 
						|
                <button name="download" class="green">Download Update</button>
 | 
						|
                <button name="close" class="red">Close</button>
 | 
						|
            </div>
 | 
						|
        </section>
 | 
						|
    </div>
 | 
						|
</body>
 | 
						|
 | 
						|
<script type="module">
 | 
						|
    const data = await Updater.getData();
 | 
						|
    document.getElementById("current").textContent = data.currentVersion;
 | 
						|
    document.getElementById("latest").textContent = data.latestVersion;
 | 
						|
 | 
						|
    document.querySelector("#disable-remind > span").textContent += data.latestVersion;
 | 
						|
 | 
						|
    function checkDisableRemind() {
 | 
						|
        const checkbox = document.querySelector("#disable-remind > input");
 | 
						|
        if (checkbox.checked) {
 | 
						|
            Updater.ignore();
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
    const onClicks = {
 | 
						|
        download() {
 | 
						|
            checkDisableRemind();
 | 
						|
            Updater.download();
 | 
						|
        },
 | 
						|
        close() {
 | 
						|
            checkDisableRemind();
 | 
						|
            Updater.close();
 | 
						|
        }
 | 
						|
    };
 | 
						|
 | 
						|
    for (const name in onClicks) {
 | 
						|
        document.querySelectorAll(`button[name="${name}"]`).forEach(button => {
 | 
						|
            button.addEventListener("click", onClicks[name]);
 | 
						|
        });
 | 
						|
    }
 | 
						|
</script>
 | 
						|
 | 
						|
<script type="module">
 | 
						|
    import { micromark } from "https://esm.sh/micromark@3?bundle";
 | 
						|
    import { gfm, gfmHtml } from "https://esm.sh/micromark-extension-gfm@2?bundle";
 | 
						|
 | 
						|
    const changelog = (await Updater.getData()).release.body;
 | 
						|
    if (changelog)
 | 
						|
        document.getElementById("changelog").innerHTML = micromark(changelog, {
 | 
						|
            extensions: [gfm()],
 | 
						|
            htmlExtensions: [gfmHtml()]
 | 
						|
        })
 | 
						|
            .replace(/h1>/g, "h3>")
 | 
						|
            .replace(/<a /g, '<a target="_blank" ');
 | 
						|
</script> |