kochie · May 29, 2023 06:52 · May 29, 2023 · May 29, 2023
diff --git a/main.js b/main.js
@@ -7,6 +7,8 @@ function createWindow () {
   const mainWindow = new BrowserWindow({
     width: 800,
     height: 600,
+    backgroundMaterial: "acrylic",
+    transparent: true,
     webPreferences: {
       preload: path.join(__dirname, 'preload.js')
     }

diff --git a/index.html b/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">
+    <link href="./styles.css" rel="stylesheet">
+    <title>Hello World!</title>
+  </head>
+  <body>
+    <h1>Hello World!</h1>
+    We are using Node.js <span id="node-version"></span>,
+    Chromium <span id="chrome-version"></span>,
+    and Electron <span id="electron-version"></span>.
+
+    <!-- You can also require other files to run in this process -->
+    <script src="./renderer.js"></script>
+  </body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,43 @@
+// Modules to control application life and create native browser window
+const { app, BrowserWindow } = require('electron')
+const path = require('path')
+
+function createWindow () {
+  // Create the browser window.
+  const mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js')
+    }
+  })
+
+  // and load the index.html of the app.
+  mainWindow.loadFile('index.html')
+
+  // Open the DevTools.
+  // mainWindow.webContents.openDevTools()
+}
+
+// This method will be called when Electron has finished
+// initialization and is ready to create browser windows.
+// Some APIs can only be used after this event occurs.
+app.whenReady().then(() => {
+  createWindow()
+
+  app.on('activate', function () {
+    // On macOS it's common to re-create a window in the app when the
+    // dock icon is clicked and there are no other windows open.
+    if (BrowserWindow.getAllWindows().length === 0) createWindow()
+  })
+})
+
+// Quit when all windows are closed, except on macOS. There, it's common
+// for applications and their menu bar to stay active until the user quits
+// explicitly with Cmd + Q.
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
+})
+
+// In this file you can include the rest of your app's specific main process
+// code. You can also put them in separate files and require them here.
diff --git a/package.json b/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "debonair-talk-shelter-fmony",
+  "productName": "debonair-talk-shelter-fmony",
+  "description": "My Electron application description",
+  "keywords": [],
+  "main": "./main.js",
+  "version": "1.0.0",
+  "author": "rober",
+  "scripts": {
+    "start": "electron ."
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "electron": "24.4.0"
+  }
+}
diff --git a/preload.js b/preload.js
@@ -0,0 +1,17 @@
+/**
+ * The preload script runs before. It has access to web APIs
+ * as well as Electron's renderer process modules and some
+ * polyfilled Node.js functions.
+ *
+ * https://www.electronjs.org/docs/latest/tutorial/sandbox
+ */
+window.addEventListener('DOMContentLoaded', () => {
+  const replaceText = (selector, text) => {
+    const element = document.getElementById(selector)
+    if (element) element.innerText = text
+  }
+
+  for (const type of ['chrome', 'node', 'electron']) {
+    replaceText(`${type}-version`, process.versions[type])
+  }
+})
diff --git a/renderer.js b/renderer.js
@@ -0,0 +1,7 @@
+/**
+ * This file is loaded via the <script> tag in the index.html file and will
+ * be executed in the renderer process for that window. No Node.js APIs are
+ * available in this process because `nodeIntegration` is turned off and
+ * `contextIsolation` is turned on. Use the contextBridge API in `preload.js`
+ * to expose Node.js functionality from the main process.
+ */
diff --git a/styles.css b/styles.css
@@ -0,0 +1,3 @@
+/* styles.css */
+
+/* Add styles here to customize the appearance of your app */
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		/* styles.css */

		/* Add styles here to customize the appearance of your app */
No results found