Skip to content

Commit 0de5000

Browse files
committed
Initial release of the electron development project
1 parent b27577a commit 0de5000

File tree

6 files changed

+2027
-0
lines changed

6 files changed

+2027
-0
lines changed

.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
dist

README.md

+18
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,20 @@
11
# electron_development
22
Example project to get up and running with Electron Development quickly
3+
4+
*NOTE: For the moment the binaries are built for the Raspberry Pi*
5+
6+
## Environment Variables
7+
Run this executable with the following Environment Variables set...
8+
<dl>
9+
<dt>ELECTRON_START_URL</dt>
10+
<dd>The URL for a webpack dev server (for example) that will serve the content for the app.</dd>
11+
<dt>ELECTRON_KIOSK</dt>
12+
<dd>Set this environment variable to 1 to show full screen without title.</dd>
13+
<dt>ELECTRON_WIDTH</dt>
14+
<dd>The width of the window to display (incompatible with ELECTRON_KIOSK).</dd>
15+
<dt>ELECTRON_HEIGHT</dt>
16+
<dd>The height of the window to display (incompatible with ELECTRON_KIOSK).</dd>
17+
<dt>ELECTRON_DEV_TOOLS</dt>
18+
<dd>Display the dev tools window.</dd>
19+
</dl>
20+

electron/electron.js

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
const electron = require('electron');
2+
// Module to control application life.
3+
const app = electron.app;
4+
// Module to create native browser window.
5+
const BrowserWindow = electron.BrowserWindow;
6+
7+
const path = require('path');
8+
const url = require('url');
9+
10+
// Keep a global reference of the window object, if you don't, the window will
11+
// be closed automatically when the JavaScript object is garbage collected.
12+
let mainWindow;
13+
const createWindow = () => {
14+
const { displayWidth, displayHeight } = electron.screen.getPrimaryDisplay().size;
15+
16+
const mainWindowParams = {
17+
width: +process.env.ELECTRON_WIDTH || 800,
18+
height: +process.env.ELECTRON_HEIGHT || 600,
19+
webPreferences: {
20+
webSecurity: process.env.NODE_ENV === 'development' ? false : true,
21+
},
22+
};
23+
const kioskParams = {
24+
displayWidth,
25+
displayHeight,
26+
frame: false,
27+
fullscreen: true,
28+
webPreferences: {
29+
webSecurity: process.env.NODE_ENV === 'development' ? false : true,
30+
},
31+
};
32+
33+
// Create the browser window.
34+
mainWindow = new BrowserWindow(process.env.ELECTRON_KIOSK ? kioskParams : mainWindowParams);
35+
36+
// and load the index.html of the app.
37+
const startUrl = process.env.ELECTRON_START_URL || url.format({
38+
pathname: path.join(__dirname, 'index.html'),
39+
protocol: 'file:',
40+
slashes: true,
41+
});
42+
console.log(`Using start url = ${startUrl}`);
43+
mainWindow.loadURL(startUrl);
44+
45+
// Open the DevTools.
46+
process.env.ELECTRON_DEV_TOOLS && mainWindow.webContents.openDevTools();
47+
48+
// Emitted when the window is closed.
49+
mainWindow.on('closed', () => {
50+
// Dereference the window object, usually you would store windows
51+
// in an array if your app supports multi windows, this is the time
52+
// when you should delete the corresponding element.
53+
mainWindow = null;
54+
});
55+
}
56+
57+
// This method will be called when Electron has finished
58+
// initialization and is ready to create browser windows.
59+
// Some APIs can only be used after this event occurs.
60+
app.on('ready', createWindow);
61+
62+
// Quit when all windows are closed.
63+
app.on('window-all-closed', () => {
64+
// On OS X it is common for applications and their menu bar
65+
// to stay active until the user quits explicitly with Cmd + Q
66+
if (process.platform !== 'darwin') {
67+
app.quit()
68+
}
69+
});
70+
71+
app.on('activate', () => {
72+
// On OS X it's common to re-create a window in the app when the
73+
// dock icon is clicked and there are no other windows open.
74+
if (mainWindow === null) {
75+
createWindow()
76+
}
77+
});
78+
79+
// In this file you can include the rest of your app's specific main process
80+
// code. You can also put them in separate files and require them here.
81+

electron/index.html

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<html>
2+
<head>
3+
</head>
4+
<body>
5+
<h1>Electron Development</h1>
6+
<div>
7+
Run this executable with the following Environment Variables set...
8+
<dl>
9+
<dt>ELECTRON_START_URL</dt>
10+
<dd>The URL for a webpack dev server (for example) that will serve the content for the app.</dd>
11+
<dt>ELECTRON_KIOSK</dt>
12+
<dd>Set this environment variable to 1 to show full screen without title.</dd>
13+
<dt>ELECTRON_WIDTH</dt>
14+
<dd>The width of the window to display (incompatible with ELECTRON_KIOSK).</dd>
15+
<dt>ELECTRON_HEIGHT</dt>
16+
<dd>The height of the window to display (incompatible with ELECTRON_KIOSK).</dd>
17+
<dt>ELECTRON_DEV_TOOLS</dt>
18+
<dd>Display the dev tools window.</dd>
19+
</dl>
20+
</div>
21+
</body>
22+
</html>

package.json

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{
2+
"name": "electron_development",
3+
"version": "1.0.0",
4+
"description": "Base Electron Project For Development",
5+
"main": "electron/electron.js",
6+
"author": "Matt Paine <[email protected]>",
7+
"license": "MIT",
8+
"private": false,
9+
"scripts": {
10+
"clean": "rm -fr dist build",
11+
"electron": "electron .",
12+
"dist": "yarn dist:pi",
13+
"dist:pi": "electron-builder --linux AppImage --armv7l"
14+
},
15+
"devDependencies": {
16+
"electron-builder": "^20.3.1",
17+
"electron": "1.7.9"
18+
},
19+
"build": {
20+
"appId": "com.mattsoftware.electron_development",
21+
"productName": "Electron Builder",
22+
"copyright": "Copyright © 2018 Matt Paine <[email protected]>",
23+
"appImage": {
24+
"systemIntegration": "doNotAsk"
25+
},
26+
"snap": null,
27+
"extends": null
28+
}
29+
}

0 commit comments

Comments
 (0)