Merge pull request #7471 from electron/update-standard-markdown

Use standard style JavaScript in all docs translations
This commit is contained in:
Zeke Sikelianos 2016-10-11 22:37:54 -07:00 committed by GitHub
commit 27e1938e9f
122 changed files with 1472 additions and 1468 deletions

View file

@ -6,13 +6,13 @@ anexarlas en el script principal de tu aplicación antes de que el evento [ready
módulo [app][app] sea emitido: módulo [app][app] sea emitido:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.commandLine.appendSwitch('remote-debugging-port', '8315'); app.commandLine.appendSwitch('remote-debugging-port', '8315')
app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1'); app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
app.on('ready', function() { app.on('ready', function () {
// Your code here // Your code here
}); })
``` ```
## --client-certificate=`path` ## --client-certificate=`path`

View file

@ -19,14 +19,14 @@ está comenzando a cargar la página web o el script principal.
Puede ser usado por el script precargado para añadir de nuevo los símbolos globales Puede ser usado por el script precargado para añadir de nuevo los símbolos globales
de Node eliminados, al alcance global cuando la integración de Node está apagada: de Node eliminados, al alcance global cuando la integración de Node está apagada:
```js ```javascript
// preload.js // preload.js
var _setImmediate = setImmediate; var _setImmediate = setImmediate
var _clearImmediate = clearImmediate; var _clearImmediate = clearImmediate
process.once('loaded', function() { process.once('loaded', function () {
global.setImmediate = _setImmediate; global.setImmediate = _setImmediate
global.clearImmediate = _clearImmediate; global.clearImmediate = _clearImmediate
}); })
``` ```
## Methods ## Methods

View file

@ -18,15 +18,15 @@ con el concepto de [scripts para proceso principal vs scripts para proceso rende
El script del proceso principal es como un script normal de Node.js: El script del proceso principal es como un script normal de Node.js:
```javascript ```javascript
var app = require('app'); var app = require('app')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var window = null; var window = null
app.on('ready', function() { app.on('ready', function () {
window = new BrowserWindow({width: 800, height: 600}); window = new BrowserWindow({width: 800, height: 600})
window.loadURL('https://github.com'); window.loadURL('https://github.com')
}); })
``` ```
El proceso renderer no es diferente de una página web normal, excepto por la El proceso renderer no es diferente de una página web normal, excepto por la

View file

@ -94,7 +94,7 @@ regresa un valor, él y su tipo son denotados abajo. Si se estaba a la escucha y
respondió a este evento se debería ver así: respondió a este evento se debería ver así:
```javascript ```javascript
Alarm.on('wake-up', function(time) { Alarm.on('wake-up', function (time) {
console.log(time) console.log(time)
}) })
``` ```

View file

@ -48,29 +48,29 @@ $ asar list /path/to/example.asar
Leer un archivo de nuestro paquete `asar`: Leer un archivo de nuestro paquete `asar`:
```javascript ```javascript
var fs = require('fs'); var fs = require('fs')
fs.readFileSync('/path/to/example.asar/file.txt'); fs.readFileSync('/path/to/example.asar/file.txt')
``` ```
Listar todos los archivos de la raíz: Listar todos los archivos de la raíz:
```javascript ```javascript
var fs = require('fs'); var fs = require('fs')
fs.readdirSync('/path/to/example.asar'); fs.readdirSync('/path/to/example.asar')
``` ```
Utilizar un módulo que se encuentra dentro del archivo: Utilizar un módulo que se encuentra dentro del archivo:
```javascript ```javascript
require('/path/to/example.asar/dir/module.js'); require('/path/to/example.asar/dir/module.js')
``` ```
También puedes mostrar una página web contenida en un `asar` utilizando `BrowserWindow`. También puedes mostrar una página web contenida en un `asar` utilizando `BrowserWindow`.
```javascript ```javascript
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var win = new BrowserWindow({width: 800, height: 600}); var win = new BrowserWindow({width: 800, height: 600})
win.loadURL('file:///path/to/example.asar/static/index.html'); win.loadURL('file:///path/to/example.asar/static/index.html')
``` ```
### API Web ### API Web
@ -96,8 +96,8 @@ si necesitáramos verificar la integridad del archivo con un checksum.
Para casos así es posible utilizar el módulo `original-fs`, que provee la API `fs` original: Para casos así es posible utilizar el módulo `original-fs`, que provee la API `fs` original:
```javascript ```javascript
var originalFs = require('original-fs'); var originalFs = require('original-fs')
originalFs.readFileSync('/path/to/example.asar'); originalFs.readFileSync('/path/to/example.asar')
``` ```
## Limitaciones de la API Node: ## Limitaciones de la API Node:

View file

@ -22,14 +22,14 @@ Para agregar un archivo a la lista de documentos recientes, puedes utilizar:
[app.addRecentDocument][addrecentdocument] API: [app.addRecentDocument][addrecentdocument] API:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.addRecentDocument('/Users/USERNAME/Desktop/work.type'); app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
``` ```
También puedes utilizar [app.clearRecentDocuments](clearrecentdocuments) para vaciar la lista de documentos recientes: También puedes utilizar [app.clearRecentDocuments](clearrecentdocuments) para vaciar la lista de documentos recientes:
```javascript ```javascript
app.clearRecentDocuments(); app.clearRecentDocuments()
``` ```
### Notas sobre Windows ### Notas sobre Windows
@ -60,17 +60,19 @@ __Menú dock de Terminal.app:__
Para establecer tu menú dock, puedes utilizar la API `app.dock.setMenu`, la cual sólo está disponible para macOS: Para establecer tu menú dock, puedes utilizar la API `app.dock.setMenu`, la cual sólo está disponible para macOS:
```javascript ```javascript
var app = require('app'); var app = require('app')
var Menu = require('menu'); var Menu = require('menu')
var dockMenu = Menu.buildFromTemplate([ var dockMenu = Menu.buildFromTemplate([
{ label: 'New Window', click: function() { console.log('New Window'); } }, {label: 'New Window', click: function () { console.log('New Window') }},
{ label: 'New Window with Settings', submenu: [ {label: 'New Window with Settings',
{ label: 'Basic' }, submenu: [
{ label: 'Pro'} {label: 'Basic'},
]}, {label: 'Pro'}
{ label: 'New Command...'} ]
]); },
app.dock.setMenu(dockMenu); {label: 'New Command...'}
])
app.dock.setMenu(dockMenu)
``` ```
## Tareas de usuario (Windows) ## Tareas de usuario (Windows)
@ -107,7 +109,7 @@ Para establecer las tareas de usuario en tu aplicación, puedes utilizar:
[app.setUserTasks][setusertaskstasks] API: [app.setUserTasks][setusertaskstasks] API:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.setUserTasks([ app.setUserTasks([
{ {
program: process.execPath, program: process.execPath,
@ -117,13 +119,13 @@ app.setUserTasks([
title: 'New Window', title: 'New Window',
description: 'Create a new window' description: 'Create a new window'
} }
]); ])
``` ```
Para purgar la lista de tareas, puedes llamar a `app.setUserTasks` con un array vacío: Para purgar la lista de tareas, puedes llamar a `app.setUserTasks` con un array vacío:
```javascript ```javascript
app.setUserTasks([]); app.setUserTasks([])
``` ```
Las tareas de usuario aún serán visibles después de cerrar tu aplicación, por lo cual Las tareas de usuario aún serán visibles después de cerrar tu aplicación, por lo cual
@ -157,8 +159,8 @@ Para establecer la barra de progreso de una ventana, puedes utilizar
[BrowserWindow.setProgressBar][setprogressbar] API: [BrowserWindow.setProgressBar][setprogressbar] API:
```javascript ```javascript
var window = new BrowserWindow({...}); var window = new BrowserWindow()
window.setProgressBar(0.5); window.setProgressBar(0.5)
``` ```
[addrecentdocument]: ../api/app.md#appaddrecentdocumentpath [addrecentdocument]: ../api/app.md#appaddrecentdocumentpath

View file

@ -18,14 +18,14 @@ Luego cargas la aplicación en Electron, abriendo devtools en cualquier ventana,
y ejecutando este código en la consola devtools: y ejecutando este código en la consola devtools:
```javascript ```javascript
require('remote').require('browser-window').addDevToolsExtension('/some-directory/react-devtools'); require('remote').require('browser-window').addDevToolsExtension('/some-directory/react-devtools')
``` ```
Para remover una extensión, puedes utilizar `BrowserWindow.removeDevToolsExtension` Para remover una extensión, puedes utilizar `BrowserWindow.removeDevToolsExtension`
especificando el nombre, y esta ya no se cargará la siguiente vez que abras devtools: especificando el nombre, y esta ya no se cargará la siguiente vez que abras devtools:
```javascript ```javascript
require('remote').require('browser-window').removeDevToolsExtension('React Developer Tools'); require('remote').require('browser-window').removeDevToolsExtension('React Developer Tools')
``` ```
## Formato de las extensiones devtools ## Formato de las extensiones devtools

View file

@ -6,14 +6,14 @@ como en este ejemplo:
_main.js_ _main.js_
```javascript ```javascript
var app = require('app'); var app = require('app')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var onlineStatusWindow; var onlineStatusWindow
app.on('ready', function() { app.on('ready', function () {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html'); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
``` ```
_online-status.html_ _online-status.html_
@ -43,19 +43,19 @@ Es posible reenviar el evento al proceso principal mediante la utilidad de inter
_main.js_ _main.js_
```javascript ```javascript
var app = require('app'); var app = require('app')
var ipc = require('ipc'); var ipc = require('ipc')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var onlineStatusWindow; var onlineStatusWindow
app.on('ready', function() { app.on('ready', function () {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html'); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
ipc.on('online-status-changed', function(event, status) { ipc.on('online-status-changed', function (event, status) {
console.log(status); console.log(status)
}); })
``` ```
_online-status.html_ _online-status.html_

View file

@ -54,7 +54,7 @@ El formato de `package.json` es exactamente el mismo que cualquier módulo Node,
y el script especificado en el campo `main` será el script de arranque de tu aplicación, y el script especificado en el campo `main` será el script de arranque de tu aplicación,
a ser ejecutado por el proceso principal. Un ejemplo de `package.json` podría verse así: a ser ejecutado por el proceso principal. Un ejemplo de `package.json` podría verse así:
```json ```javascripton
{ {
"name" : "your-app", "name" : "your-app",
"version" : "0.1.0", "version" : "0.1.0",
@ -65,43 +65,43 @@ a ser ejecutado por el proceso principal. Un ejemplo de `package.json` podría v
El `main.js` debería crear las ventanas y gestionar los eventos del sistema, un ejemplo típico sería: El `main.js` debería crear las ventanas y gestionar los eventos del sistema, un ejemplo típico sería:
```javascript ```javascript
var app = require('app'); // Módulo para controlar el ciclo de vida de la aplicación. var app = require('app') // Módulo para controlar el ciclo de vida de la aplicación.
var BrowserWindow = require('browser-window'); // Módulo para crear uan ventana de navegador. var BrowserWindow = require('browser-window') // Módulo para crear uan ventana de navegador.
// Mantener una referencia global al objeto window, si no lo haces, esta ventana // Mantener una referencia global al objeto window, si no lo haces, esta ventana
// se cerrará automáticamente cuando el objeto JavaScript sea recolectado (garbage collected): // se cerrará automáticamente cuando el objeto JavaScript sea recolectado (garbage collected):
var mainWindow = null; var mainWindow = null
// Salir de todas las ventanas cuando se cierren. // Salir de todas las ventanas cuando se cierren.
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
// En macOS es común que las aplicaciones y su barra de menú // En macOS es común que las aplicaciones y su barra de menú
// se mantengan activas hasta que el usuario cierre la aplicación // se mantengan activas hasta que el usuario cierre la aplicación
// explícitamente utilizando Cmd + Q // explícitamente utilizando Cmd + Q
if (process.platform != 'darwin') { if (process.platform !== 'darwin') {
app.quit(); app.quit()
} }
}); })
// Este método será llamado cuando Electron haya finalizado la inicialización // Este método será llamado cuando Electron haya finalizado la inicialización
// y esté listo para crear ventanas de navegador. // y esté listo para crear ventanas de navegador.
app.on('ready', function() { app.on('ready', function () {
// Crear la ventana. // Crear la ventana.
mainWindow = new BrowserWindow({width: 800, height: 600}); mainWindow = new BrowserWindow({width: 800, height: 600})
// cargar el index.html de nuestra aplicación. // cargar el index.html de nuestra aplicación.
mainWindow.loadURL('file://' + __dirname + '/index.html'); mainWindow.loadURL(`file://${__dirname}/index.html`)
// Desplegar devtools. // Desplegar devtools.
mainWindow.openDevTools(); mainWindow.openDevTools()
// Evento emitido cuando se cierra la ventana. // Evento emitido cuando se cierra la ventana.
mainWindow.on('closed', function() { mainWindow.on('closed', function () {
// Eliminar la referencia del objeto window. // Eliminar la referencia del objeto window.
// En el caso de soportar multiples ventanas, es usual almacenar // En el caso de soportar multiples ventanas, es usual almacenar
// los objetos window en un array, este es el momento en el que debes eliminar el elemento correspondiente. // los objetos window en un array, este es el momento en el que debes eliminar el elemento correspondiente.
mainWindow = null; mainWindow = null
}); })
}); })
``` ```
Finalmente el `index.html` es la página web que mostraremos: Finalmente el `index.html` es la página web que mostraremos:

View file

@ -12,40 +12,40 @@ Puedes agregar la opción `--ppapi-flash-path` y `ppapi-flash-version` o utiliz
También puedes agregar la opción `plugins` de `browser-window`. Por ejemplo, También puedes agregar la opción `plugins` de `browser-window`. Por ejemplo,
```javascript ```javascript
var app = require('app'); var app = require('app')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
// Keep a global reference of the window object, if you don't, the window will // Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the javascript object is GCed. // be closed automatically when the javascript object is GCed.
var mainWindow = null; var mainWindow = null
// Quit when all windows are closed. // Quit when all windows are closed.
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
if (process.platform != 'darwin') { if (process.platform !== 'darwin') {
app.quit(); app.quit()
} }
}); })
// Specify flash path. // Specify flash path.
// On Windows, it might be /path/to/pepflashplayer.dll // On Windows, it might be /path/to/pepflashplayer.dll
// On macOS, /path/to/PepperFlashPlayer.plugin // On macOS, /path/to/PepperFlashPlayer.plugin
// On Linux, /path/to/libpepflashplayer.so // On Linux, /path/to/libpepflashplayer.so
app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so'); app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so')
// Specify flash version, for example, v17.0.0.169 // Specify flash version, for example, v17.0.0.169
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169'); app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
app.on('ready', function() { app.on('ready', function () {
mainWindow = new BrowserWindow({ mainWindow = new BrowserWindow({
'width': 800, 'width': 800,
'height': 600, 'height': 600,
'web-preferences': { 'web-preferences': {
'plugins': true 'plugins': true
} }
}); })
mainWindow.loadURL('file://' + __dirname + '/index.html'); mainWindow.loadURL(`file://${__dirname}/index.html`)
// Something else // Something else
}); })
``` ```
## Activar el plugin flash en una etiqueta `<webview>` ## Activar el plugin flash en una etiqueta `<webview>`

View file

@ -40,7 +40,7 @@ excepto que necesitas especificar manualmente cómo se conectará el chrome driv
y dónde encontrará el binario de Electron: y dónde encontrará el binario de Electron:
```javascript ```javascript
var webdriver = require('selenium-webdriver'); var webdriver = require('selenium-webdriver')
var driver = new webdriver.Builder() var driver = new webdriver.Builder()
// El puerto "9515" es que abre chrome driver. // El puerto "9515" es que abre chrome driver.
@ -49,18 +49,18 @@ var driver = new webdriver.Builder()
// Aquí especificamos la ruta a Electron // Aquí especificamos la ruta a Electron
binary: '/Path-to-Your-App.app/Contents/MacOS/Atom'}}) binary: '/Path-to-Your-App.app/Contents/MacOS/Atom'}})
.forBrowser('electron') .forBrowser('electron')
.build(); .build()
driver.get('http://www.google.com'); driver.get('http://www.google.com')
driver.findElement(webdriver.By.name('q')).sendKeys('webdriver'); driver.findElement(webdriver.By.name('q')).sendKeys('webdriver')
driver.findElement(webdriver.By.name('btnG')).click(); driver.findElement(webdriver.By.name('btnG')).click()
driver.wait(function() { driver.wait(function () {
return driver.getTitle().then(function(title) { return driver.getTitle().then(function (title) {
return title === 'webdriver - Google Search'; return title === 'webdriver - Google Search'
}); })
}, 1000); }, 1000)
driver.quit(); driver.quit()
``` ```
## Workflow ## Workflow

View file

@ -36,17 +36,17 @@ Si vous voulez corriger rapidement le problème, vous pouvez rendre les variable
globales en changeant votre code de ça : globales en changeant votre code de ça :
```javascript ```javascript
app.on('ready', function() { app.on('ready', function () {
var tray = new Tray('/path/to/icon.png'); var tray = new Tray('/path/to/icon.png')
}) })
``` ```
à ça : à ça :
```javascript ```javascript
var tray = null; var tray = null
app.on('ready', function() { app.on('ready', function () {
tray = new Tray('/path/to/icon.png'); tray = new Tray('/path/to/icon.png')
}) })
``` ```
@ -65,7 +65,7 @@ var mainWindow = new BrowserWindow({
webPreferences: { webPreferences: {
nodeIntegration: false nodeIntegration: false
} }
}); })
``` ```
Mais si vous voulez garder la possibilité d'utiliser Node.js et les APIs Mais si vous voulez garder la possibilité d'utiliser Node.js et les APIs
@ -101,7 +101,7 @@ Vous vérifiez que vous utilisez les bons modules, vous pouvez afficher le
chemin du module `electron` : chemin du module `electron` :
```javascript ```javascript
console.log(require.resolve('electron')); console.log(require.resolve('electron'))
``` ```
et vérifier si il est de la forme : et vérifier si il est de la forme :

View file

@ -95,7 +95,7 @@ valeur, elle est écrite en dessous ainsi que son type. Si vous voulez écouter
répondre à l'évènement wake-up, ça donne quelque chose comme : répondre à l'évènement wake-up, ça donne quelque chose comme :
```javascript ```javascript
Alarm.on('wake-up', function(time) { Alarm.on('wake-up', function (time) {
console.log(time) console.log(time)
}) })
``` ```

View file

@ -1,6 +1,6 @@
Sii certo di usare la documentazione che corrisponde alla tua versione di Sii certo di usare la documentazione che corrisponde alla tua versione di
Electron. Il numero della versione dovrebbe fare parte dell'URL della pagina. Electron. Il numero della versione dovrebbe fare parte dell'URL della pagina.
Se così non fosse, stai probabilmente utilizzando una documentazione facente Se cos<EFBFBD> non fosse, stai probabilmente utilizzando una documentazione facente
parte di una branch di sviluppo che potrebbe contenere modifiche all'API che non parte di una branch di sviluppo che potrebbe contenere modifiche all'API che non
sono compatibili con la tua versione di Electron. In questo caso, puoi passare a sono compatibili con la tua versione di Electron. In questo caso, puoi passare a
una differente versione della documentazione dalla lista di una differente versione della documentazione dalla lista di

View file

