Added basic menu-bar and about window
This commit is contained in:
Joel Collins
parent
8c9c50b586
commit
a821c2b00d
5 changed files with 127 additions and 14 deletions
13
app.dev.js
13
app.dev.js
|
|
@ -1,20 +1,21 @@
|
|||
const electron = require('electron')
|
||||
const contextMenu = require('electron-context-menu')
|
||||
const path = require('path')
|
||||
|
||||
const app = electron.app
|
||||
const BrowserWindow = electron.BrowserWindow
|
||||
const contextMenu = require('electron-context-menu');
|
||||
|
||||
let url = 'http://localhost:8080/'
|
||||
|
||||
// Set the application menu
|
||||
require('./menu.js')
|
||||
|
||||
app.on('ready', () => {
|
||||
let window = new BrowserWindow({
|
||||
width: 1124,
|
||||
height: 800,
|
||||
// Remove the window frame from windows applications
|
||||
//frame: false,
|
||||
// Hide the titlebar from MacOS applications while keeping the stop lights
|
||||
//titleBarStyle: 'hidden', // or 'customButtonsOnHover',
|
||||
icon: path.join(__dirname, '/icons/png/64x64.png')
|
||||
})
|
||||
//window.setMenu(null);
|
||||
|
||||
contextMenu({
|
||||
showCopyImageAddress: true,
|
||||
|
|
|
|||
14
app.js
14
app.js
|
|
@ -5,18 +5,22 @@
|
|||
return;
|
||||
}
|
||||
|
||||
// Required packages
|
||||
const electron = require('electron')
|
||||
const contextMenu = require('electron-context-menu');
|
||||
const contextMenu = require('electron-context-menu')
|
||||
const path = require('path')
|
||||
|
||||
// Set up the app
|
||||
const app = electron.app
|
||||
const BrowserWindow = electron.BrowserWindow
|
||||
|
||||
const isDev = (process.env.NODE_ENV === 'DEV');
|
||||
|
||||
// Set the window content
|
||||
let url = `file://${path.join(__dirname, '/dist/index.html')}`
|
||||
let mainWindow
|
||||
|
||||
// Set the application menu
|
||||
require('./menu.js')
|
||||
|
||||
function createWindow() {
|
||||
// Create the browser window.
|
||||
mainWindow = new BrowserWindow({
|
||||
|
|
@ -25,12 +29,10 @@ function createWindow() {
|
|||
icon: path.join(__dirname, '/icons/png/64x64.png')
|
||||
})
|
||||
|
||||
mainWindow.setMenu(null);
|
||||
|
||||
contextMenu({
|
||||
showCopyImageAddress: true,
|
||||
showSaveImageAs: true,
|
||||
showInspectElement: isDev,
|
||||
showInspectElement: false,
|
||||
});
|
||||
|
||||
mainWindow.loadURL(url)
|
||||
|
|
|
|||
102
menu.js
Normal file
102
menu.js
Normal file
|
|
@ -0,0 +1,102 @@
|
|||
const { app, Menu } = require('electron')
|
||||
const path = require('path')
|
||||
|
||||
const openAboutWindow = require('about-window').default
|
||||
|
||||
const template = [
|
||||
{
|
||||
label: 'Edit',
|
||||
submenu: [
|
||||
{ role: 'undo' },
|
||||
{ role: 'redo' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'cut' },
|
||||
{ role: 'copy' },
|
||||
{ role: 'paste' },
|
||||
{ role: 'delete' },
|
||||
{ role: 'selectall' }
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'View',
|
||||
submenu: [
|
||||
{ role: 'reload' },
|
||||
{ role: 'forcereload' },
|
||||
{ role: 'toggledevtools' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'togglefullscreen' }
|
||||
]
|
||||
},
|
||||
{
|
||||
role: 'window',
|
||||
submenu: [
|
||||
{ role: 'minimize' },
|
||||
{ role: 'close' }
|
||||
]
|
||||
},
|
||||
{
|
||||
role: 'help',
|
||||
submenu: [
|
||||
{
|
||||
label: 'About',
|
||||
click () {
|
||||
openAboutWindow({
|
||||
icon_path: path.join(__dirname, '/icons/png/512x512.png'),
|
||||
bug_report_url: "https://gitlab.com/openflexure/openflexure-microscope-jsclient/issues",
|
||||
homepage: "https://gitlab.com/openflexure/openflexure-microscope-jsclient",
|
||||
package_json_dir: __dirname
|
||||
})
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
if (process.platform === 'darwin') {
|
||||
template.unshift({
|
||||
label: app.getName(),
|
||||
submenu: [
|
||||
{ role: 'about' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'services' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'hide' },
|
||||
{ role: 'hideothers' },
|
||||
{ role: 'unhide' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'quit' }
|
||||
]
|
||||
})
|
||||
|
||||
// Edit menu
|
||||
template[1].submenu.push(
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'Speech',
|
||||
submenu: [
|
||||
{ role: 'startspeaking' },
|
||||
{ role: 'stopspeaking' }
|
||||
]
|
||||
}
|
||||
)
|
||||
|
||||
// Window menu
|
||||
template[3].submenu = [
|
||||
{ role: 'close' },
|
||||
{ role: 'minimize' },
|
||||
{ role: 'zoom' },
|
||||
{ type: 'separator' },
|
||||
{ role: 'front' }
|
||||
]
|
||||
}
|
||||
else {
|
||||
template.unshift({
|
||||
label: 'File',
|
||||
submenu: [
|
||||
{ role: 'quit' }
|
||||
]
|
||||
})
|
||||
}
|
||||
|
||||
const menu = Menu.buildFromTemplate(template)
|
||||
Menu.setApplicationMenu(menu)
|
||||
8
package-lock.json
generated
8
package-lock.json
generated
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "openflexure-ev",
|
||||
"version": "0.1.0",
|
||||
"version": "0.1.1-alpha",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
|
@ -1432,6 +1432,12 @@
|
|||
"integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==",
|
||||
"dev": true
|
||||
},
|
||||
"about-window": {
|
||||
"version": "1.12.1",
|
||||
"resolved": "https://registry.npmjs.org/about-window/-/about-window-1.12.1.tgz",
|
||||
"integrity": "sha512-P/fJACq7RBFpv5Ql0kIqpOYgFqQ8WdoZoB7wrKmDvwTSKVOMbUZMYnQYtnOW6dHmMCYuNrmQFf+MxvuhE+KrzQ==",
|
||||
"dev": true
|
||||
},
|
||||
"accepts": {
|
||||
"version": "1.3.5",
|
||||
"resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.5.tgz",
|
||||
|
|
|
|||
|
|
@ -7,12 +7,13 @@
|
|||
"description": "An electron-based user client for the OpenFlexure Microscope Server",
|
||||
"main": "app.js",
|
||||
"version": "0.1.1-alpha",
|
||||
"license": "GNU General Public License v3.0 ",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"dev": "set NODE_ENV=DEV&& electron app.dev.js",
|
||||
"run": "vue-cli-service build && electron app.js",
|
||||
"run": "vue-cli-service build && electron .",
|
||||
"package-win": "electron-packager . openflexure-ev --ignore=^/src --overwrite --asar=true --platform=win32 --arch=x64 --icon=icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName=\"OpenFlexure Microscope JS\"",
|
||||
"package-linux": "electron-packager . openflexure-ev --ignore=^/src --overwrite --asar=true --platform=linux --arch=x64 --icon=icons/png/1024x1024.png --prune=true --out=release-builds",
|
||||
"package-rpi": "electron-packager . openflexure-ev --ignore=^/src --overwrite --asar=true --platform=linux --electron-version=3.0.13 --arch=armv7l --icon=icons/png/1024x1024.png --prune=true --out=release-builds",
|
||||
|
|
@ -26,6 +27,7 @@
|
|||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "^3.3.0",
|
||||
"@vue/cli-service": "^3.3.0",
|
||||
"about-window": "^1.12.1",
|
||||
"axios": "^0.18.0",
|
||||
"css-loader": "^2.1.0",
|
||||
"electron": "^4.0.5",
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue