set CSP in updater view
This commit is contained in:
+1
-1
@@ -77,5 +77,5 @@ function openUpdater(update: UpdateInfo) {
|
|||||||
updaterWindow = null;
|
updaterWindow = null;
|
||||||
});
|
});
|
||||||
|
|
||||||
loadView(updaterWindow, "updater.html");
|
loadView(updaterWindow, "updater/index.html");
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>About Vesktop</title>
|
<title>About Vesktop</title>
|
||||||
|
|
||||||
<link rel="stylesheet" href="./style.css" type="text/css" />
|
<link rel="stylesheet" href="./common.css" type="text/css" />
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>Vesktop Setup</title>
|
<title>Vesktop Setup</title>
|
||||||
|
|
||||||
<link rel="stylesheet" href="./style.css" type="text/css" />
|
<link rel="stylesheet" href="./common.css" type="text/css" />
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
@@ -130,10 +130,8 @@
|
|||||||
<label>
|
<label>
|
||||||
<div>
|
<div>
|
||||||
<h2>Rich Presence</h2>
|
<h2>Rich Presence</h2>
|
||||||
<span
|
<span>Enable Rich presence (game activity) via
|
||||||
>Enable Rich presence (game activity) via
|
<a href="https://github.com/OpenAsar/arrpc" target="_blank">arRPC</a></span>
|
||||||
<a href="https://github.com/OpenAsar/arrpc" target="_blank">arRPC</a></span
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<input type="checkbox" name="richPresence" checked />
|
<input type="checkbox" name="richPresence" checked />
|
||||||
</label>
|
</label>
|
||||||
@@ -169,4 +167,4 @@
|
|||||||
console.info("form:" + JSON.stringify(data));
|
console.info("form:" + JSON.stringify(data));
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<head>
|
<head>
|
||||||
<link rel="stylesheet" href="./style.css" type="text/css" />
|
<link rel="stylesheet" href="./common.css" type="text/css" />
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
|
|||||||
@@ -1,268 +0,0 @@
|
|||||||
<head>
|
|
||||||
<title>Vesktop Updater</title>
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="./style.css" type="text/css" />
|
|
||||||
|
|
||||||
<style>
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
padding: 2em;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100vh;
|
|
||||||
|
|
||||||
header,
|
|
||||||
footer {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
main {
|
|
||||||
flex: 1 1 0%;
|
|
||||||
min-height: 0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#versions {
|
|
||||||
display: inline-grid;
|
|
||||||
grid-template-columns: auto 1fr;
|
|
||||||
column-gap: 0.5em;
|
|
||||||
|
|
||||||
.label {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.value {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#current-version {
|
|
||||||
color: #fc8f8a;
|
|
||||||
}
|
|
||||||
|
|
||||||
#new-version {
|
|
||||||
color: #71c07f;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#release-notes {
|
|
||||||
display: grid;
|
|
||||||
gap: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#buttons {
|
|
||||||
display: flex;
|
|
||||||
gap: 0.5em;
|
|
||||||
justify-content: end;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
cursor: pointer;
|
|
||||||
padding: 0.5rem 1rem;
|
|
||||||
font-size: 1.2em;
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
|
|
||||||
.grey {
|
|
||||||
background-color: rgba(151, 151, 159, 0.12);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
margin: 0 0 0.5em 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
margin-bottom: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
dialog {
|
|
||||||
width: 80%;
|
|
||||||
padding: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
progress {
|
|
||||||
width: 100%;
|
|
||||||
height: 1.5em;
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#error {
|
|
||||||
color: red;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spinner-wrapper {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spinner {
|
|
||||||
width: 48px;
|
|
||||||
height: 48px;
|
|
||||||
border: 5px solid var(--fg);
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: inline-block;
|
|
||||||
box-sizing: border-box;
|
|
||||||
animation: rotation 1s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes rotation {
|
|
||||||
to {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<header>
|
|
||||||
<h1>An update is available!</h1>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
<p id="versions">
|
|
||||||
<span class="label">Current version:</span> <span id="current-version" class="value"></span>
|
|
||||||
<span class="label">New version:</span> <span id="new-version" class="value"></span>
|
|
||||||
</p>
|
|
||||||
<h2>Release Notes</h2>
|
|
||||||
|
|
||||||
<div id="release-notes"></div>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
<section id="buttons">
|
|
||||||
<button id="update-button" class="green">Install update & restart</button>
|
|
||||||
<button id="later-button" class="grey">Remind me later</button>
|
|
||||||
<button id="ignore-button" class="grey">Ignore this update</button>
|
|
||||||
</section>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
<dialog id="update-dialog" closedby="none">
|
|
||||||
<h2>Downloading Update</h2>
|
|
||||||
<p>
|
|
||||||
Please wait while the update is being downloaded. Once the update finished downloading, it will
|
|
||||||
automatically install and Vesktop will restart.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p id="linux-note" style="display: none">You will likely be prompted to enter your password. Do so to finish the
|
|
||||||
update.</p>
|
|
||||||
|
|
||||||
<progress id="download-progress" value="0" max="100"></progress>
|
|
||||||
|
|
||||||
<p id="error"></p>
|
|
||||||
</dialog>
|
|
||||||
|
|
||||||
<dialog id="installing-dialog" closedby="none">
|
|
||||||
<h2>Installing Update</h2>
|
|
||||||
<p>Please wait while the update is being installed. Vesktop will restart shortly.</p>
|
|
||||||
|
|
||||||
<div class="spinner-wrapper">
|
|
||||||
<div class="spinner"></div>
|
|
||||||
</div>
|
|
||||||
</dialog>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
<script type="module">
|
|
||||||
const { update, version: currentVersion } = await VesktopUpdaterNative.getData();
|
|
||||||
|
|
||||||
document.getElementById("current-version").textContent = currentVersion;
|
|
||||||
document.getElementById("new-version").textContent = update.version;
|
|
||||||
document.getElementById("release-notes").innerHTML = update.releaseNotes
|
|
||||||
.map(({ version, note: html }) => `
|
|
||||||
<section>
|
|
||||||
<h3>Version ${version}</h3>
|
|
||||||
<div>${html.replace(/<\/?h([1-3])/g, (m, level) => m.replace(level, Number(level) + 3))}</div>
|
|
||||||
</section>
|
|
||||||
`)
|
|
||||||
.join("\n");
|
|
||||||
|
|
||||||
document.querySelectorAll("a").forEach((a) => {
|
|
||||||
a.target = "_blank";
|
|
||||||
});
|
|
||||||
|
|
||||||
// remove useless headings
|
|
||||||
document.querySelectorAll("h3, h4, h5, h6").forEach(h => {
|
|
||||||
if (h.textContent.trim().toLowerCase() === "what's changed") {
|
|
||||||
h.remove()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/** @type {HTMLDialogElement} */
|
|
||||||
const updateDialog = document.getElementById("update-dialog");
|
|
||||||
/** @type {HTMLDialogElement} */
|
|
||||||
const installingDialog = document.getElementById("installing-dialog");
|
|
||||||
/** @type {HTMLProgressElement} */
|
|
||||||
const downloadProgress = document.getElementById("download-progress");
|
|
||||||
/** @type {HTMLElement} */
|
|
||||||
const errorText = document.getElementById("error");
|
|
||||||
|
|
||||||
document.getElementById("update-button").addEventListener("click", () => {
|
|
||||||
downloadProgress.value = 0;
|
|
||||||
errorText.textContent = "";
|
|
||||||
|
|
||||||
if (navigator.platform.startsWith("Linux")) {
|
|
||||||
document.getElementById("linux-note").style.display = "initial";
|
|
||||||
}
|
|
||||||
|
|
||||||
updateDialog.showModal();
|
|
||||||
|
|
||||||
VesktopUpdaterNative.installUpdate().then(() => {
|
|
||||||
downloadProgress.value = 100
|
|
||||||
updateDialog.closedBy = "any";
|
|
||||||
|
|
||||||
installingDialog.showModal();
|
|
||||||
updateDialog.style.visibility = "hidden";
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
document.getElementById("later-button").addEventListener("click", () => VesktopUpdaterNative.snoozeUpdate());
|
|
||||||
document.getElementById("ignore-button").addEventListener("click", () => {
|
|
||||||
const confirmed = confirm("Are you sure you want to ignore this update? You will not be notified about this update again. Updates are important for security and stability.");
|
|
||||||
if (confirmed)
|
|
||||||
VesktopUpdaterNative.ignoreUpdate()
|
|
||||||
});
|
|
||||||
|
|
||||||
VesktopUpdaterNative.onProgress(percent => downloadProgress.value = percent);
|
|
||||||
VesktopUpdaterNative.onError(message => {
|
|
||||||
updateDialog.closedBy = "any";
|
|
||||||
errorText.textContent = `An error occurred while downloading the update: ${message}`;
|
|
||||||
installingDialog.close();
|
|
||||||
updateDialog.style.visibility = "initial";
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
@@ -0,0 +1,61 @@
|
|||||||
|
<head>
|
||||||
|
<title>Vesktop Updater</title>
|
||||||
|
<meta http-equiv="Content-Security-Policy" content="
|
||||||
|
default-src 'none';
|
||||||
|
script-src vesktop:;
|
||||||
|
style-src vesktop:;
|
||||||
|
">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../common.css" type="text/css" />
|
||||||
|
<link rel="stylesheet" href="./style.css" type="text/css" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>An update is available!</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<p id="versions">
|
||||||
|
<span class="label">Current version:</span> <span id="current-version" class="value"></span>
|
||||||
|
<span class="label">New version:</span> <span id="new-version" class="value"></span>
|
||||||
|
</p>
|
||||||
|
<h2>Release Notes</h2>
|
||||||
|
|
||||||
|
<div id="release-notes"></div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<section id="buttons">
|
||||||
|
<button id="update-button" class="green">Install update & restart</button>
|
||||||
|
<button id="later-button" class="grey">Remind me later</button>
|
||||||
|
<button id="ignore-button" class="grey">Ignore this update</button>
|
||||||
|
</section>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<dialog id="update-dialog" closedby="none">
|
||||||
|
<h2>Downloading Update</h2>
|
||||||
|
<p>
|
||||||
|
Please wait while the update is being downloaded. Once the update finished downloading, it will
|
||||||
|
automatically install and Vesktop will restart.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p id="linux-note" class="hidden">You will likely be prompted to enter your password. Do so to finish the
|
||||||
|
update.</p>
|
||||||
|
|
||||||
|
<progress id="download-progress" value="0" max="100"></progress>
|
||||||
|
|
||||||
|
<p id="error"></p>
|
||||||
|
</dialog>
|
||||||
|
|
||||||
|
<dialog id="installing-dialog" closedby="none">
|
||||||
|
<h2>Installing Update</h2>
|
||||||
|
<p>Please wait while the update is being installed. Vesktop will restart shortly.</p>
|
||||||
|
|
||||||
|
<div class="spinner-wrapper">
|
||||||
|
<div class="spinner"></div>
|
||||||
|
</div>
|
||||||
|
</dialog>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script type="module" src="./script.js"></script>
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
const { update, version: currentVersion } = await VesktopUpdaterNative.getData();
|
||||||
|
|
||||||
|
document.getElementById("current-version").textContent = currentVersion;
|
||||||
|
document.getElementById("new-version").textContent = update.version;
|
||||||
|
document.getElementById("release-notes").innerHTML = update.releaseNotes
|
||||||
|
.map(
|
||||||
|
({ version, note: html }) => `
|
||||||
|
<section>
|
||||||
|
<h3>Version ${version}</h3>
|
||||||
|
<div>${html.replace(/<\/?h([1-3])/g, (m, level) => m.replace(level, Number(level) + 3))}</div>
|
||||||
|
</section>
|
||||||
|
`
|
||||||
|
)
|
||||||
|
.join("\n");
|
||||||
|
|
||||||
|
document.querySelectorAll("a").forEach(a => {
|
||||||
|
a.target = "_blank";
|
||||||
|
});
|
||||||
|
|
||||||
|
// remove useless headings
|
||||||
|
document.querySelectorAll("h3, h4, h5, h6").forEach(h => {
|
||||||
|
if (h.textContent.trim().toLowerCase() === "what's changed") {
|
||||||
|
h.remove();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/** @type {HTMLDialogElement} */
|
||||||
|
const updateDialog = document.getElementById("update-dialog");
|
||||||
|
/** @type {HTMLDialogElement} */
|
||||||
|
const installingDialog = document.getElementById("installing-dialog");
|
||||||
|
/** @type {HTMLProgressElement} */
|
||||||
|
const downloadProgress = document.getElementById("download-progress");
|
||||||
|
/** @type {HTMLElement} */
|
||||||
|
const errorText = document.getElementById("error");
|
||||||
|
|
||||||
|
document.getElementById("update-button").addEventListener("click", () => {
|
||||||
|
downloadProgress.value = 0;
|
||||||
|
errorText.textContent = "";
|
||||||
|
|
||||||
|
if (navigator.platform.startsWith("Linux")) {
|
||||||
|
document.getElementById("linux-note").classList.remove("hidden");
|
||||||
|
}
|
||||||
|
|
||||||
|
updateDialog.showModal();
|
||||||
|
|
||||||
|
VesktopUpdaterNative.installUpdate().then(() => {
|
||||||
|
downloadProgress.value = 100;
|
||||||
|
updateDialog.closedBy = "any";
|
||||||
|
|
||||||
|
installingDialog.showModal();
|
||||||
|
updateDialog.classList.add("hidden");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
document.getElementById("later-button").addEventListener("click", () => VesktopUpdaterNative.snoozeUpdate());
|
||||||
|
document.getElementById("ignore-button").addEventListener("click", () => {
|
||||||
|
const confirmed = confirm(
|
||||||
|
"Are you sure you want to ignore this update? You will not be notified about this update again. Updates are important for security and stability."
|
||||||
|
);
|
||||||
|
if (confirmed) VesktopUpdaterNative.ignoreUpdate();
|
||||||
|
});
|
||||||
|
|
||||||
|
VesktopUpdaterNative.onProgress(percent => (downloadProgress.value = percent));
|
||||||
|
VesktopUpdaterNative.onError(message => {
|
||||||
|
updateDialog.closedBy = "any";
|
||||||
|
errorText.textContent = `An error occurred while downloading the update: ${message}`;
|
||||||
|
installingDialog.close();
|
||||||
|
updateDialog.classList.remove("hidden");
|
||||||
|
});
|
||||||
@@ -0,0 +1,147 @@
|
|||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
padding: 2em;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100vh;
|
||||||
|
|
||||||
|
header,
|
||||||
|
footer {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
flex: 1 1 0%;
|
||||||
|
min-height: 0;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#versions {
|
||||||
|
display: inline-grid;
|
||||||
|
grid-template-columns: auto 1fr;
|
||||||
|
column-gap: 0.5em;
|
||||||
|
|
||||||
|
.label {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current-version {
|
||||||
|
color: #fc8f8a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#new-version {
|
||||||
|
color: #71c07f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#release-notes {
|
||||||
|
display: grid;
|
||||||
|
gap: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#buttons {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.5em;
|
||||||
|
justify-content: end;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
font-size: 1.2em;
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grey {
|
||||||
|
background-color: rgba(151, 151, 159, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
margin: 0 0 0.5em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
dialog {
|
||||||
|
width: 80%;
|
||||||
|
padding: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress {
|
||||||
|
width: 100%;
|
||||||
|
height: 1.5em;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#error {
|
||||||
|
color: red;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-wrapper {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner {
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
border: 5px solid var(--fg);
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: inline-block;
|
||||||
|
box-sizing: border-box;
|
||||||
|
animation: rotation 1s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotation {
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user