@ -48,7 +48,7 @@ API.
* Usa `bash` invece di `cmd` nei blocchi di codice (per via della diversa * Usa `bash` invece di `cmd` nei blocchi di codice (per via della diversa
evidenziazione della sintassi). evidenziazione della sintassi).
* Le linee devono essere lunghe al massimo 80 caratteri. * Le linee devono essere lunghe al massimo 80 caratteri.
* Non annidare le liste per più di due livelli (per via del rendering compiuto * Non annidare le liste per pi<EFBFBD> di due livelli (per via del rendering compiuto
da markdown). da markdown).
* Tutti i blocchi di codice `js` o `javascript` sono analizzati con * Tutti i blocchi di codice `js` o `javascript` sono analizzati con
[standard-markdown](http://npm.im/standard-markdown). [standard-markdown](http://npm.im/standard-markdown).
@ -97,7 +97,7 @@ Prendendo `autoUpdate` come esempio:
* Le classi API e le classi che sono parte di moduli devono essere elencate * Le classi API e le classi che sono parte di moduli devono essere elencate
sotto un capitolo `## Classe: NomeDellaClasse`. sotto un capitolo `## Classe: NomeDellaClasse`.
* Una pagina può avere più classi. * Una pagina pu<EFBFBD> avere pi<70> classi.
* I costruttoi devono essere elencati con un titolo di livello `###`. * I costruttoi devono essere elencati con un titolo di livello `###`.
* I [Metodi Statici](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static) (Inglese) devono essere elencati sotto un capitolo * I [Metodi Statici](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static) (Inglese) devono essere elencati sotto un capitolo
`### Metodi Statici`. `### Metodi Statici`.
@ -105,7 +105,7 @@ sotto un capitolo `## Classe: NomeDellaClasse`.
capitolo `### Metodi di Istanza`. capitolo `### Metodi di Istanza`.
* Gli Eventi di Istanza devono essere elencati sotto un capitolo * Gli Eventi di Istanza devono essere elencati sotto un capitolo
`## Eventi di Istanza`. `## Eventi di Istanza`.
* Le Proprietà di Istanza devono essere elencate sotto un capitolo `## Proprietà di Istanza`. * Le Propriet<EFBFBD> di Istanza devono essere elencate sotto un capitolo `## Propriet<65> di Istanza`.
Prendendo le classi `Session` e `Cookies` come esempi: Prendendo le classi `Session` e `Cookies` come esempi:
@ -116,7 +116,7 @@ Prendendo le classi `Session` e `Cookies` come esempi:
### session.fromPartition(partition) ### session.fromPartition(partition)
## Proprietà ## Propriet<EFBFBD>
### session.defaultSession ### session.defaultSession
@ -130,7 +130,7 @@ Prendendo le classi `Session` e `Cookies` come esempi:
#### `ses.getCacheSize(callback)` #### `ses.getCacheSize(callback)`
### Proprietà di Istanza ### Propriet<EFBFBD> di Istanza
#### `ses.cookies` #### `ses.cookies`
@ -154,10 +154,10 @@ Il capitolo dei metodi deve seguire il seguente formato:
... ...
``` ```
Il titolo può essere di livello `###` o `####` a seconda che sia un metodo di Il titolo pu<EFBFBD> essere di livello `###` o `####` a seconda che sia un metodo di
un modulo o di una classe. un modulo o di una classe.
Per i moduli, il `nomeOggetto` è il nome del modulo. Per le classi, deve essere Per i moduli, il `nomeOggetto` <EFBFBD> il nome del modulo. Per le classi, deve essere
il nome dell'istanza della classe e non deve essere lo stesso del modulo. il nome dell'istanza della classe e non deve essere lo stesso del modulo.
Per esempio, i metodi della classe `Session` sotto il modulo `session` devono Per esempio, i metodi della classe `Session` sotto il modulo `session` devono
@ -172,7 +172,7 @@ required[, optional]
``` ```
Sotto ogni metodo si trovano informazioni dettagliate su ogni parametro. Il tipo Sotto ogni metodo si trovano informazioni dettagliate su ogni parametro. Il tipo
di parametro è caratterizzato da uno dei tipi di dati comuni: di parametro <EFBFBD> caratterizzato da uno dei tipi di dati comuni:
* [`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) * [`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
* [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number) * [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number)
@ -192,7 +192,7 @@ corsivo e delimitati da uno spazio. I valori possono essere `macOS`,
``` ```
I parametri di tipo `Array` devono specificare nella descrizione sottostante I parametri di tipo `Array` devono specificare nella descrizione sottostante
che elementi può contenere l'array. che elementi pu<EFBFBD> contenere l'array.
La descrizione per i parametri di tipo `Funzione` dovrebbero rendere chiaro come La descrizione per i parametri di tipo `Funzione` dovrebbero rendere chiaro come
sia possibile chiamarli, ed elencare i tipi di parametri che vi saranno passati. sia possibile chiamarli, ed elencare i tipi di parametri che vi saranno passati.
@ -211,14 +211,14 @@ Ritorna:
... ...
``` ```
Il titolo può essere di livello `###` o `####` a seconda che sia di un evento di Il titolo pu<EFBFBD> essere di livello `###` o `####` a seconda che sia di un evento di
un modulo o di una classe. un modulo o di una classe.
I parametri di un evento seguono le stesse regole di quelli dei metodi. I parametri di un evento seguono le stesse regole di quelli dei metodi.
### Proprietà ### Propriet<EFBFBD>
Il capitolo delle proprietà deve seguire il seguente formato: Il capitolo delle propriet<EFBFBD> deve seguire il seguente formato:
```markdown ```markdown
### session.defaultSession ### session.defaultSession
@ -226,7 +226,7 @@ Il capitolo delle propriet
... ...
``` ```
Il titolo può essere di livello `###` o `####` a seconda che sia una proprietà Il titolo pu<EFBFBD> essere di livello `###` o `####` a seconda che sia una propriet<65>
di un metodo o di una classe. di un metodo o di una classe.
## Traduzioni della Documentazione ## Traduzioni della Documentazione
@ -243,4 +243,4 @@ reindirizzi ai file che hai tradotto.
* Aggiungi un collegamento alla cartella della traduzione nel [README](https://github.com/electron/electron#documentation-translations) principale di Electron. * Aggiungi un collegamento alla cartella della traduzione nel [README](https://github.com/electron/electron#documentation-translations) principale di Electron.
Nota che tutti i file nella cartella `docs-translations` devono includere solo Nota che tutti i file nella cartella `docs-translations` devono includere solo
i file tradotti. I file originali in inglese non devono essere copiati lì. i file tradotti. I file originali in inglese non devono essere copiati l<EFBFBD>.

View file

@ -5,10 +5,10 @@
次の例は、最後のウィンドウが閉じたときにアプリケーションを終了させる方法を示しています。 次の例は、最後のウィンドウが閉じたときにアプリケーションを終了させる方法を示しています。
```javascript ```javascript
const app = require('electron').app; const app = require('electron').app
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
app.quit(); app.quit()
}); })
``` ```
## イベント ## イベント
@ -134,15 +134,15 @@ Windowsでは、ファイルパスを取得するために、 `process.argv` を
`url``certificate` 検証に失敗したときに発生します。証明書を信頼するために`event.preventDefault()``callback(true)`をコールして既定の動作を止める必要があります。 `url``certificate` 検証に失敗したときに発生します。証明書を信頼するために`event.preventDefault()``callback(true)`をコールして既定の動作を止める必要があります。
```javascript ```javascript
session.on('certificate-error', function(event, webContents, url, error, certificate, callback) { session.on('certificate-error', function (event, webContents, url, error, certificate, callback) {
if (url == "https://github.com") { if (url === 'https://github.com') {
// Verification logic. // Verification logic.
event.preventDefault(); event.preventDefault()
callback(true); callback(true)
} else { } else {
callback(false); callback(false)
} }
}); })
``` ```
### イベント: 'select-client-certificate' ### イベント: 'select-client-certificate'
@ -162,9 +162,9 @@ session.on('certificate-error', function(event, webContents, url, error, certifi
`url` は、クライアント証明書を要求するナビゲーションエントリーに対応し、`callback` リストからエントリをフィルターしてコールするのに必要です。`event.preventDefault()` を使用して、アプリケーションの証明書ストアから最初の証明書を使用するのを止めることができます。 `url` は、クライアント証明書を要求するナビゲーションエントリーに対応し、`callback` リストからエントリをフィルターしてコールするのに必要です。`event.preventDefault()` を使用して、アプリケーションの証明書ストアから最初の証明書を使用するのを止めることができます。
```javascript ```javascript
app.on('select-client-certificate', function(event, webContents, url, list, callback) { app.on('select-client-certificate', function (event, webContents, url, list, callback) {
event.preventDefault(); event.preventDefault()
callback(list[0]); callback(list[0])
}) })
``` ```
@ -191,9 +191,9 @@ Returns:
既定の動作ではすべての認証をキャンセルしたり、`event.preventDefault()``callback(username, password)` とを証明書でコールし既定の動作をとめてオーバーライドします。 既定の動作ではすべての認証をキャンセルしたり、`event.preventDefault()``callback(username, password)` とを証明書でコールし既定の動作をとめてオーバーライドします。
```javascript ```javascript
app.on('login', function(event, webContents, request, authInfo, callback) { app.on('login', function (event, webContents, request, authInfo, callback) {
event.preventDefault(); event.preventDefault()
callback('username', 'secret'); callback('username', 'secret')
}) })
``` ```
@ -325,26 +325,25 @@ macOSは、ユーザーがFinderで2つ目のアプリインスタンスを開
2つ目のインスタンスを起動するとき、メインのインスタンスのウィンドウをアクティブにする例 2つ目のインスタンスを起動するとき、メインのインスタンスのウィンドウをアクティブにする例
```js ```javascript
var myWindow = null; var myWindow = null
var shouldQuit = app.makeSingleInstance(function(commandLine, workingDirectory) { var shouldQuit = app.makeSingleInstance(function (commandLine, workingDirectory) {
// Someone tried to run a second instance, we should focus our window // Someone tried to run a second instance, we should focus our window
if (myWindow) { if (myWindow) {
if (myWindow.isMinimized()) myWindow.restore(); if (myWindow.isMinimized()) myWindow.restore()
myWindow.focus(); myWindow.focus()
} }
return true; return true
}); })
if (shouldQuit) { if (shouldQuit) {
app.quit(); app.quit()
return;
} }
// Create myWindow, load the rest of the app, etc... app.on('ready', function () {
app.on('ready', function() { // Create myWindow, load the rest of the app, etc...
}); })
``` ```
### `app.setAppUserModelId(id)` _Windows_ ### `app.setAppUserModelId(id)` _Windows_
@ -359,24 +358,24 @@ app.on('ready', function() {
使用例: 使用例:
```js ```javascript
let browserOptions = {width: 1000, height: 800}; let browserOptions = {width: 1000, height: 800}
// Make the window transparent only if the platform supports it. // Make the window transparent only if the platform supports it.
if (process.platform !== 'win32' || app.isAeroGlassEnabled()) { if (process.platform !== 'win32' || app.isAeroGlassEnabled()) {
browserOptions.transparent = true; browserOptions.transparent = true
browserOptions.frame = false; browserOptions.frame = false
} }
// Create the window. // Create the window.
win = new BrowserWindow(browserOptions); win = new BrowserWindow(browserOptions)
// Navigate. // Navigate.
if (browserOptions.transparent) { if (browserOptions.transparent) {
win.loadURL('file://' + __dirname + '/index.html'); win.loadURL(`file://${__dirname}/index.html`)
} else { } else {
// No transparency, so we load a fallback that uses basic styles. // No transparency, so we load a fallback that uses basic styles.
win.loadURL('file://' + __dirname + '/fallback.html'); win.loadURL(`file://${__dirname}/fallback.html`)
} }
``` ```

View file

@ -5,13 +5,13 @@
アプリケーションのメインスクリプトで[app.commandLine.appendSwitch][append-switch]を使うことで、[app][app]モジュールの[ready][ready]イベントが発行される前にコマンドラインスイッチを追加できます。 アプリケーションのメインスクリプトで[app.commandLine.appendSwitch][append-switch]を使うことで、[app][app]モジュールの[ready][ready]イベントが発行される前にコマンドラインスイッチを追加できます。
```javascript ```javascript
const {app} = require('electron'); const {app} = require('electron')
app.commandLine.appendSwitch('remote-debugging-port', '8315'); app.commandLine.appendSwitch('remote-debugging-port', '8315')
app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1'); app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
app.on('ready', () => { app.on('ready', () => {
// Your code here // Your code here
}); })
``` ```

View file

@ -3,15 +3,15 @@
`clipboard`モジュールは、コピーとペースト操作を実行するメソッドを提供します。次の例は、クリップボードに文字列を書き込む方法を示しています: `clipboard`モジュールは、コピーとペースト操作を実行するメソッドを提供します。次の例は、クリップボードに文字列を書き込む方法を示しています:
```javascript ```javascript
const clipboard = require('electron').clipboard; const clipboard = require('electron').clipboard
clipboard.writeText('Example String'); clipboard.writeText('Example String')
``` ```
X Windowsシステム上では、セレクションクリップボードがあります。それを操作するために、それぞれのメソッドで、`selection`を通す必要があります。 X Windowsシステム上では、セレクションクリップボードがあります。それを操作するために、それぞれのメソッドで、`selection`を通す必要があります。
```javascript ```javascript
clipboard.writeText('Example String', 'selection'); clipboard.writeText('Example String', 'selection')
console.log(clipboard.readText('selection')); console.log(clipboard.readText('selection'))
``` ```
## メソッド ## メソッド
@ -79,7 +79,7 @@ HTMLマークアップとして、クリップボードの内容を返します
`data`で指定したフォーマットをクリップボードがサポートしているかどうかを返します。 `data`で指定したフォーマットをクリップボードがサポートしているかどうかを返します。
```javascript ```javascript
console.log(clipboard.has('<p>selection</p>')); console.log(clipboard.has('<p>selection</p>'))
``` ```
### `clipboard.read(data[, type])` _実験_ ### `clipboard.read(data[, type])` _実験_
@ -98,6 +98,6 @@ console.log(clipboard.has('<p>selection</p>'));
* `type` String (optional) * `type` String (optional)
```javascript ```javascript
clipboard.write({text: 'test', html: "<b>test</b>"}); clipboard.write({text: 'test', html: '<b>test</b>'})
``` ```
クリップボードに`data`を書き込みます。 クリップボードに`data`を書き込みます。

View file

@ -3,22 +3,22 @@
`content-tracing`モジュールは、Chromiumコンテンツモジュールによって生成されるトーレスデータを収集するのに使われます。このモジュールはウェブインターフェイスを含んでいないので、Chromeブラウザーで `chrome://tracing/`を開いて、結果を表示するために生成されたファイルを読み込む必要があります。 `content-tracing`モジュールは、Chromiumコンテンツモジュールによって生成されるトーレスデータを収集するのに使われます。このモジュールはウェブインターフェイスを含んでいないので、Chromeブラウザーで `chrome://tracing/`を開いて、結果を表示するために生成されたファイルを読み込む必要があります。
```javascript ```javascript
const contentTracing = require('electron').contentTracing; const contentTracing = require('electron').contentTracing
const options = { const options = {
categoryFilter: '*', categoryFilter: '*',
traceOptions: 'record-until-full,enable-sampling' traceOptions: 'record-until-full,enable-sampling'
} }
contentTracing.startRecording(options, function() { contentTracing.startRecording(options, function () {
console.log('Tracing started'); console.log('Tracing started')
setTimeout(function() { setTimeout(function () {
contentTracing.stopRecording('', function(path) { contentTracing.stopRecording('', function (path) {
console.log('Tracing data recorded to ' + path); console.log('Tracing data recorded to ' + path)
}); })
}, 5000); }, 5000)
}); })
``` ```
## メソッド ## メソッド

View file

@ -5,14 +5,14 @@
リモートサーバーに自動的にクラッシュレポートを登録する例です。 リモートサーバーに自動的にクラッシュレポートを登録する例です。
```javascript ```javascript
const crashReporter = require('electron').crashReporter; const crashReporter = require('electron').crashReporter
crashReporter.start({ crashReporter.start({
productName: 'YourName', productName: 'YourName',
companyName: 'YourCompany', companyName: 'YourCompany',
submitURL: 'https://your-domain.com/url-to-submit', submitURL: 'https://your-domain.com/url-to-submit',
autoSubmit: true autoSubmit: true
}); })
``` ```
## メソッド ## メソッド

View file

@ -4,12 +4,12 @@
```javascript ```javascript
// In the renderer process. // In the renderer process.
var desktopCapturer = require('electron').desktopCapturer; var desktopCapturer = require('electron').desktopCapturer
desktopCapturer.getSources({types: ['window', 'screen']}, function(error, sources) { desktopCapturer.getSources({types: ['window', 'screen']}, function (error, sources) {
if (error) throw error; if (error) throw error
for (var i = 0; i < sources.length; ++i) { for (var i = 0; i < sources.length; ++i) {
if (sources[i].name == "Electron") { if (sources[i].name === 'Electron') {
navigator.webkitGetUserMedia({ navigator.webkitGetUserMedia({
audio: false, audio: false,
video: { video: {
@ -22,18 +22,18 @@ desktopCapturer.getSources({types: ['window', 'screen']}, function(error, source
maxHeight: 720 maxHeight: 720
} }
} }
}, gotStream, getUserMediaError); }, gotStream, getUserMediaError)
return; return
} }
} }
}); })
function gotStream(stream) { function gotStream (stream) {
document.querySelector('video').src = URL.createObjectURL(stream); document.querySelector('video').src = URL.createObjectURL(stream)
} }
function getUserMediaError(e) { function getUserMediaError (e) {
console.log('getUserMediaError'); console.log('getUserMediaError')
} }
``` ```

View file

@ -5,9 +5,8 @@
複数のファイルやディレクトリを選択するためのダイアログを表示する例です: 複数のファイルやディレクトリを選択するためのダイアログを表示する例です:
```javascript ```javascript
var win = ...; // BrowserWindow in which to show the dialog const {dialog} = require('electron')
const dialog = require('electron').dialog; console.log(dialog.showOpenDialog({properties: ['openFile', 'openDirectory', 'multiSelections']}))
console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', 'multiSelections' ]}));
``` ```
**Note for macOS**: シートとしてダイアログを表示したい場合、唯一しなければならないことは、`browserWindow`パラメーターを参照する`BrowserWindow`を提供することです。 **Note for macOS**: シートとしてダイアログを表示したい場合、唯一しなければならないことは、`browserWindow`パラメーターを参照する`BrowserWindow`を提供することです。

View file

@ -4,22 +4,31 @@
```javascript ```javascript
// In the main process. // In the main process.
win.webContents.session.on('will-download', function(event, item, webContents) { const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.webContents.session.on('will-download', (event, item, webContents) => {
// Set the save path, making Electron not to prompt a save dialog. // Set the save path, making Electron not to prompt a save dialog.
item.setSavePath('/tmp/save.pdf'); item.setSavePath('/tmp/save.pdf')
console.log(item.getMimeType());
console.log(item.getFilename()); item.on('updated', (event, state) => {
console.log(item.getTotalBytes()); if (state === 'interrupted') {
item.on('updated', function() { console.log('Download is interrupted but can be resumed')
console.log('Received bytes: ' + item.getReceivedBytes()); } else if (state === 'progressing') {
}); if (item.isPaused()) {
item.on('done', function(e, state) { console.log('Download is paused')
if (state == "completed") { } else {
console.log("Download successfully"); console.log(`Received bytes: ${item.getReceivedBytes()}`)
} else { }
console.log("Download is cancelled or interrupted that can't be resumed");
} }
}); })
item.once('done', (event, state) => {
if (state === 'completed') {
console.log('Download successfully')
} else {
console.log(`Download failed: ${state}`)
}
})
})
``` ```
## イベント ## イベント

View file

@ -7,8 +7,8 @@
フレームの無いウィンドウを作成するために、[BrowserWindow](browser-window.md)の `options`で、`frame``false`に設定する必要があります。 フレームの無いウィンドウを作成するために、[BrowserWindow](browser-window.md)の `options`で、`frame``false`に設定する必要があります。
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600, frame: false }); var win = new BrowserWindow({ width: 800, height: 600, frame: false })
``` ```
### macOSでの別の方法 ### macOSでの別の方法
@ -16,7 +16,7 @@ var win = new BrowserWindow({ width: 800, height: 600, frame: false });
macOS 10.10 Yosemite以降では、Chrome無しのウィンドウを指定する方法があります。`frame``false`に設定しタイトルバーとウィンドウコントロールの両方を無効にする代わりに、タイトルバーを隠しコンテンツをフルウィンドウサイズに広げたいけど、標準的なウィンドウ操作用にウィンドウコントロール("トラフィックライト")を維持したいかもしれません。新しい`titleBarStyle`オプションを指定することで、そうできます。 macOS 10.10 Yosemite以降では、Chrome無しのウィンドウを指定する方法があります。`frame``false`に設定しタイトルバーとウィンドウコントロールの両方を無効にする代わりに、タイトルバーを隠しコンテンツをフルウィンドウサイズに広げたいけど、標準的なウィンドウ操作用にウィンドウコントロール("トラフィックライト")を維持したいかもしれません。新しい`titleBarStyle`オプションを指定することで、そうできます。
```javascript ```javascript
var win = new BrowserWindow({ 'titleBarStyle': 'hidden' }); var win = new BrowserWindow({ 'titleBarStyle': 'hidden' })
``` ```
## 透明なウィンドウ ## 透明なウィンドウ
@ -24,7 +24,7 @@ var win = new BrowserWindow({ 'titleBarStyle': 'hidden' });
`transparent`オプションを`true`に設定すると、フレームの無い透明なウィンドウを作成できます。 `transparent`オプションを`true`に設定すると、フレームの無い透明なウィンドウを作成できます。
```javascript ```javascript
var win = new BrowserWindow({ transparent: true, frame: false }); var win = new BrowserWindow({ transparent: true, frame: false })
``` ```
### 制限 ### 制限

View file

@ -5,31 +5,31 @@
**Note:** ショートカットはグローバルです。アプリがキーボードフォーカスを持っていなくても動作します。`app`モジュールの `ready`イベントが出力されるまでは使うべきではありません。 **Note:** ショートカットはグローバルです。アプリがキーボードフォーカスを持っていなくても動作します。`app`モジュールの `ready`イベントが出力されるまでは使うべきではありません。
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const globalShortcut = electron.globalShortcut; const globalShortcut = electron.globalShortcut
app.on('ready', function() { app.on('ready', function () {
// Register a 'ctrl+x' shortcut listener. // Register a 'ctrl+x' shortcut listener.
var ret = globalShortcut.register('ctrl+x', function() { var ret = globalShortcut.register('ctrl+x', function () {
console.log('ctrl+x is pressed'); console.log('ctrl+x is pressed')
}); })
if (!ret) { if (!ret) {
console.log('registration failed'); console.log('registration failed')
} }
// Check whether a shortcut is registered. // Check whether a shortcut is registered.
console.log(globalShortcut.isRegistered('ctrl+x')); console.log(globalShortcut.isRegistered('ctrl+x'))
}); })
app.on('will-quit', function() { app.on('will-quit', function () {
// Unregister a shortcut. // Unregister a shortcut.
globalShortcut.unregister('ctrl+x'); globalShortcut.unregister('ctrl+x')
// Unregister all shortcuts. // Unregister all shortcuts.
globalShortcut.unregisterAll(); globalShortcut.unregisterAll()
}); })
``` ```
## メソッド ## メソッド

View file

@ -14,27 +14,27 @@
```javascript ```javascript
// In main process. // In main process.
const ipcMain = require('electron').ipcMain; const ipcMain = require('electron').ipcMain
ipcMain.on('asynchronous-message', function(event, arg) { ipcMain.on('asynchronous-message', function (event, arg) {
console.log(arg); // prints "ping" console.log(arg) // prints "ping"
event.sender.send('asynchronous-reply', 'pong'); event.sender.send('asynchronous-reply', 'pong')
}); })
ipcMain.on('synchronous-message', function(event, arg) { ipcMain.on('synchronous-message', function (event, arg) {
console.log(arg); // prints "ping" console.log(arg) // prints "ping"
event.returnValue = 'pong'; event.returnValue = 'pong'
}); })
``` ```
```javascript ```javascript
// In renderer process (web page). // In renderer process (web page).
const ipcRenderer = require('electron').ipcRenderer; const ipcRenderer = require('electron').ipcRenderer
console.log(ipcRenderer.sendSync('synchronous-message', 'ping')); // prints "pong" console.log(ipcRenderer.sendSync('synchronous-message', 'ping')) // prints "pong"
ipcRenderer.on('asynchronous-reply', function(event, arg) { ipcRenderer.on('asynchronous-reply', function (event, arg) {
console.log(arg); // prints "pong" console.log(arg) // prints "pong"
}); })
ipcRenderer.send('asynchronous-message', 'ping'); ipcRenderer.send('asynchronous-message', 'ping')
``` ```
## メッセージ受信 ## メッセージ受信

View file

@ -64,7 +64,7 @@ var template = [
label: 'Select All', label: 'Select All',
accelerator: 'CmdOrCtrl+A', accelerator: 'CmdOrCtrl+A',
role: 'selectall' role: 'selectall'
}, }
] ]
}, },
{ {
@ -73,37 +73,38 @@ var template = [
{ {
label: 'Reload', label: 'Reload',
accelerator: 'CmdOrCtrl+R', accelerator: 'CmdOrCtrl+R',
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) focusedWindow.reload()
focusedWindow.reload();
} }
}, },
{ {
label: 'Toggle Full Screen', label: 'Toggle Full Screen',
accelerator: (function() { accelerator: (function () {
if (process.platform == 'darwin') if (process.platform === 'darwin') {
return 'Ctrl+Command+F'; return 'Ctrl+Command+F'
else } else {
return 'F11'; return 'F11'
}
})(), })(),
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) {
focusedWindow.setFullScreen(!focusedWindow.isFullScreen()); focusedWindow.setFullScreen(!focusedWindow.isFullScreen())
}
} }
}, },
{ {
label: 'Toggle Developer Tools', label: 'Toggle Developer Tools',
accelerator: (function() { accelerator: (function () {
if (process.platform == 'darwin') if (process.platform === 'darwin') {
return 'Alt+Command+I'; return 'Alt+Command+I'
else } else {
return 'Ctrl+Shift+I'; return 'Ctrl+Shift+I'
}
})(), })(),
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) focusedWindow.toggleDevTools()
focusedWindow.toggleDevTools();
} }
}, }
] ]
}, },
{ {
@ -119,7 +120,7 @@ var template = [
label: 'Close', label: 'Close',
accelerator: 'CmdOrCtrl+W', accelerator: 'CmdOrCtrl+W',
role: 'close' role: 'close'
}, }
] ]
}, },
{ {
@ -128,14 +129,14 @@ var template = [
submenu: [ submenu: [
{ {
label: 'Learn More', label: 'Learn More',
click: function() { require('electron').shell.openExternal('http://electron.atom.io') } click: function () { require('electron').shell.openExternal('http://electron.atom.io') }
}, }
] ]
}, }
]; ]
if (process.platform == 'darwin') { if (process.platform === 'darwin') {
var name = require('electron').remote.app.getName(); var name = require('electron').remote.app.getName()
template.unshift({ template.unshift({
label: name, label: name,
submenu: [ submenu: [
@ -174,10 +175,10 @@ if (process.platform == 'darwin') {
{ {
label: 'Quit', label: 'Quit',
accelerator: 'Command+Q', accelerator: 'Command+Q',
click: function() { app.quit(); } click: function () { app.quit() }
}, }
] ]
}); })
// Window menu. // Window menu.
template[3].submenu.push( template[3].submenu.push(
{ {
@ -187,11 +188,11 @@ if (process.platform == 'darwin') {
label: 'Bring All to Front', label: 'Bring All to Front',
role: 'front' role: 'front'
} }
); )
} }
var menu = Menu.buildFromTemplate(template); var menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu); Menu.setApplicationMenu(menu)
``` ```
## クラス: Menu ## クラス: Menu

View file

@ -5,15 +5,15 @@ Electronでは、画像を取得するAPI用に、ファイルパスまたは`na
例えば、トレイを作成したり、ウィンドウアイコンを設定する時、`String`としてイメージファイルパスを渡します: 例えば、トレイを作成したり、ウィンドウアイコンを設定する時、`String`としてイメージファイルパスを渡します:
```javascript ```javascript
var appIcon = new Tray('/Users/somebody/images/icon.png'); var appIcon = new Tray('/Users/somebody/images/icon.png')
var window = new BrowserWindow({icon: '/Users/somebody/images/window.png'}); var window = new BrowserWindow({icon: '/Users/somebody/images/window.png'})
``` ```
もしくは、`nativeImage`を返すクリップボードからイメージを読み込みます: もしくは、`nativeImage`を返すクリップボードからイメージを読み込みます:
```javascript ```javascript
var image = clipboard.readImage(); var image = clipboard.readImage()
var appIcon = new Tray(image); var appIcon = new Tray(image)
``` ```
## 対応しているフォーマット ## 対応しているフォーマット
@ -42,7 +42,7 @@ images/
```javascript ```javascript
var appIcon = new Tray('/Users/somebody/images/icon.png'); var appIcon = new Tray('/Users/somebody/images/icon.png')
``` ```
次のDPIサフィックスに対応しています: 次のDPIサフィックスに対応しています:
@ -107,9 +107,9 @@ var appIcon = new Tray('/Users/somebody/images/icon.png');
`nativeImage`のインスタンス上で提供されるメソッド: `nativeImage`のインスタンス上で提供されるメソッド:
```javascript ```javascript
const nativeImage = require('electron').nativeImage; const nativeImage = require('electron').nativeImage
var image = nativeImage.createFromPath('/Users/somebody/images/icon.png'); var image = nativeImage.createFromPath('/Users/somebody/images/icon.png')
``` ```
### `image.toPNG()` ### `image.toPNG()`

View file

@ -5,11 +5,11 @@
例: 例:
```javascript ```javascript
app.on('ready', function() { app.on('ready', function () {
require('electron').powerMonitor.on('suspend', function() { require('electron').powerMonitor.on('suspend', function () {
console.log('The system is going to sleep'); console.log('The system is going to sleep')
}); })
}); })
``` ```
## イベント ## イベント

View file

@ -5,12 +5,12 @@
例: 例:
```javascript ```javascript
const powerSaveBlocker = require('electron').powerSaveBlocker; const powerSaveBlocker = require('electron').powerSaveBlocker
var id = powerSaveBlocker.start('prevent-display-sleep'); var id = powerSaveBlocker.start('prevent-display-sleep')
console.log(powerSaveBlocker.isStarted(id)); console.log(powerSaveBlocker.isStarted(id))
powerSaveBlocker.stop(id); powerSaveBlocker.stop(id)
``` ```
## メソッド ## メソッド

View file

@ -12,14 +12,14 @@ Electronの`process`オブジェクトは次のようなAPIで拡張されてい
Node統合がオフになっているとき、削除したNodeグローバルシンボルをグローバルスコープへ戻すために、プリロードスクリプトで使用できます。 Node統合がオフになっているとき、削除したNodeグローバルシンボルをグローバルスコープへ戻すために、プリロードスクリプトで使用できます。
```js ```javascript
// preload.js // preload.js
var _setImmediate = setImmediate; var _setImmediate = setImmediate
var _clearImmediate = clearImmediate; var _clearImmediate = clearImmediate
process.once('loaded', function() { process.once('loaded', function () {
global.setImmediate = _setImmediate; global.setImmediate = _setImmediate
global.clearImmediate = _clearImmediate; global.clearImmediate = _clearImmediate
}); })
``` ```
## プロパティ ## プロパティ

View file

@ -5,20 +5,18 @@
`file://`プロトコルの同様の効果をもつプロトコルを実装した例です。 `file://`プロトコルの同様の効果をもつプロトコルを実装した例です。
```javascript ```javascript
const electron = require('electron'); const {app} = require('electron')
const app = electron.app; const path = require('path')
const path = require('path');
app.on('ready', function() { app.on('ready', function () {
var protocol = electron.protocol; var protocol = electron.protocol
protocol.registerFileProtocol('atom', function(request, callback) { protocol.registerFileProtocol('atom', function (request, callback) {
var url = request.url.substr(7); var url = request.url.substr(7)
callback({path: path.normalize(__dirname + '/' + url)}); callback({path: path.join(__dirname, url)})
}, function (error) { }, function (error) {
if (error) if (error) console.error('Failed to register protocol')
console.error('Failed to register protocol') })
}); })
});
``` ```
**Note:** このモジュールは、`app`モジュールで`ready`イベントが出力された後のみ使うことができます。 **Note:** このモジュールは、`app`モジュールで`ready`イベントが出力された後のみ使うことができます。
@ -77,12 +75,11 @@ app.on('ready', function() {
例: 例:
```javascript ```javascript
protocol.registerBufferProtocol('atom', function(request, callback) { protocol.registerBufferProtocol('atom', function (request, callback) {
callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')}); callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')})
}, function (error) { }, function (error) {
if (error) if (error) console.error('Failed to register protocol')
console.error('Failed to register protocol') })
});
``` ```
### `protocol.registerStringProtocol(scheme, handler[, completion])` ### `protocol.registerStringProtocol(scheme, handler[, completion])`

