From 0e2939b79026eff67ee3a903d421812c25f7baa5 Mon Sep 17 00:00:00 2001 From: LawnCable Date: Mon, 1 Mar 2021 22:23:12 +0100 Subject: centralize electron functions of screenshotpage to a runtime file remove some set innerHTML instances. --- src/main/manaplus/manaplus.ts | 24 ++++++++--------- src/renderer/gameserver/onlineCount.ts | 8 ++++-- src/renderer/gameserver/serverView/screenshots.ts | 32 +++++++++++++---------- src/renderer/gameserver/socialLink.ts | 4 ++- src/renderer/runtime.ts | 20 ++++++++++++++ 5 files changed, 59 insertions(+), 29 deletions(-) create mode 100644 src/renderer/runtime.ts diff --git a/src/main/manaplus/manaplus.ts b/src/main/manaplus/manaplus.ts index 15a3282..3a4a6f5 100644 --- a/src/main/manaplus/manaplus.ts +++ b/src/main/manaplus/manaplus.ts @@ -115,19 +115,19 @@ please check you network connection first.", } } -ipcMain.on("getScreenshots", (event: any, arg: string) => { +ipcMain.handle("getScreenshots", async (_event: any, arg: string) => { const screenshotsDir = join(getUserDataPath(), "/screenshots/", `${arg}/`); - fs.existsSync(screenshotsDir) || fs.mkdirSync(screenshotsDir); - fs.readdir(screenshotsDir, (err, dir) => { - let screenshots: string[] = []; - for (var i = 0, path; (path = dir[i]); i++) { - screenshots.push(path); - } - event.sender.send("getScreenshots", { - dir: screenshotsDir, - screenshots: screenshots.reverse().slice(0, 24), - }); - }); + (await fs.existsSync(screenshotsDir)) || (await fs.mkdirSync(screenshotsDir)); + const dir = await fs.readdir(screenshotsDir); + + let screenshots: string[] = []; + for (var i = 0, path; (path = dir[i]); i++) { + screenshots.push(path); + } + return { + dir: screenshotsDir, + screenshots: screenshots.reverse().slice(0, 24), + }; }); EventEmitter.on("Mana:openScreenshotDir", () => { diff --git a/src/renderer/gameserver/onlineCount.ts b/src/renderer/gameserver/onlineCount.ts index b1c8271..3d5e75a 100644 --- a/src/renderer/gameserver/onlineCount.ts +++ b/src/renderer/gameserver/onlineCount.ts @@ -12,7 +12,9 @@ export async function makeOnlineCounterList( console.log(err); const OnlineCounterContainer = document.createElement("span"); OnlineCounterContainer.classList.add("onlineCounter"); - OnlineCounterContainer.innerHTML = `Error:
${err}`; + OnlineCounterContainer.innerHTML = + 'Error:
'; + OnlineCounterContainer.append(document.createTextNode(err)); return OnlineCounterContainer; } } @@ -33,7 +35,9 @@ function generateHTML(onlinePlayers: string[]): HTMLElement { displayed_players.forEach((playername) => { const PlayerItem = document.createElement("span"); PlayerItem.classList.add("playerItem"); - PlayerItem.innerHTML = `${playername}`; + PlayerItem.innerHTML = + ''; + PlayerItem.append(document.createTextNode(playername)); PlayerList.appendChild(PlayerItem); }); diff --git a/src/renderer/gameserver/serverView/screenshots.ts b/src/renderer/gameserver/serverView/screenshots.ts index 3157365..b2c0abf 100644 --- a/src/renderer/gameserver/serverView/screenshots.ts +++ b/src/renderer/gameserver/serverView/screenshots.ts @@ -1,4 +1,4 @@ -import { ipcRenderer, shell } from "electron"; +import { ML_Runtime } from "../../runtime"; import { GameServerPage } from "./serverPage"; export class ServerScreenshotPage extends GameServerPage { @@ -7,24 +7,28 @@ export class ServerScreenshotPage extends GameServerPage { screenshotContainer.classList.add("screenshotsContainer"); screenshotContainer.id = "screenshots"; - ipcRenderer.send("getScreenshots", this.server.profile.address); + ML_Runtime.getScreenshots(this.server.profile.address) + .then(this.dataLoadedCallback.bind(null, screenshotContainer)) + .catch((err) => { + // handle this? + console.error(err); + }); return screenshotContainer; } -} -ipcRenderer.on( - "getScreenshots", - (event: any, data: { dir: string; screenshots: string[] }) => { + private dataLoadedCallback( + screenshotContainer: HTMLDivElement, + data: { dir: string; screenshots: string[] } + ) { console.log(data); - const screenshots = document.getElementById("screenshots"); - if (screenshots) { + if (screenshotContainer) { // Display screenshots if that tab is open if (data.screenshots.length !== 0) { data.screenshots.forEach((fileName: string) => { const screenshot = document.createElement("div"); screenshot.classList.add("screenshot"); - screenshots.appendChild(screenshot); + screenshotContainer.appendChild(screenshot); const img = document.createElement("img"); img.src = data.dir + fileName; screenshot.appendChild(img); @@ -34,7 +38,7 @@ ipcRenderer.on( // screenshot.appendChild(text); screenshot.addEventListener("dragstart", (event) => { event.preventDefault(); - ipcRenderer.send("dragFileOut", data.dir + fileName); + ML_Runtime.dragFileOut(data.dir + fileName); }); }); } else { @@ -43,15 +47,15 @@ ipcRenderer.on( nothingHere.innerText = "There is nothing here, yet. Make some screenshots in Game and come back here. The default key for snaping screenshots is 'P'."; - screenshots.appendChild(nothingHere); + screenshotContainer.appendChild(nothingHere); } const openFolderButton = document.createElement("button"); openFolderButton.innerText = "Open folder to see all"; openFolderButton.addEventListener("click", () => { - shell.openPath(data.dir); + ML_Runtime.openFolder(data.dir); }); - screenshots.appendChild(openFolderButton); + screenshotContainer.appendChild(openFolderButton); } } -); +} diff --git a/src/renderer/gameserver/socialLink.ts b/src/renderer/gameserver/socialLink.ts index 9c7e353..2c0e256 100644 --- a/src/renderer/gameserver/socialLink.ts +++ b/src/renderer/gameserver/socialLink.ts @@ -13,7 +13,9 @@ export class socialLink { element.onclick = () => { this.open(); }; - element.innerHTML = ``; + const icon = document.createElement("i"); + icon.className = this.icon; + element.append(icon); element.title = this.tooltip; return element; } diff --git a/src/renderer/runtime.ts b/src/renderer/runtime.ts new file mode 100644 index 0000000..9e4a887 --- /dev/null +++ b/src/renderer/runtime.ts @@ -0,0 +1,20 @@ +import { ipcRenderer, shell } from "electron"; + +class Runtime { + async getScreenshots( + server_address: string + ): Promise<{ dir: string; screenshots: string[] }> { + return await ipcRenderer.invoke("getScreenshots", server_address); + } + + /** used to drag n' drop screenshots out of the window */ + dragFileOut(filepath: string): void { + ipcRenderer.send("dragFileOut", filepath); + } + + openFolder(dir: string) { + shell.openPath(dir); + } +} + +export const ML_Runtime = new Runtime(); -- cgit v1.2.3-60-g2f50