Rework setup and tray

This commit is contained in:
smartfrigde 2023-06-10 22:54:46 +02:00
parent 4937a2cddf
commit fdd9855065
11 changed files with 247 additions and 196 deletions

View file

@ -74,7 +74,6 @@ ipcRenderer.on("rpc", (_event, data: object) => {
if (window.location.href.indexOf("splash.html") > -1 || window.location.href.indexOf("setup.html") > -1) {
contextBridge.exposeInMainWorld("armcordinternal", {
restart: () => ipcRenderer.send("restart"),
installState: ipcRenderer.sendSync("modInstallState"),
saveSettings: (...args: any) => ipcRenderer.send("saveSettings", ...args)
installState: ipcRenderer.sendSync("modInstallState")
});
}

View file

@ -18,13 +18,9 @@ if (ipcRenderer.sendSync("legacyCapturer")) {
const version = ipcRenderer.sendSync("displayVersion");
async function updateLang(): Promise<void> {
if (window.location.href.indexOf("setup.html") > -1) {
console.log("Setup, skipping lang update");
} else {
const value = `; ${document.cookie}`;
const parts: any = value.split(`; locale=`);
if (parts.length === 2) ipcRenderer.send("setLang", parts.pop().split(";").shift());
}
const value = `; ${document.cookie}`;
const parts: any = value.split(`; locale=`);
if (parts.length === 2) ipcRenderer.send("setLang", parts.pop().split(";").shift());
}
declare global {
interface Window {

View file

@ -33,7 +33,11 @@ export function injectTitlebar(): void {
const quit = document.getElementById("quit");
minimize!.addEventListener("click", () => {
ipcRenderer.send("win-minimize");
if (window.location.href.indexOf("setup.html") > -1) {
ipcRenderer.send("setup-minimize");
} else {
ipcRenderer.send("win-minimize");
}
});
maximize!.addEventListener("click", () => {
@ -46,10 +50,14 @@ export function injectTitlebar(): void {
});
quit!.addEventListener("click", () => {
if (ipcRenderer.sendSync("minimizeToTray") === true) {
ipcRenderer.send("win-hide");
} else if (ipcRenderer.sendSync("minimizeToTray") === false) {
ipcRenderer.send("win-quit");
if (window.location.href.indexOf("setup.html") > -1) {
ipcRenderer.send("setup-quit");
} else {
if (ipcRenderer.sendSync("minimizeToTray") === true) {
ipcRenderer.send("win-hide");
} else if (ipcRenderer.sendSync("minimizeToTray") === false) {
ipcRenderer.send("win-quit");
}
}
});
});

View file

@ -45,10 +45,10 @@
<br />
<div class="switch acTray">
<label class="header" data-string="settings-tray"></label>
<input id="tray" class="tgl tgl-light left" data-setting="minimizeToTray" type="checkbox" />
<label class="header" data-string="settings-mintoTray"></label>
<input id="minimizeToTray" class="tgl tgl-light left" data-setting="minimizeToTray" type="checkbox" />
<label class="tgl-btn left" for="tray"></label>
<p class="description" data-string="settings-tray-desc"></p>
<p class="description" data-string="settings-mintoTray-desc"></p>
</div>
<br />
@ -60,6 +60,14 @@
</div>
<br />
<div class="switch acTray">
<label class="header" data-string="settings-tray"></label>
<input id="tray" class="tgl tgl-light left" data-setting="tray" type="checkbox" />
<label class="tgl-btn left" for="tray"></label>
<p class="description" data-string="settings-tray-desc"></p>
</div>
<br />
<div class="switch acPatches">
<label class="header" data-string="settings-patches"></label>
<input id="patches" class="tgl tgl-light left" data-setting="automaticPatches" type="checkbox" />

42
src/setup/main.ts Normal file
View file

@ -0,0 +1,42 @@
import {BrowserWindow, app, ipcMain} from "electron";
import path from "path";
import * as fs from "fs";
import * as os from "os";
import {iconPath} from "../main";
import {Settings, getConfigLocation, setConfigBulk} from "../utils";
let setupWindow: BrowserWindow;
export function createSetupWindow(): void {
setupWindow = new BrowserWindow({
width: 390,
height: 470,
title: "ArmCord Setup",
darkTheme: true,
icon: iconPath,
frame: false,
autoHideMenuBar: true,
webPreferences: {
sandbox: false,
spellcheck: false,
preload: path.join(__dirname, "preload.js")
}
});
ipcMain.on("saveSettings", (_event, args: Settings) => {
console.log(args);
setConfigBulk(args);
});
ipcMain.on("setup-minimize", () => {
setupWindow.minimize();
});
ipcMain.on("setup-getOS", (event) => {
event.returnValue = process.platform;
});
ipcMain.on("setup-quit", async () => {
fs.unlink(await getConfigLocation(), (err) => {
if (err) throw err;
console.log('Closed during setup. "settings.json" was deleted');
app.quit();
});
});
setupWindow.loadURL(`file://${__dirname}/setup.html`);
}

12
src/setup/preload.ts Normal file
View file

@ -0,0 +1,12 @@
import {contextBridge, ipcRenderer} from "electron";
import {injectTitlebar} from "../preload/titlebar";
injectTitlebar();
contextBridge.exposeInMainWorld("armcordinternal", {
restart: () => ipcRenderer.send("restart"),
getOS: ipcRenderer.sendSync("setup-getOS"),
saveSettings: (...args: any) => ipcRenderer.send("saveSettings", ...args),
getLang: (toGet: string) =>
ipcRenderer.invoke("getLang", toGet).then((result) => {
return result;
})
});

View file

@ -7,9 +7,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ArmCord Setup</title>
<style>
@import url("css/setup.css");
@import url("../content/css/setup.css");
</style>
</head>
<body>
<div class="container">
<div id="warning" class="hidden">
@ -18,10 +19,9 @@
<div id="setup">
<div id="logo" class="hidden"></div>
<div id="page1" class="hidden">
<p id="setup_question1">Select the type of setup you want to perform.</p>
<p id="setup_question1">Welcome to the ArmCord Setup</p>
<div id="buttons">
<button id="express" class="center">Express</button>
<button id="full" class="center">Full</button>
<button id="full" class="center">Next</button>
</div>
</div>
@ -34,17 +34,8 @@
<option value="ptb">PTB</option>
</select>
</div>
<p class="text-center setup-ask" id="setup_question3">
Should ArmCord handle client mods installation?
</p>
<div class="center">
<select name="csp" id="csp" class="dropdown-button">
<option value="true">Yes</option>
<option value="false">No</option>
</select>
</div>
<div id="buttons">
<button id="next" class="center">Next</button>
<button id="next-page2" class="center">Next</button>
</div>
</div>
@ -57,32 +48,36 @@
<option value="none">None</option>
</select>
</div>
<p class="text-center" id="setup_question4_clientmodnotice">
Why not all of them? Having many client mods at the same time can cause issues. If you really
want to do it though, check our Discord ;)
</p>
<div id="buttons">
<button id="next" class="center">Next</button>
<button id="next-page3" class="center">Next</button>
</div>
</div>
<div id="page4" class="hidden">
<p class="text-center setup-ask" id="setup_question5">Do you want to use a tray icon?</p>
<div class="center">
<select name="tray" id="tray" class="dropdown-button">
<option value="true">Yes</option>
<option value="false">No</option>
</select>
</div>
<p class="text-center" id="linuxNotice"></p>
<div id="buttons">
<button id="next-page4" class="center">Next</button>
</div>
</div>
</div>
</div>
<script>
async function loadLang() {
document.getElementById("next").innerHTML = await armcord.getLang("next");
document.getElementById("setup_offline").innerHTML = await armcord.getLang("setup_offline");
document.getElementById("setup_question1").innerHTML = await armcord.getLang("setup_question1");
document.getElementById("express").innerHTML = await armcord.getLang("setup_question1_answer1");
document.getElementById("full").innerHTML = await armcord.getLang("setup_question1_answer2");
document.getElementById("setup_question2").innerHTML = await armcord.getLang("setup_question2");
document.getElementById("setup_question3").innerHTML = await armcord.getLang("setup_question3");
document.getElementById("setup_question4").innerHTML = await armcord.getLang("setup_question4");
document.getElementById("setup_question4_clientmodnotice").innerHTML = await armcord.getLang(
"setup_question4_clientmodnotice"
);
//select stuff1
document.getElementById("csp").options[1].text = await armcord.getLang("no");
document.getElementById("csp").options[0].text = await armcord.getLang("yes");
document.getElementById("next").innerHTML = await armcordinternal.getLang("next");
document.getElementById("setup_offline").innerHTML = await armcordinternal.getLang("setup_offline");
document.getElementById("setup_question1").innerHTML = await armcordinternal.getLang("setup_question1");
document.getElementById("express").innerHTML = await armcordinternal.getLang("setup_question1_answer1");
document.getElementById("full").innerHTML = await armcordinternal.getLang("setup_question1_answer2");
document.getElementById("setup_question2").innerHTML = await armcordinternal.getLang("setup_question2");
document.getElementById("setup_question3").innerHTML = await armcordinternal.getLang("setup_question3");
document.getElementById("setup_question4").innerHTML = await armcordinternal.getLang("setup_question4");
document.getElementById("setup_question5").innerHTML = await armcordinternal.getLang("setup_question5");
}
loadLang();
</script>
@ -108,68 +103,31 @@
let page2 = document.getElementById("page2");
let page3 = document.getElementById("page3");
let page4 = document.getElementById("page4");
// }}}
// Express
page1.buttons[0].addEventListener("click", () => {
window.armcordinternal.saveSettings({
windowStyle: "default",
channel: "stable",
armcordCSP: true,
minimizeToTray: true,
alternativePaste: false,
automaticPatches: false,
mods: "none",
useLegacyCapturer: false,
inviteWebsocket: true,
mobileMode: false,
dynamicIcon: false,
trayIcon: "default",
startMinimized: false,
spellcheck: true,
performanceMode: "none"
});
setTimeout(() => window.armcordinternal.restart(), 500);
});
// Full
page1.buttons[1].addEventListener("click", () => {
page1.buttons[0].addEventListener("click", () => {
page1.classList.add("hidden");
page2.classList.remove("hidden");
});
page2.buttons = document.querySelectorAll("#page2 > #buttons > button");
page2.buttons[0].addEventListener("click", () => {
document.getElementById("next-page2").addEventListener("click", () => {
options.channel = document.getElementById("channel").value;
options.csp = document.getElementById("csp").value;
options.mod = document.getElementById("mod").value;
page2.classList.add("hidden");
page3.buttons = document.querySelectorAll("#page3 > #buttons > button");
if (options.csp === "true") {
page3.classList.remove("hidden");
page3.buttons[0].addEventListener("click", () => {
options.mod = document.getElementById("mod").value;
window.armcordinternal.saveSettings({
windowStyle: "default",
channel: options.channel,
armcordCSP: true,
minimizeToTray: true,
mobileMode: false,
automaticPatches: false,
performanceMode: "none",
useLegacyCapturer: false,
alternativePaste: false,
dynamicIcon: false,
spellcheck: true,
disableAutogain: false,
startMinimized: false,
trayIcon: "default",
mods: options.mod,
inviteWebsocket: true
});
setTimeout(() => window.armcordinternal.restart(), 500);
});
} else {
page3.classList.remove("hidden");
document.getElementById("next-page3").addEventListener("click", () => {
page3.classList.add("hidden");
page4.classList.remove("hidden");
});
if (window.armcordinternal.getOS == "win32") {
document.getElementById("tray").value = "false";
document.getElementById(
"linuxNotice"
).innerHTML = `Linux may not work well with tray icons. Depending on your system configuration, you may not be able to see the tray icon. Enable at your own risk. Can be changed later.`;
}
document.getElementById("next-page4").addEventListener("click", () => {
window.armcordinternal.saveSettings({
windowStyle: "default",
channel: options.channel,
@ -179,9 +137,10 @@
mobileMode: false,
spellcheck: true,
disableAutogain: false,
mods: "none",
mods: options.mod,
dynamicIcon: false,
useLegacyCapturer: false,
tray: /true/i.test(document.getElementById("tray").value),
startMinimized: false,
alternativePaste: false,
performanceMode: "none",
@ -189,7 +148,7 @@
inviteWebsocket: true
});
setTimeout(() => window.armcordinternal.restart(), 500);
}
});
});
document.body.setAttribute("insetup", "");
</script>

View file

@ -1,7 +1,7 @@
import * as fs from "fs";
import {Menu, Tray, app, nativeImage} from "electron";
import {Menu, Tray, app, dialog, nativeImage} from "electron";
import {createInviteWindow, mainWindow} from "./window";
import {getConfig, getConfigLocation, getDisplayVersion, setWindowState} from "./utils";
import {getConfig, getConfigLocation, getDisplayVersion, setConfig, setWindowState} from "./utils";
import * as path from "path";
import {createSettingsWindow} from "./settings/main";
export let tray: any = null;
@ -25,13 +25,61 @@ app.whenReady().then(async () => {
};
if (process.platform == "darwin" && trayPath.getSize().height > 22) trayPath = trayPath.resize({height: 22});
if (await getConfig("tray")) {
let clientName = (await getConfig("clientName")) ?? "ArmCord";
if ((await getConfig("windowStyle")) == "basic") {
tray = new Tray(trayPath);
function contextMenu(): Electron.Menu {
if (finishedSetup == false) {
return Menu.buildFromTemplate([
{
label: `Finish the setup first!`,
enabled: false
},
{
label: `Quit ${clientName}`,
async click() {
fs.unlink(await getConfigLocation(), (err) => {
if (err) throw err;
let clientName = (await getConfig("clientName")) ?? "ArmCord";
if ((await getConfig("windowStyle")) == "basic") {
tray = new Tray(trayPath);
function contextMenu(): Electron.Menu {
console.log('Closed during setup. "settings.json" was deleted');
app.quit();
});
}
}
]);
} else {
return Menu.buildFromTemplate([
{
label: `Open ${clientName}`,
click() {
mainWindow.show();
}
},
{
label: `Quit ${clientName}`,
click() {
let [width, height] = mainWindow.getSize();
setWindowState({
width,
height,
isMaximized: mainWindow.isMaximized(),
x: mainWindow.getPosition()[0],
y: mainWindow.getPosition()[1]
});
app.quit();
}
}
]);
}
}
tray.setToolTip(clientName);
tray.setContextMenu(contextMenu);
} else {
tray = new Tray(trayPath);
if (finishedSetup == false) {
return Menu.buildFromTemplate([
const contextMenu = Menu.buildFromTemplate([
{
label: `Finish the setup first!`,
enabled: false
@ -48,98 +96,78 @@ app.whenReady().then(async () => {
}
}
]);
tray.setContextMenu(contextMenu);
} else {
return Menu.buildFromTemplate([
const contextMenu = Menu.buildFromTemplate([
{
label: `${clientName} ${getDisplayVersion()}`,
icon: trayVerIcon(),
enabled: false
},
{
type: "separator"
},
{
label: `Open ${clientName}`,
click() {
mainWindow.show();
}
},
{
label: "Open Settings",
click() {
createSettingsWindow();
}
},
{
label: "Support Discord Server",
click() {
createInviteWindow("TnhxcqynZ2");
}
},
{
type: "separator"
},
{
label: `Quit ${clientName}`,
click() {
let [width, height] = mainWindow.getSize();
setWindowState({
width,
height,
isMaximized: mainWindow.isMaximized(),
x: mainWindow.getPosition()[0],
y: mainWindow.getPosition()[1]
});
app.quit();
}
}
]);
tray.setContextMenu(contextMenu);
}
}
tray.setToolTip(clientName);
tray.setContextMenu(contextMenu);
tray.on("click", function () {
mainWindow.show();
});
} else {
tray = new Tray(trayPath);
if (finishedSetup == false) {
const contextMenu = Menu.buildFromTemplate([
{
label: `Finish the setup first!`,
enabled: false
},
{
label: `Quit ${clientName}`,
async click() {
fs.unlink(await getConfigLocation(), (err) => {
if (err) throw err;
if ((await getConfig("tray")) == undefined) {
if (process.platform == "win32") {
const options = {
type: "question",
buttons: ["Yes, please", "No, I don't"],
defaultId: 1,
title: "Tray icon choice",
message: `Do you want to use tray icons?`,
detail: "Linux may not work well with tray icons. Depending on your system configuration, you may not be able to see the tray icon. Enable at your own risk. Can be changed later."
};
console.log('Closed during setup. "settings.json" was deleted');
app.quit();
});
dialog.showMessageBox(mainWindow, options).then(({response}) => {
if (response == 0) {
setConfig("tray", true);
} else {
setConfig("tray", false);
}
}
]);
tray.setContextMenu(contextMenu);
} else {
const contextMenu = Menu.buildFromTemplate([
{
label: `${clientName} ${getDisplayVersion()}`,
icon: trayVerIcon(),
enabled: false
},
{
type: "separator"
},
{
label: `Open ${clientName}`,
click() {
mainWindow.show();
}
},
{
label: "Open Settings",
click() {
createSettingsWindow();
}
},
{
label: "Support Discord Server",
click() {
createInviteWindow("TnhxcqynZ2");
}
},
{
type: "separator"
},
{
label: `Quit ${clientName}`,
click() {
app.quit();
}
}
]);
tray.setContextMenu(contextMenu);
app.relaunch();
app.exit();
});
} else {
setConfig("tray", true);
app.relaunch();
app.exit();
}
}
}
tray.setToolTip(clientName);
tray.on("click", function () {
mainWindow.show();
});
});

View file

@ -52,6 +52,7 @@ export function setup(): void {
inviteWebsocket: true,
startMinimized: false,
dynamicIcon: false,
tray: true,
disableAutogain: false,
useLegacyCapturer: false,
mobileMode: false,
@ -260,6 +261,7 @@ export interface Settings {
performanceMode: string;
startMinimized: boolean;
useLegacyCapturer: boolean;
tray: boolean;
inviteWebsocket: boolean;
disableAutogain: boolean;
trayIcon: string;

View file

@ -23,6 +23,7 @@ import contextMenu from "electron-context-menu";
import os from "os";
import {tray} from "./tray";
import {iconPath} from "./main";
import {createSetupWindow} from "./setup/main";
export let mainWindow: BrowserWindow;
export let inviteWindow: BrowserWindow;
@ -256,12 +257,8 @@ async function doAfterDefiningTheWindow(): Promise<void> {
}
if (firstRun) {
await setLang(new Intl.DateTimeFormat().resolvedOptions().locale);
mainWindow.setSize(390, 470);
await mainWindow.loadFile(path.join(__dirname, "/content/setup.html"));
let trayPath = nativeImage.createFromPath(path.join(__dirname, "../", `/assets/ac_plug_colored.png`));
if (process.platform === "darwin" && trayPath.getSize().height > 22) trayPath = trayPath.resize({height: 22});
if (process.platform === "win32" && trayPath.getSize().height > 32) trayPath = trayPath.resize({height: 32});
tray.setImage(trayPath);
createSetupWindow();
mainWindow.close();
} else if ((await getConfig("skipSplash")) == true) {
// It's modified elsewhere.
// eslint-disable-next-line no-unmodified-loop-condition