diff --git a/app.js b/app.js index 36fb4dc..9bfaaa0 100644 --- a/app.js +++ b/app.js @@ -6,24 +6,53 @@ import { fileURLToPath } from 'url'; const __filename = fileURLToPath(import.meta.url); const __dirname = paths.dirname(__filename); -function createWindow() { - const win = new BrowserWindow({ - width: 800, - height: 600, - frame: false, - titleBarStyle: "hidden", - webPreferences: { - contextIsolation: true, - nodeIntegration: false, - webviewTag: true, +const WINDOW_SHORTCUTS = [ + process.platform === "darwin" ? "Command+R" : "Control+R", + "\\" +]; + +function createWindow({onTop = false}) { + const win = new BrowserWindow({ + width: 1200, + height: 800, + frame: false, + show: false, + titleBarStyle: "customButtonsOnHover", + webPreferences: { + contextIsolation: true, + nodeIntegration: false, + webviewTag: true, + } + }); + + if(onTop) { + win.setVisibleOnAllWorkspaces(true, { visibleOnFullScreen: true }); // necessary for full screen + win.setAlwaysOnTop(true, 'screen-saver', 1); // necessary so it doesn't bring you back out of full screen when spawned } - }); - win.loadFile('server/index.html'); + win.loadFile('server/index.html'); - win.webContents.on('did-fail-load', (e, code, desc) => { - console.log('Webview failed:', desc); -}); + win.on("focus", () => { + win.setVibrancy("appearance-based"); // full colors + }); + + win.on("blur", () => { + win.setVibrancy("selection"); // dims colors + }); + + win.webContents.on('did-finish-load', () => { + win.show(); + }); + + win.webContents.on('did-fail-load', (e, code, desc) => { + console.log('Webview failed:', desc); + }); + + win.on('closed', () => { + for (const key of WINDOW_SHORTCUTS) { + globalShortcut.unregister(key); + } + }); } let devToolsOpened = false; @@ -39,27 +68,38 @@ function toggleDevTools(win) { app.on("ready", async () => { // await Forms.init(); - createWindow(); + createWindow({onTop: false}); + + globalShortcut.register('CommandOrControl+Shift+Space', () => { + createWindow({onTop: true}); + }); // Register global shortcuts app.on("browser-window-focus", () => { - const reloadShortcut = process.platform === "darwin" ? "Command+R" : "Control+R"; - globalShortcut.register(reloadShortcut, () => { - BrowserWindow.getFocusedWindow().reload(); + const focused = BrowserWindow.getFocusedWindow(); + if (!focused) return; + + // Reload + globalShortcut.register(WINDOW_SHORTCUTS[0], () => { + focused.reload(); }); - globalShortcut.register("\\", () => { - toggleDevTools(BrowserWindow.getFocusedWindow()); + + // Devtools + globalShortcut.register(WINDOW_SHORTCUTS[1], () => { + toggleDevTools(focused); }); }); app.on("browser-window-blur", () => { - globalShortcut.unregisterAll(); + for (const key of WINDOW_SHORTCUTS) { + globalShortcut.unregister(key); + } }); }); app.on("activate", () => { if (BrowserWindow.getAllWindows().length === 0) { - createWindow(); + createWindow({onTop: false}); } }); diff --git a/server/index.html b/server/index.html index affadf0..17d8b68 100644 --- a/server/index.html +++ b/server/index.html @@ -8,11 +8,12 @@ body { margin: 0; overflow: hidden; + background-color: #6A2C1C; } .draggable { -webkit-app-region: drag; - height: 20px; + height: 40px; position: fixed; top: 0; left: 0; diff --git a/ui/_/code/shared.css b/ui/_/code/shared.css index dd4fb48..82248ac 100644 --- a/ui/_/code/shared.css +++ b/ui/_/code/shared.css @@ -17,8 +17,9 @@ @media (prefers-color-scheme: dark) { :root { - --main: #BD410D; + --main: #6A2C1C; --accent: var(--tan); --accent2: var(--green); + --accent3: #c74109 } } \ No newline at end of file diff --git a/ui/components/Home.js b/ui/components/Home.js index 0c7ad3d..0a4efba 100644 --- a/ui/components/Home.js +++ b/ui/components/Home.js @@ -4,8 +4,8 @@ class Home extends Shadow { render() { ZStack(() => { - input("", "20vw") - .backgroundColor("var(--darkred)") + input("", "60vw") + .backgroundColor("var(--accent3)") .color("var(--accent)") .border("none") .borderTop("1px solid var(--accent)") @@ -31,11 +31,14 @@ class Home extends Shadow { }) VStack(() => { - let json = this.getJSONData() + p(json.length + " Entries") + .marginBottom(2, em) + for(let i=0; i<100; i++) { p(json[i].name) .marginLeft(0, em) + .marginBottom(0.1, em) } }) .paddingLeft(5, em)