View file

@ -7,11 +7,11 @@ Electronでは、GUI関連モジュール`dialog`や`menu`など)はメイ
レンダラープロセスからブラウザーウィンドウを作成する例: レンダラープロセスからブラウザーウィンドウを作成する例:
```javascript ```javascript
const remote = require('electron').remote; const remote = require('electron').remote
const BrowserWindow = remote.BrowserWindow; const BrowserWindow = remote.BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com'); win.loadURL('https://github.com')
``` ```
**Note:** 逆には(メインプロセスからレンダラープロセスにアクセスする)、[webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture)が使えます。 **Note:** 逆には(メインプロセスからレンダラープロセスにアクセスする)、[webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture)が使えます。
@ -42,23 +42,23 @@ Electronは、レンダラープロセスのリモートオブジェクトが生
```javascript ```javascript
// main process mapNumbers.js // main process mapNumbers.js
exports.withRendererCallback = function(mapper) { exports.withRendererCallback = function (mapper) {
return [1,2,3].map(mapper); return [1, 2, 3].map(mapper)
} }
exports.withLocalCallback = function() { exports.withLocalCallback = function () {
return exports.mapNumbers(function(x) { return exports.mapNumbers(function (x) {
return x + 1; return x + 1
}); })
} }
``` ```
```javascript ```javascript
// renderer process // renderer process
var mapNumbers = require("remote").require("./mapNumbers"); var mapNumbers = require('remote').require('./mapNumbers')
var withRendererCb = mapNumbers.withRendererCallback(function(x) { var withRendererCb = mapNumbers.withRendererCallback(function (x) {
return x + 1; return x + 1
}) })
var withLocalCb = mapNumbers.withLocalCallback() var withLocalCb = mapNumbers.withLocalCallback()
@ -73,9 +73,9 @@ console.log(withRendererCb, withLocalCb) // [true, true, true], [2, 3, 4]
例えば、次のコードは一目で無害なコードのように思えます。リモートオブジェクト上で`close`イベントのコールバックをインストールしています。 例えば、次のコードは一目で無害なコードのように思えます。リモートオブジェクト上で`close`イベントのコールバックをインストールしています。
```javascript ```javascript
remote.getCurrentWindow().on('close', function() { remote.getCurrentWindow().on('close', function () {
// blabla... // blabla...
}); })
``` ```
りかし、明確にアンインストールするまでメインプロセスによってコールバックは参照されることを覚えておいてください。アンインストールしない場合、ウィンドウをリロードするたびに、コールバックは再度インストールされ、それぞれの再起動時にコールバックあリークします。 りかし、明確にアンインストールするまでメインプロセスによってコールバックは参照されることを覚えておいてください。アンインストールしない場合、ウィンドウをリロードするたびに、コールバックは再度インストールされ、それぞれの再起動時にコールバックあリークします。
@ -89,7 +89,7 @@ remote.getCurrentWindow().on('close', function() {
メインプロセスの組み込みモジュールは、`remote`モジュールでゲッターとして追加されるので、`electron`モジュールのように直接それらを使用できます。 メインプロセスの組み込みモジュールは、`remote`モジュールでゲッターとして追加されるので、`electron`モジュールのように直接それらを使用できます。
```javascript ```javascript
const app = remote.app; const app = remote.app
``` ```
## メソッド ## メソッド

View file

@ -9,35 +9,35 @@
画面全体にウィンドウを作成する例: 画面全体にウィンドウを作成する例:
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
var mainWindow; var mainWindow
app.on('ready', function() { app.on('ready', function () {
var electronScreen = electron.screen; var electronScreen = electron.screen
var size = electronScreen.getPrimaryDisplay().workAreaSize; var size = electronScreen.getPrimaryDisplay().workAreaSize
mainWindow = new BrowserWindow({ width: size.width, height: size.height }); mainWindow = new BrowserWindow({ width: size.width, height: size.height })
}); })
``` ```
外部ディスプレイにウィンドウを作成する別の例: 外部ディスプレイにウィンドウを作成する別の例:
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
var mainWindow; var mainWindow
app.on('ready', function() { app.on('ready', function () {
var electronScreen = electron.screen; var electronScreen = electron.screen
var displays = electronScreen.getAllDisplays(); var displays = electronScreen.getAllDisplays()
var externalDisplay = null; var externalDisplay = null
for (var i in displays) { for (var i in displays) {
if (displays[i].bounds.x != 0 || displays[i].bounds.y != 0) { if (displays[i].bounds.x !== 0 || displays[i].bounds.y !== 0) {
externalDisplay = displays[i]; externalDisplay = displays[i]
break; break
} }
} }
@ -45,9 +45,9 @@ app.on('ready', function() {
mainWindow = new BrowserWindow({ mainWindow = new BrowserWindow({
x: externalDisplay.bounds.x + 50, x: externalDisplay.bounds.x + 50,
y: externalDisplay.bounds.y + 50 y: externalDisplay.bounds.y + 50
}); })
} }
}); })
``` ```
## `Display` オブジェクト ## `Display` オブジェクト

View file

@ -5,12 +5,12 @@
[`BrowserWindow`](browser-window.md)のプロパティである [`webContents`](web-contents.md)プロパティの`session`を使うことで既存ページの `session`にアクセスできます。 [`BrowserWindow`](browser-window.md)のプロパティである [`webContents`](web-contents.md)プロパティの`session`を使うことで既存ページの `session`にアクセスできます。
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL("http://github.com"); win.loadURL('http://github.com')
var ses = win.webContents.session; var ses = win.webContents.session
``` ```
## メソッド ## メソッド
@ -38,9 +38,9 @@ var ses = win.webContents.session;
`session`モジュールで、`Session`オブジェクトを作成できます: `session`モジュールで、`Session`オブジェクトを作成できます:
```javascript ```javascript
const session = require('electron').session; const session = require('electron').session
var ses = session.fromPartition('persist:name'); var ses = session.fromPartition('persist:name')
``` ```
### インスタンスイベント ### インスタンスイベント
@ -58,12 +58,12 @@ Electronが`webContents`で`item`をダウンロードしようとすると出
`event.preventDefault()` をコールするとダウンロードをキャンセルできます。 `event.preventDefault()` をコールするとダウンロードをキャンセルできます。
```javascript ```javascript
session.defaultSession.on('will-download', function(event, item, webContents) { session.defaultSession.on('will-download', function (event, item, webContents) {
event.preventDefault(); event.preventDefault()
require('request')(item.getURL(), function(data) { require('request')(item.getURL(), function (data) {
require('fs').writeFileSync('/somewhere', data); require('fs').writeFileSync('/somewhere', data)
}); })
}); })
``` ```
### インスタンスのメソッド ### インスタンスのメソッド
@ -76,22 +76,23 @@ session.defaultSession.on('will-download', function(event, item, webContents) {
```javascript ```javascript
// Query all cookies. // Query all cookies.
session.defaultSession.cookies.get({}, function(error, cookies) { session.defaultSession.cookies.get({}, function (error, cookies) {
console.log(cookies); if (error) console.error(error)
}); console.log(cookies)
})
// Query all cookies associated with a specific url. // Query all cookies associated with a specific url.
session.defaultSession.cookies.get({ url : "http://www.github.com" }, function(error, cookies) { session.defaultSession.cookies.get({ url: 'http://www.github.com' }, function (error, cookies) {
console.log(cookies); if (error) console.error(error)
}); console.log(cookies)
})
// Set a cookie with the given cookie data; // Set a cookie with the given cookie data;
// may overwrite equivalent cookies if they exist. // may overwrite equivalent cookies if they exist.
var cookie = { url : "http://www.github.com", name : "dummy_name", value : "dummy" }; var cookie = { url: 'http://www.github.com', name: 'dummy_name', value: 'dummy' }
session.defaultSession.cookies.set(cookie, function(error) { session.defaultSession.cookies.set(cookie, function (error) {
if (error) if (error) console.error(error)
console.error(error); })
});
``` ```
#### `ses.cookies.get(filter, callback)` #### `ses.cookies.get(filter, callback)`
@ -232,13 +233,13 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
```javascript ```javascript
// To emulate a GPRS connection with 50kbps throughput and 500 ms latency. // To emulate a GPRS connection with 50kbps throughput and 500 ms latency.
window.webContents.session.enableNetworkEmulation({ window.webContents.session.enableNetworkEmulation({
latency: 500, latency: 500,
downloadThroughput: 6400, downloadThroughput: 6400,
uploadThroughput: 6400 uploadThroughput: 6400
}); })
// To emulate a network outage. // To emulate a network outage.
window.webContents.session.enableNetworkEmulation({offline: true}); window.webContents.session.enableNetworkEmulation({offline: true})
``` ```
#### `ses.disableNetworkEmulation()` #### `ses.disableNetworkEmulation()`
@ -254,12 +255,9 @@ window.webContents.session.enableNetworkEmulation({offline: true});
Calling `setCertificateVerifyProc(null)`をコールして、既定の証明書検証ロジックに戻します。 Calling `setCertificateVerifyProc(null)`をコールして、既定の証明書検証ロジックに戻します。
```javascript ```javascript
myWindow.webContents.session.setCertificateVerifyProc(function(hostname, cert, callback) { myWindow.webContents.session.setCertificateVerifyProc(function (hostname, cert, callback) {
if (hostname == 'github.com') callback(hostname === 'github.com')
callback(true); })
else
callback(false);
});
``` ```
#### `ses.webRequest` #### `ses.webRequest`
@ -275,13 +273,13 @@ APIのイベントが発生したとき、それぞれのAPIはオプション
```javascript ```javascript
// Modify the user agent for all requests to the following urls. // Modify the user agent for all requests to the following urls.
var filter = { var filter = {
urls: ["https://*.github.com/*", "*://electron.github.io"] urls: ['https://*.github.com/*', '*://electron.github.io']
}; }
session.defaultSession.webRequest.onBeforeSendHeaders(filter, function(details, callback) { session.defaultSession.webRequest.onBeforeSendHeaders(filter, function (details, callback) {
details.requestHeaders['User-Agent'] = "MyAgent"; details.requestHeaders['User-Agent'] = 'MyAgent'
callback({cancel: false, requestHeaders: details.requestHeaders}); callback({cancel: false, requestHeaders: details.requestHeaders})
}); })
``` ```
#### `ses.webRequest.onBeforeRequest([filter, ]listener)` #### `ses.webRequest.onBeforeRequest([filter, ]listener)`

View file

@ -5,9 +5,9 @@
ユーザーのデフォルトのブラウザでURLを開く例です ユーザーのデフォルトのブラウザでURLを開く例です
```javascript ```javascript
const shell = require('electron').shell; const shell = require('electron').shell
shell.openExternal('https://github.com'); shell.openExternal('https://github.com')
``` ```
## メソッド ## メソッド

View file

@ -11,14 +11,14 @@ Electron はネイティブのデスクトップアプリケーション開発
メインプロセススクリプトは普通の Node.js スクリプトのようなものです: メインプロセススクリプトは普通の Node.js スクリプトのようなものです:
```javascript ```javascript
const {app, BrowserWindow} = require('electron'); const {app, BrowserWindow} = require('electron')
let win = null; let win = null
app.on('ready', () => { app.on('ready', () => {
win = new BrowserWindow({width: 800, height: 600}); win = new BrowserWindow({width: 800, height: 600})
win.loadURL('https://github.com'); win.loadURL('https://github.com')
}); })
``` ```
レンダラプロセスは Node モジュールを使うための追加機能を除いて、通常のウェブページとなんら違いはありません: レンダラプロセスは Node モジュールを使うための追加機能を除いて、通常のウェブページとなんら違いはありません:
@ -42,22 +42,22 @@ app.on('ready', () => {
0.37の時点で、 、[分割代入][desctructuring-assignment]でビルトインモジュールの使用をより簡単にできます: 0.37の時点で、 、[分割代入][desctructuring-assignment]でビルトインモジュールの使用をより簡単にできます:
```javascript ```javascript
const {app, BrowserWindow} = require('electron'); const {app, BrowserWindow} = require('electron')
``` ```
もし`electron`モジュール全体が必要であれば、requireして、それぞれのモジュールを`electron`からアクセスすることができます。 もし`electron`モジュール全体が必要であれば、requireして、それぞれのモジュールを`electron`からアクセスすることができます。
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const {app, BrowserWindow} = electron; const {app, BrowserWindow} = electron
``` ```
これは、次のコードと同じ意味を持ちます。 これは、次のコードと同じ意味を持ちます。
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
``` ```
[gui]: https://en.wikipedia.org/wiki/Graphical_user_interface [gui]: https://en.wikipedia.org/wiki/Graphical_user_interface

View file

@ -3,23 +3,23 @@
`Tray`は、オペレーティングシステムの通知エリアでアイコンで表示され、通常コンテキストメニューが付随します。 `Tray`は、オペレーティングシステムの通知エリアでアイコンで表示され、通常コンテキストメニューが付随します。
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const Menu = electron.Menu; const Menu = electron.Menu
const Tray = electron.Tray; const Tray = electron.Tray
var appIcon = null; var appIcon = null
app.on('ready', function(){ app.on('ready', function () {
appIcon = new Tray('/path/to/my/icon'); appIcon = new Tray('/path/to/my/icon')
var contextMenu = Menu.buildFromTemplate([ var contextMenu = Menu.buildFromTemplate([
{ label: 'Item1', type: 'radio' }, { label: 'Item1', type: 'radio' },
{ label: 'Item2', type: 'radio' }, { label: 'Item2', type: 'radio' },
{ label: 'Item3', type: 'radio', checked: true }, { label: 'Item3', type: 'radio', checked: true },
{ label: 'Item4', type: 'radio' } { label: 'Item4', type: 'radio' }
]); ])
appIcon.setToolTip('This is my application.'); appIcon.setToolTip('This is my application.')
appIcon.setContextMenu(contextMenu); appIcon.setContextMenu(contextMenu)
}); })
``` ```

View file

@ -5,9 +5,9 @@
現在のページの倍率を200%にする例です。 現在のページの倍率を200%にする例です。
```javascript ```javascript
var webFrame = require('electron').webFrame; var webFrame = require('electron').webFrame
webFrame.setZoomFactor(2); webFrame.setZoomFactor(2)
``` ```
## メソッド ## メソッド
@ -55,11 +55,11 @@ inputフィールドやtextエリアでスペルチェックの提供を設定
プロバイダーとして[node-spellchecker][spellchecker]を使用する例です: プロバイダーとして[node-spellchecker][spellchecker]を使用する例です:
```javascript ```javascript
webFrame.setSpellCheckProvider("en-US", true, { webFrame.setSpellCheckProvider('en-US', true, {
spellCheck: function(text) { spellCheck: function (text) {
return !(require('spellchecker').isMisspelled(text)); return !(require('spellchecker').isMisspelled(text))
} }
}); })
``` ```
### `webFrame.registerURLSchemeAsSecure(scheme)` ### `webFrame.registerURLSchemeAsSecure(scheme)`

View file

@ -185,15 +185,15 @@ Electronアプリ内でウェブページのような外部コンテンツを埋
```javascript ```javascript
webview.addEventListener('dom-ready', () => { webview.addEventListener('dom-ready', () => {
webview.openDevTools(); webview.openDevTools()
}); })
``` ```
### `<webview>.loadURL(url[, options])` ### `<webview>.loadURL(url[, options])`
* `url` URL * `url` URL
* `options` Object (optional) * `options` Object (optional)
* `httpReferrer` String - リファラURL * `httpReferrer` String - リファラURL
* `userAgent` String - リクエストに使用されるUser agent * `userAgent` String - リクエストに使用されるUser agent
* `extraHeaders` String - 追加のヘッダを"\n"で区切って指定します。 * `extraHeaders` String - 追加のヘッダを"\n"で区切って指定します。
@ -558,8 +558,8 @@ HTML APIでフルスクリーンでなくなった際に発生します。
```javascript ```javascript
webview.addEventListener('console-message', (e) => { webview.addEventListener('console-message', (e) => {
console.log('Guest page logged a message:', e.message); console.log('Guest page logged a message:', e.message)
}); })
``` ```
### Event: 'found-in-page' ### Event: 'found-in-page'
@ -577,11 +577,10 @@ webview.addEventListener('console-message', (e) => {
```javascript ```javascript
webview.addEventListener('found-in-page', (e) => { webview.addEventListener('found-in-page', (e) => {
if (e.result.finalUpdate) if (e.result.finalUpdate) webview.stopFindInPage('keepSelection')
webview.stopFindInPage('keepSelection'); })
});
const requestId = webview.findInPage('test'); const requestId = webview.findInPage('test')
``` ```
### Event: 'new-window' ### Event: 'new-window'
@ -599,14 +598,14 @@ const requestId = webview.findInPage('test');
下記のサンプルは、新しいURLをシステムのデフォルトブラウザで開きます。 下記のサンプルは、新しいURLをシステムのデフォルトブラウザで開きます。
```javascript ```javascript
const {shell} = require('electron'); const {shell} = require('electron')
webview.addEventListener('new-window', (e) => { webview.addEventListener('new-window', (e) => {
const protocol = require('url').parse(e.url).protocol; const protocol = require('url').parse(e.url).protocol
if (protocol === 'http:' || protocol === 'https:') { if (protocol === 'http:' || protocol === 'https:') {
shell.openExternal(e.url); shell.openExternal(e.url)
} }
}); })
``` ```
### Event: 'will-navigate' ### Event: 'will-navigate'
@ -656,8 +655,8 @@ webview.addEventListener('new-window', (e) => {
```javascript ```javascript
webview.addEventListener('close', () => { webview.addEventListener('close', () => {
webview.src = 'about:blank'; webview.src = 'about:blank'
}); })
``` ```
### Event: 'ipc-message' ### Event: 'ipc-message'
@ -674,18 +673,18 @@ webview.addEventListener('close', () => {
```javascript ```javascript
// 埋め込み元ページ(<webview>があるページ)で // 埋め込み元ページ(<webview>があるページ)で
webview.addEventListener('ipc-message', (event) => { webview.addEventListener('ipc-message', (event) => {
console.log(event.channel); console.log(event.channel)
// Prints "pong" // Prints "pong"
}); })
webview.send('ping'); webview.send('ping')
``` ```
```javascript ```javascript
// ゲストページ(<webview>内)で // ゲストページ(<webview>内)で
const {ipcRenderer} = require('electron'); const {ipcRenderer} = require('electron')
ipcRenderer.on('ping', () => { ipcRenderer.on('ping', () => {
ipcRenderer.sendToHost('pong'); ipcRenderer.sendToHost('pong')
}); })
``` ```
### Event: 'crashed' ### Event: 'crashed'

View file

@ -22,17 +22,17 @@ Node.js の新しいバージョンがリリースされたとき、私たちは
// In the main process. // In the main process.
global.sharedObject = { global.sharedObject = {
someProperty: 'default value' someProperty: 'default value'
}; }
``` ```
```javascript ```javascript
// In page 1. // In page 1.
require('remote').getGlobal('sharedObject').someProperty = 'new value'; require('remote').getGlobal('sharedObject').someProperty = 'new value'
``` ```
```javascript ```javascript
// In page 2. // In page 2.
console.log(require('remote').getGlobal('sharedObject').someProperty); console.log(require('remote').getGlobal('sharedObject').someProperty)
``` ```
## 何分か経つと、アプリの Window/tray が消えてしまいます ## 何分か経つと、アプリの Window/tray が消えてしまいます
@ -49,17 +49,17 @@ console.log(require('remote').getGlobal('sharedObject').someProperty);
変更前: 変更前:
```javascript ```javascript
app.on('ready', function() { app.on('ready', function () {
var tray = new Tray('/path/to/icon.png'); var tray = new Tray('/path/to/icon.png')
}) })
``` ```
変更後: 変更後:
```javascript ```javascript
var tray = null; var tray = null
app.on('ready', function() { app.on('ready', function () {
tray = new Tray('/path/to/icon.png'); tray = new Tray('/path/to/icon.png')
}) })
``` ```
@ -75,7 +75,7 @@ var win = new BrowserWindow({
webPreferences: { webPreferences: {
nodeIntegration: false nodeIntegration: false
} }
}); })
``` ```
しかし、Node.jsとElectron APIを使用した機能を維持したい場合は、ほかのライブラリを読み込む前に、ページのシンボルをリネームする必要があります。 しかし、Node.jsとElectron APIを使用した機能を維持したい場合は、ほかのライブラリを読み込む前に、ページのシンボルをリネームする必要があります。
@ -106,7 +106,7 @@ Uncaught TypeError: Cannot read property 'setZoomLevel' of undefined
正しい組み込みモジュールを使用しているかを確認するために、`electron`モジュールのパスを出力します。 正しい組み込みモジュールを使用しているかを確認するために、`electron`モジュールのパスを出力します。
```javascript ```javascript
console.log(require.resolve('electron')); console.log(require.resolve('electron'))
``` ```
そして、次の形式かどうかを確認します。 そして、次の形式かどうかを確認します。

View file

@ -43,29 +43,29 @@ $ asar list /path/to/example.asar
`asar` アーカイブ内のファイルを読み込む: `asar` アーカイブ内のファイルを読み込む:
```javascript ```javascript
const fs = require('fs'); const fs = require('fs')
fs.readFileSync('/path/to/example.asar/file.txt'); fs.readFileSync('/path/to/example.asar/file.txt')
``` ```
アーカイブのルート直下にあるすべてのファイルを一覧にする: アーカイブのルート直下にあるすべてのファイルを一覧にする:
```javascript ```javascript
const fs = require('fs'); const fs = require('fs')
fs.readdirSync('/path/to/example.asar'); fs.readdirSync('/path/to/example.asar')
``` ```
アーカイブからモジュールを使用する: アーカイブからモジュールを使用する:
```javascript ```javascript
require('/path/to/example.asar/dir/module.js'); require('/path/to/example.asar/dir/module.js')
``` ```
`BrowserWindow` を使って `asar` アーカイブ内の Web ページを表示することもできます: `BrowserWindow` を使って `asar` アーカイブ内の Web ページを表示することもできます:
```javascript ```javascript
const {BrowserWindow} = require('electron'); const {BrowserWindow} = require('electron')
let win = new BrowserWindow({width: 800, height: 600}); let win = new BrowserWindow({width: 800, height: 600})
win.loadURL('file:///path/to/example.asar/static/index.html'); win.loadURL('file:///path/to/example.asar/static/index.html')
``` ```
### Web API ### Web API
@ -89,15 +89,15 @@ $.get('file:///path/to/example.asar/file.txt', (data) => {
アーカイブのチェックサムを検証する等の幾つかのケースでは、`asar` アーカイブをファイルとして読み込む必要があります。この目的のために、 `asar` サポートしないオリジナルの `fs` API を提供するビルトインの `original-fs` モジュールを使用できます。 アーカイブのチェックサムを検証する等の幾つかのケースでは、`asar` アーカイブをファイルとして読み込む必要があります。この目的のために、 `asar` サポートしないオリジナルの `fs` API を提供するビルトインの `original-fs` モジュールを使用できます。
```javascript ```javascript
const originalFs = require('original-fs'); const originalFs = require('original-fs')
originalFs.readFileSync('/path/to/example.asar'); originalFs.readFileSync('/path/to/example.asar')
``` ```
`process.noAssar``true` をセットしても `fs` モジュールの `asar` サポートを無効にすることができます: `process.noAssar``true` をセットしても `fs` モジュールの `asar` サポートを無効にすることができます:
```javascript ```javascript
process.noAsar = true; process.noAsar = true
fs.readFileSync('/path/to/example.asar'); fs.readFileSync('/path/to/example.asar')
``` ```
## Node API の制限 ## Node API の制限

View file

@ -14,11 +14,11 @@
```javascript ```javascript
let myNotification = new Notification('Title', { let myNotification = new Notification('Title', {
body: 'Lorem Ipsum Dolor Sit Amet' body: 'Lorem Ipsum Dolor Sit Amet'
}); })
myNotification.onclick = () => { myNotification.onclick = () => {
console.log('Notification clicked'); console.log('Notification clicked')
}; }
``` ```
オペレーティングシステム間でコードとユーザ体験は似ていますが、細かい違いがあります。 オペレーティングシステム間でコードとユーザ体験は似ていますが、細かい違いがあります。
@ -57,13 +57,13 @@ __Application dock menu:__
最近のドキュメントにファイルを追加するために、[app.addRecentDocument][addrecentdocument] APIを使用できます: 最近のドキュメントにファイルを追加するために、[app.addRecentDocument][addrecentdocument] APIを使用できます:
```javascript ```javascript
app.addRecentDocument('/Users/USERNAME/Desktop/work.type'); app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
``` ```
[app.clearRecentDocuments][clearrecentdocuments] API を使用して、最近のドキュメント一覧を空にできます: [app.clearRecentDocuments][clearrecentdocuments] API を使用して、最近のドキュメント一覧を空にできます:
```javascript ```javascript
app.clearRecentDocuments(); app.clearRecentDocuments()
``` ```
### Windows 留意点 ### Windows 留意点
@ -87,21 +87,21 @@ __Dock menu of Terminal.app:__
カスタムドックメニューを設定するために、macOSのみに提供されている `app.dock.setMenu` APIを使用できます。 カスタムドックメニューを設定するために、macOSのみに提供されている `app.dock.setMenu` APIを使用できます。
```javascript ```javascript
const electron = require('electron'); const {app, Menu} = require('electron')
const app = electron.app;
const Menu = electron.Menu;
const dockMenu = Menu.buildFromTemplate([ const dockMenu = Menu.buildFromTemplate([
{ label: 'New Window', click() { console.log('New Window'); } }, {label: 'New Window', click () { console.log('New Window') }},
{ label: 'New Window with Settings', submenu: [ {label: 'New Window with Settings',
{ label: 'Basic' }, submenu: [
{ label: 'Pro'} {label: 'Basic'},
{label: 'Pro'}
]}, ]},
{ label: 'New Command...'} {label: 'New Command...'}
]); ])
app.dock.setMenu(dockMenu); app.dock.setMenu(dockMenu)
``` ```
## ユーザータスク (Windows) ## ユーザータスク (Windows)
Windowsでは、ジャンプリストの `Tasks` カテゴリでカスタムアクションを指定できます。 Windowsでは、ジャンプリストの `Tasks` カテゴリでカスタムアクションを指定できます。
@ -129,13 +129,13 @@ app.setUserTasks([
title: 'New Window', title: 'New Window',
description: 'Create a new window' description: 'Create a new window'
} }
]); ])
``` ```
タスクリストをクリアするために、`app.setUserTasks` をコールし、配列を空にします。 タスクリストをクリアするために、`app.setUserTasks` をコールし、配列を空にします。
```javascript ```javascript
app.setUserTasks([]); app.setUserTasks([])
``` ```
アプリケーションを閉じた後もユーザータスクは表示されていてるので、アプリケーションをアンインストールするまではタスクに指定したアイコンとプログラムのパスは存在し続けてる必要があります。 アプリケーションを閉じた後もユーザータスクは表示されていてるので、アプリケーションをアンインストールするまではタスクに指定したアイコンとプログラムのパスは存在し続けてる必要があります。
@ -156,32 +156,32 @@ __Windows Media Playerの縮小表示ツールバー:__
アプリケーションに縮小表示ツールバーを設定するために、[BrowserWindow.setThumbarButtons][setthumbarbuttons]を使えます: アプリケーションに縮小表示ツールバーを設定するために、[BrowserWindow.setThumbarButtons][setthumbarbuttons]を使えます:
```javascript ```javascript
const {BrowserWindow} = require('electron'); const {BrowserWindow} = require('electron')
const path = require('path'); const path = require('path')
let win = new BrowserWindow({ let win = new BrowserWindow({
width: 800, width: 800,
height: 600 height: 600
}); })
win.setThumbarButtons([ win.setThumbarButtons([
{ {
tooltip: 'button1', tooltip: 'button1',
icon: path.join(__dirname, 'button1.png'), icon: path.join(__dirname, 'button1.png'),
click() { console.log("button2 clicked"); } click () { console.log('button2 clicked') }
}, },
{ {
tooltip: 'button2', tooltip: 'button2',
icon: path.join(__dirname, 'button2.png'), icon: path.join(__dirname, 'button2.png'),
flags: ['enabled', 'dismissonclick'], flags: ['enabled', 'dismissonclick'],
click() { console.log("button2 clicked."); } click () { console.log('button2 clicked.') }
} }
]); ])
``` ```
縮小表示ツールバーボタンをクリアするために、 `BrowserWindow.setThumbarButtons` をコールして配列を空にします: 縮小表示ツールバーボタンをクリアするために、 `BrowserWindow.setThumbarButtons` をコールして配列を空にします:
```javascript ```javascript
win.setThumbarButtons([]); win.setThumbarButtons([])
``` ```
## Unity ランチャーショートカット (Linux) ## Unity ランチャーショートカット (Linux)
@ -206,8 +206,8 @@ __タスクバーボタン上の進行状況バー:__
ウィンドウに進行状況バーを設定するために、[BrowserWindow.setProgressBar][setprogressbar] APIを使えます: ウィンドウに進行状況バーを設定するために、[BrowserWindow.setProgressBar][setprogressbar] APIを使えます:
```javascript ```javascript
let win = new BrowserWindow({...}); let win = new BrowserWindow()
win.setProgressBar(0.5); win.setProgressBar(0.5)
``` ```
## タスクバーでアイコンをオーバーレイする (Windows) ## タスクバーでアイコンをオーバーレイする (Windows)
@ -223,8 +223,8 @@ __タスクバーボタンでのオーバーレイ:__
ウィンドウでオーバーレイアイコンを設定するために、[BrowserWindow.setOverlayIcon][setoverlayicon] APIを使用できます。 ウィンドウでオーバーレイアイコンを設定するために、[BrowserWindow.setOverlayIcon][setoverlayicon] APIを使用できます。
```javascript ```javascript
let win = new BrowserWindow({...}); let win = new BrowserWindow()
win.setOverlayIcon('path/to/overlay.png', 'Description for overlay'); win.setOverlayIcon('path/to/overlay.png', 'Description for overlay')
``` ```
## Windowのファイル表示 (macOS) ## Windowのファイル表示 (macOS)
@ -240,9 +240,9 @@ __Represented file ポップアップメニュー:__
ウィンドウにrepresented fileを設定するために、[BrowserWindow.setRepresentedFilename][setrepresentedfilename] と [BrowserWindow.setDocumentEdited][setdocumentedited] APIsを使えます: ウィンドウにrepresented fileを設定するために、[BrowserWindow.setRepresentedFilename][setrepresentedfilename] と [BrowserWindow.setDocumentEdited][setdocumentedited] APIsを使えます:
```javascript ```javascript
let win = new BrowserWindow({...}); let win = new BrowserWindow()
win.setRepresentedFilename('/etc/passwd'); win.setRepresentedFilename('/etc/passwd')
win.setDocumentEdited(true); win.setDocumentEdited(true)
``` ```
[addrecentdocument]: ../api/app.md#appaddrecentdocumentpath-os-x-windows [addrecentdocument]: ../api/app.md#appaddrecentdocumentpath-os-x-windows

View file

@ -18,14 +18,14 @@ $ git clone --recursive https://github.com/facebook/react-devtools.git
複数のウィンドウで、DevToolsを開くために、Electronでエクステンションをロードし、DevToolsコンソールで次のコードを実行します。 複数のウィンドウで、DevToolsを開くために、Electronでエクステンションをロードし、DevToolsコンソールで次のコードを実行します。
```javascript ```javascript
const BrowserWindow = require('electron').remote.BrowserWindow; const BrowserWindow = require('electron').remote.BrowserWindow
BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome'); BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome')
``` ```
エクステンションをアンロードするために、`BrowserWindow.removeDevToolsExtension` APIを名前を指定してコールすると、次回DevToolsを開いた時にはロードされません。 エクステンションをアンロードするために、`BrowserWindow.removeDevToolsExtension` APIを名前を指定してコールすると、次回DevToolsを開いた時にはロードされません。
```javascript ```javascript
BrowserWindow.removeDevToolsExtension('React Developer Tools'); BrowserWindow.removeDevToolsExtension('React Developer Tools')
``` ```
## DevTools エクステンションのフォーマット ## DevTools エクステンションのフォーマット

View file

@ -5,16 +5,16 @@
_main.js_ _main.js_
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
let onlineStatusWindow; let onlineStatusWindow
app.on('ready', () => { app.on('ready', () => {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
``` ```
_online-status.html_ _online-status.html_
@ -42,21 +42,21 @@ _online-status.html_
_main.js_ _main.js_
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const ipcMain = electron.ipcMain; const ipcMain = electron.ipcMain
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
let onlineStatusWindow; let onlineStatusWindow
app.on('ready', () => { app.on('ready', () => {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
ipcMain.on('online-status-changed', (event, status) => { ipcMain.on('online-status-changed', (event, status) => {
console.log(status); console.log(status)
}); })
``` ```
_online-status.html_ _online-status.html_

View file

@ -39,7 +39,7 @@ your-app/
`package.json` の形式は Node モジュールとまったく同じです。 `main` フィールドで指定するスクリプトはアプリの起動スクリプトであり、メインプロセスを実行します。 `package.json` の例は次のようになります: `package.json` の形式は Node モジュールとまったく同じです。 `main` フィールドで指定するスクリプトはアプリの起動スクリプトであり、メインプロセスを実行します。 `package.json` の例は次のようになります:
```json ```javascripton
{ {
"name" : "your-app", "name" : "your-app",
"version" : "0.1.0", "version" : "0.1.0",
@ -52,52 +52,52 @@ __注記__ `package.json` に `main` が存在しない場合、Electron は
`main.js` ではウィンドウを作成してシステムイベントを管理します。典型的な例は次のようになります: `main.js` ではウィンドウを作成してシステムイベントを管理します。典型的な例は次のようになります:
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
// アプリケーションを操作するモジュール // アプリケーションを操作するモジュール
const {app} = electron; const {app} = electron
// ネイティブブラウザウィンドウを作成するモジュール // ネイティブブラウザウィンドウを作成するモジュール
const {BrowserWindow} = electron; const {BrowserWindow} = electron
// ウィンドウオブジェクトをグローバル参照をしておくこと。 // ウィンドウオブジェクトをグローバル参照をしておくこと。
// しないと、ガベージコレクタにより自動的に閉じられてしまう。 // しないと、ガベージコレクタにより自動的に閉じられてしまう。
let win; let win
function createWindow() { function createWindow () {
// ブラウザウィンドウの作成 // ブラウザウィンドウの作成
win = new BrowserWindow({width: 800, height: 600}); win = new BrowserWindow({width: 800, height: 600})
// アプリケーションのindex.htmlの読み込み // アプリケーションのindex.htmlの読み込み
win.loadURL(`file://${__dirname}/index.html`); win.loadURL(`file://${__dirname}/index.html`)
// DevToolsを開く // DevToolsを開く
win.webContents.openDevTools(); win.webContents.openDevTools()
// ウィンドウが閉じられた時に発行される // ウィンドウが閉じられた時に発行される
win.on('closed', () => { win.on('closed', () => {
// ウィンドウオブジェクトを参照から外す。 // ウィンドウオブジェクトを参照から外す。
// もし何個かウィンドウがあるならば、配列として持っておいて、対応するウィンドウのオブジェクトを消去するべき。 // もし何個かウィンドウがあるならば、配列として持っておいて、対応するウィンドウのオブジェクトを消去するべき。
win = null; win = null
}); })
} }
// このメソッドはElectronが初期化を終えて、ブラウザウィンドウを作成可能になった時に呼び出される。 // このメソッドはElectronが初期化を終えて、ブラウザウィンドウを作成可能になった時に呼び出される。
// 幾つかのAPIはこのイベントの後でしか使えない。 // 幾つかのAPIはこのイベントの後でしか使えない。
app.on('ready', createWindow); app.on('ready', createWindow)
// すべてのウィンドウが閉じられた時にアプリケーションを終了する。 // すべてのウィンドウが閉じられた時にアプリケーションを終了する。
app.on('window-all-closed', () => { app.on('window-all-closed', () => {
// macOSでは、Cmd + Q(終了)をユーザーが実行するまではウィンドウが全て閉じられても終了しないでおく。 // macOSでは、Cmd + Q(終了)をユーザーが実行するまではウィンドウが全て閉じられても終了しないでおく。
if (process.platform !== 'darwin') { if (process.platform !== 'darwin') {
app.quit(); app.quit()
} }
}); })
app.on('activate', () => { app.on('activate', () => {
// macOS では、ドックをクリックされた時にウィンドウがなければ新しく作成する。 // macOS では、ドックをクリックされた時にウィンドウがなければ新しく作成する。
if (win === null) { if (win === null) {
createWindow(); createWindow()
} }
}); })
// このファイルでアプリケーション固有のメインプロセスのコードを読み込むことができる。 // このファイルでアプリケーション固有のメインプロセスのコードを読み込むことができる。
// ファイルを別に分けておいてここでrequireすることもできる。 // ファイルを別に分けておいてここでrequireすることもできる。

View file

@ -18,22 +18,22 @@ macOSとLinuxでは、Pepper Flashプラグインの詳細は、Chromeブラウ
// On Windows, it might be /path/to/pepflashplayer.dll // On Windows, it might be /path/to/pepflashplayer.dll
// On macOS, /path/to/PepperFlashPlayer.plugin // On macOS, /path/to/PepperFlashPlayer.plugin
// On Linux, /path/to/libpepflashplayer.so // On Linux, /path/to/libpepflashplayer.so
app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so'); app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so')
// Specify flash version, for example, v17.0.0.169 // Specify flash version, for example, v17.0.0.169
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169'); app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
app.on('ready', function() { app.on('ready', function () {
mainWindow = new BrowserWindow({ mainWindow = new BrowserWindow({
'width': 800, 'width': 800,
'height': 600, 'height': 600,
'web-preferences': { 'web-preferences': {
'plugins': true 'plugins': true
} }
}); })
mainWindow.loadURL('file://' + __dirname + '/index.html'); mainWindow.loadURL(`file://${__dirname}/index.html`)
// Something else // Something else
}); })
``` ```
## `<webview>` タグでFlashプラグインを有効化 ## `<webview>` タグでFlashプラグインを有効化

View file

@ -15,7 +15,7 @@ Electronで `chromedriver` を使用するために、Electronがどこにある
$ npm install --save-dev spectron $ npm install --save-dev spectron
``` ```
```js ```javascript
// 可視のウィンドウがタイトル付きで開かれているかを調べる簡単なテスト // 可視のウィンドウがタイトル付きで開かれているかを調べる簡単なテスト
var Application = require('spectron').Application var Application = require('spectron').Application
var assert = require('assert') var assert = require('assert')
@ -72,7 +72,7 @@ $ npm install selenium-webdriver
Electronでの `selenium-webdriver` 使用方法は、chrome driverへの接続方法とElectronバイナリがどこにあるかをマニュアルで指定する以外は、upstreamと基本的に同じです。 Electronでの `selenium-webdriver` 使用方法は、chrome driverへの接続方法とElectronバイナリがどこにあるかをマニュアルで指定する以外は、upstreamと基本的に同じです。
```javascript ```javascript
const webdriver = require('selenium-webdriver'); const webdriver = require('selenium-webdriver')
const driver = new webdriver.Builder() const driver = new webdriver.Builder()
// The "9515" is the port opened by chrome driver. // The "9515" is the port opened by chrome driver.
@ -80,22 +80,22 @@ const driver = new webdriver.Builder()
.withCapabilities({ .withCapabilities({
chromeOptions: { chromeOptions: {
// Here is the path to your Electron binary. // Here is the path to your Electron binary.
binary: '/Path-to-Your-App.app/Contents/MacOS/Electron', binary: '/Path-to-Your-App.app/Contents/MacOS/Electron'
} }
}) })
.forBrowser('electron') .forBrowser('electron')
.build(); .build()
driver.get('http://www.google.com'); driver.get('http://www.google.com')
driver.findElement(webdriver.By.name('q')).sendKeys('webdriver'); driver.findElement(webdriver.By.name('q')).sendKeys('webdriver')
driver.findElement(webdriver.By.name('btnG')).click(); driver.findElement(webdriver.By.name('btnG')).click()
driver.wait(function() { driver.wait(function () {
return driver.getTitle().then(function(title) { return driver.getTitle().then(function (title) {
return title === 'webdriver - Google Search'; return title === 'webdriver - Google Search'
}); })
}, 1000); }, 1000)
driver.quit(); driver.quit()
``` ```
## WebdriverIOのセットアップをする ## WebdriverIOのセットアップをする
@ -123,20 +123,20 @@ $ npm install webdriverio
### 3. chrome driverに接続する ### 3. chrome driverに接続する
```javascript ```javascript
const webdriverio = require('webdriverio'); const webdriverio = require('webdriverio')
const options = { const options = {
host: "localhost", // Use localhost as chrome driver server host: 'localhost', // Use localhost as chrome driver server
port: 9515, // "9515" is the port opened by chrome driver. port: 9515, // "9515" is the port opened by chrome driver.
desiredCapabilities: { desiredCapabilities: {
browserName: 'chrome', browserName: 'chrome',
chromeOptions: { chromeOptions: {
binary: '/Path-to-Your-App/electron', // Path to your Electron binary. binary: '/Path-to-Your-App/electron', // Path to your Electron binary.
args: [/* cli arguments */] // Optional, perhaps 'app=' + /path/to/your/app/ args: [/* cli arguments */] // Optional, perhaps 'app=' + /path/to/your/app/
}
} }
}; }
}
let client = webdriverio.remote(options); let client = webdriverio.remote(options)
client client
.init() .init()
@ -144,9 +144,9 @@ client
.setValue('#q', 'webdriverio') .setValue('#q', 'webdriverio')
.click('#btnG') .click('#btnG')
.getTitle().then((title) => { .getTitle().then((title) => {
console.log('Title was: ' + title); console.log('Title was: ' + title)
}) })
.end(); .end()
``` ```
## ワークフロー ## ワークフロー

View file

@ -35,19 +35,19 @@ __Note:__ `widevinecdmadapter` バイナリはElectronにパスが通ってい
// * `widevinecdmadapter.plugin` on macOS, // * `widevinecdmadapter.plugin` on macOS,
// * `libwidevinecdmadapter.so` on Linux, // * `libwidevinecdmadapter.so` on Linux,
// * `widevinecdmadapter.dll` on Windows. // * `widevinecdmadapter.dll` on Windows.
app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin'); app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin')
// The version of plugin can be got from `chrome://plugins` page in Chrome. // The version of plugin can be got from `chrome://plugins` page in Chrome.
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866'); app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')
let win = null; let win = null
app.on('ready', () => { app.on('ready', () => {
win = new BrowserWindow({ win = new BrowserWindow({
webPreferences: { webPreferences: {
// The `plugins` have to be enabled. // The `plugins` have to be enabled.
plugins: true plugins: true
} }
}); })
}); })
``` ```
## プラグインの検証 ## プラグインの検証

View file

@ -645,15 +645,21 @@ app.setJumpList([
name: 'Tools', name: 'Tools',
items: [ items: [
{ {
type: 'task', title: 'Tool A', type: 'task',
program: process.execPath, args: '--run-tool-a', title: 'Tool A',
icon: process.execPath, iconIndex: 0, program: process.execPath,
args: '--run-tool-a',
icon: process.execPath,
iconIndex: 0,
description: 'Runs Tool A' description: 'Runs Tool A'
}, },
{ {
type: 'task', title: 'Tool B', type: 'task',
program: process.execPath, args: '--run-tool-b', title: 'Tool B',
icon: process.execPath, iconIndex: 0, program: process.execPath,
args: '--run-tool-b',
icon: process.execPath,
iconIndex: 0,
description: 'Runs Tool B' description: 'Runs Tool B'
} }
] ]
@ -662,14 +668,18 @@ app.setJumpList([
{ // has no name and no type so `type` is assumed to be "tasks" { // has no name and no type so `type` is assumed to be "tasks"
items: [ items: [
{ {
type: 'task', title: 'New Project', type: 'task',
program: process.execPath, args: '--new-project', title: 'New Project',
program: process.execPath,
args: '--new-project',
description: 'Create a new project.' description: 'Create a new project.'
}, },
{ type: 'separator' }, { type: 'separator' },
{ {
type: 'task', title: 'Recover Project', type: 'task',
program: process.execPath, args: '--recover-project', title: 'Recover Project',
program: process.execPath,
args: '--recover-project',
description: 'Recover Project' description: 'Recover Project'
} }
] ]

View file

@ -97,7 +97,7 @@ Returns `Object`:
**참고:** 윈도우의 대부분의 앱은 북마크 붙여넣기를 지원하지 않습니다. **참고:** 윈도우의 대부분의 앱은 북마크 붙여넣기를 지원하지 않습니다.
`clipboard.write` 를 통해 북마크와 대체 텍스트를 클립보드에 쓸 수 있습니다. `clipboard.write` 를 통해 북마크와 대체 텍스트를 클립보드에 쓸 수 있습니다.
```js ```javascript
clipboard.write({ clipboard.write({
text: 'http://electron.atom.io', text: 'http://electron.atom.io',
bookmark: 'Electron Homepage' bookmark: 'Electron Homepage'

View file

@ -147,7 +147,7 @@ if (browserOptions.transparent) {
사용자의 현재 시스템 전체 색상 환경설정을 RGBA 16진 문자열 형태로 반환합니다. 사용자의 현재 시스템 전체 색상 환경설정을 RGBA 16진 문자열 형태로 반환합니다.
```js ```javascript
const color = systemPreferences.getAccentColor() // `"aabbccdd"` const color = systemPreferences.getAccentColor() // `"aabbccdd"`
const red = color.substr(0, 2) // "aa" const red = color.substr(0, 2) // "aa"
const green = color.substr(2, 2) // "bb" const green = color.substr(2, 2) // "bb"

View file

@ -165,7 +165,7 @@ console.log(webFrame.getResourceUsage())
cssStyleSheets: { /* same with "images" */ }, cssStyleSheets: { /* same with "images" */ },
xslStyleSheets: { /* same with "images" */ }, xslStyleSheets: { /* same with "images" */ },
fonts: { /* same with "images" */ }, fonts: { /* same with "images" */ },
other: { /* same with "images" */ }, other: { /* same with "images" */ }
} }
``` ```

View file

@ -9,7 +9,7 @@ $ code electron-quick-start
### 2. 다음 설정으로 `.vscode/launch.json` 파일 추가하기: ### 2. 다음 설정으로 `.vscode/launch.json` 파일 추가하기:
```json ```javascripton
{ {
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [

View file

@ -116,7 +116,8 @@ const {app, Menu} = require('electron')
const dockMenu = Menu.buildFromTemplate([ const dockMenu = Menu.buildFromTemplate([
{label: 'New Window', click () { console.log('New Window') }}, {label: 'New Window', click () { console.log('New Window') }},
{label: 'New Window with Settings', submenu: [ {label: 'New Window with Settings',
submenu: [
{label: 'Basic'}, {label: 'Basic'},
{label: 'Pro'} {label: 'Pro'}
]}, ]},

View file

@ -61,7 +61,7 @@ your-app/
파일을 지정하면 메인 프로세스의 엔트리 포인트로 사용합니다. 예를 들어 사용할 수 있는 파일을 지정하면 메인 프로세스의 엔트리 포인트로 사용합니다. 예를 들어 사용할 수 있는
`package.json`은 다음과 같습니다: `package.json`은 다음과 같습니다:
```json ```javascripton
{ {
"name" : "your-app", "name" : "your-app",
"version" : "0.1.0", "version" : "0.1.0",

View file

@ -2,13 +2,13 @@
O módulo `app` é responsável por controlar o ciclo de vida do aplicativo. O módulo `app` é responsável por controlar o ciclo de vida do aplicativo.
O exemplo a seguir mostra como fechar o aplicativo quando a última janela é fechada: O exemplo a seguir mostra como fechar o aplicativo quando a última janela é fechada:
```javascript ```javascript
const app = require('electron').app; const app = require('electron').app
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
app.quit(); app.quit()
}); })
``` ```
## Eventos ## Eventos
@ -152,15 +152,15 @@ para confiar no certificado, você deve impedir o comportamento padrão com
`event.preventDefault()` e chamar `callback(true)`. `event.preventDefault()` e chamar `callback(true)`.
```javascript ```javascript
session.on('certificate-error', function(event, webContents, url, error, certificate, callback) { session.on('certificate-error', function (event, webContents, url, error, certificate, callback) {
if (url == "https://github.com") { if (url === 'https://github.com') {
// Lógica de verificação. // Lógica de verificação.
event.preventDefault(); event.preventDefault()
callback(true); callback(true)
} else { } else {
callback(false); callback(false)
} }
}); })
``` ```
### Evento: 'select-client-certificate' ### Evento: 'select-client-certificate'
@ -183,9 +183,9 @@ Usar `event.preventDefault()` impede o aplicativo de usar o primeiro certificado
da memória. da memória.
```javascript ```javascript
app.on('select-client-certificate', function(event, webContents, url, list, callback) { app.on('select-client-certificate', function (event, webContents, url, list, callback) {
event.preventDefault(); event.preventDefault()
callback(list[0]); callback(list[0])
}) })
``` ```
@ -214,9 +214,9 @@ isto, você deve impedir esse comportamento com `event.preventDefault()` e
chamar `callback(username, password)` com as credenciais. chamar `callback(username, password)` com as credenciais.
```javascript ```javascript
app.on('login', function(event, webContents, request, authInfo, callback) { app.on('login', function (event, webContents, request, authInfo, callback) {
event.preventDefault(); event.preventDefault()
callback('username', 'secret'); callback('username', 'secret')
}) })
``` ```
@ -365,26 +365,23 @@ No macOS o sistema enforça instância única automaticamente quando usuários t
Um exemplo de ativação da janela de primeira instância quando uma segunda instância inicializa: Um exemplo de ativação da janela de primeira instância quando uma segunda instância inicializa:
```js ```javascript
var myWindow = null; let myWindow = null
var shouldQuit = app.makeSingleInstance(function(commandLine, workingDirectory) { let shouldQuit = app.makeSingleInstance(function (commandLine, workingDirectory) {
// Alguém tentou rodar uma segunda instância, devemos focar nossa janela // Alguém tentou rodar uma segunda instância, devemos focar nossa janela
if (myWindow) { if (myWindow) {
if (myWindow.isMinimized()) myWindow.restore(); if (myWindow.isMinimized()) myWindow.restore()
myWindow.focus(); myWindow.focus()
} }
return true; return true
}); })
if (shouldQuit) { if (shouldQuit) app.quit()
app.quit();
return;
}
// Cria myWindow, carrega o resto do aplicativo, etc... app.on('ready', function () {
app.on('ready', function() { // Cria myWindow, carrega o resto do aplicativo, etc...
}); })
``` ```
### `app.setAppUserModelId(id)` _Windows_ ### `app.setAppUserModelId(id)` _Windows_

View file

@ -3,15 +3,15 @@
A classe `BrowserWindow` lhe dá a habilidade de criar uma janela do browser. Por exemplo: A classe `BrowserWindow` lhe dá a habilidade de criar uma janela do browser. Por exemplo:
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600, show: false }); var win = new BrowserWindow({ width: 800, height: 600, show: false })
win.on('closed', function() { win.on('closed', function () {
win = null; win = null
}); })
win.loadURL('https://github.com'); win.loadURL('https://github.com')
win.show(); win.show()
``` ```
Você também pode criar uma janela sem o chrome utilizando a API [Frameless Window](../../../docs/api/frameless-window.md). Você também pode criar uma janela sem o chrome utilizando a API [Frameless Window](../../../docs/api/frameless-window.md).
@ -109,16 +109,16 @@ Emitido quando a janela for fechar. É emitido antes dos eventos `beforeunload`
Normalmente você utiliza o manipulador de eventos do `beforeunload` para decidir se a janela deve ser fechada, que também será chamado quando a janela é recarregada. No Electron, retornar uma string vazia ou `false` cancela o fechamento. Por exemplo: Normalmente você utiliza o manipulador de eventos do `beforeunload` para decidir se a janela deve ser fechada, que também será chamado quando a janela é recarregada. No Electron, retornar uma string vazia ou `false` cancela o fechamento. Por exemplo:
```javascript ```javascript
window.onbeforeunload = function(e) { window.onbeforeunload = function (e) {
console.log('Não quero ser fechada'); console.log('Não quero ser fechada')
// Diferente de navegadores comuns, nos quais uma string deve ser retornada e // Diferente de navegadores comuns, nos quais uma string deve ser retornada e
// o usuário deve confirmar se a janela será fechada, o Electron dá mais opções // o usuário deve confirmar se a janela será fechada, o Electron dá mais opções
// aos desenvolvedores. Retornar uma string vazia ou false cancela o fechamento. // aos desenvolvedores. Retornar uma string vazia ou false cancela o fechamento.
// Você também pode usar a API de diálogo para deixar que o usuário confirme o // Você também pode usar a API de diálogo para deixar que o usuário confirme o
// fechamento do aplicativo. // fechamento do aplicativo.
e.returnValue = false; e.returnValue = false
}; }
``` ```
### Evento: 'closed' ### Evento: 'closed'
@ -191,13 +191,13 @@ Emitido quando a janela sai do estado de tela cheia, ocasionado por uma api de h
Emitido quando um [App Command](https://msdn.microsoft.com/en-us/library/windows/desktop/ms646275(v=vs.85).aspx) é invocado. Estes estão tipicamente relacionado às teclas de mídia do teclado, ou comandos do browser, assim como o botão "Voltar" existente em alguns modelos de mouse no Windows. Emitido quando um [App Command](https://msdn.microsoft.com/en-us/library/windows/desktop/ms646275(v=vs.85).aspx) é invocado. Estes estão tipicamente relacionado às teclas de mídia do teclado, ou comandos do browser, assim como o botão "Voltar" existente em alguns modelos de mouse no Windows.
```js ```javascript
someWindow.on('app-command', function(e, cmd) { someWindow.on('app-command', function (e, cmd) {
// Navega a janela 'para trás' quando o usuário pressiona o botão voltar do mouse // Navega a janela 'para trás' quando o usuário pressiona o botão voltar do mouse
if (cmd === 'browser-backward' && someWindow.webContents.canGoBack()) { if (cmd === 'browser-backward' && someWindow.webContents.canGoBack()) {
someWindow.webContents.goBack(); someWindow.webContents.goBack()
} }
}); })
``` ```
## Métodos ## Métodos
@ -244,7 +244,7 @@ Objetos criados com `new BrowserWindow` possuem as seguintes propriedades:
```javascript ```javascript
// Neste exemplo `win` é a nossa instância // Neste exemplo `win` é a nossa instância
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
``` ```
### `win.webContents` ### `win.webContents`

View file

@ -9,9 +9,9 @@ Por exemplo:
```javascript ```javascript
app.on('ready', () => { app.on('ready', () => {
require('electron').powerMonitor.on('suspend', () => { require('electron').powerMonitor.on('suspend', () => {
console.log('O sistema está indo dormir'); console.log('O sistema está indo dormir')
}); })
}); })
``` ```
## Eventos ## Eventos

View file

@ -16,14 +16,14 @@ Emitido quando o Electron carregou seu script de inicialização interno e está
Pode ser utilizado pelo script pré-carregamento (preload.js abaixo) para adicionar símbolos globais do Node removidos para o escopo global quando a integração do node é desligada: Pode ser utilizado pelo script pré-carregamento (preload.js abaixo) para adicionar símbolos globais do Node removidos para o escopo global quando a integração do node é desligada:
```js ```javascript
// preload.js // preload.js
var _setImmediate = setImmediate; var _setImmediate = setImmediate
var _clearImmediate = clearImmediate; var _clearImmediate = clearImmediate
process.once('loaded', function() { process.once('loaded', function () {
global.setImmediate = _setImmediate; global.setImmediate = _setImmediate
global.clearImmediate = _clearImmediate; global.clearImmediate = _clearImmediate
}); })
``` ```
## Propriedades ## Propriedades

View file

@ -5,8 +5,8 @@ O módulo `shell` fornece funções relacionadas à integração com o desktop.
Um exemplo para abrir uma URL no browser padrão do usuário: Um exemplo para abrir uma URL no browser padrão do usuário:
```javascript ```javascript
const shell = require('shell'); const shell = require('shell')
shell.openExternal('https://github.com'); shell.openExternal('https://github.com')
``` ```
## Métodos ## Métodos

View file

@ -71,7 +71,7 @@ O evento é uma cadeia que é utilizada após um `.on` em um método listner. Se
crie algo parecido com o exemplo abaixo: crie algo parecido com o exemplo abaixo:
```javascript ```javascript
Alarm.on('wake-up', function(time) { Alarm.on('wake-up', function (time) {
console.log(time) console.log(time)
}) })
``` ```

View file

@ -49,29 +49,29 @@ $ asar list /path/to/example.asar
Lendo um arquivo em pacote `asar`: Lendo um arquivo em pacote `asar`:
```javascript ```javascript
var fs = require('fs'); var fs = require('fs')
fs.readFileSync('/path/to/example.asar/file.txt'); fs.readFileSync('/path/to/example.asar/file.txt')
``` ```
Listando todos os arquivos a partir da raiz: Listando todos os arquivos a partir da raiz:
```javascript ```javascript
var fs = require('fs'); var fs = require('fs')
fs.readdirSync('/path/to/example.asar'); fs.readdirSync('/path/to/example.asar')
``` ```
Utilizando um módulo dentro do pacote `asar`: Utilizando um módulo dentro do pacote `asar`:
```javascript ```javascript
require('/path/to/example.asar/dir/module.js'); require('/path/to/example.asar/dir/module.js')
``` ```
Você também pode renderizar uma página web apartir de um arquivo `asar` utilizando o módulo `BrowserWindow`: Você também pode renderizar uma página web apartir de um arquivo `asar` utilizando o módulo `BrowserWindow`:
```javascript ```javascript
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var win = new BrowserWindow({width: 800, height: 600}); var win = new BrowserWindow({width: 800, height: 600})
win.loadURL('file:///path/to/example.asar/static/index.html'); win.loadURL('file:///path/to/example.asar/static/index.html')
``` ```
### API Web ### API Web
@ -97,8 +97,8 @@ o arquivo `asar` como um arquivo normal. Para isto, você pode usar o built-in
`original-fs` que fornece a API `fs`, sem apoio a arquivos asar`: `original-fs` que fornece a API `fs`, sem apoio a arquivos asar`:
```javascript ```javascript
var originalFs = require('original-fs'); var originalFs = require('original-fs')
originalFs.readFileSync('/path/to/example.asar'); originalFs.readFileSync('/path/to/example.asar')
``` ```
## Limitaçõs na API Node ## Limitaçõs na API Node

View file

@ -25,15 +25,15 @@ Para adicionar um arquivo para os documentos recentes, você pode usar a API
[app.addRecentDocument][addrecentdocument]: [app.addRecentDocument][addrecentdocument]:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.addRecentDocument('/Users/USERNAME/Desktop/work.type'); app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
``` ```
E você pode usar a API [app.clearRecentDocuments][clearrecentdocuments] para E você pode usar a API [app.clearRecentDocuments][clearrecentdocuments] para
limpar a lista de documentos recentes. limpar a lista de documentos recentes.
```javascript ```javascript
app.clearRecentDocuments(); app.clearRecentDocuments()
``` ```
### Notas para Windows ### Notas para Windows
@ -67,17 +67,18 @@ Para criar seu Dock Menu customizado, você pode usar a API `app.dock.setMenu`,
ela está disponível apenas no macOS: ela está disponível apenas no macOS:
```javascript ```javascript
var app = require('app'); const {app, Menu} = require('electron')
var Menu = require('menu');
var dockMenu = Menu.buildFromTemplate([ const dockMenu = Menu.buildFromTemplate([
{ label: 'New Window', click: function() { console.log('New Window'); } }, {label: 'New Window', click () { console.log('New Window') }},
{ label: 'New Window with Settings', submenu: [ {label: 'New Window with Settings',
{ label: 'Basic' }, submenu: [
{ label: 'Pro'} {label: 'Basic'},
{label: 'Pro'}
]}, ]},
{ label: 'New Command...'} {label: 'New Command...'}
]); ])
app.dock.setMenu(dockMenu); app.dock.setMenu(dockMenu)
``` ```
## Tarefas do Usuário (Windows) ## Tarefas do Usuário (Windows)
@ -114,7 +115,7 @@ Para setar tarefas do usuário para sua aplicação, você pode usar a API
[app.setUserTasks][setusertaskstasks]: [app.setUserTasks][setusertaskstasks]:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.setUserTasks([ app.setUserTasks([
{ {
program: process.execPath, program: process.execPath,
@ -124,14 +125,14 @@ app.setUserTasks([
title: 'New Window', title: 'New Window',
description: 'Create a new window' description: 'Create a new window'
} }
]); ])
``` ```
Para limpar sua lista de tarefas, apenas chame `app.setUserTasks` com um Para limpar sua lista de tarefas, apenas chame `app.setUserTasks` com um
array vazio. array vazio.
```javascript ```javascript
app.setUserTasks([]); app.setUserTasks([])
``` ```
As tarefas do usuário são exibidas mesmo depois da aplicação ser fechada, As tarefas do usuário são exibidas mesmo depois da aplicação ser fechada,
@ -163,33 +164,33 @@ __Miniaturas da barra de tarefas do Windows Media Player:__
Você pode usar [BrowserWindow.setThumbarButtons][setthumbarbuttons] para criar Você pode usar [BrowserWindow.setThumbarButtons][setthumbarbuttons] para criar
miniaturas na barra de ferramentas para sua aplicação. miniaturas na barra de ferramentas para sua aplicação.
``` ```javascript
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var path = require('path'); var path = require('path')
var win = new BrowserWindow({ var win = new BrowserWindow({
width: 800, width: 800,
height: 600 height: 600
}); })
win.setThumbarButtons([ win.setThumbarButtons([
{ {
tooltip: "button1", tooltip: 'button1',
icon: path.join(__dirname, 'button1.png'), icon: path.join(__dirname, 'button1.png'),
click: function() { console.log("button2 clicked"); } click: function () { console.log('button2 clicked') }
}, },
{ {
tooltip: "button2", tooltip: 'button2',
icon: path.join(__dirname, 'button2.png'), icon: path.join(__dirname, 'button2.png'),
flags:['enabled', 'dismissonclick'], flags: ['enabled', 'dismissonclick'],
click: function() { console.log("button2 clicked."); } click: function () { console.log('button2 clicked.') }
} }
]); ])
``` ```
Para limpar os botões na miniatura da barra de ferramentas, apenas chame Para limpar os botões na miniatura da barra de ferramentas, apenas chame
`BrowserWindow.setThumbarButtons` com um array vazio. `BrowserWindow.setThumbarButtons` com um array vazio.
```javascript ```javascript
win.setThumbarButtons([]); win.setThumbarButtons([])
``` ```
## Unity Launcher Shortcuts (Linux) ## Unity Launcher Shortcuts (Linux)
@ -222,8 +223,8 @@ Para adicionar uma barra de progresso para uma janela, você pode ver a API:
[BrowserWindow.setProgressBar][setprogressbar]: [BrowserWindow.setProgressBar][setprogressbar]:
```javascript ```javascript
var window = new BrowserWindow({...}); var window = new BrowserWindow()
window.setProgressBar(0.5); window.setProgressBar(0.5)
``` ```
## Representação do arquivo na janela (macOS) ## Representação do arquivo na janela (macOS)
@ -244,9 +245,9 @@ Para inserir o arquivo de representacão da janela, você pode usar as API
[BrowserWindow.setDocumentEdited][setdocumentedited]: [BrowserWindow.setDocumentEdited][setdocumentedited]:
```javascript ```javascript
var window = new BrowserWindow({...}); var window = new BrowserWindow()
window.setRepresentedFilename('/etc/passwd'); window.setRepresentedFilename('/etc/passwd')
window.setDocumentEdited(true); window.setDocumentEdited(true)
``` ```
[addrecentdocument]: ../api/app.md#appaddrecentdocumentpath [addrecentdocument]: ../api/app.md#appaddrecentdocumentpath

View file

@ -18,15 +18,15 @@ Siga as instruções em [`react-devtools/shells/chrome/Readme.md`](https://gith
Agora você poderá carregar a extensão no Electron abrindo o DevTools em qualquer janela, e executando o seguinte código no console do DevTools: Agora você poderá carregar a extensão no Electron abrindo o DevTools em qualquer janela, e executando o seguinte código no console do DevTools:
```javascript ```javascript
const BrowserWindow = require('electron').remote.BrowserWindow; const BrowserWindow = require('electron').remote.BrowserWindow
BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome'); BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome')
``` ```
Para remover a extensão, você pode executar a chamada `BrowserWindow.removeDevToolsExtension` Para remover a extensão, você pode executar a chamada `BrowserWindow.removeDevToolsExtension`
com o nome da extensão e ela não será carregada na próxima vez que você abrir o DevTools: com o nome da extensão e ela não será carregada na próxima vez que você abrir o DevTools:
```javascript ```javascript
BrowserWindow.removeDevToolsExtension('React Developer Tools'); BrowserWindow.removeDevToolsExtension('React Developer Tools')
``` ```
## Formato das extensões DevTools ## Formato das extensões DevTools

View file

@ -7,14 +7,14 @@ a seguir:
_main.js_ _main.js_
```javascript ```javascript
var app = require('app'); var app = require('app')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var onlineStatusWindow; var onlineStatusWindow
app.on('ready', function() { app.on('ready', function () {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html'); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
``` ```
_online-status.html_ _online-status.html_
@ -46,19 +46,19 @@ pode ver isto no exemplo abaixo:
_main.js_ _main.js_
```javascript ```javascript
var app = require('app'); var app = require('app')
var ipc = require('ipc'); var ipc = require('ipc')
var BrowserWindow = require('browser-window'); var BrowserWindow = require('browser-window')
var onlineStatusWindow; var onlineStatusWindow
app.on('ready', function() { app.on('ready', function () {
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false }); onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html'); onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
}); })
ipc.on('online-status-changed', function(event, status) { ipc.on('online-status-changed', function (event, status) {
console.log(status); console.log(status)
}); })
``` ```
_online-status.html_ _online-status.html_
@ -66,18 +66,18 @@ _online-status.html_
```html ```html
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<body> <body>
<script> <script>
var ipc = require('ipc'); const {ipcRenderer} = require('electron')
var updateOnlineStatus = function() { const updateOnlineStatus = () => {
ipc.send('online-status-changed', navigator.onLine ? 'online' : 'offline'); ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline')
}; }
window.addEventListener('online', updateOnlineStatus); window.addEventListener('online', updateOnlineStatus)
window.addEventListener('offline', updateOnlineStatus); window.addEventListener('offline', updateOnlineStatus)
updateOnlineStatus(); updateOnlineStatus()
</script> </script>
</body> </body>
</html> </html>
``` ```

View file

@ -63,7 +63,7 @@ e o script especificado pelo campo `main` é o script de inicialização do seu
que irá executar o processo principal. Um exemplo do seu `package.json` deve parecer que irá executar o processo principal. Um exemplo do seu `package.json` deve parecer
com isso: com isso:
```json ```javascripton
{ {
"name" : "seu-app", "name" : "seu-app",
"version" : "0.1.0", "version" : "0.1.0",

View file

@ -20,40 +20,37 @@ para a linha de comando do Electron ou usando o método
Por exemplo: Por exemplo:
```javascript ```javascript
var app = require('app'); const {app, BrowserWindow} = require('electron')
var BrowserWindow = require('browser-window');
// Mantém uma referência global da janela, se não manter, a janela irá fechar // Mantém uma referência global da janela, se não manter, a janela irá fechar
// automaticamente quando o objeto javascript for GCed. // automaticamente quando o objeto javascript for GCed.
var mainWindow = null; let mainWindow = null
// Sai assim que todas as janelas forem fechadas. // Sai assim que todas as janelas forem fechadas.
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
if (process.platform != 'darwin') { if (process.platform !== 'darwin') app.quit()
app.quit(); })
}
});
// Epecifica o caminho do flash. // Epecifica o caminho do flash.
// No Windows, deve ser /path/to/pepflashplayer.dll // No Windows, deve ser /path/to/pepflashplayer.dll
// No macOS, /path/to/PepperFlashPlayer.plugin // No macOS, /path/to/PepperFlashPlayer.plugin
// No Linux, /path/to/libpepflashplayer.so // No Linux, /path/to/libpepflashplayer.so
app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so'); app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so')
// Especifica a versão do flash, por exemplo, v17.0.0.169 // Especifica a versão do flash, por exemplo, v17.0.0.169
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169'); app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
app.on('ready', function() { app.on('ready', function () {
mainWindow = new BrowserWindow({ mainWindow = new BrowserWindow({
'width': 800, 'width': 800,
'height': 600, 'height': 600,
'web-preferences': { 'web-preferences': {
'plugins': true 'plugins': true
} }
}); })
mainWindow.loadURL('file://' + __dirname + '/index.html'); mainWindow.loadURL(`file://${__dirname}/index.html`)
// Algo mais // Algo mais
}); })
``` ```
## Ative o plugin Flash na tag `<webview>` ## Ative o plugin Flash na tag `<webview>`

View file

@ -49,29 +49,29 @@ $ asar list /path/to/example.asar
Прочитаеем файл в архиве `asar`: Прочитаеем файл в архиве `asar`:
```javascript ```javascript
const fs = require('fs'); const fs = require('fs')
fs.readFileSync('/path/to/example.asar/file.txt'); fs.readFileSync('/path/to/example.asar/file.txt')
``` ```
Список всех файлов начиная от корня архива: Список всех файлов начиная от корня архива:
```javascript ```javascript
const fs = require('fs'); const fs = require('fs')
fs.readdirSync('/path/to/example.asar'); fs.readdirSync('/path/to/example.asar')
``` ```
Используем модуль из архива: Используем модуль из архива:
```javascript ```javascript
require('/path/to/example.asar/dir/module.js'); require('/path/to/example.asar/dir/module.js')
``` ```
Вы также можете показывать веб-страницы из архива `asar` через `BrowserWindow`: Вы также можете показывать веб-страницы из архива `asar` через `BrowserWindow`:
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({width: 800, height: 600}); var win = new BrowserWindow({width: 800, height: 600})
win.loadURL('file:///path/to/example.asar/static/index.html'); win.loadURL('file:///path/to/example.asar/static/index.html')
``` ```
### Веб API ### Веб API
@ -98,16 +98,16 @@ $.get('file:///path/to/example.asar/file.txt', function(data) {
`original-fs`, который предоставляет доступ к `fs` без поддежки `asar`: `original-fs`, который предоставляет доступ к `fs` без поддежки `asar`:
```javascript ```javascript
var originalFs = require('original-fs'); var originalFs = require('original-fs')
originalFs.readFileSync('/path/to/example.asar'); originalFs.readFileSync('/path/to/example.asar')
``` ```
Вы также можете выставить `process.noAsar` в `true`, чтобы выключить поддержку `asar` Вы также можете выставить `process.noAsar` в `true`, чтобы выключить поддержку `asar`
в модуле `fs`: в модуле `fs`:
```javascript ```javascript
process.noAsar = true; process.noAsar = true
fs.readFileSync('/path/to/example.asar'); fs.readFileSync('/path/to/example.asar')
``` ```
## Ограничения Node API ## Ограничения Node API

View file

@ -60,7 +60,7 @@ your-app/
как `main`, будет выполняться при запуске вашего приложения, работая в как `main`, будет выполняться при запуске вашего приложения, работая в
главном процессе. Например, Ваш `package.json` может выглядеть вот так: главном процессе. Например, Ваш `package.json` может выглядеть вот так:
```json ```javascripton
{ {
"name" : "your-app", "name" : "your-app",
"version" : "0.1.0", "version" : "0.1.0",
@ -91,7 +91,7 @@ function createWindow () {
mainWindow = new BrowserWindow({width: 800, height: 600}) mainWindow = new BrowserWindow({width: 800, height: 600})
// и загружаем index.html приложения. // и загружаем index.html приложения.
mainWindow.loadURL('file://' + __dirname + '/index.html') mainWindow.loadURL(`file://${__dirname}/index.html`)
// Открываем DevTools. // Открываем DevTools.
mainWindow.webContents.openDevTools() mainWindow.webContents.openDevTools()
@ -105,32 +105,32 @@ function createWindow () {
}) })
} }
//Этот метод будет вызван, когда Electron закончит инициализацию // Этот метод будет вызван, когда Electron закончит инициализацию
//и будет готов создавать окна браузера. // и будет готов создавать окна браузера.
//Некоторые API возможно использовать только после того, как // Некоторые API возможно использовать только после того, как
//это произойдёт. // это произойдёт.
app.on('ready', createWindow) app.on('ready', createWindow)
// Выйти, если все окна закрыты // Выйти, если все окна закрыты
app.on('window-all-closed', function () { app.on('window-all-closed', function () {
//На macOS приложение и его строка меню обычно остаются активными, // На macOS приложение и его строка меню обычно остаются активными,
//пока пользователь не завершит их с помощью `Cmd + Q`. // пока пользователь не завершит их с помощью `Cmd + Q`.
if (process.platform !== 'darwin') { if (process.platform !== 'darwin') {
app.quit() app.quit()
} }
}) })
app.on('activate', function () { app.on('activate', function () {
//На macOS приложение обычно пересоздаёт окно, когда // На macOS приложение обычно пересоздаёт окно, когда
//пользователь кликает на его иконку в доке, если не открыто // пользователь кликает на его иконку в доке, если не открыто
//других окон. // других окон.
if (mainWindow === null) { if (mainWindow === null) {
createWindow() createWindow()
} }
}) })
//В этот файл Вы можете включить остальной код вашего главного процесса. // В этот файл Вы можете включить остальной код вашего главного процесса.
//Вы также можете разложить его по отдельным файлам и подключить с помощью require. // Вы также можете разложить его по отдельным файлам и подключить с помощью require.
``` ```

View file

@ -89,7 +89,7 @@ a value it and its type is noted below. If you were to listen and respond to
this event it might look something like this: this event it might look something like this:
```javascript ```javascript
Alarm.on('wake-up', function(time) { Alarm.on('wake-up', function (time) {
console.log(time) console.log(time)
}) })
``` ```

View file

@ -91,7 +91,7 @@ a value it and its type is noted below. If you were to listen and respond to
this event it might look something like this: this event it might look something like this:
```javascript ```javascript
Alarm.on('wake-up', function(time) { Alarm.on('wake-up', function (time) {
console.log(time) console.log(time)
}) })
``` ```

View file

@ -5,10 +5,10 @@
下面的这个例子将会展示如何在最后一个窗口被关闭时退出应用: 下面的这个例子将会展示如何在最后一个窗口被关闭时退出应用:
```javascript ```javascript
var app = require('app'); var app = require('app')
app.on('window-all-closed', function() { app.on('window-all-closed', function () {
app.quit(); app.quit()
}); })
``` ```
## 事件列表 ## 事件列表
@ -143,15 +143,15 @@ app.on('window-all-closed', function() {
调用 `callback(true)` 调用 `callback(true)`
```javascript ```javascript
session.on('certificate-error', function(event, webContents, url, error, certificate, callback) { session.on('certificate-error', function (event, webContents, url, error, certificate, callback) {
if (url == "https://github.com") { if (url === 'https://github.com') {
// 验证逻辑。 // 验证逻辑。
event.preventDefault(); event.preventDefault()
callback(true); callback(true)
} else { } else {
callback(false); callback(false)
} }
}); })
``` ```
### 事件:'select-client-certificate' ### 事件:'select-client-certificate'
@ -174,9 +174,9 @@ session.on('certificate-error', function(event, webContents, url, error, certifi
需要通过调用 `event.preventDefault()` 来防止应用自动使用第一个证书进行验证。如下所示: 需要通过调用 `event.preventDefault()` 来防止应用自动使用第一个证书进行验证。如下所示:
```javascript ```javascript
app.on('select-certificate', function(event, host, url, list, callback) { app.on('select-certificate', function (event, host, url, list, callback) {
event.preventDefault(); event.preventDefault()
callback(list[0]); callback(list[0])
}) })
``` ```
### 事件: 'login' ### 事件: 'login'
@ -203,9 +203,9 @@ app.on('select-certificate', function(event, host, url, list, callback) {
`callback(username, password)` 来进行验证。 `callback(username, password)` 来进行验证。
```javascript ```javascript
app.on('login', function(event, webContents, request, authInfo, callback) { app.on('login', function (event, webContents, request, authInfo, callback) {
event.preventDefault(); event.preventDefault()
callback('username', 'secret'); callback('username', 'secret')
}) })
``` ```
### 事件:'gpu-process-crashed' ### 事件:'gpu-process-crashed'
@ -363,29 +363,26 @@ app.on('login', function(event, webContents, request, authInfo, callback) {
下面是一个简单的例子。我们可以通过这个例子了解如何确保应用为单实例运行状态。 下面是一个简单的例子。我们可以通过这个例子了解如何确保应用为单实例运行状态。
```js ```javascript
var myWindow = null; let myWindow = null
var shouldQuit = app.makeSingleInstance(function(commandLine, workingDirectory) { let shouldQuit = app.makeSingleInstance(function (commandLine, workingDirectory) {
// 当另一个实例运行的时候,这里将会被调用,我们需要激活应用的窗口 // 当另一个实例运行的时候,这里将会被调用,我们需要激活应用的窗口
if (myWindow) { if (myWindow) {
if (myWindow.isMinimized()) myWindow.restore(); if (myWindow.isMinimized()) myWindow.restore()
myWindow.focus(); myWindow.focus()
} }
return true; return true
}); })
// 这个实例是多余的实例,需要退出 // 这个实例是多余的实例,需要退出
if (shouldQuit) { if (shouldQuit) app.quit()
app.quit();
return;
}
// 创建窗口、继续加载应用、应用逻辑等……
app.on('ready', function() {
});
app.on('ready', function () {
// 创建窗口、继续加载应用、应用逻辑等……
})
``` ```
### `app.setAppUserModelId(id)` _Windows_ ### `app.setAppUserModelId(id)` _Windows_
* `id` String * `id` String
@ -400,24 +397,24 @@ app.on('ready', function() {
举个例子: 举个例子:
```js ```javascript
let browserOptions = {width: 1000, height: 800}; let browserOptions = {width: 1000, height: 800}
// 只有平台支持的时候才使用透明窗口 // 只有平台支持的时候才使用透明窗口
if (process.platform !== 'win32' || app.isAeroGlassEnabled()) { if (process.platform !== 'win32' || app.isAeroGlassEnabled()) {
browserOptions.transparent = true; browserOptions.transparent = true
browserOptions.frame = false; browserOptions.frame = false
} }
// 创建窗口 // 创建窗口
win = new BrowserWindow(browserOptions); win = new BrowserWindow(browserOptions)
// 转到某个网页 // 转到某个网页
if (browserOptions.transparent) { if (browserOptions.transparent) {
win.loadURL('file://' + __dirname + '/index.html'); win.loadURL(`file://${__dirname}/index.html`)
} else { } else {
// 没有透明特效,我们应该用某个只包含基本样式的替代解决方案。 // 没有透明特效,我们应该用某个只包含基本样式的替代解决方案。
win.loadURL('file://' + __dirname + '/fallback.html'); win.loadURL(`file://${__dirname}/fallback.html`)
} }
``` ```
### `app.commandLine.appendSwitch(switch[, value])` ### `app.commandLine.appendSwitch(switch[, value])`

View file

@ -4,18 +4,18 @@
```javascript ```javascript
// In the main process. // In the main process.
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
// Or in the renderer process. // Or in the renderer process.
const BrowserWindow = require('electron').remote.BrowserWindow; // const BrowserWindow = require('electron').remote.BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600, show: false }); var win = new BrowserWindow({ width: 800, height: 600, show: false })
win.on('closed', function() { win.on('closed', function () {
win = null; win = null
}); })
win.loadURL('https://github.com'); win.loadURL('https://github.com')
win.show(); win.show()
``` ```
你也可以不通过chrome创建窗口使用 你也可以不通过chrome创建窗口使用
@ -151,15 +151,15 @@ win.show();
通常你想通过 `beforeunload` 处理器来决定是否关闭窗口,但是它也会在窗口重载的时候被触发. 在 Electron 中,返回一个空的字符串或 `false` 可以取消关闭.例如: 通常你想通过 `beforeunload` 处理器来决定是否关闭窗口,但是它也会在窗口重载的时候被触发. 在 Electron 中,返回一个空的字符串或 `false` 可以取消关闭.例如:
```javascript ```javascript
window.onbeforeunload = function(e) { window.onbeforeunload = function (e) {
console.log('I do not want to be closed'); console.log('I do not want to be closed')
// Unlike usual browsers, in which a string should be returned and the user is // Unlike usual browsers, in which a string should be returned and the user is
// prompted to confirm the page unload, Electron gives developers more options. // prompted to confirm the page unload, Electron gives developers more options.
// Returning empty string or false would prevent the unloading now. // Returning empty string or false would prevent the unloading now.
// You can also use the dialog API to let the user confirm closing the application. // You can also use the dialog API to let the user confirm closing the application.
e.returnValue = false; e.returnValue = false
}; }
``` ```
### Event: 'closed' ### Event: 'closed'
@ -233,13 +233,13 @@ window.onbeforeunload = function(e) {
在请求一个[App Command](https://msdn.microsoft.com/en-us/library/windows/desktop/ms646275(v=vs.85).aspx)的时候触发. 在请求一个[App Command](https://msdn.microsoft.com/en-us/library/windows/desktop/ms646275(v=vs.85).aspx)的时候触发.
典型的是键盘媒体或浏览器命令, Windows上的 "Back" 按钮用作鼠标也会触发. 典型的是键盘媒体或浏览器命令, Windows上的 "Back" 按钮用作鼠标也会触发.
```js ```javascript
someWindow.on('app-command', function(e, cmd) { someWindow.on('app-command', function (e, cmd) {
// Navigate the window back when the user hits their mouse back button // Navigate the window back when the user hits their mouse back button
if (cmd === 'browser-backward' && someWindow.webContents.canGoBack()) { if (cmd === 'browser-backward' && someWindow.webContents.canGoBack()) {
someWindow.webContents.goBack(); someWindow.webContents.goBack()
} }
}); })
``` ```
### Event: 'scroll-touch-begin' _macOS_ ### Event: 'scroll-touch-begin' _macOS_
@ -294,7 +294,7 @@ someWindow.on('app-command', function(e, cmd) {
```javascript ```javascript
// In this example `win` is our instance // In this example `win` is our instance
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
``` ```
### `win.webContents` ### `win.webContents`

View file

@ -3,13 +3,13 @@
这页列出了Chrome浏览器和Electron支持的命令行开关. 你也可以在[app][app]模块的[ready][ready]事件发出之前使用[app.commandLine.appendSwitch][append-switch] 来添加它们到你应用的main脚本里面: 这页列出了Chrome浏览器和Electron支持的命令行开关. 你也可以在[app][app]模块的[ready][ready]事件发出之前使用[app.commandLine.appendSwitch][append-switch] 来添加它们到你应用的main脚本里面:
```javascript ```javascript
const app = require('electron').app; const app = require('electron').app
app.commandLine.appendSwitch('remote-debugging-port', '8315'); app.commandLine.appendSwitch('remote-debugging-port', '8315')
app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1'); app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1')
app.on('ready', function() { app.on('ready', function () {
// Your code here // Your code here
}); })
``` ```
## --client-certificate=`path` ## --client-certificate=`path`

View file

@ -4,15 +4,15 @@
下面例子展示了如何将一个字符串写道 clipboard 上: 下面例子展示了如何将一个字符串写道 clipboard 上:
```javascript ```javascript
const clipboard = require('electron').clipboard; const clipboard = require('electron').clipboard
clipboard.writeText('Example String'); clipboard.writeText('Example String')
``` ```
在 X Window 系统上, 有一个可选的 clipboard. 你可以为每个方法使用 `selection` 来控制它: 在 X Window 系统上, 有一个可选的 clipboard. 你可以为每个方法使用 `selection` 来控制它:
```javascript ```javascript
clipboard.writeText('Example String', 'selection'); clipboard.writeText('Example String', 'selection')
console.log(clipboard.readText('selection')); console.log(clipboard.readText('selection'))
``` ```
## 方法 ## 方法
@ -93,7 +93,7 @@ console.log(clipboard.readText('selection'));
返回 clipboard 是否支持指定 `data` 的格式. 返回 clipboard 是否支持指定 `data` 的格式.
```javascript ```javascript
console.log(clipboard.has('<p>selection</p>')); console.log(clipboard.has('<p>selection</p>'))
``` ```
### `clipboard.read(data[, type])` _Experimental_ ### `clipboard.read(data[, type])` _Experimental_
@ -112,6 +112,6 @@ console.log(clipboard.has('<p>selection</p>'));
* `type` String (可选) * `type` String (可选)
```javascript ```javascript
clipboard.write({text: 'test', html: "<b>test</b>"}); clipboard.write({text: 'test', html: '<b>test</b>'})
``` ```
向 clipboard 写入 `data` . 向 clipboard 写入 `data` .

View file

@ -3,22 +3,22 @@
`content-tracing` 模块是用来收集由底层的Chromium content 模块 产生的搜索数据. 这个模块不具备web接口所有需要我们在chrome浏览器中添加 `chrome://tracing/` 来加载生成文件从而查看结果. `content-tracing` 模块是用来收集由底层的Chromium content 模块 产生的搜索数据. 这个模块不具备web接口所有需要我们在chrome浏览器中添加 `chrome://tracing/` 来加载生成文件从而查看结果.
```javascript ```javascript
const contentTracing = require('electron').contentTracing; const contentTracing = require('electron').contentTracing
const options = { const options = {
categoryFilter: '*', categoryFilter: '*',
traceOptions: 'record-until-full,enable-sampling' traceOptions: 'record-until-full,enable-sampling'
} }
contentTracing.startRecording(options, function() { contentTracing.startRecording(options, function () {
console.log('Tracing started'); console.log('Tracing started')
setTimeout(function() { setTimeout(function () {
contentTracing.stopRecording('', function(path) { contentTracing.stopRecording('', function (path) {
console.log('Tracing data recorded to ' + path); console.log('Tracing data recorded to ' + path)
}); })
}, 5000); }, 5000)
}); })
``` ```
## 方法 ## 方法

View file

@ -5,14 +5,14 @@
下面是一个自动提交崩溃报告给服务器的例子 : 下面是一个自动提交崩溃报告给服务器的例子 :
```javascript ```javascript
const crashReporter = require('electron').crashReporter; const crashReporter = require('electron').crashReporter
crashReporter.start({ crashReporter.start({
productName: 'YourName', productName: 'YourName',
companyName: 'YourCompany', companyName: 'YourCompany',
submitURL: 'https://your-domain.com/url-to-submit', submitURL: 'https://your-domain.com/url-to-submit',
autoSubmit: true autoSubmit: true
}); })
``` ```
可以使用下面的项目来创建一个服务器,用来接收和处理崩溃报告 : 可以使用下面的项目来创建一个服务器,用来接收和处理崩溃报告 :

View file

@ -4,12 +4,12 @@
```javascript ```javascript
// 在渲染进程中. // 在渲染进程中.
var desktopCapturer = require('electron').desktopCapturer; var desktopCapturer = require('electron').desktopCapturer
desktopCapturer.getSources({types: ['window', 'screen']}, function(error, sources) { desktopCapturer.getSources({types: ['window', 'screen']}, function (error, sources) {
if (error) throw error; if (error) throw error
for (var i = 0; i < sources.length; ++i) { for (var i = 0; i < sources.length; ++i) {
if (sources[i].name == "Electron") { if (sources[i].name === 'Electron') {
navigator.webkitGetUserMedia({ navigator.webkitGetUserMedia({
audio: false, audio: false,
video: { video: {
@ -22,18 +22,18 @@ desktopCapturer.getSources({types: ['window', 'screen']}, function(error, source
maxHeight: 720 maxHeight: 720
} }
} }
}, gotStream, getUserMediaError); }, gotStream, getUserMediaError)
return; return
} }
} }
}); })
function gotStream(stream) { function gotStream (stream) {
document.querySelector('video').src = URL.createObjectURL(stream); document.querySelector('video').src = URL.createObjectURL(stream)
} }
function getUserMediaError(e) { function getUserMediaError (e) {
console.log('getUserMediaError'); console.log('getUserMediaError')
} }
``` ```
@ -61,4 +61,4 @@ function getUserMediaError(e) {
* `name` String - 捕获窗口或屏幕的描述名 . 如果资源为屏幕,名字为 `Entire Screen``Screen <index>`; 如果资源为窗口, 名字为窗口的标题. * `name` String - 捕获窗口或屏幕的描述名 . 如果资源为屏幕,名字为 `Entire Screen``Screen <index>`; 如果资源为窗口, 名字为窗口的标题.
* `thumbnail` [NativeImage](NativeImage.md) - 缩略图. * `thumbnail` [NativeImage](NativeImage.md) - 缩略图.
**注意:** 不能保证 `source.thumbnail` 的 size 和 `options` 中的 `thumnbailSize` 一直一致. 它也取决于屏幕或窗口的缩放比例. **注意:** 不能保证 `source.thumbnail` 的 size 和 `options` 中的 `thumnbailSize` 一直一致. 它也取决于屏幕或窗口的缩放比例.

View file

@ -5,9 +5,8 @@
对话框例子,展示了选择文件和目录: 对话框例子,展示了选择文件和目录:
```javascript ```javascript
var win = ...; // BrowserWindow in which to show the dialog const {dialog} = require('electron')
const dialog = require('electron').dialog; console.log(dialog.showOpenDialog({properties: ['openFile', 'openDirectory', 'multiSelections']}))
console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', 'multiSelections' ]}));
``` ```
**macOS 上的注意事项**: 如果你想像sheets一样展示对话框只需要在`browserWindow` 参数中提供一个 `BrowserWindow` 的引用对象. **macOS 上的注意事项**: 如果你想像sheets一样展示对话框只需要在`browserWindow` 参数中提供一个 `BrowserWindow` 的引用对象.
@ -91,4 +90,4 @@ console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', '
展示一个传统的包含错误信息的对话框. 展示一个传统的包含错误信息的对话框.
`app` 模块触发 `ready` 事件之前,这个 api 可以被安全调用,通常它被用来在启动的早期阶段报告错误. 在 Linux 上,如果在 `app` 模块触发 `ready` 事件之前调用message 将会被触发显示stderr并且没有实际GUI 框显示. `app` 模块触发 `ready` 事件之前,这个 api 可以被安全调用,通常它被用来在启动的早期阶段报告错误. 在 Linux 上,如果在 `app` 模块触发 `ready` 事件之前调用message 将会被触发显示stderr并且没有实际GUI 框显示.

View file

@ -6,22 +6,31 @@
```javascript ```javascript
// In the main process. // In the main process.
win.webContents.session.on('will-download', function(event, item, webContents) { const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.webContents.session.on('will-download', (event, item, webContents) => {
// Set the save path, making Electron not to prompt a save dialog. // Set the save path, making Electron not to prompt a save dialog.
item.setSavePath('/tmp/save.pdf'); item.setSavePath('/tmp/save.pdf')
console.log(item.getMimeType());
console.log(item.getFilename()); item.on('updated', (event, state) => {
console.log(item.getTotalBytes()); if (state === 'interrupted') {
item.on('updated', function() { console.log('Download is interrupted but can be resumed')
console.log('Received bytes: ' + item.getReceivedBytes()); } else if (state === 'progressing') {
}); if (item.isPaused()) {
item.on('done', function(e, state) { console.log('Download is paused')
if (state == "completed") { } else {
console.log("Download successfully"); console.log(`Received bytes: ${item.getReceivedBytes()}`)
} else { }
console.log("Download is cancelled or interrupted that can't be resumed");
} }
}); })
item.once('done', (event, state) => {
if (state === 'completed') {
console.log('Download successfully')
} else {
console.log(`Download failed: ${state}`)
}
})
})
``` ```
## 事件 ## 事件

View file

@ -10,8 +10,8 @@
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600, frame: false }); var win = new BrowserWindow({ width: 800, height: 600, frame: false })
``` ```
### macOS上的替代方案 ### macOS上的替代方案
@ -21,7 +21,7 @@ var win = new BrowserWindow({ width: 800, height: 600, frame: false });
,同时又想保持对窗口的控制("traffic lights")。你可以通过指定`titleBarStyle`这一新选项达到目标: ,同时又想保持对窗口的控制("traffic lights")。你可以通过指定`titleBarStyle`这一新选项达到目标:
```javascript ```javascript
var win = new BrowserWindow({ 'titleBarStyle': 'hidden' }); var win = new BrowserWindow({ 'titleBarStyle': 'hidden' })
``` ```
## 透明窗口 ## 透明窗口
@ -29,7 +29,7 @@ var win = new BrowserWindow({ 'titleBarStyle': 'hidden' });
通过设置`transparent` 选项为 `true`,你能使无边框窗口透明: 通过设置`transparent` 选项为 `true`,你能使无边框窗口透明:
```javascript ```javascript
var win = new BrowserWindow({ transparent: true, frame: false }); var win = new BrowserWindow({ transparent: true, frame: false })
``` ```
### 限制 ### 限制

View file

@ -6,30 +6,30 @@
消息前使用此模块(注册快捷键). 消息前使用此模块(注册快捷键).
```javascript ```javascript
var app = require('app'); var app = require('app')
var globalShortcut = require('global-shortcut'); var globalShortcut = require('global-shortcut')
app.on('ready', function() { app.on('ready', function () {
// Register a 'ctrl+x' shortcut listener. // Register a 'ctrl+x' shortcut listener.
var ret = globalShortcut.register('ctrl+x', function() { var ret = globalShortcut.register('ctrl+x', function () {
console.log('ctrl+x is pressed'); console.log('ctrl+x is pressed')
}) })
if (!ret) { if (!ret) {
console.log('registration failed'); console.log('registration failed')
} }
// Check whether a shortcut is registered. // Check whether a shortcut is registered.
console.log(globalShortcut.isRegistered('ctrl+x')); console.log(globalShortcut.isRegistered('ctrl+x'))
}); })
app.on('will-quit', function() { app.on('will-quit', function () {
// Unregister a shortcut. // Unregister a shortcut.
globalShortcut.unregister('ctrl+x'); globalShortcut.unregister('ctrl+x')
// Unregister all shortcuts. // Unregister all shortcuts.
globalShortcut.unregisterAll(); globalShortcut.unregisterAll()
}); })
``` ```
## Methods ## Methods

View file

@ -14,27 +14,27 @@
```javascript ```javascript
// 在主进程中. // 在主进程中.
var ipc = require('ipc'); var ipc = require('ipc')
ipc.on('asynchronous-message', function(event, arg) { ipc.on('asynchronous-message', function (event, arg) {
console.log(arg); // 打印 "ping" console.log(arg) // 打印 "ping"
event.sender.send('asynchronous-reply', 'pong'); event.sender.send('asynchronous-reply', 'pong')
}); })
ipc.on('synchronous-message', function(event, arg) { ipc.on('synchronous-message', function (event, arg) {
console.log(arg); // 打印 "ping" console.log(arg) // 打印 "ping"
event.returnValue = 'pong'; event.returnValue = 'pong'
}); })
``` ```
```javascript ```javascript
// 在渲染进程(网页). // 在渲染进程(网页).
var ipc = require('ipc'); var ipc = require('ipc')
console.log(ipc.sendSync('synchronous-message', 'ping')); // 打印 "pong" console.log(ipc.sendSync('synchronous-message', 'ping')) // 打印 "pong"
ipc.on('asynchronous-reply', function(arg) { ipc.on('asynchronous-reply', function (arg) {
console.log(arg); // 打印 "pong" console.log(arg) // 打印 "pong"
}); })
ipc.send('asynchronous-message', 'ping'); ipc.send('asynchronous-message', 'ping')
``` ```
## 监听消息 ## 监听消息

View file

@ -16,27 +16,27 @@
```javascript ```javascript
// In main process. // In main process.
const ipcMain = require('electron').ipcMain; const ipcMain = require('electron').ipcMain
ipcMain.on('asynchronous-message', function(event, arg) { ipcMain.on('asynchronous-message', function (event, arg) {
console.log(arg); // prints "ping" console.log(arg) // prints "ping"
event.sender.send('asynchronous-reply', 'pong'); event.sender.send('asynchronous-reply', 'pong')
}); })
ipcMain.on('synchronous-message', function(event, arg) { ipcMain.on('synchronous-message', function (event, arg) {
console.log(arg); // prints "ping" console.log(arg) // prints "ping"
event.returnValue = 'pong'; event.returnValue = 'pong'
}); })
``` ```
```javascript ```javascript
// In renderer process (web page). // In renderer process (web page).
const ipcRenderer = require('electron').ipcRenderer; const ipcRenderer = require('electron').ipcRenderer
console.log(ipcRenderer.sendSync('synchronous-message', 'ping')); // prints "pong" console.log(ipcRenderer.sendSync('synchronous-message', 'ping')) // prints "pong"
ipcRenderer.on('asynchronous-reply', function(event, arg) { ipcRenderer.on('asynchronous-reply', function (event, arg) {
console.log(arg); // prints "pong" console.log(arg) // prints "pong"
}); })
ipcRenderer.send('asynchronous-message', 'ping'); ipcRenderer.send('asynchronous-message', 'ping')
``` ```
## 监听消息 ## 监听消息

View file

@ -67,7 +67,7 @@ var template = [
label: 'Select All', label: 'Select All',
accelerator: 'CmdOrCtrl+A', accelerator: 'CmdOrCtrl+A',
role: 'selectall' role: 'selectall'
}, }
] ]
}, },
{ {
@ -76,37 +76,32 @@ var template = [
{ {
label: 'Reload', label: 'Reload',
accelerator: 'CmdOrCtrl+R', accelerator: 'CmdOrCtrl+R',
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) focusedWindow.reload()
focusedWindow.reload();
} }
}, },
{ {
label: 'Toggle Full Screen', label: 'Toggle Full Screen',
accelerator: (function() { accelerator: (function () {
if (process.platform == 'darwin') return (process.platform === 'darwin') ? 'Ctrl+Command+F' : 'F11'
return 'Ctrl+Command+F';
else
return 'F11';
})(), })(),
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) focusedWindow.setFullScreen(!focusedWindow.isFullScreen())
focusedWindow.setFullScreen(!focusedWindow.isFullScreen());
} }
}, },
{ {
label: 'Toggle Developer Tools', label: 'Toggle Developer Tools',
accelerator: (function() { accelerator: (function () {
if (process.platform == 'darwin') if (process.platform === 'darwin') {
return 'Alt+Command+I'; return 'Alt+Command+I'
else } else {
return 'Ctrl+Shift+I'; return 'Ctrl+Shift+I'
}
})(), })(),
click: function(item, focusedWindow) { click: function (item, focusedWindow) {
if (focusedWindow) if (focusedWindow) focusedWindow.toggleDevTools()
focusedWindow.toggleDevTools();
} }
}, }
] ]
}, },
{ {
@ -122,7 +117,7 @@ var template = [
label: 'Close', label: 'Close',
accelerator: 'CmdOrCtrl+W', accelerator: 'CmdOrCtrl+W',
role: 'close' role: 'close'
}, }
] ]
}, },
{ {
@ -131,14 +126,14 @@ var template = [
submenu: [ submenu: [
{ {
label: 'Learn More', label: 'Learn More',
click: function() { require('electron').shell.openExternal('http://electron.atom.io') } click: function () { require('electron').shell.openExternal('http://electron.atom.io') }
}, }
] ]
}, }
]; ]
if (process.platform == 'darwin') { if (process.platform === 'darwin') {
var name = require('electron').remote.app.getName(); var name = require('electron').remote.app.getName()
template.unshift({ template.unshift({
label: name, label: name,
submenu: [ submenu: [
@ -177,10 +172,10 @@ if (process.platform == 'darwin') {
{ {
label: 'Quit', label: 'Quit',
accelerator: 'Command+Q', accelerator: 'Command+Q',
click: function() { app.quit(); } click: function () { app.quit() }
}, }
] ]
}); })
// Window menu. // Window menu.
template[3].submenu.push( template[3].submenu.push(
{ {
@ -190,11 +185,11 @@ if (process.platform == 'darwin') {
label: 'Bring All to Front', label: 'Bring All to Front',
role: 'front' role: 'front'
} }
); )
} }
var menu = Menu.buildFromTemplate(template); var menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu); Menu.setApplicationMenu(menu)
``` ```
## 类: Menu ## 类: Menu
@ -352,4 +347,4 @@ Property List Files][AboutInformationPropertyListFiles] .
[AboutInformationPropertyListFiles]: https://developer.apple.com/library/ios/documentation/general/Reference/InfoPlistKeyReference/Articles/AboutInformationPropertyListFiles.html [AboutInformationPropertyListFiles]: https://developer.apple.com/library/ios/documentation/general/Reference/InfoPlistKeyReference/Articles/AboutInformationPropertyListFiles.html
[setMenu]: [setMenu]:
https://github.com/electron/electron/blob/master/docs/api/browser-window.md#winsetmenumenu-linux-windows https://github.com/electron/electron/blob/master/docs/api/browser-window.md#winsetmenumenu-linux-windows

View file

@ -5,15 +5,15 @@
例如, 当创建一个 tray 或设置窗口的图标时候,你可以使用一个字符串的图片路径 : 例如, 当创建一个 tray 或设置窗口的图标时候,你可以使用一个字符串的图片路径 :
```javascript ```javascript
var appIcon = new Tray('/Users/somebody/images/icon.png'); var appIcon = new Tray('/Users/somebody/images/icon.png')
var window = new BrowserWindow({icon: '/Users/somebody/images/window.png'}); var window = new BrowserWindow({icon: '/Users/somebody/images/window.png'})
``` ```
或者从剪切板中读取图片,它返回的是 `nativeImage`: 或者从剪切板中读取图片,它返回的是 `nativeImage`:
```javascript ```javascript
var image = clipboard.readImage(); var image = clipboard.readImage()
var appIcon = new Tray(image); var appIcon = new Tray(image)
``` ```
## 支持的格式 ## 支持的格式
@ -39,7 +39,7 @@ images/
```javascript ```javascript
var appIcon = new Tray('/Users/somebody/images/icon.png'); var appIcon = new Tray('/Users/somebody/images/icon.png')
``` ```
也支持下面这些 DPI 后缀: 也支持下面这些 DPI 后缀:
@ -102,9 +102,9 @@ var appIcon = new Tray('/Users/somebody/images/icon.png');
`nativeImage` 有如下方法: `nativeImage` 有如下方法:
```javascript ```javascript
const nativeImage = require('electron').nativeImage; const nativeImage = require('electron').nativeImage
var image = nativeImage.createFromPath('/Users/somebody/images/icon.png'); var image = nativeImage.createFromPath('/Users/somebody/images/icon.png')
``` ```
### `image.toPNG()` ### `image.toPNG()`

View file

@ -5,11 +5,11 @@
例如: 例如:
```javascript ```javascript
app.on('ready', function() { app.on('ready', function () {
require('electron').powerMonitor.on('suspend', function() { require('electron').powerMonitor.on('suspend', function () {
console.log('The system is going to sleep'); console.log('The system is going to sleep')
}); })
}); })
``` ```
## 事件 ## 事件

View file

@ -5,12 +5,12 @@
例如: 例如:
```javascript ```javascript
const powerSaveBlocker = require('electron').powerSaveBlocker; const powerSaveBlocker = require('electron').powerSaveBlocker
var id = powerSaveBlocker.start('prevent-display-sleep'); var id = powerSaveBlocker.start('prevent-display-sleep')
console.log(powerSaveBlocker.isStarted(id)); console.log(powerSaveBlocker.isStarted(id))
powerSaveBlocker.stop(id); powerSaveBlocker.stop(id)
``` ```
## 方法 ## 方法

View file

@ -17,14 +17,14 @@ Electron 中的 `process` 对象 与 upstream node 中的有以下的不同点:
当node被完全关闭的时候它可以被预加载脚本使用来添加(原文: removed)与node无关的全局符号来回退到全局范围: 当node被完全关闭的时候它可以被预加载脚本使用来添加(原文: removed)与node无关的全局符号来回退到全局范围:
```js ```javascript
// preload.js // preload.js
var _setImmediate = setImmediate; var _setImmediate = setImmediate
var _clearImmediate = clearImmediate; var _clearImmediate = clearImmediate
process.once('loaded', function() { process.once('loaded', function () {
global.setImmediate = _setImmediate; global.setImmediate = _setImmediate
global.clearImmediate = _clearImmediate; global.clearImmediate = _clearImmediate
}); })
``` ```
## 属性 ## 属性

View file

@ -5,20 +5,17 @@
例子,使用一个与 `file://` 功能相似的协议 : 例子,使用一个与 `file://` 功能相似的协议 :
```javascript ```javascript
const electron = require('electron'); const {app, protocol} = require('electron')
const app = electron.app; const path = require('path')
const path = require('path');
app.on('ready', function() { app.on('ready', () => {
var protocol = electron.protocol; protocol.registerFileProtocol('atom', (request, callback) => {
protocol.registerFileProtocol('atom', function(request, callback) { const url = request.url.substr(7)
var url = request.url.substr(7); callback({path: path.normalize(`${__dirname}/${url}`)})
callback({path: path.normalize(__dirname + '/' + url)}); }, (error) => {
}, function (error) { if (error) console.error('Failed to register protocol')
if (error) })
console.error('Failed to register protocol') })
});
});
``` ```
**注意:** 这个模块只有在 `app` 模块的 `ready` 事件触发之后才可使用. **注意:** 这个模块只有在 `app` 模块的 `ready` 事件触发之后才可使用.
@ -63,7 +60,7 @@ app.on('ready', function() {
为了处理请求,调用 `callback` 时需要使用文件路径或者一个带 `path` 参数的对象, 例如 `callback(filePath)` 为了处理请求,调用 `callback` 时需要使用文件路径或者一个带 `path` 参数的对象, 例如 `callback(filePath)`
`callback({path: filePath})`. `callback({path: filePath})`.
当不使用任何参数调用 `callback` 时,你可以指定一个数字或一个带有 `error` 参数的对象,来标识 `request` 失败.你可以使用的 error number 可以参考 当不使用任何参数调用 `callback` 时,你可以指定一个数字或一个带有 `error` 参数的对象,来标识 `request` 失败.你可以使用的 error number 可以参考
[net error list][net-error]. [net error list][net-error].
默认 `scheme` 会被注册为一个 `http:` 协议,它与遵循 "generic URI syntax" 规则的协议解析不同,例如 `file:` ,所以你或许应该调用 `protocol.registerStandardSchemes` 来创建一个标准的 scheme. 默认 `scheme` 会被注册为一个 `http:` 协议,它与遵循 "generic URI syntax" 规则的协议解析不同,例如 `file:` ,所以你或许应该调用 `protocol.registerStandardSchemes` 来创建一个标准的 scheme.
@ -82,12 +79,11 @@ app.on('ready', function() {
例子: 例子:
```javascript ```javascript
protocol.registerBufferProtocol('atom', function(request, callback) { protocol.registerBufferProtocol('atom', function (request, callback) {
callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')}); callback({mimeType: 'text/html', data: new Buffer('<h5>Response</h5>')})
}, function (error) { }, function (error) {
if (error) if (error) console.error('Failed to register protocol')
console.error('Failed to register protocol') })
});
``` ```
### `protocol.registerStringProtocol(scheme, handler[, completion])` ### `protocol.registerStringProtocol(scheme, handler[, completion])`
@ -180,4 +176,4 @@ which sends a new HTTP request as a response.
* `completion` Function * `completion` Function
取消对 `scheme` 的拦截,使用它的原始句柄进行处理. 取消对 `scheme` 的拦截,使用它的原始句柄进行处理.
[net-error]: https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h [net-error]: https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h

View file

@ -8,11 +8,11 @@ Electron中, 与GUI相关的模块如 `dialog`, `menu` 等)只存在于主进
下面是从渲染进程创建一个浏览器窗口的例子: 下面是从渲染进程创建一个浏览器窗口的例子:
```javascript ```javascript
const remote = require('electron').remote; const remote = require('electron').remote
const BrowserWindow = remote.BrowserWindow; const BrowserWindow = remote.BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com'); win.loadURL('https://github.com')
``` ```
**注意:** 反向操作(从主进程访问渲染进程),可以使用[webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture). **注意:** 反向操作(从主进程访问渲染进程),可以使用[webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture).
@ -55,23 +55,23 @@ get the return value of the passed callbacks.
```javascript ```javascript
// 主进程 mapNumbers.js // 主进程 mapNumbers.js
exports.withRendererCallback = function(mapper) { exports.withRendererCallback = function (mapper) {
return [1,2,3].map(mapper); return [1, 2, 3].map(mapper)
} }
exports.withLocalCallback = function() { exports.withLocalCallback = function () {
return exports.mapNumbers(function(x) { return exports.mapNumbers(function (x) {
return x + 1; return x + 1
}); })
} }
``` ```
```javascript ```javascript
// 渲染进程 // 渲染进程
var mapNumbers = require("remote").require("./mapNumbers"); var mapNumbers = require('remote').require('./mapNumbers')
var withRendererCb = mapNumbers.withRendererCallback(function(x) { var withRendererCb = mapNumbers.withRendererCallback(function (x) {
return x + 1; return x + 1
}) })
var withLocalCb = mapNumbers.withLocalCallback() var withLocalCb = mapNumbers.withLocalCallback()
@ -86,9 +86,9 @@ console.log(withRendererCb, withLocalCb) // [true, true, true], [2, 3, 4]
例如,下面的代码第一眼看上去毫无问题。给远程对象的`close`事件绑定了一个回调函数: 例如,下面的代码第一眼看上去毫无问题。给远程对象的`close`事件绑定了一个回调函数:
```javascript ```javascript
remote.getCurrentWindow().on('close', function() { remote.getCurrentWindow().on('close', function () {
// blabla... // blabla...
}); })
``` ```
但记住主进程会一直保持对这个回调函数的引用,除非明确的卸载它。如果不卸载,每次重新载入窗口都会再次绑定,这样每次重启就会泄露一个回调函数。 但记住主进程会一直保持对这个回调函数的引用,除非明确的卸载它。如果不卸载,每次重新载入窗口都会再次绑定,这样每次重启就会泄露一个回调函数。
@ -102,7 +102,7 @@ remote.getCurrentWindow().on('close', function() {
在主进程中的内置模块已经被添加为`remote`模块中的属性,所以可以直接像使用`electron`模块一样直接使用它们。 在主进程中的内置模块已经被添加为`remote`模块中的属性,所以可以直接像使用`electron`模块一样直接使用它们。
```javascript ```javascript
const app = remote.app; const app = remote.app
``` ```
## 方法 ## 方法

View file

@ -10,36 +10,36 @@
一个例子,创建一个充满整个屏幕的窗口 : 一个例子,创建一个充满整个屏幕的窗口 :
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
var mainWindow; var mainWindow
app.on('ready', function() { app.on('ready', function () {
var electronScreen = electron.screen; var electronScreen = electron.screen
var size = electronScreen.getPrimaryDisplay().workAreaSize; var size = electronScreen.getPrimaryDisplay().workAreaSize
mainWindow = new BrowserWindow({ width: size.width, height: size.height }); mainWindow = new BrowserWindow({ width: size.width, height: size.height })
}); })
``` ```
另一个例子,在此页外创建一个窗口: 另一个例子,在此页外创建一个窗口:
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
var mainWindow; var mainWindow
app.on('ready', function() { app.on('ready', function () {
var electronScreen = electron.screen; var electronScreen = electron.screen
var displays = electronScreen.getAllDisplays(); var displays = electronScreen.getAllDisplays()
var externalDisplay = null; var externalDisplay = null
for (var i in displays) { for (var i in displays) {
if (displays[i].bounds.x != 0 || displays[i].bounds.y != 0) { if (displays[i].bounds.x !== 0 || displays[i].bounds.y !== 0) {
externalDisplay = displays[i]; externalDisplay = displays[i]
break; break
} }
} }
@ -47,9 +47,9 @@ app.on('ready', function() {
mainWindow = new BrowserWindow({ mainWindow = new BrowserWindow({
x: externalDisplay.bounds.x + 50, x: externalDisplay.bounds.x + 50,
y: externalDisplay.bounds.y + 50 y: externalDisplay.bounds.y + 50
}); })
} }
}); })
``` ```
## `Display` 对象 ## `Display` 对象

View file

@ -5,12 +5,12 @@
你也可以通过使用 [`webContents`](web-contents.md) 的属性 `session` 来使用一个已有页面的 `session` `webContents` 是[`BrowserWindow`](browser-window.md) 的属性. 你也可以通过使用 [`webContents`](web-contents.md) 的属性 `session` 来使用一个已有页面的 `session` `webContents` 是[`BrowserWindow`](browser-window.md) 的属性.
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({ width: 800, height: 600 }); var win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL("http://github.com"); win.loadURL('http://github.com')
var ses = win.webContents.session; var ses = win.webContents.session
``` ```
## 方法 ## 方法
@ -38,9 +38,9 @@ var ses = win.webContents.session;
可以在 `session` 模块中创建一个 `Session` 对象 : 可以在 `session` 模块中创建一个 `Session` 对象 :
```javascript ```javascript
const session = require('electron').session; const session = require('electron').session
var ses = session.fromPartition('persist:name'); var ses = session.fromPartition('persist:name')
``` ```
### 实例事件 ### 实例事件
@ -58,12 +58,12 @@ var ses = session.fromPartition('persist:name');
调用 `event.preventDefault()` 可以取消下载,并且在进程的下个 tick中这个 `item` 也不可用. 调用 `event.preventDefault()` 可以取消下载,并且在进程的下个 tick中这个 `item` 也不可用.
```javascript ```javascript
session.defaultSession.on('will-download', function(event, item, webContents) { session.defaultSession.on('will-download', function (event, item, webContents) {
event.preventDefault(); event.preventDefault()
require('request')(item.getURL(), function(data) { require('request')(item.getURL(), function (data) {
require('fs').writeFileSync('/somewhere', data); require('fs').writeFileSync('/somewhere', data)
}); })
}); })
``` ```
### 实例方法 ### 实例方法
@ -76,28 +76,29 @@ session.defaultSession.on('will-download', function(event, item, webContents) {
```javascript ```javascript
// 查询所有 cookies. // 查询所有 cookies.
session.defaultSession.cookies.get({}, function(error, cookies) { session.defaultSession.cookies.get({}, function (error, cookies) {
console.log(cookies); if (error) console.error(error)
}); console.log(cookies)
})
// 查询与指定 url 相关的所有 cookies. // 查询与指定 url 相关的所有 cookies.
session.defaultSession.cookies.get({ url : "http://www.github.com" }, function(error, cookies) { session.defaultSession.cookies.get({ url: 'http://www.github.com' }, function (error, cookies) {
console.log(cookies); if (error) console.error(error)
}); console.log(cookies)
})
// 设置 cookie; // 设置 cookie;
// may overwrite equivalent cookies if they exist. // may overwrite equivalent cookies if they exist.
var cookie = { url : "http://www.github.com", name : "dummy_name", value : "dummy" }; var cookie = { url: 'http://www.github.com', name: 'dummy_name', value: 'dummy' }
session.defaultSession.cookies.set(cookie, function(error) { session.defaultSession.cookies.set(cookie, function (error) {
if (error) if (error) console.error(error)
console.error(error); })
});
``` ```
#### `ses.cookies.get(filter, callback)` #### `ses.cookies.get(filter, callback)`
* `filter` Object * `filter` Object
* `url` String (可选) - 与获取 cookies 相关的 * `url` String (可选) - 与获取 cookies 相关的
`url`.不设置的话就是从所有 url 获取 cookies . `url`.不设置的话就是从所有 url 获取 cookies .
* `name` String (可选) - 通过 name 过滤 cookies. * `name` String (可选) - 通过 name 过滤 cookies.
* `domain` String (可选) - 获取对应域名或子域名的 cookies . * `domain` String (可选) - 获取对应域名或子域名的 cookies .
@ -106,7 +107,7 @@ session.defaultSession.cookies.set(cookie, function(error) {
* `session` Boolean (可选) - 过滤掉 session 或 持久的 cookies. * `session` Boolean (可选) - 过滤掉 session 或 持久的 cookies.
* `callback` Function * `callback` Function
发送一个请求,希望获得所有匹配 `details` 的 cookies, 发送一个请求,希望获得所有匹配 `details` 的 cookies,
在完成的时候,将通过 `callback(error, cookies)` 调用 `callback`. 在完成的时候,将通过 `callback(error, cookies)` 调用 `callback`.
`cookies`是一个 `cookie` 对象. `cookies`是一个 `cookie` 对象.
@ -126,7 +127,7 @@ session.defaultSession.cookies.set(cookie, function(error) {
#### `ses.cookies.set(details, callback)` #### `ses.cookies.set(details, callback)`
* `details` Object * `details` Object
* `url` String - 与获取 cookies 相关的 * `url` String - 与获取 cookies 相关的
`url`. `url`.
* `name` String - cookie 名. 忽略默认为空. * `name` String - cookie 名. 忽略默认为空.
* `value` String - cookie 值. 忽略默认为空. * `value` String - cookie 值. 忽略默认为空.
@ -142,7 +143,7 @@ session.defaultSession.cookies.set(cookie, function(error) {
#### `ses.cookies.remove(url, name, callback)` #### `ses.cookies.remove(url, name, callback)`
* `url` String - 与 cookies 相关的 * `url` String - 与 cookies 相关的
`url`. `url`.
* `name` String - 需要删除的 cookie 名. * `name` String - 需要删除的 cookie 名.
* `callback` Function * `callback` Function
@ -203,7 +204,7 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
例子: 例子:
* `http=foopy:80;ftp=foopy2` - 为 `http://` URL 使用 HTTP 代理 `foopy:80` , 和为 `ftp://` URL * `http=foopy:80;ftp=foopy2` - 为 `http://` URL 使用 HTTP 代理 `foopy:80` , 和为 `ftp://` URL
HTTP 代理 `foopy2:80` . HTTP 代理 `foopy2:80` .
* `foopy:80` - 为所有 URL 使用 HTTP 代理 `foopy:80` . * `foopy:80` - 为所有 URL 使用 HTTP 代理 `foopy:80` .
* `foopy:80,bar,direct://` - 为所有 URL 使用 HTTP 代理 `foopy:80` , 如果 `foopy:80` 不可用,则切换使用 `bar`, 再往后就不使用代理了. * `foopy:80,bar,direct://` - 为所有 URL 使用 HTTP 代理 `foopy:80` , 如果 `foopy:80` 不可用,则切换使用 `bar`, 再往后就不使用代理了.
@ -229,7 +230,7 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
* `options` Object * `options` Object
* `offline` Boolean - 是否模拟网络故障. * `offline` Boolean - 是否模拟网络故障.
* `latency` Double - 每毫秒的 RTT * `latency` Double - 每毫秒的 RTT
* `downloadThroughput` Double - 每 Bps 的下载速率. * `downloadThroughput` Double - 每 Bps 的下载速率.
* `uploadThroughput` Double - 每 Bps 的上载速率. * `uploadThroughput` Double - 每 Bps 的上载速率.
@ -238,13 +239,13 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
```javascript ```javascript
// 模拟 GPRS 连接,使用的 50kbps 流量500 毫秒的 rtt. // 模拟 GPRS 连接,使用的 50kbps 流量500 毫秒的 rtt.
window.webContents.session.enableNetworkEmulation({ window.webContents.session.enableNetworkEmulation({
latency: 500, latency: 500,
downloadThroughput: 6400, downloadThroughput: 6400,
uploadThroughput: 6400 uploadThroughput: 6400
}); })
// 模拟网络故障. // 模拟网络故障.
window.webContents.session.enableNetworkEmulation({offline: true}); window.webContents.session.enableNetworkEmulation({offline: true})
``` ```
#### `ses.disableNetworkEmulation()` #### `ses.disableNetworkEmulation()`
@ -261,12 +262,9 @@ window.webContents.session.enableNetworkEmulation({offline: true});
调用了 `setCertificateVerifyProc(null)` ,则将会回复到默认证书验证过程. 调用了 `setCertificateVerifyProc(null)` ,则将会回复到默认证书验证过程.
```javascript ```javascript
myWindow.webContents.session.setCertificateVerifyProc(function(hostname, cert, callback) { myWindow.webContents.session.setCertificateVerifyProc(function (hostname, cert, callback) {
if (hostname == 'github.com') callback(hostname === 'github.com')
callback(true); })
else
callback(false);
});
``` ```
#### `ses.setPermissionRequestHandler(handler)` #### `ses.setPermissionRequestHandler(handler)`
@ -279,16 +277,16 @@ myWindow.webContents.session.setCertificateVerifyProc(function(hostname, cert, c
为对应 `session` 许可请求设置响应句柄.调用 `callback(true)` 接收许可,调用 `callback(false)` 禁止许可. 为对应 `session` 许可请求设置响应句柄.调用 `callback(true)` 接收许可,调用 `callback(false)` 禁止许可.
```javascript ```javascript
session.fromPartition(partition).setPermissionRequestHandler(function(webContents, permission, callback) { session.fromPartition(partition).setPermissionRequestHandler(function (webContents, permission, callback) {
if (webContents.getURL() === host) { if (webContents.getURL() === host) {
if (permission == "notifications") { if (permission === 'notifications') {
callback(false); // denied. callback(false) // denied.
return; return
} }
} }
callback(true); callback(true)
}); })
``` ```
#### `ses.clearHostResolverCache([callback])` #### `ses.clearHostResolverCache([callback])`
@ -310,13 +308,13 @@ session.fromPartition(partition).setPermissionRequestHandler(function(webContent
```javascript ```javascript
// 将所有请求的代理都修改为下列 url. // 将所有请求的代理都修改为下列 url.
var filter = { var filter = {
urls: ["https://*.github.com/*", "*://electron.github.io"] urls: ['https://*.github.com/*', '*://electron.github.io']
}; }
session.defaultSession.webRequest.onBeforeSendHeaders(filter, function(details, callback) { session.defaultSession.webRequest.onBeforeSendHeaders(filter, function (details, callback) {
details.requestHeaders['User-Agent'] = "MyAgent"; details.requestHeaders['User-Agent'] = 'MyAgent'
callback({cancel: false, requestHeaders: details.requestHeaders}); callback({cancel: false, requestHeaders: details.requestHeaders})
}); })
``` ```
#### `ses.webRequest.onBeforeRequest([filter, ]listener)` #### `ses.webRequest.onBeforeRequest([filter, ]listener)`
@ -478,4 +476,4 @@ session.defaultSession.webRequest.onBeforeSendHeaders(filter, function(details,
* `resourceType` String * `resourceType` String
* `timestamp` Double * `timestamp` Double
* `fromCache` Boolean * `fromCache` Boolean
* `error` String - 错误描述. * `error` String - 错误描述.

View file

@ -6,9 +6,9 @@
在用户默认浏览器中打开URL的示例: 在用户默认浏览器中打开URL的示例:
```javascript ```javascript
const {shell} = require('electron'); const {shell} = require('electron')
shell.openExternal('https://github.com'); shell.openExternal('https://github.com')
``` ```
## Methods ## Methods

View file

@ -9,16 +9,16 @@ Electron也提供了一些额外的内置组件来开发传统桌面应用。一
主进程脚本看起来像个普通的nodejs脚本 主进程脚本看起来像个普通的nodejs脚本
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const BrowserWindow = electron.BrowserWindow; const BrowserWindow = electron.BrowserWindow
var window = null; var window = null
app.on('ready', function() { app.on('ready', function () {
window = new BrowserWindow({width: 800, height: 600}); window = new BrowserWindow({width: 800, height: 600})
window.loadURL('https://github.com'); window.loadURL('https://github.com')
}); })
``` ```
渲染进程和传统的web界面一样除了它具有使用node模块的能力 渲染进程和传统的web界面一样除了它具有使用node模块的能力
@ -42,7 +42,7 @@ app.on('ready', function() {
如果你使用的是CoffeeScript或Babel你可以使用[destructuring assignment][4]来让使用内置模块更简单: 如果你使用的是CoffeeScript或Babel你可以使用[destructuring assignment][4]来让使用内置模块更简单:
```javascript ```javascript
const {app, BrowserWindow} = require('electron'); const {app, BrowserWindow} = require('electron')
``` ```
然而如果你使用的是普通的JavaScript你就需要等到Chrome支持ES6了。 然而如果你使用的是普通的JavaScript你就需要等到Chrome支持ES6了。

View file

@ -3,23 +3,23 @@
用一个 `Tray` 来表示一个图标,这个图标处于正在运行的系统的通知区 ,通常被添加到一个 context menu 上. 用一个 `Tray` 来表示一个图标,这个图标处于正在运行的系统的通知区 ,通常被添加到一个 context menu 上.
```javascript ```javascript
const electron = require('electron'); const electron = require('electron')
const app = electron.app; const app = electron.app
const Menu = electron.Menu; const Menu = electron.Menu
const Tray = electron.Tray; const Tray = electron.Tray
var appIcon = null; var appIcon = null
app.on('ready', function(){ app.on('ready', function () {
appIcon = new Tray('/path/to/my/icon'); appIcon = new Tray('/path/to/my/icon')
var contextMenu = Menu.buildFromTemplate([ var contextMenu = Menu.buildFromTemplate([
{ label: 'Item1', type: 'radio' }, { label: 'Item1', type: 'radio' },
{ label: 'Item2', type: 'radio' }, { label: 'Item2', type: 'radio' },
{ label: 'Item3', type: 'radio', checked: true }, { label: 'Item3', type: 'radio', checked: true },
{ label: 'Item4', type: 'radio' } { label: 'Item4', type: 'radio' }
]); ])
appIcon.setToolTip('This is my application.'); appIcon.setToolTip('This is my application.')
appIcon.setContextMenu(contextMenu); appIcon.setContextMenu(contextMenu)
}); })
``` ```
@ -32,8 +32,8 @@ __平台限制:__
* 在 Linux为了让单独的 `MenuItem` 起效,需要再次调用 `setContextMenu` .例如: * 在 Linux为了让单独的 `MenuItem` 起效,需要再次调用 `setContextMenu` .例如:
```javascript ```javascript
contextMenu.items[2].checked = false; contextMenu.items[2].checked = false
appIcon.setContextMenu(contextMenu); appIcon.setContextMenu(contextMenu)
``` ```
如果想在所有平台保持完全相同的行为,不应该依赖点击事件,而是一直将一个 context menu 添加到 tray icon. 如果想在所有平台保持完全相同的行为,不应该依赖点击事件,而是一直将一个 context menu 添加到 tray icon.

View file

@ -6,12 +6,12 @@
它负责渲染并控制网页,也是 [`BrowserWindow`](browser-window.md) 对象的属性.一个使用 `webContents` 的例子: 它负责渲染并控制网页,也是 [`BrowserWindow`](browser-window.md) 对象的属性.一个使用 `webContents` 的例子:
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
var win = new BrowserWindow({width: 800, height: 1500}); var win = new BrowserWindow({width: 800, height: 1500})
win.loadURL("http://github.com"); win.loadURL('http://github.com')
var webContents = win.webContents; var webContents = win.webContents
``` ```
## 事件 ## 事件
@ -302,7 +302,7 @@ var webContents = win.webContents;
比如 `http://``file://`. 如果加载想要忽略 http 缓存,可以使用 `pragma` 头来达到目的. 比如 `http://``file://`. 如果加载想要忽略 http 缓存,可以使用 `pragma` 头来达到目的.
```javascript ```javascript
const options = {"extraHeaders" : "pragma: no-cache\n"} const options = {'extraHeaders': 'pragma: no-cache\n'}
webContents.loadURL(url, options) webContents.loadURL(url, options)
``` ```
@ -317,10 +317,10 @@ webContents.loadURL(url, options)
返回当前page 的 url. 返回当前page 的 url.
```javascript ```javascript
var win = new BrowserWindow({width: 800, height: 600}); var win = new BrowserWindow({width: 800, height: 600})
win.loadURL("http://github.com"); win.loadURL('http://github.com')
var currentURL = win.webContents.getURL(); var currentURL = win.webContents.getURL()
``` ```
### `webContents.getTitle()` ### `webContents.getTitle()`
@ -428,51 +428,51 @@ var currentURL = win.webContents.getURL();
### `webContents.undo()` ### `webContents.undo()`
执行网页的编辑命令 `undo` . 执行网页的编辑命令 `undo` .
### `webContents.redo()` ### `webContents.redo()`
执行网页的编辑命令 `redo` . 执行网页的编辑命令 `redo` .
### `webContents.cut()` ### `webContents.cut()`
执行网页的编辑命令 `cut` . 执行网页的编辑命令 `cut` .
### `webContents.copy()` ### `webContents.copy()`
执行网页的编辑命令 `copy` . 执行网页的编辑命令 `copy` .
### `webContents.paste()` ### `webContents.paste()`
执行网页的编辑命令 `paste` . 执行网页的编辑命令 `paste` .
### `webContents.pasteAndMatchStyle()` ### `webContents.pasteAndMatchStyle()`
执行网页的编辑命令 `pasteAndMatchStyle` . 执行网页的编辑命令 `pasteAndMatchStyle` .
### `webContents.delete()` ### `webContents.delete()`
执行网页的编辑命令 `delete` . 执行网页的编辑命令 `delete` .
### `webContents.selectAll()` ### `webContents.selectAll()`
执行网页的编辑命令 `selectAll` . 执行网页的编辑命令 `selectAll` .
### `webContents.unselect()` ### `webContents.unselect()`
执行网页的编辑命令 `unselect` . 执行网页的编辑命令 `unselect` .
### `webContents.replace(text)` ### `webContents.replace(text)`
* `text` String * `text` String
执行网页的编辑命令 `replace` . 执行网页的编辑命令 `replace` .
### `webContents.replaceMisspelling(text)` ### `webContents.replaceMisspelling(text)`
* `text` String * `text` String
执行网页的编辑命令 `replaceMisspelling` . 执行网页的编辑命令 `replaceMisspelling` .
### `webContents.insertText(text)` ### `webContents.insertText(text)`
@ -507,12 +507,11 @@ var currentURL = win.webContents.getURL();
使用给定的 `action` 来为 `webContents` 停止任何 `findInPage` 请求. 使用给定的 `action` 来为 `webContents` 停止任何 `findInPage` 请求.
```javascript ```javascript
webContents.on('found-in-page', function(event, result) { webContents.on('found-in-page', function (event, result) {
if (result.finalUpdate) if (result.finalUpdate) webContents.stopFindInPage('clearSelection')
webContents.stopFindInPage("clearSelection"); })
});
const requestId = webContents.findInPage("api"); const requestId = webContents.findInPage('api')
``` ```
### `webContents.hasServiceWorker(callback)` ### `webContents.hasServiceWorker(callback)`
@ -566,23 +565,22 @@ const requestId = webContents.findInPage("api");
``` ```
```javascript ```javascript
const BrowserWindow = require('electron').BrowserWindow; const BrowserWindow = require('electron').BrowserWindow
const fs = require('fs'); const fs = require('fs')
var win = new BrowserWindow({width: 800, height: 600}); var win = new BrowserWindow({width: 800, height: 600})
win.loadURL("http://github.com"); win.loadURL('http://github.com')
win.webContents.on("did-finish-load", function() { win.webContents.on('did-finish-load', function () {
// Use default printing options // Use default printing options
win.webContents.printToPDF({}, function(error, data) { win.webContents.printToPDF({}, function (error, data) {
if (error) throw error; if (error) throw error
fs.writeFile("/tmp/print.pdf", data, function(error) { fs.writeFile('/tmp/print.pdf', data, function (error) {
if (error) if (error) throw error
throw error; console.log('Write PDF successfully.')
console.log("Write PDF successfully.");
}) })
}) })
}); })
``` ```
### `webContents.addWorkSpace(path)` ### `webContents.addWorkSpace(path)`
@ -592,9 +590,9 @@ win.webContents.on("did-finish-load", function() {
添加指定的路径给开发者工具栏的 workspace.必须在 DevTools 创建之后使用它 : 添加指定的路径给开发者工具栏的 workspace.必须在 DevTools 创建之后使用它 :
```javascript ```javascript
mainWindow.webContents.on('devtools-opened', function() { mainWindow.webContents.on('devtools-opened', function () {
mainWindow.webContents.addWorkSpace(__dirname); mainWindow.webContents.addWorkSpace(__dirname)
}); })
``` ```
### `webContents.removeWorkSpace(path)` ### `webContents.removeWorkSpace(path)`
@ -650,14 +648,14 @@ Toggles 开发者工具.
```javascript ```javascript
// 主进程. // 主进程.
var window = null; var window = null
app.on('ready', function() { app.on('ready', function () {
window = new BrowserWindow({width: 800, height: 600}); window = new BrowserWindow({width: 800, height: 600})
window.loadURL('file://' + __dirname + '/index.html'); window.loadURL(`file://${__dirname}/index.html`)
window.webContents.on('did-finish-load', function() { window.webContents.on('did-finish-load', function () {
window.webContents.send('ping', 'whoooooooh!'); window.webContents.send('ping', 'whoooooooh!')
}); })
}); })
``` ```
```html ```html
@ -666,8 +664,8 @@ app.on('ready', function() {
<body> <body>
<script> <script>
require('electron').ipcRenderer.on('ping', function(event, message) { require('electron').ipcRenderer.on('ping', function(event, message) {
console.log(message); // Prints "whoooooooh!" console.log(message) // Prints "whoooooooh!"
}); })
</script> </script>
</body> </body>
</html> </html>
@ -686,8 +684,8 @@ app.on('ready', function() {
* `height` Integer - 设置模拟屏幕 height * `height` Integer - 设置模拟屏幕 height
* `viewPosition` Object - 在屏幕放置 view * `viewPosition` Object - 在屏幕放置 view
(screenPosition == mobile) (默认: `{x: 0, y: 0}`) (screenPosition == mobile) (默认: `{x: 0, y: 0}`)
* `x` Integer - 设置偏移左上角的x轴 * `x` Integer - 设置偏移左上角的x轴
* `y` Integer - 设置偏移左上角的y轴 * `y` Integer - 设置偏移左上角的y轴
* `deviceScaleFactor` Integer - 设置设备比例因子 (如果为0默认为原始屏幕比例) (默认: `0`) * `deviceScaleFactor` Integer - 设置设备比例因子 (如果为0默认为原始屏幕比例) (默认: `0`)
* `viewSize` Object - 设置模拟视图 size (空表示不覆盖) * `viewSize` Object - 设置模拟视图 size (空表示不覆盖)
* `width` Integer - 设置模拟视图 width * `width` Integer - 设置模拟视图 width
@ -769,14 +767,13 @@ app.on('ready', function() {
如果保存界面过程初始化成功,返回 true. 如果保存界面过程初始化成功,返回 true.
```javascript ```javascript
win.loadURL('https://github.com'); win.loadURL('https://github.com')
win.webContents.on('did-finish-load', function() { win.webContents.on('did-finish-load', function () {
win.webContents.savePage('/tmp/test.html', 'HTMLComplete', function(error) { win.webContents.savePage('/tmp/test.html', 'HTMLComplete', function (error) {
if (!error) if (!error) console.log('Save page successfully')
console.log("Save page successfully"); })
}); })
});
``` ```
## 实例属性 ## 实例属性
@ -803,23 +800,24 @@ win.webContents.on('did-finish-load', function() {
```javascript ```javascript
try { try {
win.webContents.debugger.attach("1.1"); win.webContents.debugger.attach('1.1')
} catch(err) { } catch (err) {
console.log("Debugger attach failed : ", err); console.log('Debugger attach failed : ', err)
}; }
win.webContents.debugger.on('detach', function(event, reason) { win.webContents.debugger.on('detach', function (event, reason) {
console.log("Debugger detached due to : ", reason); console.log('Debugger detached due to : ', reason)
}); })
win.webContents.debugger.on('message', function(event, method, params) { win.webContents.debugger.on('message', function (event, method, params) {
if (method == "Network.requestWillBeSent") { if (method === 'Network.requestWillBeSent') {
if (params.request.url == "https://www.github.com") if (params.request.url === 'https://www.github.com') {
win.webContents.debugger.detach(); win.webContents.debugger.detach()
}
} }
}) })
win.webContents.debugger.sendCommand("Network.enable"); win.webContents.debugger.sendCommand('Network.enable')
``` ```
#### `webContents.debugger.attach([protocolVersion])` #### `webContents.debugger.attach([protocolVersion])`

View file

@ -5,9 +5,9 @@
例子,放大当前页到 200%. 例子,放大当前页到 200%.
```javascript ```javascript
var webFrame = require('electron').webFrame; var webFrame = require('electron').webFrame
webFrame.setZoomFactor(2); webFrame.setZoomFactor(2)
``` ```
## 方法 ## 方法
@ -54,11 +54,11 @@ webFrame.setZoomFactor(2);
例子,使用 [node-spellchecker][spellchecker] 作为一个 provider: 例子,使用 [node-spellchecker][spellchecker] 作为一个 provider:
```javascript ```javascript
webFrame.setSpellCheckProvider("en-US", true, { webFrame.setSpellCheckProvider('en-US', true, {
spellCheck: function(text) { spellCheck: function (text) {
return !(require('spellchecker').isMisspelled(text)); return !(require('spellchecker').isMisspelled(text))
} }
}); })
``` ```
### `webFrame.registerURLSchemeAsSecure(scheme)` ### `webFrame.registerURLSchemeAsSecure(scheme)`

View file

@ -145,9 +145,9 @@
**例如** **例如**
```javascript ```javascript
webview.addEventListener("dom-ready", function() { webview.addEventListener('dom-ready', function () {
webview.openDevTools(); webview.openDevTools()
}); })
``` ```
### `<webview>.loadURL(url[, options])` ### `<webview>.loadURL(url[, options])`
@ -517,9 +517,9 @@ Returns:
下面示例代码将所有信息输出到内置控制台,没有考虑到输出等级和其他属性。 下面示例代码将所有信息输出到内置控制台,没有考虑到输出等级和其他属性。
```javascript ```javascript
webview.addEventListener('console-message', function(e) { webview.addEventListener('console-message', function (e) {
console.log('Guest page logged a message:', e.message); console.log('Guest page logged a message:', e.message)
}); })
``` ```
### Event: 'found-in-page' ### Event: 'found-in-page'
@ -536,12 +536,11 @@ webview.addEventListener('console-message', function(e) {
在请求[`webview.findInPage`](web-view-tag.md#webviewtagfindinpage)结果有效时触发. 在请求[`webview.findInPage`](web-view-tag.md#webviewtagfindinpage)结果有效时触发.
```javascript ```javascript
webview.addEventListener('found-in-page', function(e) { webview.addEventListener('found-in-page', function (e) {
if (e.result.finalUpdate) if (e.result.finalUpdate) webview.stopFindInPage('keepSelection')
webview.stopFindInPage("keepSelection"); })
});
const rquestId = webview.findInPage("test"); const rquestId = webview.findInPage('test')
``` ```
### Event: 'new-window' ### Event: 'new-window'
@ -560,9 +559,9 @@ const rquestId = webview.findInPage("test");
下面示例代码在系统默认浏览器中打开了一个新的url. 下面示例代码在系统默认浏览器中打开了一个新的url.
```javascript ```javascript
webview.addEventListener('new-window', function(e) { webview.addEventListener('new-window', function (e) {
require('electron').shell.openExternal(e.url); require('electron').shell.openExternal(e.url)
}); })
``` ```
### Event: 'will-navigate' ### Event: 'will-navigate'
@ -606,9 +605,9 @@ webview.addEventListener('new-window', function(e) {
下面的示例代码指示了在客户端试图关闭自己的时候将改变导航连接为`about:blank`. 下面的示例代码指示了在客户端试图关闭自己的时候将改变导航连接为`about:blank`.
```javascript ```javascript
webview.addEventListener('close', function() { webview.addEventListener('close', function () {
webview.src = 'about:blank'; webview.src = 'about:blank'
}); })
``` ```
### Event: 'ipc-message' ### Event: 'ipc-message'
@ -624,19 +623,19 @@ webview.addEventListener('close', function() {
```javascript ```javascript
// In embedder page. // In embedder page.
webview.addEventListener('ipc-message', function(event) { webview.addEventListener('ipc-message', function (event) {
console.log(event.channel); console.log(event.channel)
// Prints "pong" // Prints "pong"
}); })
webview.send('ping'); webview.send('ping')
``` ```
```javascript ```javascript
// In guest page. // In guest page.
var ipcRenderer = require('electron').ipcRenderer; var ipcRenderer = require('electron').ipcRenderer
ipcRenderer.on('ping', function() { ipcRenderer.on('ping', function () {
ipcRenderer.sendToHost('pong'); ipcRenderer.sendToHost('pong')
}); })
``` ```
### Event: 'crashed' ### Event: 'crashed'
@ -670,7 +669,7 @@ ipcRenderer.on('ping', function() {
### Event: 'did-change-theme-color' ### Event: 'did-change-theme-color'
在页面的主体色改变的时候触发. 在页面的主体色改变的时候触发.
在使用 meta 标签的时候这就很常见了: 在使用 meta 标签的时候这就很常见了:
```html ```html
@ -689,4 +688,4 @@ ipcRenderer.on('ping', function() {
在开发者工具获取焦点的时候触发. 在开发者工具获取焦点的时候触发.
[blink-feature-string]: https://code.google.com/p/chromium/codesearch#chromium/src/out/Debug/gen/blink/platform/RuntimeEnabledFeatures.cpp&sq=package:chromium&type=cs&l=527 [blink-feature-string]: https://code.google.com/p/chromium/codesearch#chromium/src/out/Debug/gen/blink/platform/RuntimeEnabledFeatures.cpp&sq=package:chromium&type=cs&l=527

Some files were not shown because too many files have changed in this diff Show more