Home

Awesome

'About This App' Window for Electron Apps

npm version

This package provides 'About This App' window for Electron applications.

You can install this module via npm.

$ npm install about-window

Usage

Only one function is exported as default. Please see TypeScript type definition. The function can be called from both main process and renderer process.

export default function openAboutWindow(info: {
    icon_path: string;
    product_name?: string;
    package_json_dir?: string;
    about_page_dir?: string;
    bug_report_url?: string;
    bug_link_text?: string;
    copyright?: string;
    homepage?: string;
    description?: string;
    license?: string;
    css_path?: string | string[];
    adjust_window_size?: boolean;
    win_options?: BrowserWindowOptions;
    use_version_info?: boolean | [string, string][];
    show_close_button?: string;
    app?: Electron.App;
    BrowserWindow?: typeof Electron.BrowserWindow;
    ipcMain?: Electron.IpcMain;
}): BrowserWindow

Only icon_path property is required, others are optional. I recommend to specify as below to extract information from package.json as much as possible. Path to package.json is also automatically detected if possible.

openAboutWindow({
    icon_path: 'path/to/icon.png'
});

If string value is passed to the first parameter, it is passed to icon_path. So following is a shorthand of above code:

openAboutWindow('path/to/icon.png');

You can check an example app to know how to use this package.

$ git clone https://github.com/rhysd/about-window.git
$ cd about-window/example
$ npm install
$ npm start

# Or for debug
$ npm run debug

Parameter's properties of openAboutWindow()

NameDescriptionType
icon_pathPath to icon file of the application. The path is passed to src property of <img> element. Requiredstring
package_json_dirPath to directory which contains package.json. If not specified, it will try to detect a path to package.json. If also failed, it gives up and show less information in 'About This App' window. Optionalstring
bug_report_urlURL to bug report page. If not specified, 'bugs' entry in package.json is used. Optionalstring
copyrightCopyright notice shown in window. If not specified, it is replaced with license description generated by 'license' entry of package.json. Optionalstring
homepageURL of application's web page. If not specified, 'homepage' entry of package.json is used instead. Optionalstring
descriptionDescription of the application. If not specified, 'description' entry of package.json is used instead. Optionalstring
licenseLicense of the application. If not specified, 'license' entry of package.json is used instead. This property is used when copyright is not specified. Optionalstring
win_optionsOptions of 'About This App' window. It is merged into default options. OptionalBrowserWindow options object
css_pathPath(s) to user-defined CSS file. It will be inserted to DOM of the window. Optional(array of) string
adjust_window_sizeAdjust the window size to its content not to show scroll bar. Optionalboolean
open_devtoolsFor debug purpose, Chrome DevTools will start when the window is opened. Optionalboolean
use_inner_htmlIf true, set the value with .innerHTML on copyright, license and description Default is false. Optionalboolean
bug_link_textText for a bug report link. Optionalstring
product_nameName of the application Optionalstring
use_version_infoIf is false, nothing will be displayed, if is true, the versions of electron, chrome, node, and v8 will be displayed, if is an array of string tuple, its entries will be displayed. Default is true. Optionalboolean
show_close_buttonIf this is a valid string, a close button with this string be displayed. Optionalstring
about_page_dirDirectory path which contains about.html which is rendered in 'About this app' window. Optionalstring
appapp instance to use. This property is necessary only when using on renderer processes. OptionalElectron.App
BrowserWindowConstructor of BrowserWindow to use. This property is necessary only when using on renderer processes. OptionalElectron.BrowserWindow
ipcMainipcMain instance to use. This property is necessary only when using on renderer processes. OptionalElectron.IpcMain

Note: If you set use_inner_html to true, please ensure that contents don't contain any untrusted external input in order to avoid XSS. Be careful.

Open the window from non-main process

Since openAboutWindow() depends on several APIs only available on main process, they must be provided by caller when it is called on non-main process.

To mimic the APIs, use @electron/remote module.

import {app, BrowserWindow, ipcMain} from '@electron/remote';

openAboutWindow({
    icon_path: 'path/to/icon.png'
    app,
    BrowserWindow,
    ipcMain,
});

Screen Shots

Linux

Linux screenshot

OS X

OS X screenshot

Windows

Windows screenshot

License

MIT License.