High level way to create menubar desktop applications with electron
This module provides boilerplate for setting up a menubar application using electron. all you have to do is point it at your index.html
and menubar icon and this will handle opening/closing a window when you click/blur.
Currently Mac OS only but patches welcome to add Windows/Linux support.
Watch the 1HR screen recording of me coding this module: https://www.youtube.com/watch?v=PAJAvsyaHs0
This module was written for + is used by Monu
npm install menubar --save
create a JS program like this:
var menubar = require('menubar')
var mb = menubar()
mb.on('ready', function ready () {
console.log('app is ready')
// your app code here
})
make sure there is also a index.html
file in dir
then use electron
or electron-packager
to build/run the app:
$ npm install electron-prebuilt -g
$ electron your-app.js
see example/
for a working example
the return value of mb
is an event emitter with these properties:
{
app: the electron require('app') instance,
window: the electron require('browser-window') instance,
tray: the electron require('tray') instance
}
you can pass an optional options object into the menubar constructor
dir
(defaultprocess.cwd()
) - the app source directoryindex
(defaultfile:// + opts.dir + index.html
) - the html to load for the pop up windowicon
(default opts.dir + 'Icon.png') - the png icon to use for the menubartray
(default created on-the-fly) - an electronTray
instance. if providedopts.icon
will be ignoredpreloadWindow
(default false) - Create BrowserWindow instance before it is used -- increasing resource usage, but making the click on the menubar load faster.width
(default 400) - window widthheight
(default 400) - window heightx
(default screen.workArea.width - opts.width - 200) - the x position of the windowy
(default screen.workArea.y) - the y position of the window
the return value of the menubar constructor is an event emitter
ready
- when the app has been created and initializedcreate-window
- the line before new BrowserWindow is calledafter-create-window
- the line after all window init code is doneshow
- the line before window.show is calledafter-show
- the line after window.show is calledhide
- the line before window.hide is called (on window blur)after-hide
- the line after window.hide is called