docs: Update Korean docs as upstream (#7211)

* 📝 Update `README-ko.md`

* Remove Korean readme specified header.
* Add Indonesia community link.

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Mark untranslated docs

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Add untranslated files

[ci skip]

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Update Korean docs as upstream

* 📝 Update `README-ko.md`

* Remove Korean readme specified header.
* Add Indonesia community link.

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Update Korean docs as upstream

* 📝 Mark untranslated docs

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Add untranslated files

[ci skip]

* 📝 Update Korean docs as upstream

[ci skip]

* 📝 Update Korean docs as upstream

* 📝 Correct readme name

[ci skip]

* 📝 Update Korean docs as upstream

[ci skip]
This commit is contained in:
Plusb Preco 2016-09-16 01:27:10 +09:00 committed by Kevin Sawicki
parent b84d29fb32
commit 787bc85703
37 changed files with 1350 additions and 559 deletions

View file

@ -33,6 +33,7 @@ Electron에 대해 자주 묻는 질문이 있습니다. 이슈를 생성하기
* [Pepper 플래시 플러그인 사용하기](tutorial/using-pepper-flash-plugin.md)
* [Widevine CDM 플러그인 사용하기](tutorial/using-widevine-cdm-plugin.md)
* [Headless CI 시스템에서 테스팅하기 (Travis, Jenkins)](tutorial/testing-on-headless-ci.md)
* [오프 스크린 랜더링](tutorial/offscreen-rendering.md)
## 튜토리얼
@ -96,5 +97,6 @@ Electron에 대해 자주 묻는 질문이 있습니다. 이슈를 생성하기
* [빌드 설명서 (macOS)](development/build-instructions-osx.md)
* [빌드 설명서 (Windows)](development/build-instructions-windows.md)
* [빌드 설명서 (Linux)](development/build-instructions-linux.md)
* [디버그 설명서 (macOS)](development/debug-instructions-macos.md)
* [디버그 설명서 (Windows)](development/debug-instructions-windows.md)
* [디버거 심볼 서버 설정](development/setting-up-symbol-server.md)

View file

@ -183,8 +183,13 @@ Returns:
* `url` URL
* `error` String - 에러 코드
* `certificate` Object
* `data` Buffer - PEM 인코딩된 데이터
* `issuerName` String
* `data` String - PEM 인코딩된 데이터
* `issuerName` String - 인증서 발급자의 공통 이름
* `subjectName` String - 대상의 공통 이름
* `serialNumber` String - 문자열로 표현된 hex 값
* `validStart` Integer - 초 단위의 인증서가 유효하기 시작한 날짜
* `validExpiry` Integer - 초 단위의 인증서가 만료되는 날짜
* `fingerprint` String - 인증서의 지문
* `callback` Function
`url`에 대한 `certificate` 인증서의 유효성 검증에 실패했을 때 발생하는 이벤트입니다.
@ -211,8 +216,13 @@ Returns:
* `webContents` [WebContents](web-contents.md)
* `url` URL
* `certificateList` [Objects]
* `data` Buffer - PEM으로 인코딩된 데이터
* `issuerName` String - 발급자의 공통 이름
* `data` String - PEM으로 인코딩된 데이터
* `issuerName` String - 인증서 발급자의 공통 이름
* `subjectName` String - 대상의 공통 이름
* `serialNumber` String - 문자열로 표현된 hex 값
* `validStart` Integer - 초 단위의 인증서가 유효하기 시작한 날짜
* `validExpiry` Integer - 초 단위의 인증서가 만료되는 날짜
* `fingerprint` String - 인증서의 지문
* `callback` Function
클라이언트 인증이 요청되었을 때 발생하는 이벤트입니다.
@ -434,16 +444,23 @@ npm 모듈 규칙에 따라 대부분의 경우 `package.json`의 `name` 필드
최근 문서 목록을 모두 비웁니다.
### `app.setAsDefaultProtocolClient(protocol)` _macOS_ _Windows_
### `app.setAsDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - 프로토콜의 이름, `://` 제외. 만약 앱을 통해 `electron://`
같은 링크를 처리하고 싶다면, 이 메서드에 `electron` 인수를 담아 호출하면 됩니다.
* `path` String (optional) _Windows_ - 기본값은 `process.execPath`입니다.
* `args` Array (optional) _Windows_ - 기본값은 빈 배열입니다.
이 메서드는 지정한 프로토콜(URI scheme)에 대해 현재 실행파일을 기본 핸들러로
등록합니다. 이를 통해 운영체제와 더 가깝게 통합할 수 있습니다. 한 번 등록되면,
`your-protocol://`과 같은 모든 링크에 대해 호출시 현재 실행 파일이 실행됩니다.
모든 링크, 프로토콜을 포함하여 애플리케이션의 인수로 전달됩니다.
Windows에선 실행시에 선택적 매개변수를 통해 경로, 실행 파일, 인수, 실행 파일로 전달될
인수의 배열을 제공할 수 있습니다.
호출에 성공하면 `true`를 반환하고 그렇지 않다면 `false`를 반환합니다.
**참고:** macOS에선, 애플리케이션의 `info.plist`에 등록해둔 프로토콜만 사용할 수
있습니다. 이는 런타임에서 변경될 수 없습니다. 이 파일은 간단히 텍스트 에디터를
사용하거나, 애플리케이션을 빌드할 때 스크립트가 생성되도록 할 수 있습니다. 자세한
@ -451,19 +468,27 @@ npm 모듈 규칙에 따라 대부분의 경우 `package.json`의 `name` 필드
이 API는 내부적으로 Windows 레지스트리와 LSSetDefaultHandlerForURLScheme를 사용합니다.
### `app.removeAsDefaultProtocolClient(protocol)` _macOS_ _Windows_
호출에 성공하면 `true`를 반환하고 그렇지 않다면 `false`를 반환합니다.
### `app.removeAsDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - 프로토콜의 이름, `://` 제외.
* `path` String (optional) _Windows_ - Defaults to `process.execPath`
* `args` Array (optional) _Windows_ - Defaults to an empty array
이 메서드는 현재 실행파일이 지정한 프로토콜(URI scheme)에 대해 기본 핸들러인지를
확인합니다. 만약 그렇다면, 이 메서드는 앱을 기본 핸들러에서 제거합니다.
### `app.isDefaultProtocolClient(protocol)` _macOS_ _Windows_
호출에 성공하면 `true`를 반환하고 그렇지 않다면 `false`를 반환합니다.
### `app.isDefaultProtocolClient(protocol[, path, args])` _macOS_ _Windows_
* `protocol` String - `://`를 제외한 프로토콜의 이름.
이 메서드는 현재 실행 파일이 지정한 프로토콜에 대해 기본 동작인지 확인합니다. (URI
스킴) 만약 그렇다면 `true`를 반환하고 아닌 경우 `false`를 반환합니다.
* `path` String (optional) _Windows_ - Defaults to `process.execPath`
* `args` Array (optional) _Windows_ - Defaults to an empty array
**참고:** macOS에선, 응용 프로그램이 프로토콜에 대한 기본 프로토콜 동작으로
등록되었는지를 확인하기 위해 이 메서드를 사용할 수 있습니다. 또한 macOS에서
@ -494,6 +519,8 @@ Windows에서 사용할 수 있는 JumpList의 [Tasks][tasks] 카테고리에 `t
아이콘을 가지고 있을 경우, 사용할 아이콘의 인덱스를 이 옵션으로 지정해 주어야 합니다.
단, 아이콘을 하나만 포함하고 있는 경우 0을 지정하면 됩니다.
호출에 성공하면 `true`를 반환하고 그렇지 않다면 `false`를 반환합니다.
### `app.makeSingleInstance(callback)`
* `callback` Function
@ -621,6 +648,9 @@ https://www.chromium.org/developers/design-documents/accessibility 를 참고하
### `app.commandLine.appendSwitch(switch[, value])`
* `switch` String -명령줄 스위치
* `value` String (optional) - 주어진 스위치에 대한 값
Chrominum의 명령줄에 스위치를 추가합니다. `value`는 추가적인 값을 뜻하며 옵션입니다.
**참고:** 이 메서드는 `process.argv`에 영향을 주지 않습니다. 개발자들은 보통
@ -628,6 +658,8 @@ Chrominum의 로우 레벨 수준의 동작을 제어하기 위해 주로 사용
### `app.commandLine.appendArgument(value)`
* `value` String - 명령줄에 덧붙여질 인수
Chrominum의 명령줄에 인수를 추가합니다. 인수는 올바르게 인용됩니다.
**참고:** 이 메서드는 `process.argv`에 영향을 주지 않습니다.
@ -675,6 +707,12 @@ dock 아이콘을 숨깁니다.
dock 아이콘을 표시합니다.
### `app.dock.isVisible()` _macOS_
dock 아이콘이 보이는 상태인지 여부를 반환합니다. `app.dock.show()` 호출은
비동기이므로 해당 메서드를 호출한 후 바로 이 메서드를 호출하면 `true`를 반환하지
않을 수 있습니다.
### `app.dock.setMenu(menu)` _macOS_
* `menu` [Menu](menu.md)
@ -687,21 +725,23 @@ dock 아이콘을 표시합니다.
dock 아이콘의 `image`를 설정합니다.
### `app.getLoginItemSettings()` _macOS_
### `app.getLoginItemSettings()` _macOS_ _Windows_
앱의 로그인 항목 설정을 객체로 반환합니다.
* `openAtLogin` Boolean - 앱이 로그인시 열리도록 설정되어있는 경우 `true`를 반환.
* `openAsHidden` Boolean - 앱이 로구인시 숨겨진 채로 열리도록 설정되어있는 경우
`true`를 반환.
`true`를 반환. 이 설정은 macOS에서만 지원됩니다.
* `wasOpenedAtLogin` Boolean - 자동으로 로그인할 때 애플리케이션이 열려있었는지 여부.
이 설정은 macOS에서만 지원됩니다.
* `wasOpenedAsHidden` Boolean - 앱이 숨겨진 로그인 항목처럼 열려있었는지 여부.
이는 앱이 시작시 어떤 윈도우도 열지 않을 것을 표시합니다.
이는 앱이 시작시 어떤 윈도우도 열지 않을 것을 표시합니다. 이 설정은 macOS에서만
지원됩니다.
* `restoreState` Boolean - 앱이 이전 세션에서 상태를 복원하여 로그인 항목처럼
열려있었는지 여부. 이는 앱이 마지막으로 종료되었던 때에 열려있었던 윈도우를 복원하는
것을 표시합니다.
것을 표시합니다. 이 설정은 macOS에서만 지원됩니다.
### `app.setLoginItemSettings(settings)` _macOS_
### `app.setLoginItemSettings(settings)` _macOS_ _Windows_
* `settings` Object
* `openAtLogin` Boolean - `true`로 지정하면 로그인시 애플리케이션을 열도록 하며
@ -709,7 +749,8 @@ dock 아이콘의 `image`를 설정합니다.
* `openAsHidden` Boolean - `true`로 지정하면 애플리케이션을 숨겨진 채로 열도록
합니다. 기본값은 `false`입니다. 사용자가 시스템 설정에서 이 설정을 변경할 수
있으며 앱이 열렸을 때 현재 값을 확인하려면
`app.getLoginItemStatus().wasOpenedAsHidden`를 확인해야 합니다.
`app.getLoginItemStatus().wasOpenedAsHidden`을 확인해야 합니다. 이 설정은
macOS에서만 지원됩니다.
앱의 로그인 항목 설정을 지정합니다.

View file

@ -104,6 +104,10 @@ Returns:
`url`을 설정하고 자동 업데이터를 초기화합니다.
### `autoUpdater.getFeedURL()`
현재 업데이트 피드 URL을 반환합니다.
### `autoUpdater.checkForUpdates()`
서버에 새로운 업데이트가 있는지 요청을 보내 확인합니다. API를 사용하기 전에

View file

@ -16,7 +16,11 @@ win.on('closed', () => {
win = null;
})
win.loadURL('https://github.com');
// 원격 URL 로드
win.loadURL('https://github.com')
// 또는 로컬 HTML 로드
win.loadURL(`file://${__dirname}/app/index.html`)
```
## Frameless 윈도우
@ -204,14 +208,14 @@ On Windows it is
수 없습니다. 하지만 편법으로 `globalShortcut`을 통해 키 입력을 받을 수 있습니다.
* Windows의 경우, 가능한 타입으론 `toolbar`가 있습니다.
`titleBarStyle` 속성은 macOS 10.10 Yosemite 이후 버전만 지원하며, 다음 3가지 종류의
값을 사용할 수 있습니다:
`titleBarStyle`의 속성은 다음과 같습니다:
* `default` 또는 미지정: 표준 Mac 회색 불투명 스타일을 사용합니다.
* `hidden`: 타이틀 바를 숨기고 콘텐츠 전체를 윈도우 크기에 맞춥니다.
타이틀 바는 없어지지만 표준 창 컨트롤 ("신호등 버튼")은 왼쪽 상단에 유지됩니다.
* `hidden-inset`: `hidden` 타이틀 바 속성과 함께 신호등 버튼이 윈도우 모서리로부터
약간 더 안쪽으로 들어가도록합니다.
약간 더 안쪽으로 들어가도록합니다. 10.9 Mavericks에선 지원되지 않고 `hidden`으로
폴백합니다.
`webPreferences` 속성은 다음과 같은 속성을 가질 수 있습니다:
@ -276,27 +280,31 @@ On Windows it is
* `defaultEncoding` String - 기본값 `ISO-8859-1`.
* `backgroundThrottling` Boolean - 페이지가 백그라운드 상태에 진입할 때 애니메이션과
타이머에 스로틀을 적용할지 여부입니다. 기본값은 `true`입니다.
* `offscreen` Boolean - 브라우저 윈도우에 오프 스크린 랜더링을 적용할지 여부를
지정합니다. 기본값은 `false`입니다.
## Events
### Instance Events
`BrowserWindow` 객체는 다음과 같은 이벤트를 발생시킵니다:
`new BrowserWindow`로 생성된 객체는 다음과 같은 이벤트를 발생시킵니다:
**참고:** 몇몇 이벤트는 라벨에 특정한 OS에서만 작동합니다.
### Event: 'page-title-updated'
#### Event: 'page-title-updated'
Returns:
* `event` Event
* `title` String
문서의 제목이 변경될 때 발생하는 이벤트입니다. `event.preventDefault()`를 호출하여
네이티브 윈도우의 제목이 변경되는 것을 방지할 수 있습니다.
### Event: 'close'
#### Event: 'close'
Returns:
* `event` Event
* `title` String
윈도우가 닫히기 시작할 때 발생하는 이벤트입니다.
이 이벤트는 DOM의 `beforeunload``unload` 이벤트 전에 발생합니다.
@ -319,87 +327,87 @@ window.onbeforeunload = (e) => {
};
```
### Event: 'closed'
#### Event: 'closed'
윈도우 종료가 완료된 경우 발생하는 이벤트입니다. 이 이벤트가 발생했을 경우 반드시
윈도우의 레퍼런스가 더 이상 사용되지 않도록 제거해야 합니다.
### Event: 'unresponsive'
#### Event: 'unresponsive'
웹 페이지가 응답하지 않을 때 발생하는 이벤트입니다.
### Event: 'responsive'
#### Event: 'responsive'
응답하지 않는 웹 페이지가 다시 응답하기 시작했을 때 발생하는 이벤트입니다.
### Event: 'blur'
#### Event: 'blur'
윈도우가 포커스를 잃었을 떄 발생하는 이벤트입니다.
### Event: 'focus'
#### Event: 'focus'
윈도우가 포커스를 가졌을 때 발생하는 이벤트입니다.
### Event: 'show'
#### Event: 'show'
윈도우가 보여진 상태일 때 발생하는 이벤트입니다.
### Event: 'hide'
#### Event: 'hide'
윈도우가 숨겨진 상태일 때 발생하는 이벤트입니다.
### Event: 'ready-to-show'
#### Event: 'ready-to-show'
웹 페이지가 완전히 랜더링되어 윈도우가 시각적인 깜빡임없이 텐츠를 보여줄 수 있을 때
웹 페이지가 완전히 랜더링되어 윈도우가 시각적인 깜빡임없이 텐츠를 보여줄 수 있을 때
발생하는 이벤트입니다.
### Event: 'maximize'
#### Event: 'maximize'
윈도우가 최대화됐을 때 발생하는 이벤트입니다.
### Event: 'unmaximize'
#### Event: 'unmaximize'
윈도우의 최대화 상태가 해제되었을 때 발생하는 이벤트입니다.
### Event: 'minimize'
#### Event: 'minimize'
윈도우가 최소화됐을 때 발생하는 이벤트입니다.
### Event: 'restore'
#### Event: 'restore'
윈도우가 최소화 상태에서 복구되었을 때 발생하는 이벤트입니다.
### Event: 'resize'
#### Event: 'resize'
윈도우의 크기가 재조정될 때 발생하는 이벤트입니다.
### Event: 'move'
#### Event: 'move'
윈도우가 새로운 위치로 이동될 때 발생하는 이벤트입니다.
__참고__: macOS에선 이 이벤트가 그저 `moved` 이벤트의 별칭(alias)으로 사용됩니다.
### Event: 'moved' _macOS_
#### Event: 'moved' _macOS_
윈도우가 새로운 위치로 이동되었을 때 발생하는 이벤트입니다. (한 번만)
### Event: 'enter-full-screen'
#### Event: 'enter-full-screen'
윈도우가 풀 스크린 모드로 진입할 때 발생하는 이벤트입니다.
### Event: 'leave-full-screen'
#### Event: 'leave-full-screen'
윈도우가 풀 스크린 모드에서 해제될 때 발생하는 이벤트입니다.
### Event: 'enter-html-full-screen'
#### Event: 'enter-html-full-screen'
윈도우가 HTML API에 의해 풀 스크린 모드로 진입할 때 발생하는 이벤트입니다.
### Event: 'leave-html-full-screen'
#### Event: 'leave-html-full-screen'
윈도우가 HTML API에 의해 풀 스크린 모드에서 해제될 때 발생하는 이벤트입니다.
### Event: 'app-command' _Windows_
#### Event: 'app-command' _Windows_
Returns:
@ -424,15 +432,15 @@ someWindow.on('app-command', (e, cmd) => {
});
```
### Event: 'scroll-touch-begin' _macOS_
#### Event: 'scroll-touch-begin' _macOS_
스크롤 휠 이벤트가 동작하기 시작했을 때 발생하는 이벤트입니다.
### Event: 'scroll-touch-end' _macOS_
#### Event: 'scroll-touch-end' _macOS_
스크롤 휠 이벤트가 동작을 멈췄을 때 발생하는 이벤트입니다.
### Event: 'swipe' _macOS_
#### Event: 'swipe' _macOS_
Returns:
@ -442,32 +450,32 @@ Returns:
3-손가락 스와이프가 작동할 때 발생하는 이벤트입니다. 방향은 `up`, `right`, `down`,
`left`가 될 수 있습니다.
## Methods
### Static Methods
`BrowserWindow` 객체는 다음과 같은 메서드를 가지고 있습니다:
`BrowserWindow` 클래스는 다음과 같은 정적 메서드를 가지고 있습니다:
### `BrowserWindow.getAllWindows()`
#### `BrowserWindow.getAllWindows()`
열려있는 모든 브라우저 윈도우의 배열을 반환합니다.
### `BrowserWindow.getFocusedWindow()`
#### `BrowserWindow.getFocusedWindow()`
애플리케이션에서 포커스된 윈도우를 반환합니다. 포커스된 윈도우가 없을 경우 `null`
반환합니다.
### `BrowserWindow.fromWebContents(webContents)`
#### `BrowserWindow.fromWebContents(webContents)`
* `webContents` [WebContents](web-contents.md)
`webContents`를 소유하고 있는 윈도우를 찾습니다.
### `BrowserWindow.fromId(id)`
#### `BrowserWindow.fromId(id)`
* `id` Integer
ID에 해당하는 윈도우를 찾습니다.
### `BrowserWindow.addDevToolsExtension(path)`
#### `BrowserWindow.addDevToolsExtension(path)`
* `path` String
@ -479,7 +487,7 @@ ID에 해당하는 윈도우를 찾습니다.
**참고:** 이 API는 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 없습니다.
### `BrowserWindow.removeDevToolsExtension(name)`
#### `BrowserWindow.removeDevToolsExtension(name)`
* `name` String
@ -487,7 +495,7 @@ ID에 해당하는 윈도우를 찾습니다.
**참고:** 이 API는 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 없습니다.
### `BrowserWindow.getDevToolsExtensions()`
#### `BrowserWindow.getDevToolsExtensions()`
키는 확장 기능 이름을 값은 `name``version` 속성을 포함하는 객체를 가지는 객체를
반환합니다.
@ -500,7 +508,7 @@ let installed = BrowserWindow.getDevToolsExtensions().hasOwnProperty('devtron')
**참고:** 이 API는 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 없습니다.
## Instance Properties
### Instance Properties
`new BrowserWindow`로 생성한 객체는 다음과 같은 속성을 가지고 있습니다:
@ -509,7 +517,7 @@ let installed = BrowserWindow.getDevToolsExtensions().hasOwnProperty('devtron')
let win = new BrowserWindow({width: 800, height: 600});
```
### `win.webContents`
#### `win.webContents`
윈도우의 `WebContents` 객체입니다. 모든 웹 페이지와 관련된 이벤트와 작업이 이 객체를
통해 수행됩니다.
@ -517,97 +525,101 @@ let win = new BrowserWindow({width: 800, height: 600});
메서드나 이벤트에 대한 자세한 내용은 [`webContents` 문서](web-contents.md)를
참고하세요.
### `win.id`
#### `win.id`
윈도우의 유일 ID입니다.
## Instance Methods
### Instance Methods
`new BrowserWindow`로 생성한 객체는 다음과 같은 메서드들을 가지고 있습니다:
**참고:** 몇몇 메서드들은 라벨에서 특정한 운영체제 시스템에서만 작동합니다.
### `win.destroy()`
#### `win.destroy()`
윈도우를 강제로 닫습니다. 웹 페이지의 `unload``beforeunload` 이벤트는 일어나지
않습니다. 또한 이 윈도우의 `close`도 일어나지 않습니다. 하지만 `closed` 이벤트는
반드시 발생함을 보장합니다.
### `win.close()`
#### `win.close()`
윈도우의 종료를 시도합니다. 이 메서드는 사용자가 윈도우의 닫기 버튼을 클릭했을 때와
같은 효과를 냅니다. 웹 페이지는 로드가 취소되고 종료됩니다. 자세한 내용은
[close 이벤트](#event-close)를 참고하세요.
### `win.focus()`
#### `win.focus()`
윈도우에 포커스를 맞춥니다.
### `win.blur()`
#### `win.blur()`
윈도우의 포커스를 없앱니다.
### `win.isFocused()`
#### `win.isFocused()`
윈도우가 포커스되었는지 여부를 반환합니다.
### `win.show()`
#### `win.isDestroyed()`
윈도우가 소멸되었는지 여부를 반환합니다.
#### `win.show()`
윈도우를 표시하고 포커스합니다.
### `win.showInactive()`
#### `win.showInactive()`
윈도우를 표시만 하고 포커스하지 않습니다.
### `win.hide()`
#### `win.hide()`
윈도우를 숨깁니다.
### `win.isVisible()`
#### `win.isVisible()`
윈도우가 사용자에게 표시되고 있는지 여부를 반환합니다.
### `win.isModal()`
#### `win.isModal()`
현재 윈도우가 모달 윈도우인지 여부를 반환합니다.
### `win.maximize()`
#### `win.maximize()`
윈도우를 최대화 시킵니다.
### `win.unmaximize()`
#### `win.unmaximize()`
윈도우 최대화를 취소합니다.
### `win.isMaximized()`
#### `win.isMaximized()`
윈도우가 최대화 되어있는지 여부를 반환합니다.
### `win.minimize()`
#### `win.minimize()`
윈도우를 최소화 시킵니다. 어떤 플랫폼은 최소화된 윈도우가 Dock에 표시됩니다.
### `win.restore()`
#### `win.restore()`
최소화된 윈도우를 이전 상태로 되돌립니다.
### `win.isMinimized()`
#### `win.isMinimized()`
윈도우가 최소화되었는지 여부를 반환합니다.
### `win.setFullScreen(flag)`
#### `win.setFullScreen(flag)`
* `flag` Boolean
윈도우의 전체화면 상태를 지정합니다.
### `win.isFullScreen()`
#### `win.isFullScreen()`
윈도우가 전체화면 모드 상태인지 여부를 반환합니다.
### `win.setAspectRatio(aspectRatio[, extraSize])` _macOS_
#### `win.setAspectRatio(aspectRatio[, extraSize])` _macOS_
* `aspectRatio` 유지하려 하는 콘텐츠 뷰 일부의 종횡비
* `aspectRatio` Float - 유지하려 하는 콘텐츠 뷰 일부의 종횡비.
* `extraSize` Object (optional) - 종횡비를 유지하는 동안 포함되지 않을 엑스트라 크기.
* `width` Integer
* `height` Integer
@ -624,7 +636,7 @@ let win = new BrowserWindow({width: 800, height: 600});
크기는 관여하지 않습니다. 그저 전체 콘텐츠 뷰 내에 있는 모든 엑스트라 너비, 높이 영역이
합해집니다.
### `win.setBounds(options[, animate])`
#### `win.setBounds(options[, animate])`
* `options` Object
@ -637,11 +649,16 @@ let win = new BrowserWindow({width: 800, height: 600});
윈도우를 지정한 `width`, `height`, `x`, `y`로 크기 재조정 및 이동합니다.
### `win.getBounds()`
#### `win.getBounds()`
윈도우의 width, height, x, y 값을 가지는 객체를 반환합니다.
### `win.setSize(width, height[, animate])`
#### `win.getContentBounds()`
윈도우의 클라이언트 영역 (웹 페이지)의 너비, 높이, x, y 값을 포함하는 객체를
반환합니다.
#### `win.setSize(width, height[, animate])`
* `width` Integer
* `height` Integer
@ -649,11 +666,11 @@ let win = new BrowserWindow({width: 800, height: 600});
`width``height` 값으로 윈도우 크기를 재조정합니다. (너비, 높이)
### `win.getSize()`
#### `win.getSize()`
윈도우의 너비, 높이값을 가지는 배열을 반환합니다.
### `win.setContentSize(width, height[, animate])`
#### `win.setContentSize(width, height[, animate])`
* `width` Integer
* `height` Integer
@ -661,118 +678,118 @@ let win = new BrowserWindow({width: 800, height: 600});
윈도우 클라이언트 영역(웹 페이지)의 크기를 `width`, `height`로 재조정합니다.
### `win.getContentSize()`
#### `win.getContentSize()`
윈도우 클라이언트 영역의 너비, 높이 크기를 배열로 반환합니다.
### `win.setMinimumSize(width, height)`
#### `win.setMinimumSize(width, height)`
* `width` Integer
* `height` Integer
윈도우의 최소 `width`, `height` 크기를 지정합니다.
### `win.getMinimumSize()`
#### `win.getMinimumSize()`
윈도우의 최소 너비, 높이 크기를 배열로 반환합니다.
### `win.setMaximumSize(width, height)`
#### `win.setMaximumSize(width, height)`
* `width` Integer
* `height` Integer
윈도우의 최대 `width`, `height` 크기를 지정합니다.
### `win.getMaximumSize()`
#### `win.getMaximumSize()`
윈도우의 최대 너비, 높이 크기를 배열로 반환합니다.
### `win.setResizable(resizable)`
#### `win.setResizable(resizable)`
* `resizable` Boolean
사용자에 의해 윈도우의 크기가 재조정될 수 있는지를 지정합니다.
### `win.isResizable()`
#### `win.isResizable()`
사용자에 의해 윈도우의 크기가 재조정될 수 있는지 여부를 반환합니다.
### `win.setMovable(movable)` _macOS_ _Windows_
#### `win.setMovable(movable)` _macOS_ _Windows_
* `movable` Boolean
사용자에 의해 윈도우를 이동시킬 수 있는지 여부를 지정합니다. Linux에선 아무 일도
일어나지 않습니다.
### `win.isMovable()` _macOS_ _Windows_
#### `win.isMovable()` _macOS_ _Windows_
사용자에 의해 윈도우를 이동시킬 수 있는지 여부를 반환합니다. Linux에선 항상 `true`
반환합니다.
### `win.setMinimizable(minimizable)` _macOS_ _Windows_
#### `win.setMinimizable(minimizable)` _macOS_ _Windows_
* `minimizable` Boolean
사용자에 의해 윈도우를 최소화시킬 수 있는지 여부를 지정합니다. Linux에선 아무 일도
일어나지 않습니다.
### `win.isMinimizable()` _macOS_ _Windows_
#### `win.isMinimizable()` _macOS_ _Windows_
사용자에 의해 윈도우를 최소화시킬 수 있는지 여부를 반환합니다. Linux에선 항상 `true`
반환합니다.
### `win.setMaximizable(maximizable)` _macOS_ _Windows_
#### `win.setMaximizable(maximizable)` _macOS_ _Windows_
* `maximizable` Boolean
사용자에 의해 윈도우를 최대화시킬 수 있는지 여부를 지정합니다. Linux에선 아무 일도
일어나지 않습니다.
### `win.isMaximizable()` _macOS_ _Windows_
#### `win.isMaximizable()` _macOS_ _Windows_
사용자에 의해 윈도우를 최대화시킬 수 있는지 여부를 반환합니다. Linux에선 항상 `true`
반환합니다.
### `win.setFullScreenable(fullscreenable)`
#### `win.setFullScreenable(fullscreenable)`
* `fullscreenable` Boolean
최대화/줌 버튼이 전체화면 모드 또는 윈도우 최대화를 토글할 수 있게 할지 여부를
지정합니다.
### `win.isFullScreenable()`
#### `win.isFullScreenable()`
최대화/줌 버튼이 전체화면 모드 또는 윈도우 최대화를 토글할 수 있게 할지 여부를
반환합니다.
### `win.setClosable(closable)` _macOS_ _Windows_
#### `win.setClosable(closable)` _macOS_ _Windows_
* `closable` Boolean
사용자에 의해 윈도우가 수동적으로 닫힐 수 있는지 여부를 지정합니다. Linux에선 아무 일도
일어나지 않습니다.
### `win.isClosable()` _macOS_ _Windows_
#### `win.isClosable()` _macOS_ _Windows_
사용자에 의해 윈도우가 수동적으로 닫힐 수 있는지 여부를 반환합니다. Linux에선 항상
`true`를 반환합니다.
### `win.setAlwaysOnTop(flag)`
#### `win.setAlwaysOnTop(flag)`
* `flag` Boolean
윈도우가 언제나 다른 윈도우들 위에 표시되는지 여부를 지정합니다. 이 설정을 활성화 하면
윈도우는 포커스 될 수 없는 툴박스 윈도우가 아닌 일반 윈도우로 유지됩니다.
### `win.isAlwaysOnTop()`
#### `win.isAlwaysOnTop()`
윈도우가 언제나 다른 윈도우들 위에 표시되는지 여부를 반환합니다.
### `win.center()`
#### `win.center()`
윈도우를 화면 정 중앙으로 이동합니다.
### `win.setPosition(x, y[, animate])`
#### `win.setPosition(x, y[, animate])`
* `x` Integer
* `y` Integer
@ -780,23 +797,26 @@ let win = new BrowserWindow({width: 800, height: 600});
윈도우의 위치를 `x`, `y`로 이동합니다.
### `win.getPosition()`
#### `win.getPosition()`
윈도우의 위치를 배열로 반환합니다.
### `win.setTitle(title)`
#### `win.setTitle(title)`
* `title` String
`title`을 네이티브 윈도우의 제목으로 지정합니다.
### `win.getTitle()`
#### `win.getTitle()`
윈도우의 제목을 반환합니다.
**참고:** 웹 페이지의 제목과 네이티브 윈도우의 제목은 서로 다를 수 있습니다.
### `win.setSheetOffset(offsetY[, offsetX])` _macOS_
#### `win.setSheetOffset(offsetY[, offsetX])` _macOS_
* `offsetY` Float
* `offsetX` Float (optional)
macOS에서 시트를 부착할 위치를 지정합니다. 기본적으로 시트는 윈도우의 프레임 바로
아래의 위치에 부착됩니다. 아마도 이 기능은 보통 다음과 같이 HTML 렌더링된 툴바 밑에
@ -807,36 +827,36 @@ let toolbarRect = document.getElementById('toolbar').getBoundingClientRect();
win.setSheetOffset(toolbarRect.height);
```
### `win.flashFrame(flag)`
#### `win.flashFrame(flag)`
* `flag` Boolean
사용자가 윈도우에 관심을 가질 수 있도록 창을 깜빡이거나 이를 중지합니다.
### `win.setSkipTaskbar(skip)`
#### `win.setSkipTaskbar(skip)`
* `skip` Boolean
애플리케이션 아이콘을 작업표시줄에 보이지 않도록 설정합니다.
### `win.setKiosk(flag)`
#### `win.setKiosk(flag)`
* `flag` Boolean
Kiosk(키오스크) 모드를 설정합니다.
### `win.isKiosk()`
#### `win.isKiosk()`
현재 윈도우가 kiosk 모드인지 여부를 반환합니다.
### `win.getNativeWindowHandle()`
#### `win.getNativeWindowHandle()`
`Buffer` 상의 플랫폼에 따른 윈도우 핸들을 반환합니다.
핸들의 타입에 따라 적절히 캐스팅됩니다. Windows의 `HWND`, macOS의 `NSView*`, Linux의
`Window` (`unsigned long`)를 예로 들 수 있습니다.
### `win.hookWindowMessage(message, callback)` _Windows_
#### `win.hookWindowMessage(message, callback)` _Windows_
* `message` Integer
* `callback` Function
@ -844,68 +864,101 @@ Kiosk(키오스크) 모드를 설정합니다.
Windows 메시지 훅을 등록합니다. `callback`은 WndProc에서 메시지를 받았을 때
호출됩니다.
### `win.isWindowMessageHooked(message)` _Windows_
#### `win.isWindowMessageHooked(message)` _Windows_
* `message` Integer
지정한 메시지가 후킹됬는지 여부를 반환합니다.
### `win.unhookWindowMessage(message)` _Windows_
#### `win.unhookWindowMessage(message)` _Windows_
* `message` Integer
지정한 메시지 훅을 등록 해제합니다.
### `win.unhookAllWindowMessages()` _Windows_
#### `win.unhookAllWindowMessages()` _Windows_
모든 메시지 훅을 등록 해제합니다.
### `win.setRepresentedFilename(filename)` _macOS_
#### `win.setRepresentedFilename(filename)` _macOS_
* `filename` String
윈도우 대표 파일의 경로명을 설정합니다. 파일의 아이콘이 윈도우 타이틀 바에 표시됩니다.
### `win.getRepresentedFilename()` _macOS_
#### `win.getRepresentedFilename()` _macOS_
윈도우 대표 파일의 경로명을 반환합니다.
### `win.setDocumentEdited(edited)` _macOS_
#### `win.setDocumentEdited(edited)` _macOS_
* `edited` Boolean
윈도우의 문서가 변경되었는지 여부를 설정합니다. 그리고 `true`로 설정했을 때 타이틀 바의
아이콘이 회색으로 표시됩니다.
### `win.isDocumentEdited()` _macOS_
#### `win.isDocumentEdited()` _macOS_
윈도우의 문서가 변경되었는지 여부를 반환합니다.
### `win.focusOnWebView()`
#### `win.focusOnWebView()`
### `win.blurWebView()`
#### `win.blurWebView()`
### `win.capturePage([rect, ]callback)`
#### `win.capturePage([rect, ]callback)`
* `rect` Object (optional) - 캡쳐될 페이지의 영역
* `x` Integer
* `y` Integer
* `width` Integer
* `height` Integer
* `callback` Function
`webContents.capturePage([rect, ]callback)`와 같습니다.
### `win.loadURL(url[, options])`
#### `win.loadURL(url[, options])`
* `url` URL
* `options` Object (optional)
* `httpReferrer` String - HTTP 리퍼러 URL.
* `userAgent` String - 요청을 보낸 사용자의 user agent.
* `extraHeaders` String - "\n"로 구분된 부가적인 헤더
`webContents.loadURL(url[, options])` API와 같습니다.
### `win.reload()`
`url`은 원격 주소 (e.g. `http://`)가 되거나 `file://` 프로토콜을 사용하는 로컬 HTML
경로가 될 수 있습니다.
파일 URL이 올바른 형식으로 지정되었는지 확인하려면 Node의
[`url.format`](https://nodejs.org/api/url.html#url_url_format_urlobject) 메서드를
사용하는 것을 권장합니다.
```javascript
let url = require('url').format({
protocol: 'file',
slashes: true,
pathname: require('path').join(__dirname, 'index.html')
})
win.loadURL(url)
```
#### `win.reload()`
`webContents.reload` API와 같습니다.
### `win.setMenu(menu)` _Linux_ _Windows_
#### `win.setMenu(menu)` _Linux_ _Windows_
* `menu` Menu
지정한 `menu`를 윈도우의 메뉴로 설정합니다 `null`을 설정하면 메뉴를 제거합니다.
### `win.setProgressBar(progress)`
#### `win.setProgressBar(progress[, options])`
* `progress` Double
* `options` Object (optional)
* `mode` String _Windows_ - 프로그래스 막대의 모드 (`none`, `normal`,
`indeterminate`, `error`, `paused`)
작업표시줄에 표시되고 있는 애플리케이션 아이콘에 진행 상태를 표시합니다. [0, 1.0]
사이의 값을 지정할 수 있습니다.
@ -917,7 +970,12 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
`*.desktop` 파일을 생성한 후 `package.json``desktopName` 필드에 파일 이름을
지정해야 합니다. 기본적으로 `app.getName().desktop`을 통해 접근합니다.
### `win.setOverlayIcon(overlay, description)` _Windows 7+_
Windows에선 모드를 전달할 수 있습니다. 사용할 수 있는 값은 `none`, `normal`,
`indeterminate`, `error`, 그리고 `paused`가 있습니다. 만약 모드 설정 없이
`setProgressBar`를 호출하면 (올바른 범위의 값을 전달했을 때), `normal`이 기본적으로
설정됩니다.
#### `win.setOverlayIcon(overlay, description)` _Windows_
* `overlay` [NativeImage](native-image.md) - 작업표시줄 아이콘의 우측 하단에 표시될
아이콘입니다. `null`로 지정하면 빈 오버레이가 사용됩니다
@ -926,19 +984,19 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
현재 작업표시줄 아이콘에 16 x 16 픽셀 크기의 오버레이를 지정합니다. 보통 이 기능은
애플리케이션의 여러 상태를 사용자에게 소극적으로 알리기 위한 방법으로 사용됩니다.
### `win.setHasShadow(hasShadow)` _macOS_
#### `win.setHasShadow(hasShadow)` _macOS_
* `hasShadow` Boolean
윈도우가 그림자를 가질지 여부를 지정합니다. Windows와 Linux에선 아무 일도 일어나지
않습니다.
### `win.hasShadow()` _macOS_
#### `win.hasShadow()` _macOS_
윈도우가 그림자를 가지고 있는지 여부를 반환합니다. Windows와 Linux에선 항상 `true`
반환합니다.
### `win.setThumbarButtons(buttons)` _Windows 7+_
#### `win.setThumbarButtons(buttons)` _Windows_
* `buttons` - Array
@ -968,17 +1026,35 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
눌려지지 않은 상태를 유지합니다. 이 값은 버튼을 알림의 용도로 사용하기 위해
만들어졌습니다.
### `win.showDefinitionForSelection()` _macOS_
#### `win.setThumbnailClip(region)` _Windows_
* `region` Object - Region of the window
* `x` Integer - 영역의 x 위치
* `y` Integer - 영역의 y 위치
* `width` Integer - 영역의 너비
* `height` Integer - 영역의 높이
작업 표시줄에 윈도우의 섬네일이 표시될 때 섬네일 이미지로 사용할 윈도우의 영역을
지정합니다. 빈 영역을 지정하는 것으로 전체 윈도우의 섬네일로 초기화할 수 있습니다:
`{x: 0, y: 0, width: 0, height: 0}`.
#### `win.setThumbnailToolTip(toolTip)` _Windows_
* `toolTip` String
작업 표시줄의 윈도우 섬네일 위에 표시될 툴팁을 설정합니다.
#### `win.showDefinitionForSelection()` _macOS_
`webContents.showDefinitionForSelection()`와 같습니다.
### `win.setIcon(icon)` _Windows_ _Linux_
#### `win.setIcon(icon)` _Windows_ _Linux_
* `icon` [NativeImage](native-image.md)
윈도우 아이콘을 변경합니다.
### `win.setAutoHideMenuBar(hide)`
#### `win.setAutoHideMenuBar(hide)`
* `hide` Boolean
@ -988,11 +1064,11 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
메뉴 막대가 이미 표시되고 있을 때 `setAutoHideMenuBar(true)`를 호출한다고 해서
메뉴가 즉시 숨겨지지는 않습니다.
### `win.isMenuBarAutoHide()`
#### `win.isMenuBarAutoHide()`
메뉴 막대 자동 숨김 상태인지 여부를 반환합니다.
### `win.setMenuBarVisibility(visible)`
#### `win.setMenuBarVisibility(visible)`
* `visible` Boolean
@ -1002,11 +1078,11 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
**역자주:** 기본 메뉴 막대를 완전히 없애려면 `win.setMenu(null)`를 호출해야 합니다.
단순히 이 API를 사용하면 여전히 메뉴에 등록된 핫 키가 작동합니다.
### `win.isMenuBarVisible()`
#### `win.isMenuBarVisible()`
메뉴 막대가 표시되고 있는지 여부를 반환합니다.
### `win.setVisibleOnAllWorkspaces(visible)`
#### `win.setVisibleOnAllWorkspaces(visible)`
* `visible` Boolean
@ -1014,13 +1090,13 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
**참고:** 이 API는 Windows에서 아무 일도 하지 않습니다.
### `win.isVisibleOnAllWorkspaces()`
#### `win.isVisibleOnAllWorkspaces()`
윈도우가 모든 워크스페이스에서 표시될지 여부를 반환합니다.
**참고:** 이 API는 Windows에서 언제나 false를 반환합니다.
### `win.setIgnoreMouseEvents(ignore)`
#### `win.setIgnoreMouseEvents(ignore)`
* `ignore` Boolean
@ -1029,31 +1105,33 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
이 윈도우에서 일어나는 모든 마우스 이벤트가 이 윈도우 밑의 윈도우로 전달됩니다. 하지만
이 윈도우가 포커스되어 있다면, 여전히 키보드 이벤트는 받을 수 있습니다.
### `win.setContentProtection(enable)` _macOS_ _Windows_
#### `win.setContentProtection(enable)` _macOS_ _Windows_
* `enable` Boolean
윈도우 콘텐츠가 외부 어플리케이션에 의해 캡쳐되는 것을 막습니다.
macOS에선 NSWindow의 sharingType을 NSWindowSharingNone로 설정합니다.
Windows에선 WDA_MONITOR와 함께 SetWindowDisplayAffinity를 호출합니다.
Windows에선 `WDA_MONITOR`와 함께 SetWindowDisplayAffinity를 호출합니다.
### `win.setFocusable(focusable)` _Windows_
#### `win.setFocusable(focusable)` _Windows_
* `focusable` Boolean
윈도우가 포커스될 수 있는지 여부를 변경합니다.
### `win.setParentWindow(parent)` _Linux_ _macOS_
#### `win.setParentWindow(parent)` _Linux_ _macOS_
* `parent` BrowserWindow
`parent` 인수를 현재 윈도우의 부모 윈도우로 설정합니다. `null`로 설정하면
현재 윈도우를 상위 윈도우로 전환합니다.
### `win.getParentWindow()`
#### `win.getParentWindow()`
모든 부모 윈도우를 반환합니다.
### `win.getChildWindows()`
#### `win.getChildWindows()`
모든 자식 윈도우를 반환합니다.

View file

@ -1,14 +1,17 @@
# desktopCapturer
> 마이크, 카메라 또는 화면에서 오디오, 비디오 그리고 이미지를 캡쳐하기 위한
`getUserMedia` 소스를 나열합니다.
> 멀티미디어 소스에 대해 접근하고 [`navigator.webkitGetUserMedia`] API를 통해
> 오디오나 비디오를 데스크톱으로부터 캡쳐할 수 있도록 합니다.
다음 예시는 창 제목이 `Electron`인 데스크톱 창에 대해 비디오 캡쳐하는 방법을
보여줍니다.
```javascript
// 렌더러 프로세스 내부
const {desktopCapturer} = require('electron');
// 렌더러 프로세스에서.
const {desktopCapturer} = require('electron')
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
if (error) throw error;
if (error) throw error
for (let i = 0; i < sources.length; ++i) {
if (sources[i].name === 'Electron') {
navigator.webkitGetUserMedia({
@ -23,29 +26,29 @@ desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
maxHeight: 720
}
}
}, gotStream, getUserMediaError);
return;
}, handleStream, handleError)
return
}
}
});
})
function gotStream(stream) {
document.querySelector('video').src = URL.createObjectURL(stream);
function handleStream (stream) {
document.querySelector('video').src = URL.createObjectURL(stream)
}
function getUserMediaError(e) {
console.log('getUserMediaError');
function handleError (e) {
console.log(e)
}
```
`navigator.webkitGetUserMedia` 호출에 대해 제약된 객체를 생성할 때
`desktopCapturer`에서 소스를 사용한다면 `chromeMediaSource`은 반드시
`"desktop"`으로 지정되어야 하며, `audio` 도 반드시 `false`로 지정되어야 합니다.
만약 전체 데스크탑에서 오디오와 비디오 모두 캡쳐를 하고 싶을 땐 `chromeMediaSource`
`"screen"` 그리고 `audio``true`로 지정할 수 있습니다. 이 방법을 사용하면
`chromeMediaSourceId`를 지정할 수 없습니다.
`desktopCapturer`로부터 제공된 소스로부터 비디오 캡쳐를 하려면
[`navigator.webkitGetUserMedia`]로 전달되는 속성에 `chromeMediaSource: 'desktop'`,
`audio: false` 가 반드시 포함되어야 합니다.
전체 데스크톱의 오디오와 비디오를 모두 캡쳐하려면 [`navigator.webkitGetUserMedia`]로
전달되는 속성에 `chromeMediaSource: 'screen'`, 와 `audio: true` 가 반드시
포함되어야 하지만 `chromeMediaSourceId` 속성은 포함되어선 안됩니다.
## Methods
@ -54,25 +57,26 @@ function getUserMediaError(e) {
### `desktopCapturer.getSources(options, callback)`
* `options` Object
* `types` Array - 캡쳐될 데스크탑 소스의 타입에 대한 리스트를 배열로 지정합니다.
사용 가능한 타입은 `screen``window`니다.
* `thumbnailSize` Object (optional) - 섬네일 크기를 조정할 때 최대한 맞춰질 크기,
기본값은 `{width: 150, height: 150}`입니다.
* `types` Array - 캡쳐될 데스크톱 소스의 종류를 나열하는 문자열을 담은 배열, 종류는
`screen` 또는 `window`가 될 수 있습니다.
* `thumbnailSize` Object (optional) - 미디어 소스 섬네일의 크기가 맞춰져야 할
제안된 크기, 기본값은 `{width: 150, height: 150}`입니다.
* `callback` Function
모든 데스크탑 소스를 요청합니다. 요청의 처리가 완료되면 `callback`
`callback(error, sources)` 형식으로 호출됩니다.
사용할 수 있는 데스크톱 미디어 소스를 가져오기 시작하고 작업이 완료되면
`callback(error, sources)` 호출됩니다.
`sources``Source` 객체의 배열입니다. 각 `Source`는 캡쳐된 화면과 독립적인
`sources``Source`객체의 배열이며, 각 `Source`는 캡쳐될 수 있는 스크린과 각기
윈도우를 표현합니다. 그리고 다음과 같은 속성을 가지고 있습니다:
* `id` String - `navigator.webkitGetUserMedia` API에서 사용할 수 있는 캡쳐된 윈도우
또는 화면의 id입니다. 포맷은 `window:XX` 또는 `screen:XX`로 표현되며 `XX`
무작위로 생성된 숫자입니다.
* `name` String - 캡쳐된 화면과 윈도우에 대해 묘사된 이름입니다. 만약 소스가
화면이라면, `Entire Screen` 또는 `Screen <index>`가 될 것이고 소스가 윈도우라면,
해당 윈도우의 제목이 반환됩니다.
* `thumbnail` [NativeImage](native-image.md) - 섬네일 네이티브 이미지.
* `id` String - 윈도우 또는 스크린의 식별자로써 [`navigator.webkitGetUserMedia`]를
호출할 때 `chromeMediaSourceId` 속성에 사용될 수 있습니다. 식별자의 형식은
`window:XX` 또는 `screen:XX` 이며 `XX` 부분은 무작위로 생성된 숫자입니다.
* `name` String - `Entire Screen` 또는 `Screen <index>`로 이름지어질 스크린
소스이며, 이는 윈도우 제목에 일치하는 윈도우 소스의 이름이 됩니다.
* `thumbnail` [NativeImage](native-image.md) - 섬네일 이미지입니다. **참고:**
`desktopCapturer.getSources`로 전달된 `options` 객체의 `thumnbailSize` 속성과
같이 이 섬네일의 사이즈가 완전히 같을 것이라고 보장하지 않습니다. 실질적인 크기는
스크린과 윈도우의 비율에 따라 달라질 수 있습니다.
**참고:** `source.thumbnail`의 크기는 언제나 `options``thumnbailSize`와 같다고
보장할 수 없습니다. 섬네일의 크기는 화면과 윈도우의 크기에 의존하여 조정됩니다.
[`navigator.webkitGetUserMedia`]: https://developer.mozilla.org/en/docs/Web/API/Navigator/getUserMedia

View file

@ -127,6 +127,9 @@ macOS 또는 Windows에서 "확인", "취소"와 같은 순서로 버튼을 지
### `dialog.showErrorBox(title, content)`
* `title` String - 오류 상자에서 표시할 제목
* `content` String - 오류 상자에서 표시할 텍스트
에러 메시지를 보여주는 대화 상자를 표시합니다.
이 함수는 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 있습니다. 이 메서드는

View file

@ -78,6 +78,12 @@ Returns:
통해 아무 경로도 설정하지 않을 경우 Electron은 기본 루틴 파일 저장을 실행합니다.
(파일 대화 상자를 엽니다)
### `downloadItem.getSavePath()`
다운로드 아이템의 저장 경로를 반환합니다. 이 경로는
`downloadItem.setSavePath(path)`로 설정된 경로나 나타난 저장 대화상자에서 선택한
경로 중 하나가 될 수 있습니다.
### `downloadItem.pause()`
다운로드를 일시 중지합니다.

View file

@ -23,8 +23,9 @@ API를 사용하여 작업할 때 선택된 파일의 경로를 알 수 있도
};
holder.ondrop = (e) => {
e.preventDefault();
const file = e.dataTransfer.files[0];
console.log('File you dragged here is', file.path);
for (let f of e.dataTransfer.files) {
console.log('File(s) you dragged here: ', f.path);
}
return false;
};
</script>

View file

@ -19,7 +19,7 @@ let win = new BrowserWindow({width: 800, height: 600, frame: false})
### 최신 macOS에서 사용할 수 있는 대안
macOS 10.10 Yosemite 이후의 최신 버전부터는 테두리가 없는 창을 만들 때 새로운 방법을
macOS 10.9 Mavericks 이후의 최신 버전부터는 테두리가 없는 창을 만들 때 새로운 방법을
사용할 수 있습니다. `frame` 옵션을 `false`로 지정하여 제목과 창 구성 요소를 모두
비활성화하는 대신 새로운 `titleBarStyle` 옵션을 통해 제목만 숨기고 창 구성 요소
("신호등 버튼")의 기능과 창 크기를 그대로 유지할 수 있습니다:

View file

@ -8,7 +8,7 @@
`MenuItem` 인스턴스 객체에서 사용할 수 있는 메서드입니다:
### new MenuItem(options)
### `new MenuItem(options)`
* `options` Object
* `click` Function - 메뉴 아이템이 클릭될 때 `click(menuItem, browserWindow,
@ -52,10 +52,13 @@
* `pasteandmatchstyle`
* `selectall`
* `delete`
* `minimize` - 현재 윈도우를 최소화합니다
* `close` - 현재 윈도우를 닫습니다
* `quit`- 애플리케이션을 닫습니다
* `togglefullscreen` - 현재 윈도우에서 전체 화면 모드를 토글합니다
* `minimize` - 현재 윈도우를 최소화합니다.
* `close` - 현재 윈도우를 닫습니다.
* `quit`- 애플리케이션을 닫습니다.
* `togglefullscreen` - 현재 윈도우에서 전체 화면 모드를 토글합니다.
* `resetzoom` - 포커스된 페이지의 줌 레벨을 기본 크기로 초기화합니다.
* `zoomin` - 포커스된 페이지를 10% 줌인합니다.
* `zoomout` - 포커스된 페이지를 10% 줌아웃합니다.
macOS에서의 `role`은 다음 값을 추가로 가질 수 있습니다:
@ -63,6 +66,8 @@ macOS에서의 `role`은 다음 값을 추가로 가질 수 있습니다:
* `hide` - `hide` 액션에 대응
* `hideothers` - `hideOtherApplications` 액션에 대응
* `unhide` - `unhideAllApplications` 액션에 대응
* `startspeaking` - `startSpeaking` 액션에 대응
* `stopspeaking` - `stopSpeaking` 액션에 대응
* `front` - `arrangeInFront` 액션에 대응
* `zoom` - `performZoom` 액션에 대응
* `window` - 부 메뉴를 가지는 "Window" 메뉴

View file

@ -2,37 +2,20 @@
> 네이티브 애플리케이션 메뉴와 컨텍스트 메뉴를 생성합니다.
이 모듈은 메인 프로세스용 모듈이지만 `remote` 모듈을 통해 렌더러 프로세스에서도 사용할
수 있습니다.
각 메뉴는 여러 개의 [메뉴 아이템](menu-item.md)으로 구성되고 서브 메뉴를 가질 수도 있습니다.
다음 예시는 웹 페이지 내에서 [remote](remote.md) 모듈을 활용하여 동적으로 메뉴를
생성하는 예시입니다. 그리고 유저가 페이지에서 오른쪽 클릭을 할 때마다 마우스 위치에
팝업 형태로 메뉴를 표시합니다:
## 예시
```html
<!-- index.html -->
<script>
const {remote} = require('electron');
const {Menu, MenuItem} = remote;
`Menu` 클래스는 메인 프로세스에서만 사용할 수 있지만, [`remote`](remote.md) 모듈을
통해 랜더러 프로세스에서도 사용할 수 있습니다.
const menu = new Menu();
menu.append(new MenuItem({label: 'MenuItem1', click() { console.log('item 1 clicked'); }}));
menu.append(new MenuItem({type: 'separator'}));
menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}));
### 메인 프로세스
window.addEventListener('contextmenu', (e) => {
e.preventDefault();
menu.popup(remote.getCurrentWindow());
}, false);
</script>
```
또 하나의 예를 들자면 다음 예시는 렌더러 프로세스에서 template API를 사용하여
애플리케이션 메뉴를 만듭니다:
다음은 템플릿 API를 사용하여 메인 프로세스에서 어플리케이션 메뉴를 생성하는 예시입니다:
```javascript
const {Menu} = require('electron')
const template = [
{
label: 'Edit',
@ -63,7 +46,7 @@ const template = [
},
{
role: 'selectall'
},
}
]
},
{
@ -72,21 +55,35 @@ const template = [
{
label: 'Reload',
accelerator: 'CmdOrCtrl+R',
click(item, focusedWindow) {
if (focusedWindow) focusedWindow.reload();
click (item, focusedWindow) {
if (focusedWindow) focusedWindow.reload()
}
},
{
role: 'togglefullscreen'
},
{
label: 'Toggle Developer Tools',
accelerator: process.platform === 'darwin' ? 'Alt+Command+I' : 'Ctrl+Shift+I',
click(item, focusedWindow) {
if (focusedWindow)
focusedWindow.webContents.toggleDevTools();
click (item, focusedWindow) {
if (focusedWindow) focusedWindow.webContents.toggleDevTools()
}
},
{
type: 'separator'
},
{
role: 'resetzoom'
},
{
role: 'zoomin'
},
{
role: 'zoomout'
},
{
type: 'separator'
},
{
role: 'togglefullscreen'
}
]
},
{
@ -97,7 +94,7 @@ const template = [
},
{
role: 'close'
},
}
]
},
{
@ -105,14 +102,14 @@ const template = [
submenu: [
{
label: 'Learn More',
click() { require('electron').shell.openExternal('http://electron.atom.io'); }
},
click () { require('electron').shell.openExternal('http://electron.atom.io') }
}
]
},
];
}
]
if (process.platform === 'darwin') {
const name = require('electron').remote.app.getName();
const name = require('electron').remote.app.getName()
template.unshift({
label: name,
submenu: [
@ -143,9 +140,26 @@ if (process.platform === 'darwin') {
},
{
role: 'quit'
},
}
]
});
})
// Edit menu.
template[1].submenu.push(
{
type: 'separator'
},
{
label: 'Speech',
submenu: [
{
role: 'startspeaking'
},
{
role: 'stopspeaking'
}
]
}
)
// Window menu.
template[3].submenu = [
{
@ -169,11 +183,34 @@ if (process.platform === 'darwin') {
label: 'Bring All to Front',
role: 'front'
}
];
]
}
const menu = Menu.buildFromTemplate(template);
Menu.setApplicationMenu(menu);
const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)
```
### 렌더러 프로세스
밑은 [`remote`](remote.md) 모듈을 사용하여 동적으로 웹 페이지 (렌더러 프로세스)에서
메뉴를 직접적으로 생성하는 예시이며 오른쪽 클릭을 했을 때 메뉴를 표시합니다.
```html
<!-- index.html -->
<script>
const {remote} = require('electron')
const {Menu, MenuItem} = remote
const menu = new Menu()
menu.append(new MenuItem({label: 'MenuItem1', click() { console.log('item 1 clicked') }}))
menu.append(new MenuItem({type: 'separator'}))
menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}))
window.addEventListener('contextmenu', (e) => {
e.preventDefault()
menu.popup(remote.getCurrentWindow())
}, false)
</script>
```
## Class: Menu
@ -182,11 +219,11 @@ Menu.setApplicationMenu(menu);
새로운 메뉴를 생성합니다.
## Methods
## Static Methods
`menu` 클래스는 다음과 같은 메서드를 가지고 있습니다:
`menu` 클래스는 다음과 같은 정적 메서드를 가지고 있습니다:
### `Menu.setApplicationMenu(menu)`
#### `Menu.setApplicationMenu(menu)`
* `menu` Menu
@ -195,12 +232,12 @@ Linux에선 각 창의 상단에 표시됩니다.
**참고** 이 API는 `app``ready` 이벤트가 발생한 이후에 호출해야 합니다.
### `Menu.getApplicationMenu()`
#### `Menu.getApplicationMenu()`
설정되어있는 어플리케이션 메뉴를 반환합니다. (`Menu`의 인스턴스) 만약 없다면 `null`
반환합니다.
### `Menu.sendActionToFirstResponder(action)` _macOS_
#### `Menu.sendActionToFirstResponder(action)` _macOS_
* `action` String
@ -211,7 +248,7 @@ macOS의 네이티브 액션에 대해 자세히 알아보려면
[macOS Cocoa Event Handling Guide](https://developer.apple.com/library/mac/documentation/Cocoa/Conceptual/EventOverview/EventArchitecture/EventArchitecture.html#//apple_ref/doc/uid/10000060i-CH3-SW7)
문서를 참고하세요.
### `Menu.buildFromTemplate(template)`
#### `Menu.buildFromTemplate(template)`
* `template` Array
@ -221,41 +258,39 @@ macOS의 네이티브 액션에 대해 자세히 알아보려면
또한 `template`에는 다른 속성도 추가할 수 있으며 메뉴가 만들어질 때 해당 메뉴 아이템의
프로퍼티로 변환됩니다.
## Instance Methods
### Instance Methods
`menu` 객체는 다음과 같은 인스턴스 메서드를 가지고 있습니다:
### `menu.popup([browserWindow, x, y, positioningItem])`
#### `menu.popup([browserWindow, x, y, positioningItem])`
* `browserWindow` BrowserWindow (optional) - 기본값은 `null`입니다.
* `x` Number (optional) - 기본값은 -1입니다.
* `y` Number (만약 `x`를 지정한 경우 **필수 항목**) - 기본값은 -1입니다.
* `browserWindow` BrowserWindow (optional) - 기본값은
`BrowserWindow.getFocusedWindow()`입니다.
* `x` Number (optional) - 기본값은 현재 마우스의 위치입니다.
* `y` Number (만약 `x`를 지정한 경우 **필수 항목**) - 기본값은 현재 마우스의 위치입니다.
* `positioningItem` Number (optional) _macOS_ - 메뉴 팝업 시 마우스 커서에 바로
위치시킬 메뉴 아이템의 인덱스. 기본값은 -1입니다.
메뉴를 `browserWindow` 내부 팝업으로 표시합니다. 옵션으로 메뉴를 표시할 `(x,y)`
좌표를 지정할 수 있습니다. 따로 좌표를 지정하지 않은 경우 마우스 커서 위치에 표시됩니다.
`positioningItem` 속성은 메뉴 팝업 시 마우스 커서에 바로 위치시킬 메뉴 아이템의
인덱스입니다. (macOS에서만 지원합니다)
메뉴를 `browserWindow` 내부 팝업으로 표시합니다.
### `menu.append(menuItem)`
#### `menu.append(menuItem)`
* `menuItem` MenuItem
메뉴의 리스트 끝에 `menuItem`을 삽입합니다.
### `menu.insert(pos, menuItem)`
#### `menu.insert(pos, menuItem)`
* `pos` Integer
* `menuItem` MenuItem
`pos` 위치에 `menuItem`을 삽입합니다.
## Instance Properties
### Instance Properties
`menu` 객체는 또한 다음과 같은 속성을 가지고 있습니다:
### `menu.items`
#### `menu.items`
메뉴가 가지고 있는 메뉴 아이템들의 배열입니다.

View file

@ -2,22 +2,22 @@
> PNG 또는 JPG 파일을 사용하여 트레이, 독, 애플리케이션 아이콘을 생성합니다.
Electron은 파일 경로 또는 `nativeImage` 인스턴스를 통해 이미지를 사용할 수 있는 API를
Electron은 파일 경로 또는 `NativeImage` 인스턴스를 통해 이미지를 사용할 수 있는 API를
가지고 있습니다. `null`을 전달할 경우 빈 이미지가 생성됩니다.
예를 들어 트레이 메뉴를 만들거나 윈도우의 아이콘을 설정할 때 다음과 같이 파일 경로를
전달하여 이미지를 사용할 수 있습니다:
```javascript
const appIcon = new Tray('/Users/somebody/images/icon.png');
let win = new BrowserWindow({icon: '/Users/somebody/images/window.png'});
const appIcon = new Tray('/Users/somebody/images/icon.png')
let win = new BrowserWindow({icon: '/Users/somebody/images/window.png'})
```
이 예시는 클립보드로부터 가져온 `nativeImage`로 트레이 메뉴를 생성합니다:
```javascript
const image = clipboard.readImage();
const appIcon = new Tray(image);
const image = clipboard.readImage()
const appIcon = new Tray(image)
```
## 지원하는 포맷
@ -26,17 +26,28 @@ const appIcon = new Tray(image);
손실 없는 이미지 압축과 투명도 지원을 위해 `PNG` 사용을 권장합니다.
Windows에서는 파일 경로로부터 `ICO` 포맷도 사용할 수 있으며, 가장 좋은 시각적 효과를
얻기 위해 최소한 아이콘에 다음 사이즈를 포함하는 것을 권장합니다:
얻기 위해 최소한 다음 사이즈를 포함하는 것을 권장합니다:
* 16x16
* 32x32
* 64x64
* 작은 아이콘
* 16x16 (100% DPI 스케일)
* 20x20 (125% DPI 스케일)
* 24x24 (150% DPI 스케일)
* 32x32 (200% DPI 스케일)
* 큰 아이콘
* 32x32 (100% DPI 스케일)
* 40x40 (125% DPI 스케일)
* 48x48 (150% DPI 스케일)
* 64x64 (200% DPI 스케일)
* 256x256
[이 글][icons]의 *Size requirements* 섹션을 확인하세요.
[icons]:https://msdn.microsoft.com/en-us/library/windows/desktop/dn742485(v=vs.85).aspx
## 고해상도 이미지
플랫폼이 high-DPI를 지원하는 경우 `@2x`와 같이 이미지의 파일명 뒤에 접미사를 추가하여
고해상도 이미지로 지정할 수 있습니다.
플랫폼이 Apple Retina 디스플레이와 같이 high-DPI를 지원하는 경우 `@2x`와 같이
이미지의 파일명 뒤에 접미사를 추가하는 것으로 고해상도 이미지를 지정할 수 있습니다.
예를 들어 `icon.png` 라는 기본 해상도의 이미지를 기준으로 크기를 두 배로 늘린 이미지를
`icon@2x.png` 처럼 지정하면 고해상도 이미지로 처리됩니다.
@ -54,7 +65,7 @@ images/
```javascript
let appIcon = new Tray('/Users/somebody/images/icon.png');
let appIcon = new Tray('/Users/somebody/images/icon.png')
```
지원하는 DPI 접미사는 다음과 같습니다:
@ -89,22 +100,22 @@ let appIcon = new Tray('/Users/somebody/images/icon.png');
## Methods
`nativeImage` 클래스는 다음과 같은 메서드를 가지고 있습니다:
`nativeImage` 모듈은 다음과 같은 메서드를 가지고 있으며, 모든 메서드는
`NativeImage` 클래스의 인스턴스를 반환합니다.
### `nativeImage.createEmpty()`
`nativeImage` 인스턴스를 만듭니다.
`NativeImage` 인스턴스를 만듭니다.
### `nativeImage.createFromPath(path)`
* `path` String
`path`로부터 이미지를 로드하여 새로운 `nativeImage` 인스턴스를 만듭니다.
`path`로부터 이미지를 로드하여 새로운 `NativeImage` 인스턴스를 만듭니다.
```javascript
const nativeImage = require('electron').nativeImage;
let image = nativeImage.createFromPath('/Users/somebody/images/icon.png');
const nativeImage = require('electron').nativeImage
let image = nativeImage.createFromPath('/Users/somebody/images/icon.png')
```
### `nativeImage.createFromBuffer(buffer[, scaleFactor])`
@ -112,34 +123,50 @@ let image = nativeImage.createFromPath('/Users/somebody/images/icon.png');
* `buffer` [Buffer][buffer]
* `scaleFactor` Double (optional)
`buffer`로부터 이미지를 로드하여 새로운 `nativeImage` 인스턴스를 만듭니다.
`buffer`로부터 이미지를 로드하여 새로운 `NativeImage` 인스턴스를 만듭니다.
`scaleFactor`의 기본값은 1.0 입니다.
### `nativeImage.createFromDataURL(dataURL)`
* `dataURL` String
`dataURL`로부터 이미지를 로드하여 새로운 `nativeImage` 인스턴스를 만듭니다.
`dataURL`로부터 이미지를 로드하여 새로운 `NativeImage` 인스턴스를 만듭니다.
## Instance Methods
## Class: NativeImage
`nativeImage` 인스턴스 객체에서 사용할 수 있는 메서드입니다.
네이티브로 랩핑된 트레이, dock, 애플리케이션 아이콘을 위한 이미지입니다.
### `image.toPNG()`
### Instance Methods
`NativeImage` 클래스 인스턴스 객체에서 사용할 수 있는 메서드입니다.
#### `image.toPNG()`
`PNG` 이미지를 인코딩한 데이터를 [Buffer][buffer]로 반환합니다.
### `image.toJPEG(quality)`
#### `image.toJPEG(quality)`
* `quality` Integer (**required**) 0 - 100 사이의 값
`JPEG` 이미지를 인코딩한 데이터를 [Buffer][buffer]로 반환합니다.
### `image.toDataURL()`
##### `image.toBitmap()`
이미지의 raw 비트맵 픽셀 데이터를 가지는 [Buffer][buffer]의 복사본을 반환합니다.
#### `image.toDataURL()`
이미지를 data URL로 반환합니다.
### `image.getNativeHandle()` _macOS_
#### `image.getBitmap()`
이미지의 raw 비트맵 픽셀 데이터를 가지는 [Buffer][buffer]를 반환합니다.
`getBitmap()``toBitmap()`의 차이는 `getBitmap()`은 비트맵 데이터를 복사하지
않습니다. 그래서 버퍼를 현재 이벤트 루프 틱에 바로 반환해야 할 경우 유용하게 사용할 수
있습니다. 그렇지 않은 경우 데이터가 변경되거나 소멸될 수 있습니다.
#### `image.getNativeHandle()` _macOS_
이미지의 네이티브 핸들 밑에 있는 C 포인터를 담은 [Buffer][buffer]을 반환합니다.
macOS에선, `NSImage` 인스턴스가 반환됩니다.
@ -148,21 +175,21 @@ macOS에선, `NSImage` 인스턴스가 반환됩니다.
따라서 반드시 관련된 `nativeImage` 인스턴스가 확실하게 유지되고 있는지를 인지해야
합니다.
### `image.isEmpty()`
#### `image.isEmpty()`
이미지가 비었는지 확인합니다.
### `image.getSize()`
#### `image.getSize()`
이미지의 사이즈를 반환합니다.
### `image.setTemplateImage(option)`
#### `image.setTemplateImage(option)`
* `option` Boolean
해당 이미지를 템플릿 이미지로 설정합니다.
### `image.isTemplateImage()`
#### `image.isTemplateImage()`
이미지가 템플릿 이미지인지 확인합니다.

View file

@ -23,7 +23,7 @@ powerSaveBlocker.stop(id);
* `prevent-app-suspension` - 저전력 모드 등으로 인한 애플리케이션 작동 중단을
방지합니다. 시스템을 항시 활성화 상태로 만듭니다. 하지만 화면은 자동으로 꺼질 수
있습니다. 사용 예시: 파일 다운로드, 음악 재생 등.
* `prevent-display-sleep`- 슬립 모드 등으로 인한 애플리케이션의 작동 중단을
* `prevent-display-sleep` - 슬립 모드 등으로 인한 애플리케이션의 작동 중단을
방지합니다. 시스템을 항시 활성화 상태로 만들고 슬립 모드(화면 꺼짐)를 방지합니다.
사용 예시: 비디오 재생 등.

View file

@ -28,98 +28,39 @@ process.once('loaded', () => {
### `process.noAsar`
Setting this to `true` can disable the support for `asar` archives in Node's
built-in modules.
이 속성을 `true`로 지정하면 Node 빌트인 모듈의 `asar` 아카이브 지원을 비활성화 시킬
수 있습니다.
### `process.type`
Current process's type, can be `"browser"` (i.e. main process) or `"renderer"`.
현재 프로세스의 종류입니다. `"browser"` (메인 프로세스) 또는 `"renderer"`가 될 수
있습니다.
### `process.versions.electron`
Electron's version string.
Electron의 버전 문자열입니다.
### `process.versions.chrome`
Chrome's version string.
Chrome의 버전 문자열입니다.
### `process.resourcesPath`
Path to the resources directory.
리소스 디렉토리의 경로입니다.
### `process.mas`
For Mac App Store build, this property is `true`, for other builds it is
`undefined`.
Mac App Store 빌드에선 이 속성이 `true`가 됩니다. 다른 빌드에선 `undefined`가 됩니다.
### `process.windowsStore`
If the app is running as a Windows Store app (appx), this property is `true`,
for otherwise it is `undefined`.
애플리케이션이 Windows Store 앱 (appx) 형태로 작동하고 있을 경우 이 속성이 `true`
됩니다. 그렇지 않은 경우 `undefined`가 됩니다.
### `process.defaultApp`
When app is started by being passed as parameter to the default app, this
property is `true` in the main process, otherwise it is `undefined`.
## Methods
The `process` object has the following method:
### `process.crash()`
Causes the main thread of the current process crash.
### `process.hang()`
Causes the main thread of the current process hang.
### `process.setFdLimit(maxDescriptors)` _macOS_ _Linux_
* `maxDescriptors` Integer
Sets the file descriptor soft limit to `maxDescriptors` or the OS hard
limit, whichever is lower for the current process.
### `process.getProcessMemoryInfo()`
Returns an object giving memory usage statistics about the current process. Note
that all statistics are reported in Kilobytes.
* `workingSetSize` - The amount of memory currently pinned to actual physical
RAM.
* `peakWorkingSetSize` - The maximum amount of memory that has ever been pinned
to actual physical RAM.
* `privateBytes` - The amount of memory not shared by other processes, such as
JS heap or HTML content.
* `sharedBytes` - The amount of memory shared between processes, typically
memory consumed by the Electron code itself
### `process.getSystemMemoryInfo()`
Returns an object giving memory usage statistics about the entire system. Note
that all statistics are reported in Kilobytes.
* `total` - The total amount of physical memory in Kilobytes available to the
system.
* `free` - The total amount of memory not being used by applications or disk
cache.
On Windows / Linux:
* `swapTotal` - The total amount of swap memory in Kilobytes available to the
system.
* `swapFree` - The free amount of swap memory in Kilobytes available to the
system.
----------------------------------------
## Properties
### `process.noAsar`
이 속성을 `true`로 지정하면 Node 빌트인 모듈의 `asar` 아카이브 지원을 비활성화 시킬
수 있습니다.
애플리케이션이 기본 어플리케이션 형식으로 전달되는 인수와 함께 실행됐을 때, 메인
프로세스에서 이 속성이 `true`가 되며 다른 경우엔 `undefined`가 됩니다.
## Methods
@ -131,11 +72,36 @@ On Windows / Linux:
### `process.hang()`
현재 프로세스의 스레드를 중단시킵니다.
현재 프로세스의 메인 스레드를 중단시킵니다.
### `process.setFdLimit(maxDescriptors)` _macOS_ _Linux_
* `maxDescriptors` Integer
현재 프로세스 파일 디스크립터의 제한 값을 소프트 제한 `maxDescriptors`의 값이나 OS 하드
제한 중 낮은 값으로 설정합니다.
현재 프로세스 파일 디스크립터의 제한 값을 소프트 제한 `maxDescriptors`의 값이나 OS
하드 제한 중 낮은 값으로 설정합니다.
### `process.getProcessMemoryInfo()`
현재 프로세스의 메모리 사용량에 대한 정보를 객체 형태로 반환합니다. 참고로 모든 사용량은
킬로바이트로 표기됩니다.
* `workingSetSize` Integer - 현재 실제 물리적 RAM에 예약된 메모리의 양.
* `peakWorkingSetSize` Integer - 물리적 RAM에 예약된 메모리의 최대 사용량.
* `privateBytes` Integer - 다른 프로세스에 공유되지 않은 JS 힙 또는 HTML 콘텐츠와
같은 메모리의 양.
* `sharedBytes` Integer - 다른 프로세스와 공유된, 일반적으로 Electron 코드 자체에서
사용하는 메모리의 양.
### `process.getSystemMemoryInfo()`
전체 시스템의 메모리 사용량에 대한 정보를 객체 형태로 반환합니다. 참고로 모든 사용량은
킬로바이트로 표기됩니다.
* `total` Integer - 시스템에서 사용할 수 있는 킬로바이트 단위의 전체 물리적 메모리의
양.
* `free` Integer - 애플리케이션이나 디스크 캐시로 사용되지 않은 메모리의 양.
* `swapTotal` Integer - 시스템에서 사용할 수 있는 킬로바이트 단위의 스왑 메모리
전체 양. _Windows_ _Linux_
* `swapFree` Integer - 시스템에서 사용할 수 있는 킬로 바이트 단위의 사용되지 않은
스왑 메모리의 양. _Windows_ _Linux_

View file

@ -48,8 +48,10 @@ app.on('ready', () => {
</body>
```
따라서 커스텀 프로토콜을 등록하여 `http` 프로토콜을 덮어 쓰려면, 표준 스킴으로
등록해야만 합니다:
표준 스킴으로 등록하는 것은 [파일 시스템 API][file-system-api]를 통해 파일에 접근하는
것을 허용할 것입니다. 그렇지 않은 경우 렌더러는 해당 스킴에 대해 보안 에러를 throw할
것입니다. 일반적인 경우 `http` 프로토콜을 대체하는 커스텀 프로토콜을 등록하고 싶다면,
표준 스킴으로 등록해야 합니다:
```javascript
protocol.registerStandardSchemes(['atom']);
@ -220,3 +222,4 @@ POST 요청에는 반드시 `uploadData` 객체가 제공되어야 합니다.
가로챈 `scheme`를 삭제하고 기본 핸들러로 복구합니다.
[net-error]: https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h
[file-system-api]: https://developer.mozilla.org/en-US/docs/Web/API/LocalFileSystem

View file

@ -149,9 +149,11 @@ const app = remote.app;
메인 프로세스의 전역 변수(`name`)를 가져옵니다. (예시: `global[name]`)
## Properties
### `remote.process`
메인 프로세스의 `process` 객체를 반환합니다. `remote.getGlobal('process')`
메인 프로세스의 `process` 객체니다. `remote.getGlobal('process')`
같습니다. 하지만 캐시 됩니다.
[rmi]: http://en.wikipedia.org/wiki/Java_remote_method_invocation

View file

@ -19,27 +19,37 @@ let ses = win.webContents.session
`session` 모듈은 다음과 같은 메서드를 가지고 있습니다:
### session.fromPartition(partition)
### `session.fromPartition(partition[, options])`
* `partition` String
* `options` Object
* `cache` Boolean - 캐시를 활성화할지 여부.
`partition` 문자열로 부터 새로운 `Session` 인스턴스를 만들어 반환합니다.
`partition` 문자열로부터 `Session` 인스턴스를 만들어 반환합니다. 이미 `partition`
해당하는 `Session`이 존재할 경우, 해당 세션이 반환됩니다. 그렇지않은 경우 `Session`
인스턴스가 `options`에 맞춰 새로 생성됩니다.
`partition``persist:`로 시작하면 페이지는 지속성 세션을 사용하며 다른 모든 앱 내의
페이지에서 같은 `partition`을 사용할 수 있습니다. 만약 `persist:` 접두어로 시작하지
않으면 페이지는 인-메모리 세션을 사용합니다. `partition`을 지정하지 않으면 애플리케이션의
기본 세션이 반환됩니다.
`options`에 맞춰 `Session`을 생성하려면, `partition`에 해당하는 `Session`이 이미
이전에 사용되지 않고 있는지 확인해야 합니다. 이미 존재하는 `Session` 객체의
`options`를 변경하는 방법은 없습니다.
## Properties
`session` 모듈은 다음과 같은 속성을 가지고 있습니다:
### session.defaultSession
### `session.defaultSession`
애플리케이션의 기본 세션 객체를 반환합니다.
## Class: Session
> 세션의 속성을 가져오거나 설정합니다.
`session` 모듈을 사용하여 `Session` 객체를 생성할 수 있습니다:
```javascript
@ -89,7 +99,7 @@ session.defaultSession.on('will-download', (event, item, webContents) => {
세션의 HTTP 캐시를 비웁니다.
#### `ses.clearStorageData([options, ]callback)`
#### `ses.clearStorageData([options, callback])`
* `options` Object (optional), proprties:
* `origin` String - `scheme://host:port`와 같은 `window.location.origin` 규칙을
@ -99,7 +109,7 @@ session.defaultSession.on('will-download', (event, item, webContents) => {
`shadercache`, `websql`, `serviceworkers`
* `quotas` Array - 비우려는 할당의 종류, 다음과 같은 타입을 포함할 수 있습니다:
`temporary`, `persistent`, `syncable`.
* `callback` Function - 작업이 완료되면 호출됩니다.
* `callback` Function (optional) - 작업이 완료되면 호출됩니다.
웹 스토리지의 데이터를 비웁니다.
@ -112,6 +122,8 @@ session.defaultSession.on('will-download', (event, item, webContents) => {
* `config` Object
* `pacScript` String - PAC 파일과 관련된 URL입니다.
* `proxyRules` String - 사용할 프록시의 규칙을 나타냅니다.
* `proxyBypassRules` String - 어떤 URL이 프록시 설정을 무시되어야 하는지를
지정하는 규칙입니다.
* `callback` Function - 작업이 완료되면 호출됩니다.
프록시 설정을 적용합니다.
@ -146,6 +158,43 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
* `http=foopy;socks=foopy2` - http:// URL에 `foopy` HTTP 프록시를 사용합니다.
그리고 `socks4://foopy2` 프록시를 다른 모든 URL에 사용합니다.
`proxyBypassRules`는 밑에서 묘사된 규칙의 콤마로 구분된 목록입니다:
* `[ URL_SCHEME "://" ] HOSTNAME_PATTERN [ ":" <port> ]`
Match all hostnames that match the pattern HOSTNAME_PATTERN.
예시:
"foobar.com", "*foobar.com", "*.foobar.com", "*foobar.com:99",
"https://x.*.y.com:99"
* `"." HOSTNAME_SUFFIX_PATTERN [ ":" PORT ]`
Match a particular domain suffix.
예시:
".google.com", ".com", "http://.google.com"
* `[ SCHEME "://" ] IP_LITERAL [ ":" PORT ]`
Match URLs which are IP address literals.
예시:
"127.0.1", "[0:0::1]", "[::1]", "http://[::1]:99"
* `IP_LITERAL "/" PREFIX_LENGHT_IN_BITS`
Match any URL that is to an IP literal that falls between the
given range. IP range is specified using CIDR notation.
예시:
"192.168.1.1/16", "fefe:13::abc/33".
* `<local>`
Match local addresses. The meaning of `<local>` is whether the
host matches one of: "127.0.0.1", "::1", "localhost".
#### `ses.resolveProxy(url, callback)`
* `url` URL
@ -164,10 +213,14 @@ proxyURL = [<proxyScheme>"://"]<proxyHost>[":"<proxyPort>]
#### `ses.enableNetworkEmulation(options)`
* `options` Object
* `offline` Boolean - 네트워크의 오프라인 상태 여부
* `latency` Double - 밀리세컨드 단위의 RTT
* `downloadThroughput` Double - Bps 단위의 다운로드 주기
* `uploadThroughput` Double - Bps 단위의 업로드 주기
* `offline` Boolean (optional) - 네트워크 연결 끊김을 에뮬레이트할지 여부입니다.
기본값은 false입니다.
* `latency` Double (optional) - 밀리세컨드당 RTT입니다. 기본값은 0이며 이는
레이턴시 스로틀링을 비활성화합니다.
* `downloadThroughput` Double (optional) - Bps 단위의 다운로드 속도입니다.
기본값은 0이며 이는 다운로드 스로틀링을 비활성화합니다.
* `uploadThroughput` Double (optional) - Bps 단위의 업로드 속도입니다. 기본값은
0이며 이는 업로드 스로틀링을 비활성화합니다.
제공된 설정으로 `session`의 네트워크를 에뮬레이트합니다.
@ -304,8 +357,9 @@ app.on('ready', function () {
## Class: Cookies
`Cookies` 클래스는 쿠키를 탐색하고 조작하는 방법을 제공합니다. `Cookies` 클래스의
인스턴스는 반드시 `Session` 클래스의 `cookies` 속성에서 접근해야 합니다.
> 세션의 쿠키를 변경하거나 요청합니다.
`Cookies` 클래스의 인스턴스는 `Session``cookies` 속성을 통해 접근합니다.
예를 들어:
@ -395,9 +449,10 @@ session.defaultSession.cookies.set(cookie, (error) => {
## Class: WebRequest
`WebRequest` 클래스는 생명 주기의 다양한 단계에서 요청의 콘텐츠를 조작하거나 가로채는
방법을 제공합니다. `WebRequest` 클래스는 반드시 `Session` 클래스의 `webRequest`
속성에서 접근해야 합니다.
> 생명주기 동안의 다양한 단계를 가지는 요청의 콘텐츠를 가로채고 변경합니다.
`WebRequest` 클래스의 인스턴스는 `Session``webRequest` 속성을 통해 접근할 수
있습니다.
`WebRequest`의 메서드는 선택적인 `filter``listener` 속성을 허용하며 `listener`
API의 이벤트가 발생했을 때 `listener(details)` 형식으로 호출되고, `details`는 요청에

View file

@ -50,3 +50,38 @@ mailto: URL은 유저의 기본 이메일 에이전트로 URL을 엽니다.) 애
### `shell.beep()`
비프음을 재생합니다.
### `shell.writeShortcutLink(shortcutPath[, operation], options)` _Windows_
* `shortcutPath` String
* `operation` String (optional) - 기본값은 `create`이며 다음 값 중 한 가지가 될 수
있습니다:
* `create` - 새 바로가기를 생성하고 필요하다면 덮어씁니다.
* `update` - 이미 존재하는 바로가기의 특정한 속성을 갱신합니다.
* `replace` - 이미 존재하는 바로가기를 덮어씁니다. 바로가기가 존재하지 않으면
실패합니다.
* `options` Object
* `target` String - 이 바로가기로부터 실행될 대상입니다.
* `cwd` String (optional) - 작업 디렉토리입니다. 기본값은 없습니다.
* `args` String (optional) - 이 바로가기로부터 실행될 때 `target`에 적용될 인수
값입니다. 기본값은 없습니다.
* `description` String (optional) - 바로가기의 설명입니다. 기본값은 없습니다.
* `icon` String (optional) - 아이콘의 경로입니다. DLL 또는 EXE가 될 수 있습니다.
`icon``iconIndex`는 항상 같이 설정되어야 합니다. 기본값은 없으며 `target`
아이콘을 사용합니다.
* `iconIndex` Integer (optional) - `icon`이 DLL 또는 EXE일 때 사용되는 아이콘의
리소스 ID이며 기본값은 0입니다.
* `appUserModelId` String (optional) - 애플리케이션 사용자 모델 ID입니다.
기본값은 없습니다.
`shortcutPath`에 바로가기 링크를 생성합니다. 바로가기 생성에 성공하면 `true`
반환하고 그렇지 않으면 `false`를 반환합니다.
### `shell.readShortcutLink(shortcutPath)` _Windows_
* `shortcutPath` String
`shortcutPath`에 위치한 바로가기 링크를 해석합니다. `shell.writeShortcutLink`
메서드의 `options`에 묘사된 속성을 포함하는 객체를 반환합니다.
오류가 발생하면 예외가 throw됩니다.

View file

@ -14,6 +14,11 @@ console.log(systemPreferences.isDarkMode());
이 메서드는 시스템이 어두운 모드 상태인 경우 `true`를 반환하고 아닐 경우 `false`
반환합니다.
### `systemPreferences.isSwipeTrackingFromScrollEventsEnabled()` _macOS_
이 메서드는 페이지 간의 스와이프가 설정되어있을 때 `true`를 반환하고 그렇지 않은 경우
`false`를 반환합니다.
### `systemPreferences.subscribeNotification(event, callback)` _macOS_
* `event` String
@ -41,13 +46,17 @@ macOS의 네이티브 알림을 구독하며, 해당하는 `event`가 발생하
### `systemPreferences.subscribeLocalNotification(event, callback)` _macOS_
`subscribeNotification`와 같지만, 로컬 기본값으로 `NSNotificationCenter`
사용합니다. 다음과 같은 이벤트에 필수적입니다:
* `event` String
* `callback` Function
* `NSUserDefaultsDidChangeNotification`
`subscribeNotification`와 같습니다. 하지만 로컬 기본값에 대해
`NSNotificationCenter`를 사용합니다. 이는 `NSUserDefaultsDidChangeNotification`
같은 이벤트에 대해 필수적입니다.
### `systemPreferences.unsubscribeLocalNotification(id)` _macOS_
* `id` Integer
`unsubscribeNotification`와 같지만, `NSNotificationCenter`에서 구독자를 제거합니다.
### `systemPreferences.getUserDefault(key, type)` _macOS_

View file

@ -122,6 +122,13 @@ appIcon.setContextMenu(contextMenu)
트레이 아이콘에 파일이 드롭되면 발생하는 이벤트입니다.
#### Event: 'drop-text' _macOS_
* `event` Event
* `text` String - 드롭된 텍스트의 문자열
드래그된 텍스트가 트레이 아이콘에 드롭되면 발생하는 이벤트입니다.
#### Event: 'drag-enter' _macOS_
트레이 아이콘에 드래그 작업이 시작될 때 발생하는 이벤트입니다.
@ -166,12 +173,35 @@ appIcon.setContextMenu(contextMenu)
상태바에서 트레이 아이콘 옆에 표시되는 제목 텍스트를 설정합니다.
#### `tray.setHighlightMode(highlight)` _macOS_
#### `tray.setHighlightMode(mode)` _macOS_
* `highlight` Boolean
* `mode` String - 다음 값 중 하나가 될 수 있는 하이라이트 모드:
* `selection` - 트레이 아이콘이 클릭되었을 때와 콘텍스트 메뉴가 열렸을 때
하이라이트를 적용합니다. 이 값이 기본값입니다.
* `always` - 언제나 트레이 아이콘에 하이라이트를 적용합니다.
* `never` - 트레이 아이콘에 하이라이트를 아예 적용하지 않습니다.
트레이 아이콘이 클릭됐을 때 아이콘의 배경이 파란색으로 하이라이트 될지 여부를 지정합니다.
기본값은 true입니다.
트레이 아이콘의 배경이 하이라이팅될 때를 지정합니다. (파란색)
**참고:** [`BrowserWindow`](browser-window.md)와 함께 `highlightMode`를 윈도우
가시성에 따라 `'never'``'always'` 사이에서 키거나 끌 수 있습니다.
```javascript
const {BrowserWindow, Tray} = require('electron')
const win = new BrowserWindow({width: 800, height: 600})
const tray = new Tray('/path/to/my/icon')
tray.on('click', () => {
win.isVisible() ? win.hide() : win.show()
})
win.on('show', () => {
tray.setHighlightMode('always')
})
win.on('hide', () => {
tray.setHighlightMode('never')
})
```
#### `tray.displayBalloon(options)` _Windows_

View file

@ -13,14 +13,34 @@ const {BrowserWindow} = require('electron');
let win = new BrowserWindow({width: 800, height: 1500});
win.loadURL('http://github.com');
let webContents = win.webContents;
let contents = win.webContents;
```
## Events
## Methods
`webContents` 객체는 다음과 같은 이벤트들을 발생시킵니다:
다음 메서드는 `webContents` 모듈에서 접근할 수 있는 메서드입니다:
### Event: 'did-finish-load'
```javascript
const {webContents} = require('electron');
```
#### `webContents.getAllWebContents()`
모든 `WebContents` 인스턴스의 배열을 반환합니다. 이 배열은 윈도우, 웹뷰, 열린 개발자
도구 그리고 개발자 도구 확장 기능의 백그라운드 페이지의 모든 웹 콘텐츠를 포함합니다.
#### `webContents.getFocusedWebContents()`
이 애플리케이션에서 포커스되어있는 웹 콘텐츠를 반환합니다. 포커스된 웹 콘텐츠가 없을
경우 `null`을 반환합니다.
## Class: WebContents
> BrowserWindow 인스턴스의 콘텐츠를 표시하고 제어합니다.
### Instance Events
#### Event: 'did-finish-load'
탐색 작업이 끝났을 때 발생하는 이벤트입니다. 브라우저의 탭의 스피너가 멈추고 `onload`
이벤트가 발생했을 때를 말합니다.
@ -41,7 +61,7 @@ Returns:
확인할 수 있습니다. 참고로 리다이렉트 응답은 `errorCode` -3과 함께 발생합니다; 이
에러는 명시적으로 무시할 수 있습니다.
### Event: 'did-frame-finish-load'
#### Event: 'did-frame-finish-load'
Returns:
@ -50,15 +70,15 @@ Returns:
프레임(Frame)이 탐색을 끝냈을 때 발생하는 이벤트입니다.
### Event: 'did-start-loading'
#### Event: 'did-start-loading'
브라우저 탭의 스피너가 회전을 시작한 때와 같은 시점에 대응하는 이벤트입니다.
### Event: 'did-stop-loading'
#### Event: 'did-stop-loading'
브라우저 탭의 스피너가 회전을 멈추었을 때와 같은 시점에 대응하는 이벤트입니다.
### Event: 'did-get-response-details'
#### Event: 'did-get-response-details'
Returns:
@ -75,7 +95,7 @@ Returns:
요청한 리소스에 관련된 자세한 정보를 사용할 수 있을 때 발생하는 이벤트입니다.
`status`는 리소스를 다운로드하기 위한 소켓 연결을 나타냅니다.
### Event: 'did-get-redirect-request'
#### Event: 'did-get-redirect-request'
Returns:
@ -90,7 +110,7 @@ Returns:
리소스를 요청하는 동안에 리다이렉트 응답을 받았을 때 발생하는 이벤트입니다.
### Event: 'dom-ready'
#### Event: 'dom-ready'
Returns:
@ -98,7 +118,7 @@ Returns:
주어진 프레임의 문서가 로드되었을 때 발생하는 이벤트입니다.
### Event: 'page-favicon-updated'
#### Event: 'page-favicon-updated'
Returns:
@ -107,7 +127,7 @@ Returns:
페이지가 favicon(파비콘) URL을 받았을 때 발생하는 이벤트입니다.
### Event: 'new-window'
#### Event: 'new-window'
Returns:
@ -125,7 +145,7 @@ Returns:
`event.preventDefault()`를 호출하면 새로운 창이 생성되는 것을 방지할 수 있습니다.
### Event: 'will-navigate'
#### Event: 'will-navigate'
Returns:
@ -143,7 +163,7 @@ Returns:
`event.preventDefault()`를 호출하면 탐색을 방지할 수 있습니다.
### Event: 'did-navigate'
#### Event: 'did-navigate'
Returns:
@ -155,12 +175,13 @@ Returns:
이 이벤트는 앵커 링크를 클릭하거나 `window.location.hash`의 값을 변경하는 등의 페이지
내 탐색시엔 발생하지 않습니다. 대신 `did-navigate-in-page` 이벤트를 사용해야 합니다.
### Event: 'did-navigate-in-page'
#### Event: 'did-navigate-in-page'
Returns:
* `event` Event
* `url` String
* `isMainFrame` Boolean
페이지 내의 탐색이 완료되면 발생하는 이벤트입니다.
@ -168,11 +189,11 @@ Returns:
않습니다. 예를 들어 앵커 링크를 클릭했을 때, 또는 DOM `hashchange` 이벤트가 발생했을
때로 볼 수 있습니다.
### Event: 'crashed'
#### Event: 'crashed'
렌더러 프로세스가 예기치 못하게 종료되었을 때 발생되는 이벤트입니다.
### Event: 'plugin-crashed'
#### Event: 'plugin-crashed'
Returns:
@ -182,23 +203,23 @@ Returns:
플러그인 프로세스가 예기치 못하게 종료되었을 때 발생되는 이벤트입니다.
### Event: 'destroyed'
#### Event: 'destroyed'
`webContents`가 소멸될 때 발생되는 이벤트입니다.
### Event: 'devtools-opened'
#### Event: 'devtools-opened'
개발자 도구가 열렸을 때 발생되는 이벤트입니다.
### Event: 'devtools-closed'
#### Event: 'devtools-closed'
개발자 도구가 닫혔을 때 발생되는 이벤트입니다.
### Event: 'devtools-focused'
#### Event: 'devtools-focused'
개발자 도구에 포커스가 가거나 개발자 도구가 열렸을 때 발생되는 이벤트입니다.
### Event: 'certificate-error'
#### Event: 'certificate-error'
Returns:
@ -206,8 +227,13 @@ Returns:
* `url` URL
* `error` String - 에러 코드
* `certificate` Object
* `data` Buffer - PEM 인코딩된 데이터
* `issuerName` String
* `data` String - PEM 인코딩된 데이터
* `issuerName` String - 인증서 발급자의 공통 이름
* `subjectName` String - 대상의 공통 이름
* `serialNumber` String - 문자열로 표현된 hex 값
* `validStart` Integer - 초 단위의 인증서가 유효하기 시작한 날짜
* `validExpiry` Integer - 초 단위의 인증서가 만료되는 날짜
* `fingerprint` String - 인증서의 지문
* `callback` Function
`url`에 대한 `certificate` 인증서의 유효성 검증에 실패했을 때 발생하는 이벤트입니다.
@ -215,15 +241,20 @@ Returns:
사용법은 [`app`의 `certificate-error` 이벤트](app.md#event-certificate-error)와
같습니다.
### Event: 'select-client-certificate'
#### Event: 'select-client-certificate'
Returns:
* `event` Event
* `url` URL
* `certificateList` [Objects]
* `data` Buffer - PEM 인코딩된 데이터
* `issuerName` String - 인증서 발급자 이름
* `data` String - PEM 인코딩된 데이터
* `issuerName` String - 인증서 발급자의 공통 이름
* `subjectName` String - 대상의 공통 이름
* `serialNumber` String - 문자열로 표현된 hex 값
* `validStart` Integer - 초 단위의 인증서가 유효하기 시작한 날짜
* `validExpiry` Integer - 초 단위의 인증서가 만료되는 날짜
* `fingerprint` String - 인증서의 지문
* `callback` Function
클라이언트 인증이 요청되었을 때 발생하는 이벤트입니다.
@ -231,7 +262,7 @@ Returns:
사용법은 [`app`의 `select-client-certificate` 이벤트](app.md#event-select-client-certificate)와
같습니다.
### Event: 'login'
#### Event: 'login'
Returns:
@ -252,7 +283,7 @@ Returns:
[`app`의 `login`이벤트](app.md#event-login)와 사용 방법은 같습니다.
### Event: 'found-in-page'
#### Event: 'found-in-page'
Returns:
@ -267,15 +298,15 @@ Returns:
[`webContents.findInPage`](web-contents.md#webcontentsfindinpage) 요청의 결과를
사용할 수 있을 때 발생하는 이벤트입니다.
### Event: 'media-started-playing'
#### Event: 'media-started-playing'
미디어가 재생되기 시작할 때 발생하는 이벤트입니다.
### Event: 'media-paused'
#### Event: 'media-paused'
미디어가 중지되거나 재생이 완료되었을 때 발생하는 이벤트입니다.
### Event: 'did-change-theme-color'
#### Event: 'did-change-theme-color'
페이지의 테마 색이 변경될 때 발생하는 이벤트입니다. 이 이벤트는 보통 meta 태그에
의해서 발생합니다:
@ -284,7 +315,7 @@ Returns:
<meta name='theme-color' content='#ff0000'>
```
### Event: 'update-target-url'
#### Event: 'update-target-url'
Returns:
@ -293,14 +324,20 @@ Returns:
마우스나 키보드를 사용해 링크에 포커스할 때 발생하는 이벤트입니다.
### Event: 'cursor-changed'
#### Event: 'cursor-changed'
Returns:
* `event` Event
* `type` String
* `image` NativeImage (optional)
* `scale` Float (optional)
* `scale` Float (optional) - 커스텀 커서의 스케일링 수치
* `size` Object (optional) - `image`의 사이즈
* `width` Integer
* `height` Integer
* `hotspot` Object (optional) - 커스텀 커서의 핫스팟 좌표
* `x` Integer - x 좌표
* `y` Integer - y 좌표
커서 종류가 변경될 때 발생하는 이벤트입니다. `type` 인수는 다음 값이 될 수 있습니다:
`default`, `crosshair`, `pointer`, `text`, `wait`, `help`, `e-resize`, `n-resize`,
@ -312,10 +349,10 @@ Returns:
`not-allowed`, `zoom-in`, `zoom-out`, `grab`, `grabbing`, `custom`.
만약 `type` 인수가 `custom` 이고 `image` 인수가 `NativeImage`를 통한 커스텀
커서를 지정했을 때, 해당 이미지로 커서가 변경됩니다. 또한 `scale` 인수는 이미지의
크기를 조정합니다.
커서를 지정했을 때, 해당 이미지로 커서가 변경됩니다. 또한 `scale`, `size` 그리고 `hotspot` 인수는
커스텀 커서의 추가적인 정보를 포함합니다.
### Event: 'context-menu'
#### Event: 'context-menu'
Returns:
@ -332,7 +369,7 @@ Returns:
이미지, 오디오, 비디오입니다.
* `mediaType` String - 컨텍스트 메뉴가 호출된 노드의 종류. 값은 `none`, `image`,
`audio`, `video`, `canvas`, `file` 또는 `plugin`이 될 수 있습니다.
* `hasImageContent` Boolean - 컨텍스트 메뉴가 내용이 있는 이미지에서 호출되었는지
* `hasImageContents` Boolean - 컨텍스트 메뉴가 내용이 있는 이미지에서 호출되었는지
여부.
* `isEditable` Boolean - 컨텍스트를 편집할 수 있는지 여부.
* `selectionText` String - 컨텍스트 메뉴가 호출된 부분에 있는 선택된 텍스트.
@ -371,7 +408,7 @@ Returns:
새로운 컨텍스트 메뉴의 제어가 필요할 때 발생하는 이벤트입니다.
### Event: 'select-bluetooth-device'
#### Event: 'select-bluetooth-device'
Returns:
@ -406,11 +443,33 @@ app.on('ready', () => {
})
```
## Instance Methods
#### Event: 'paint'
`webContents`객체는 다음과 같은 인스턴스 메서드들을 가지고 있습니다.
Returns:
### `webContents.loadURL(url[, options])`
* `event` Event
* `dirtyRect` Object
* `x` Integer - 이미지의 x 좌표.
* `y` Integer - 이미지의 y 좌표.
* `width` Integer - Dirty 영역의 너비.
* `height` Integer - Dirty 영역의 높이.
* `image` [NativeImage](native-image.md) - 전체 프레임의 이미지 데이터.
새 프레임이 생성되었을 때 발생하는 이벤트입니다. Dirty 영역만이 버퍼로 전달됩니다.
```javascript
const {BrowserWindow} = require('electron')
let win = new BrowserWindow({webPreferences: {offscreen: true}})
win.webContents.on('paint', (event, dirty, image) => {
// updateBitmap(dirty, image.toBitmap())
})
win.loadURL('http://github.com')
```
### Instance Methods
#### `contents.loadURL(url[, options])`
* `url` URL
* `options` Object (optional)
@ -427,14 +486,14 @@ const options = {extraHeaders: 'pragma: no-cache\n'};
webContents.loadURL(url, options)
```
### `webContents.downloadURL(url)`
#### `contents.downloadURL(url)`
* `url` URL
`url`의 리소스를 탐색 없이 다운로드를 시작합니다. `session``will-download`
이벤트가 발생합니다.
### `webContents.getURL()`
#### `contents.getURL()`
현재 웹 페이지의 URL을 반환합니다.
@ -445,93 +504,101 @@ win.loadURL('http://github.com');
let currentURL = win.webContents.getURL();
```
### `webContents.getTitle()`
#### `contents.getTitle()`
현재 웹 페이지의 제목을 반환합니다.
### `webContents.isLoading()`
#### `win.isDestroyed()`
윈도우가 소멸되었는지 여부를 반환합니다.
#### `contents.isFocused()`
웹 페이지가 포커스되어있는지 여부를 반환합니다.
#### `contents.isLoading()`
현재 웹 페이지가 리소스를 로드중인지 여부를 반환합니다.
### `webContents.isLoadingMainFrame()`
#### `contents.isLoadingMainFrame()`
메인 프레임이 여전히 로딩중인지 여부를 반환합니다. (내부 iframe 또는 frame 포함)
### `webContents.isWaitingForResponse()`
#### `contents.isWaitingForResponse()`
현재 웹 페이지가 페이지의 메인 리소스로부터 첫 응답을 기다리고있는지 여부를 반환합니다.
### `webContents.stop()`
#### `contents.stop()`
대기중인 탐색 작업을 모두 멈춥니다.
### `webContents.reload()`
#### `contents.reload()`
현재 웹 페이지를 새로고침합니다.
### `webContents.reloadIgnoringCache()`
#### `contents.reloadIgnoringCache()`
현재 웹 페이지의 캐시를 무시한 채로 새로고침합니다.
### `webContents.canGoBack()`
#### `contents.canGoBack()`
브라우저가 이전 웹 페이지로 돌아갈 수 있는지 여부를 반환합니다.
### `webContents.canGoForward()`
#### `contents.canGoForward()`
브라우저가 다음 웹 페이지로 이동할 수 있는지 여부를 반환합니다.
### `webContents.canGoToOffset(offset)`
#### `contents.canGoToOffset(offset)`
* `offset` Integer
웹 페이지가 `offset`로 이동할 수 있는지 여부를 반환합니다.
### `webContents.clearHistory()`
#### `contents.clearHistory()`
탐색 기록을 삭제합니다.
### `webContents.goBack()`
#### `contents.goBack()`
브라우저가 이전 웹 페이지로 이동하게 합니다.
### `webContents.goForward()`
#### `contents.goForward()`
브라우저가 다음 웹 페이지로 이동하게 합니다.
### `webContents.goToIndex(index)`
#### `contents.goToIndex(index)`
* `index` Integer
브라우저가 지정된 절대 웹 페이지 인덱스로 탐색하게 합니다.
### `webContents.goToOffset(offset)`
#### `contents.goToOffset(offset)`
* `offset` Integer
"current entry"에서 지정된 offset으로 탐색합니다.
### `webContents.isCrashed()`
#### `contents.isCrashed()`
렌더러 프로세스가 예기치 않게 종료되었는지 여부를 반환합니다.
### `webContents.setUserAgent(userAgent)`
#### `contents.setUserAgent(userAgent)`
* `userAgent` String
현재 웹 페이지의 유저 에이전트를 덮어씌웁니다.
### `webContents.getUserAgent()`
#### `contents.getUserAgent()`
현재 웹 페이지의 유저 에이전트 문자열을 반환합니다.
### `webContents.insertCSS(css)`
#### `contents.insertCSS(css)`
* `css` String
CSS 코드를 현재 웹 페이지에 삽입합니다.
### `webContents.executeJavaScript(code[, userGesture, callback])`
#### `contents.executeJavaScript(code[, userGesture, callback])`
* `code` String
* `userGesture` Boolean (optional)
@ -544,71 +611,110 @@ CSS 코드를 현재 웹 페이지에 삽입합니다.
호출될 수 있습니다. `userGesture``true`로 설정하면 이러한 제약을 무시할 수
있습니다.
### `webContents.setAudioMuted(muted)`
#### `contents.setAudioMuted(muted)`
* `muted` Boolean
현재 웹 페이지의 소리를 음소거합니다.
### `webContents.isAudioMuted()`
#### `contents.isAudioMuted()`
현재 페이지가 음소거 되어있는지 여부를 반환합니다.
### `webContents.undo()`
#### `contents.setZoomFactor(factor)`
* `factor` Number - 줌 수치.
지정한 수치로 줌 수치를 변경합니다. 줌 수치는 100으로 나눈 값이며 300%는 3.0이 됩니다.
#### `contents.getZoomFactor(callback)`
* `callback` Function
현재 줌 수치 값을 요청합니다. `callback``callback(zoomFactor)` 형태로 호출됩니다.
#### `contents.setZoomLevel(level)`
* `level` Number - 줌 레벨.
지정한 수준으로 줌 수준을 변경합니다. 원본 크기는 0이고 각 값의 증가와 감소는 현재 줌을
20% 크거나 작게 표현하고 각 크기는 원본 크기의 300%와 50%로 제한됩니다.
#### `contents.getZoomLevel(callback)`
* `callback` Function
현재 줌 수준 값을 요청합니다. `callback``callback(zoomLevel)` 형태로 호출됩니다.
#### `contents.setZoomLevelLimits(minimumLevel, maximumLevel)`
* `minimumLevel` Number
* `maximumLevel` Number
최대와 최소 값의 줌 수준 값을 지정합니다.
#### `contents.undo()`
웹 페이지에서 `undo` 편집 커맨드를 실행합니다.
### `webContents.redo()`
#### `contents.redo()`
웹 페이지에서 `redo` 편집 커맨드를 실행합니다.
### `webContents.cut()`
#### `contents.cut()`
웹 페이지에서 `cut` 편집 커맨드를 실행합니다.
### `webContents.copy()`
#### `contents.copy()`
웹 페이지에서 `copy` 편집 커맨드를 실행합니다.
### `webContents.paste()`
### `contents.copyImageAt(x, y)`
* `x` Integer
* `y` Integer
주어진 위치에 있는 이미지를 클립보드로 복사합니다.
#### `contents.paste()`
웹 페이지에서 `paste` 편집 커맨드를 실행합니다.
### `webContents.pasteAndMatchStyle()`
#### `contents.pasteAndMatchStyle()`
웹 페이지에서 `pasteAndMatchStyle` 편집 커맨드를 실행합니다.
### `webContents.delete()`
#### `contents.delete()`
웹 페이지에서 `delete` 편집 커맨드를 실행합니다.
### `webContents.selectAll()`
#### `contents.selectAll()`
웹 페이지에서 `selectAll` 편집 커맨드를 실행합니다.
### `webContents.unselect()`
#### `contents.unselect()`
웹 페이지에서 `unselect` 편집 커맨드를 실행합니다.
### `webContents.replace(text)`
#### `contents.replace(text)`
* `text` String
웹 페이지에서 `replace` 편집 커맨드를 실행합니다.
### `webContents.replaceMisspelling(text)`
#### `contents.replaceMisspelling(text)`
* `text` String
웹 페이지에서 `replaceMisspelling` 편집 커맨드를 실행합니다.
### `webContents.insertText(text)`
#### `contents.insertText(text)`
* `text` String
포커스된 요소에 `text`를 삽입합니다.
### `webContents.findInPage(text[, options])`
#### `contents.findInPage(text[, options])`
* `text` String - 찾을 콘텐츠, 반드시 공백이 아니여야 합니다.
* `options` Object (optional)
@ -629,7 +735,7 @@ CSS 코드를 현재 웹 페이지에 삽입합니다.
[`found-in-page`](web-contents.md#event-found-in-page) 이벤트를 통해 취득할 수
있습니다.
### `webContents.stopFindInPage(action)`
#### `contents.stopFindInPage(action)`
* `action` String - [`webContents.findInPage`](web-contents.md#webcontentfindinpage)
요청이 종료되었을 때 일어날 수 있는 작업을 지정합니다.
@ -648,7 +754,7 @@ webContents.on('found-in-page', (event, result) => {
const requestId = webContents.findInPage('api');
```
### `webContents.capturePage([rect, ]callback)`
#### `contents.capturePage([rect, ]callback)`
* `rect` Object (optional) - 캡쳐할 페이지의 영역
* `x` Integer
@ -661,21 +767,21 @@ const requestId = webContents.findInPage('api');
`callback(image)` 형식으로 호출됩니다. `image`는 [NativeImage](native-image.md)의
인스턴스이며 스크린샷 데이터를 담고있습니다. `rect`를 생략하면 페이지 전체를 캡처합니다.
### `webContents.hasServiceWorker(callback)`
#### `contents.hasServiceWorker(callback)`
* `callback` Function
ServiceWorker가 등록되어있는지 확인하고 `callback`에 대한 응답으로 boolean 값을
반환합니다.
### `webContents.unregisterServiceWorker(callback)`
#### `contents.unregisterServiceWorker(callback)`
* `callback` Function
ServiceWorker가 존재하면 모두 등록을 해제하고 JS Promise가 만족될 때 `callback`
대한 응답으로 boolean을 반환하거나 JS Promise가 만족되지 않을 때 `false`를 반환합니다.
### `webContents.print([options])`
#### `contents.print([options])`
`options` Object (optional)
* `silent` Boolean - 사용자에게 프린트 설정을 묻지 않습니다. 기본값을 `false`입니다.
@ -689,7 +795,7 @@ ServiceWorker가 존재하면 모두 등록을 해제하고 JS Promise가 만족
`webContents.print({silent: false, printBackground: false})`를 호출하는 것과
같습니다.
### `webContents.printToPDF(options, callback)`
#### `contents.printToPDF(options, callback)`
* `options` Object
* `marginsType` Integer - 사용할 마진의 종류를 지정합니다. 0 부터 2 사이 값을 사용할
@ -742,7 +848,7 @@ win.webContents.on('did-finish-load', () => {
});
```
### `webContents.addWorkSpace(path)`
#### `contents.addWorkSpace(path)`
* `path` String
@ -755,13 +861,13 @@ win.webContents.on('devtools-opened', () => {
});
```
### `webContents.removeWorkSpace(path)`
#### `contents.removeWorkSpace(path)`
* `path` String
특정 경로를 개발자 도구의 워크스페이스에서 제거합니다.
### `webContents.openDevTools([options])`
#### `contents.openDevTools([options])`
* `options` Object (optional)
* `detach` Boolean - 새 창에서 개발자 도구를 엽니다.
@ -772,37 +878,36 @@ win.webContents.on('devtools-opened', () => {
개발자 도구를 엽니다.
### `webContents.closeDevTools()`
#### `contents.closeDevTools()`
개발자 도구를 닫습니다.
### `webContents.isDevToolsOpened()`
#### `contents.isDevToolsOpened()`
개발자 도구가 열려있는지 여부를 반환합니다.
### `webContents.isDevToolsFocused()`
#### `contents.isDevToolsFocused()`
개발자 도구에 포커스 되어있는지 여부를 반환합니다.
### `webContents.toggleDevTools()`
#### `contents.toggleDevTools()`
개발자 도구를 토글합니다.
### `webContents.inspectElement(x, y)`
#### `contents.inspectElement(x, y)`
* `x` Integer
* `y` Integer
(`x`, `y`)위치의 요소를 조사합니다.
### `webContents.inspectServiceWorker()`
#### `contents.inspectServiceWorker()`
서비스 워커 컨텍스트(service worker context)를 위한 개발자 도구를 엽니다.
### `webContents.send(channel[, arg1][, arg2][, ...])`
#### `contents.send(channel[, arg1][, arg2][, ...])`
* `channel` String
* `arg` (optional)
`channel`을 통하여 렌더러 프로세스에 비동기 메시지를 보냅니다. 임의의 인수를 보낼수도
있습니다. 인수들은 내부적으로 JSON 포맷으로 직렬화 되며, 이후 함수와 프로토타입 체인은
@ -838,44 +943,43 @@ app.on('ready', () => {
</html>
```
### `webContents.enableDeviceEmulation(parameters)`
#### `contents.enableDeviceEmulation(parameters)`
`parameters` Object, properties:
* `screenPosition` String - 에뮬레이트 할 화면 종료를 지정합니다
(기본값: `desktop`)
* `desktop`
* `mobile`
* `screenSize` Object - 에뮬레이트 화면의 크기를 지정합니다 (screenPosition ==
mobile)
* `width` Integer - 에뮬레이트 화면의 너비를 지정합니다
* `height` Integer - 에뮬레이트 화면의 높이를 지정합니다
* `viewPosition` Object - 화면에서 뷰의 위치 (screenPosition == mobile) (기본값:
`{x: 0, y: 0}`)
* `x` Integer - 좌상단 모서리로부터의 x 축의 오프셋
* `y` Integer - 좌상단 모서리로부터의 y 축의 오프셋
* `deviceScaleFactor` Integer - 디바이스의 스케일 팩터(scale factor)를 지정합니다.
(0일 경우 기본 디바이스 스케일 팩터를 기본으로 사용합니다. 기본값: `0`)
* `viewSize` Object - 에뮬레이트 된 뷰의 크기를 지정합니다 (빈 값은 덮어쓰지 않는
다는 것을 의미합니다)
* `width` Integer - 에뮬레이트 된 뷰의 너비를 지정합니다
* `height` Integer - 에뮬레이트 된 뷰의 높이를 지정합니다
* `fitToView` Boolean - 에뮬레이트의 뷰가 사용 가능한 공간에 맞추어 스케일 다운될지를
지정합니다 (기본값: `false`)
* `offset` Object - 사용 가능한 공간에서 에뮬레이트 된 뷰의 오프셋을 지정합니다 (fit
to view 모드 외에서) (기본값: `{x: 0, y: 0}`)
* `x` Float - 좌상단 모서리에서 x 축의 오프셋을 지정합니다
* `y` Float - 좌상단 모서리에서 y 축의 오프셋을 지정합니다
* `scale` Float - 사용 가능한 공간에서 에뮬레이드 된 뷰의 스케일 (fit to view 모드
외에서, 기본값: `1`)
* `parameters` Object
* `screenPosition` String - 에뮬레이트 할 화면 종료를 지정합니다
(기본값: `desktop`)
* `desktop` String - Desktop screen type
* `mobile` String - Mobile screen type
* `screenSize` Object - 에뮬레이트 화면의 크기를 지정합니다 (screenPosition ==
mobile)
* `width` Integer - 에뮬레이트 화면의 너비를 지정합니다
* `height` Integer - 에뮬레이트 화면의 높이를 지정합니다
* `viewPosition` Object - 화면에서 뷰의 위치 (screenPosition == mobile) (기본값:
`{x: 0, y: 0}`)
* `x` Integer - 좌상단 모서리로부터의 x 축의 오프셋
* `y` Integer - 좌상단 모서리로부터의 y 축의 오프셋
* `deviceScaleFactor` Float - 디바이스의 스케일 팩터(scale factor)를 지정합니다.
(0일 경우 기본 디바이스 스케일 팩터를 기본으로 사용합니다. 기본값: `0`)
* `viewSize` Object - 에뮬레이트 된 뷰의 크기를 지정합니다 (빈 값은 덮어쓰지 않는
다는 것을 의미합니다)
* `width` Integer - 에뮬레이트 된 뷰의 너비를 지정합니다
* `height` Integer - 에뮬레이트 된 뷰의 높이를 지정합니다
* `fitToView` Boolean - 에뮬레이트의 뷰가 사용 가능한 공간에 맞추어 스케일 다운될지를
지정합니다 (기본값: `false`)
* `offset` Object - 사용 가능한 공간에서 에뮬레이트 된 뷰의 오프셋을 지정합니다 (fit
to view 모드 외에서) (기본값: `{x: 0, y: 0}`)
* `x` Float - 좌상단 모서리에서 x 축의 오프셋을 지정합니다
* `y` Float - 좌상단 모서리에서 y 축의 오프셋을 지정합니다
* `scale` Float - 사용 가능한 공간에서 에뮬레이드 된 뷰의 스케일 (fit to view 모드
외에서, 기본값: `1`)
`parameters`로 디바이스 에뮬레이션을 사용합니다.
### `webContents.disableDeviceEmulation()`
#### `contents.disableDeviceEmulation()`
`webContents.enableDeviceEmulation`로 활성화된 디바이스 에뮬레이선을 비활성화 합니다.
### `webContents.sendInputEvent(event)`
#### `contents.sendInputEvent(event)`
* `event` Object
* `type` String (**required**) - 이벤트의 종류. 다음 값들을 사용할 수 있습니다:
@ -915,7 +1019,7 @@ Input `event`를 웹 페이지로 전송합니다.
* `hasPreciseScrollingDeltas` Boolean
* `canScroll` Boolean
### `webContents.beginFrameSubscription([onlyDirty ,]callback)`
#### `contents.beginFrameSubscription([onlyDirty ,]callback)`
* `onlyDirty` Boolean (optional) - 기본값은 `false`입니다.
* `callback` Function
@ -934,11 +1038,11 @@ Input `event`를 웹 페이지로 전송합니다.
속성을 포함하는 객체입니다. 만약 `onlyDirty``true`로 지정되어 있으면,
`frameBuffer`가 다시 그려진 부분만 포함합니다. `onlyDirty`의 기본값은 `false`입니다.
### `webContents.endFrameSubscription()`
#### `contents.endFrameSubscription()`
프레임 프레젠테이션 이벤트들에 대한 구독을 중지합니다.
### `webContents.startDrag(item)`
#### `contents.startDrag(item)`
* `item` object
* `file` String
@ -948,7 +1052,7 @@ Input `event`를 웹 페이지로 전송합니다.
드래그될 파일의 절대 경로입니다. 그리고 `icon`은 드래그 도중 커서 밑에 표시될
이미지입니다.
### `webContents.savePage(fullPath, saveType, callback)`
#### `contents.savePage(fullPath, saveType, callback)`
* `fullPath` String - 전체 파일 경로.
* `saveType` String - 저장 종류를 지정합니다.
@ -971,36 +1075,65 @@ win.webContents.on('did-finish-load', () => {
});
```
### `webContents.showDefinitionForSelection()` _macOS_
#### `contents.showDefinitionForSelection()` _macOS_
페이지에서 선택된 단어에 대한 사전 검색 결과 팝업을 표시합니다.
## Instance Properties
#### `contents.isOffscreen()`
`WebContents`객체들은 다음 속성들을 가지고 있습니다:
*오프 스크린 렌더링* 이 활성화되었는지 여부를 표시합니다.
### `webContents.id`
#### `contents.startPainting()`
*오프 스크린 렌더링* 이 활성화되었고 페인팅 상태가 아니라면 페인팅을 시작합니다.
#### `contents.stopPainting()`
*오프 스크린 렌더링* 이 활성화되었고 페인팅 상태라면 페인팅을 중지합니다.
#### `contents.isPainting()`
*오프 스크린 렌더링* 이 활성화된 경우 현재 패인팅 상태를 반환합니다.
#### `contents.setFrameRate(fps)`
* `fps` Integer
*오프 스크린 렌더링* 이 활성화된 경우 프레임 레이트를 지정한 숫자로 지정합니다. 1과 60
사이의 값만 사용할 수 있습니다.
#### `contents.getFrameRate()`
*오프 스크린 렌더링* 이 활성화된 경우 현재 프레임 레이트를 반환합니다.
### Instance Properties
#### `contents.id`
이 WebContents의 유일 ID.
### `webContents.session`
#### `contents.session`
이 webContents에서 사용하는 [session](session.md) 객체를 반환합니다.
### `webContents.hostWebContents`
#### `contents.hostWebContents`
현재 `WebContents`를 소유하는 `WebContents`를 반환합니다.
### `webContents.devToolsWebContents`
#### `contents.devToolsWebContents`
`WebContents`에 대한 개발자 도구의 `WebContents`를 가져옵니다.
**참고:** 사용자가 절대로 이 객체를 저장해서는 안 됩니다. 개발자 도구가 닫혔을 때,
`null`이 반환될 수 있습니다.
### `webContents.debugger`
#### `contents.debugger`
디버거 API는 [원격 디버깅 프로토콜][rdp]에 대한 대체 수송자 역할을 합니다.
현재 `webContents`에 대한 디버거 인스턴스를 가져옵니다.
## Class: Debugger
> Chrome의 원격 디버깅 프로토콜에 대한 대체 접근자입니다.
```javascript
try {
@ -1023,21 +1156,23 @@ win.webContents.debugger.on('message', (event, method, params) => {
win.webContents.debugger.sendCommand('Network.enable');
```
#### `webContents.debugger.attach([protocolVersion])`
### Instance Methods
* `protocolVersion` String (optional) - 요쳥할 디버깅 프로토콜의 버전.
#### `debugger.attach([protocolVersion])`
* `protocolVersion` String (optional) - 요청할 디버깅 프로토콜의 버전.
`webContents`에 디버거를 부착합니다.
#### `webContents.debugger.isAttached()`
#### `debugger.isAttached()`
디버거가 `webContents`에 부착되어 있는지 여부를 반환합니다.
#### `webContents.debugger.detach()`
#### `debugger.detach()`
`webContents`로부터 디버거를 분리시킵니다.
#### `webContents.debugger.sendCommand(method[, commandParams, callback])`
#### `debugger.sendCommand(method[, commandParams, callback])`
* `method` String - 메서드 이름, 반드시 원격 디버깅 프로토콜에 의해 정의된 메서드중
하나가 됩니다.
@ -1049,6 +1184,8 @@ win.webContents.debugger.sendCommand('Network.enable');
지정한 커맨드를 디버깅 대상에게 전송합니다.
### Instance Events
#### Event: 'detach'
* `event` Event

View file

@ -116,9 +116,6 @@
"on"으로 지정하면 `webview` 페이지 내에서 `require``process 객체`같은 node.js
API를 사용할 수 있습니다. 이를 지정하면 내부에서 로우레벨 리소스에 접근할 수 있습니다.
**참고:** Node 통합 기능은 `webview`에서 부모 윈도우가 해당 옵션이 비활성화되어있는
경우 항상 비활성화됩니다.
### `plugins`
```html
@ -483,6 +480,19 @@ Service worker에 대한 개발자 도구를 엽니다.
`event` 객체에 대해 자세히 알아보려면 [webContents.sendInputEvent](web-contents.md#webcontentssendinputeventevent)를
참고하세요.
### `<webview>.setZoomFactor(factor)`
* `factor` Number - 줌 수치.
지정한 수치로 줌 수치를 변경합니다. 줌 수치는 100으로 나눈 값이며 300%는 3.0이 됩니다.
### `<webview>.setZoomLevel(level)`
* `level` Number - 줌 레벨.
지정한 수준으로 줌 수준을 변경합니다. 원본 크기는 0이고 각 값의 증가와 감소는 현재 줌을
20% 크거나 작게 표현하고 각 크기는 원본 크기의 300%와 50%로 제한됩니다.
### `<webview>.showDefinitionForSelection()` _macOS_
페이지에서 선택된 단어에 대한 사전 검색 결과 팝업을 표시합니다.
@ -697,6 +707,7 @@ Returns:
Returns:
* `url` String
* `isMainFrame` Boolean
페이지 내의 탐색이 완료되면 발생하는 이벤트입니다.

View file

@ -1,4 +1,4 @@
# `window.open` 함수
1# `window.open` 함수
> 새 윈도우를 열고 URL을 로드합니다.
@ -37,33 +37,35 @@
## Class: BrowserWindowProxy
### `BrowserWindowProxy.blur()`
> 자식 브라우저 윈도우를 조작합니다
### Instance Methods
`BrowserWindowProxy` 객체는 다음과 같은 인스턴스 메서드를 가지고 있습니다:
#### `win.blur()`
자식 윈도우의 포커스를 해제합니다.
### `BrowserWindowProxy.close()`
#### `win.close()`
자식 윈도우를 강제로 닫습니다. unload 이벤트가 발생하지 않습니다.
자식 윈도우를 강제로 닫습니다. unload 이벤트가 발생하지 않습니다.
### `BrowserWindowProxy.closed`
자식 윈도우가 닫히면 true로 설정됩니다.
### `BrowserWindowProxy.eval(code)`
#### `win.eval(code)`
* `code` String
자식 윈도우에서 특정 스크립트를 실행합니다.
### `BrowserWindowProxy.focus()`
#### `win.focus()`
자식 윈도우에 포커스를 맞춥니다. (창을 맨 앞으로 가져옵니다)
### `BrowserWindowProxy.print()`
#### `win.print()`
자식 윈도우에 프린트 대화 상자를 호출합니다.
### `BrowserWindowProxy.postMessage(message, targetOrigin)`
#### `win.postMessage(message, targetOrigin)`
* `message` String
* `targetOrigin` String
@ -73,3 +75,11 @@
참고로 자식 윈도우의 `window.opener` 객체에는 다른 속성 없이 이 메서드 한 개만
구현되어 있습니다.
### Instance Properties
`BrowserWindowProxy` 객체는 다음과 같은 인스턴스 속성을 가지고 있습니다:
#### `win.closed`
자식 윈도우가 닫히면 true로 설정됩니다.

View file

@ -22,7 +22,8 @@ Ubuntu를 사용하고 있다면 다음과 같이 라이브러리를 설치해
$ sudo apt-get install build-essential clang libdbus-1-dev libgtk2.0-dev \
libnotify-dev libgnome-keyring-dev libgconf2-dev \
libasound2-dev libcap-dev libcups2-dev libxtst-dev \
libxss1 libnss3-dev gcc-multilib g++-multilib curl
libxss1 libnss3-dev gcc-multilib g++-multilib curl \
gperf bison
```
Fedora를 사용하고 있다면 다음과 같이 라이브러리를 설치해야 합니다:
@ -30,7 +31,8 @@ Fedora를 사용하고 있다면 다음과 같이 라이브러리를 설치해
```bash
$ sudo yum install clang dbus-devel gtk2-devel libnotify-devel libgnome-keyring-devel \
xorg-x11-server-utils libcap-devel cups-devel libXtst-devel \
alsa-lib-devel libXrandr-devel GConf2-devel nss-devel
alsa-lib-devel libXrandr-devel GConf2-devel nss-devel bison \
gperf
```
다른 배포판의 경우 pacman 같은 패키지 매니저를 통해 패키지를 설치 할 수 있습니다.

View file

@ -59,17 +59,25 @@ $ python script\build.py -c D
빌드가 모두 끝나면 `out/D` (디버그 타겟) 또는 `out/R` (릴리즈 타겟) 디렉터리에서
`electron.exe` 실행 파일을 찾을 수 있습니다.
## 64비트 빌드
## 32비트 빌드
64비트를 타겟으로 빌드 하려면 부트스트랩 스크립트를 실행할 때 `--target_arch=x64`
32비트를 타겟으로 빌드 하려면 부트스트랩 스크립트를 실행할 때 `--target_arch=ia32`
인수를 같이 넘겨주면 됩니다:
```powershell
$ python script\bootstrap.py -v --target_arch=x64
$ python script\bootstrap.py -v --target_arch=ia32
```
다른 빌드 단계도 정확하게 같습니다.
## Visual Studio 프로젝트
Visual Studio 프로젝트를 생성하려면, `--msvs` 인수를 전달할 수 있습니다:
```powershell
$ python script\bootstrap.py --msvs
```
## 테스트
프로젝트 코딩 스타일을 확인하려면:

View file

@ -24,7 +24,6 @@ C++ 코드는 많은 Chromium의 추상화와 타입을 사용합니다. 따라
## JavaScript
* [표준](http://npm.im/standard) JavaScript 코딩 스타일을 사용합니다.
* Google의 코딩 스타일에도 맞추기 위해 파일의 끝에는 **절대** 개행을 삽입해선 안됩니다.
* 파일 이름의 공백은 `_`대신에 `-`을 사용하여야 합니다. 예를 들어
`file_name.js``file-name.js`로 고쳐야 합니다. 왜냐하면
[github/atom](https://github.com/github/atom)에서 사용되는 모듈의 이름은 보통

View file

@ -0,0 +1,132 @@
> 이 문서는 아직 Electron 기여자가 번역하지 않았습니다.
>
> Electron에 기여하고 싶다면 [기여 가이드](https://github.com/electron/electron/blob/master/CONTRIBUTING-ko.md)를
> 참고하세요.
>
> 문서의 번역이 완료되면 이 틀을 삭제해주세요.
# Debugging on macOS
If you experience crashes or issues in Electron that you believe are not caused
by your JavaScript application, but instead by Electron itself, debugging can
be a little bit tricky, especially for developers not used to native/C++
debugging. However, using lldb, and the Electron source code, it is fairly easy
to enable step-through debugging with breakpoints inside Electron's source code.
## Requirements
* **A debug build of Electron**: The easiest way is usually building it
yourself, using the tools and prerequisites listed in the
[build instructions for macOS](build-instructions-osx.md). While you can
easily attach to and debug Electron as you can download it directly, you will
find that it is heavily optimized, making debugging substantially more
difficult: The debugger will not be able to show you the content of all
variables and the execution path can seem strange because of inlining,
tail calls, and other compiler optimizations.
* **Xcode**: In addition to Xcode, also install the Xcode command line tools.
They include LLDB, the default debugger in Xcode on Mac OS X. It supports
debugging C, Objective-C and C++ on the desktop and iOS devices and simulator.
## Attaching to and Debugging Electron
To start a debugging session, open up Terminal and start `lldb`, passing a debug
build of Electron as a parameter.
```bash
$ lldb ./out/D/Electron.app
(lldb) target create "./out/D/Electron.app"
Current executable set to './out/D/Electron.app' (x86_64).
```
### Setting Breakpoints
LLDB is a powerful tool and supports multiple strategies for code inspection. For
this basic introduction, let's assume that you're calling a command from JavaScript
that isn't behaving correctly - so you'd like to break on that command's C++
counterpart inside the Electron source.
Relevant code files can be found in `./atom/` as well as in Brightray, found in
`./vendor/brightray/browser` and `./vendor/brightray/common`. If you're hardcore,
you can also debug Chromium directly, which is obviously found in `chromium_src`.
Let's assume that you want to debug `app.setName()`, which is defined in `browser.cc`
as `Browser::SetName()`. Set the breakpoint using the `breakpoint` command, specifying
file and line to break on:
```bash
(lldb) breakpoint set --file browser.cc --line 117
Breakpoint 1: where = Electron Framework``atom::Browser::SetName(std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > const&) + 20 at browser.cc:118, address = 0x000000000015fdb4
```
Then, start Electron:
```bash
(lldb) run
```
The app will immediately be paused, since Electron sets the app's name on launch:
```bash
(lldb) run
Process 25244 launched: '/Users/fr/Code/electron/out/D/Electron.app/Contents/MacOS/Electron' (x86_64)
Process 25244 stopped
* thread #1: tid = 0x839a4c, 0x0000000100162db4 Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 20 at browser.cc:118, queue = 'com.apple.main-thread', stop reason = breakpoint 1.1
frame #0: 0x0000000100162db4 Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 20 at browser.cc:118
115 }
116
117 void Browser::SetName(const std::string& name) {
-> 118 name_override_ = name;
119 }
120
121 int Browser::GetBadgeCount() {
(lldb)
```
To show the arguments and local variables for the current frame, run `frame variable` (or `fr v`),
which will show you that the app is currently setting the name to "Electron".
```bash
(lldb) frame variable
(atom::Browser *) this = 0x0000000108b14f20
(const string &) name = "Electron": {
[...]
}
```
To do a source level single step in the currently selected thread, execute `step` (or `s`).
This would take you into into `name_override_.empty()`. To proceed and do a step over,
run `next` (or `n`).
```bash
(lldb) step
Process 25244 stopped
* thread #1: tid = 0x839a4c, 0x0000000100162dcc Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 44 at browser.cc:119, queue = 'com.apple.main-thread', stop reason = step in
frame #0: 0x0000000100162dcc Electron Framework`atom::Browser::SetName(this=0x0000000108b14f20, name="Electron") + 44 at browser.cc:119
116
117 void Browser::SetName(const std::string& name) {
118 name_override_ = name;
-> 119 }
120
121 int Browser::GetBadgeCount() {
122 return badge_count_;
```
To finish debugging at this point, run `process continue`. You can also continue until a certain
line is hit in this thread (`thread until 100`). This command will run the thread in the current
frame till it reaches line 100 in this frame or stops if it leaves the current frame.
Now, if you open up Electron's developer tools and call `setName`, you will once again hit the
breakpoint.
### Further Reading
LLDB is a powerful tool with a great documentation. To learn more about it, consider
Apple's debugging documentation, for instance the [LLDB Command Structure Reference][lldb-command-structure]
or the introduction to [Using LLDB as a Standalone Debugger][lldb-standalone].
You can also check out LLDB's fantastic [manual and tutorial][lldb-tutorial], which
will explain more complex debugging scenarios.
[lldb-command-structure]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/gdb_to_lldb_transition_guide/document/lldb-basics.html#//apple_ref/doc/uid/TP40012917-CH2-SW2
[lldb-standalone]: https://developer.apple.com/library/mac/documentation/IDEs/Conceptual/gdb_to_lldb_transition_guide/document/lldb-terminal-workflow-tutorial.html
[lldb-tutorial]: http://lldb.llvm.org/tutorial.html

View file

@ -9,7 +9,7 @@ Electron의 Chrome 버전은 보통 새로운 Chrome 안정 버전이 릴리즈
Electron은 크롬이 사용하는 안정된 채널만을 이용합니다, 만약 중요한 수정이 베타 또는
개발 채널에 패치된 경우, 이전 버전의 채널로 롤백합니다.
자세한 내용은 [보안 설명](../tutorial/security.md)을 참고하세요.
자세한 내용은 [보안 설명](tutorial/security.md)을 참고하세요.
## Electron은 언제 최신 버전의 Node.js로 업그레이드 하나요?

View file

@ -5,8 +5,6 @@
[![devDependency Status](https://david-dm.org/electron/electron/dev-status.svg)](https://david-dm.org/electron/electron#info=devDependencies)
[![Join the Electron Community on Slack](http://atom-slack.herokuapp.com/badge.svg)](http://atom-slack.herokuapp.com/)
### [Electron](https://github.com/electron/electron/) 한국어 참조 문서
Electron 프레임워크는 JavaScript, HTML 그리고 CSS를 사용하여
Cross-Platform 데스크톱 애플리케이션을 개발할 수 있도록 해주는 프레임워크입니다.
[Node.js](https://nodejs.org/)와 [Chromium](http://www.chromium.org)을 기반으로
@ -76,6 +74,7 @@ npm install electron --save-dev
- [`electron-kr`](http://www.meetup.com/electron-kr/) *(한국)* 커뮤니티
- [`electron-jp`](https://electron-jp-slackin.herokuapp.com/) *(일본)* 커뮤니티
- [`electron-tr`](http://www.meetup.com/Electron-JS-Istanbul/) *(터키)* 커뮤니티
- [`electron-id`](https://electron-id.slack.com) *(인도네시아)* 커뮤니티
[awesome-electron](https://github.com/sindresorhus/awesome-electron) 프로젝트에
커뮤니티가 운영중인 유용한 예시 애플리케이션과 도구, 리소스가 있으니 참고하기 바랍니다.

View file

@ -0,0 +1,64 @@
> 이 문서는 아직 Electron 기여자가 번역하지 않았습니다.
>
> Electron에 기여하고 싶다면 [기여 가이드](https://github.com/electron/electron/blob/master/CONTRIBUTING-ko.md)를
> 참고하세요.
>
> 문서의 번역이 완료되면 이 틀을 삭제해주세요.
# About Electron
[Electron](http://electron.atom.io) is an open source library developed by GitHub for building cross-platform desktop applications with HTML, CSS, and JavaScript. Electron accomplishes this by combining [Chromium](https://www.chromium.org/Home) and [Node.js](https://nodejs.org) into a single runtime and apps can be packaged for Mac, Windows, and Linux.
Electron began in 2013 as the framework on which [Atom](https://atom.io), GitHub's hackable text editor, would be built. The two were open sourced in the Spring of 2014.
It has since become a popular tool used by open source developers, startups, and established companies. [See who is building on Electron](/apps).
Read on to learn more about the contributors and releases of Electron or get started building with Electron in the [Quick Start Guide](../quick-start).
## Core Team and Contributors
Electron is maintained by a team at GitHub as well as a group of [active contributors](https://github.com/electron/electron/graphs/contributors) from the community. Some of the contributors are individuals and some work at larger companies who are developing on Electron. We're happy to add frequent contributors to the project as maintainers. Read more about [contributing to Electron](https://github.com/electron/electron/blob/master/CONTRIBUTING.md).
## Releases
[Electron releases](https://github.com/electron/electron/releases) frequently. We release when there are significant bug fixes, new APIs or are updating versions of Chromium or Node.js.
### Updating Dependencies
Electron's version of Chromium is usually updated within one or two weeks after a new stable Chromium version is released, depending on the effort involved in the upgrade.
When a new version of Node.js is released, Electron usually waits about a month before upgrading in order to bring in a more stable version.
In Electron, Node.js and Chromium share a single V8 instance—usually the version that Chromium is using. Most of the time this _just works_ but sometimes it means patching Node.js.
### Versioning
Due to the hard dependency on Node.js and Chromium, Electron is in a tricky versioning position and [does not follow `semver`](http://semver.org). You should therefore always reference a specific version of Electron. [Read more about Electron's versioning](http://electron.atom.io/docs/tutorial/electron-versioning/) or see the [versions currently in use](https://electron.atom.io/#electron-versions).
### LTS
Long term support of older versions of Electron does not currently exist. If your current version of Electron works for you, you can stay on it for as long as you'd like. If you want to make use of new features as they come in you should upgrade to a newer version.
A major update came with version `v1.0.0`. If you're not yet using this version, you should [read more about the `v1.0.0` changes](http://electron.atom.io/blog/2016/05/11/electron-1-0).
## Core Philosophy
In order to keep Electron small (file size) and sustainable (the spread of dependencies and APIs) the project limits the scope of the core project.
For instance, Electron uses just the rendering library from Chromium rather than all of Chromium. This makes it easier to upgrade Chromium but also means some browser features found in Google Chrome do not exist in Electron.
New features added to Electron should primarily be native APIs. If a feature can be its own Node.js module, it probably should be. See the [Electron tools built by the community](http://electron.atom.io/community).
## History
Below are milestones in Electron's history.
| :calendar: | :tada: |
| --- | --- |
| **April 2013**| [Atom Shell is started](https://github.com/electron/electron/commit/6ef8875b1e93787fa9759f602e7880f28e8e6b45).|
| **May 2014** | [Atom Shell is open sourced](http://blog.atom.io/2014/05/06/atom-is-now-open-source.html). |
| **April 2015** | [Atom Shell is re-named Electron](https://github.com/electron/electron/pull/1389). |
| **May 2016** | [Electron releases `v1.0.0`](http://electron.atom.io/blog/2016/05/11/electron-1-0).|
| **May 2016** | [Electron apps compatible with Mac App Store](http://electron.atom.io/docs/tutorial/mac-app-store-submission-guide).|
| **August 2016** | [Windows Store support for Electron apps](http://electron.atom.io/docs/tutorial/windows-store-guide).|

View file

@ -0,0 +1,40 @@
> 이 문서는 아직 Electron 기여자가 번역하지 않았습니다.
>
> Electron에 기여하고 싶다면 [기여 가이드](https://github.com/electron/electron/blob/master/CONTRIBUTING-ko.md)를
> 참고하세요.
>
> 문서의 번역이 완료되면 이 틀을 삭제해주세요.
# Accessibility
Making accessible applications is important and we're happy to introduce new functionality to [Devtron](https://electron.atom.io/devtron) and [Spectron](https://electron.atom.io/spectron) that gives developers the opportunity to make their apps better for everyone.
---
Accessibility concerns in Electron applications are similar to those of websites because they're both ultimately HTML. With Electron apps, however, you can't use the online resources for accessibility audits because your app doesn't have a URL to point the auditor to.
These new features bring those auditing tools to your Electron app. You can choose to add audits to your tests with Spectron or use them within DevTools with Devtron. Read on for a summary of the tools or checkout our [accessibility documentation](http://electron.atom.io/docs/tutorials/accessibility) for more information.
### Spectron
In the testing framework Spectron, you can now audit each window and `<webview>` tag in your application. For example:
```javascript
app.client.auditAccessibility().then(function (audit) {
if (audit.failed) {
console.error(audit.message)
}
})
```
You can read more about this feature in [Spectron's documentation](https://github.com/electron/spectron#accessibility-testing).
### Devtron
In Devtron there is a new accessibility tab which will allow you to audit a page in your app, sort and filter the results.
![devtron screenshot](https://cloud.githubusercontent.com/assets/1305617/17156618/9f9bcd72-533f-11e6-880d-389115f40a2a.png)
Both of these tools are using the [Accessibility Developer Tools](https://github.com/GoogleChrome/accessibility-developer-tools) library built by Google for Chrome. You can learn more about the accessibility audit rules this library uses on that [repository's wiki](https://github.com/GoogleChrome/accessibility-developer-tools/wiki/Audit-Rules).
If you know of other great accessibility tools for Electron, add them to the [accessibility documentation](http://electron.atom.io/docs/tutorials/accessibility) with a pull request.

View file

@ -35,8 +35,8 @@ myNotification.onclick = () => {
* Windows 8.1과 8에선 [Application User Model ID][app-user-model-id]로 바로가기를
만들어 놔야 합니다. 이 바로가기는 반드시 시작 화면에 설치되어 있어야 합니다. 참고로
반드시 시작 화면에 고정 할 필요는 없습니다.
* Windows 7과 그 이하 버전은 데스크톱 알림을 지원하지 않습니다.
혹시 "풍선 팝업 알림" 기능을 찾는다면 [Tray API][tray-balloon]를 사용하세요.
* Windows 7은 데스크톱 알림을 지원하지 않습니다. 혹시 "풍선 팝업 알림" 기능을 찾는다면
[Tray API][tray-balloon]를 사용하세요.
또한 알림 본문의 최대 길이는 250자 입니다. Windows 개발팀에선 알림 문자열을 200자
이하로 유지하는 것을 권장합니다.

View file

@ -9,6 +9,11 @@ Electron은 유명한 웹 프레임워크를 디버깅하기 위해 사용할
## 개발자 도구는 어떻게 로드하나요
이 문서는 확장 기능을 수동으로 로드하는 방법의 과정을 설명합니다.
[electron-devtools-installer](https://github.com/GPMDP/electron-devtools-installer)와
같은 Chrome WebStore에서 자동으로 확장 기능을 다운로드하는 서드-파티 도구를 사용할 수도
있습니다.
Electron에 확장 기능을 로드하려면, Chrome 브라우저에서 다운로드 해야 하며, 파일 시스템 경로를 지정해야 합니다. 그리고 `BrowserWindow.addDevToolsExtension(extension)`를 호출함으로써 기능을 로드할 수 있습니다.
예시로 [React Developer Tools][react-devtools]를 사용한다면:
@ -26,7 +31,10 @@ Electron에 확장 기능을 로드하려면, Chrome 브라우저에서 다운
* macOS에선 `~/Library/Application Support/Google/Chrome/Default/Extensions`.
4. 확장 기능의 경로를 `BrowserWindow.addDevToolsExtension` API로 전달합니다.
React Developer Tools의 경우 다음과 비슷해야 합니다:
`~/Library/Application Support/Google/Chrome/Default/Extensions/fmkadmapgofadopljbjfkapdkoienihi/0.14.10_0`
`~/Library/Application Support/Google/Chrome/Default/Extensions/fmkadmapgofadopljbjfkapdkoienihi/0.15.0_0`
**참고:** `BrowserWindow.addDevToolsExtension` API는 `app` 모듈의 `ready` 이벤트가
발생하기 전까지 사용할 수 없습니다.
확장 기능의 이름은 `BrowserWindow.addDevToolsExtension`에서 반환되며, 이 이름을
`BrowserWindow.removeDevToolsExtension` API로 전달함으로써 해당하는 확장 기능을
@ -45,6 +53,7 @@ Electron에서 정상적으로 작동하는 것을 확인했으며 작동 여부
* [jQuery Debugger](https://chrome.google.com/webstore/detail/jquery-debugger/dbhhnnnpaeobfddmlalhnehgclcmjimi)
* [AngularJS Batarang](https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk)
* [Vue.js devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
* [Cerebral Debugger](http://www.cerebraljs.com/documentation/the_debugger)
### 개발자 도구가 작동하지 않을 때 어떻게 해야 하나요?

View file

@ -15,6 +15,6 @@ Electron은 Node와 Chromium에 큰 의존성을 지니고 있는 만큼, 유의
* Patch: 새로운 기능과 버그 수정을 반영합니다 - 만약 `1.0.0`에서 `1.0.1`
업그레이드하는 경우, 애플리케이션은 잘 작동할 것입니다.
`electron-prebuilt`를 사용하고 있다면, Electron의 변경 사항을 확실하게 인지하고
`electron` 또는 `electron-prebuilt`를 사용하고 있다면, Electron의 변경 사항을 확실하게 인지하고
개발자 스스로 업그레이드를 적용하기 위해 고정된 버전 숫자를 사용하는 것을 권장합니다.
(`^1.1.0` 대신 `1.1.0` 사용)

View file

@ -0,0 +1,62 @@
> 이 문서는 아직 Electron 기여자가 번역하지 않았습니다.
>
> Electron에 기여하고 싶다면 [기여 가이드](https://github.com/electron/electron/blob/master/CONTRIBUTING-ko.md)를
> 참고하세요.
>
> 문서의 번역이 완료되면 이 틀을 삭제해주세요.
# Offscreen Rendering
Offscreen rendering lets you obtain the content of a browser window in a bitmap,
so it can be rendered anywhere, for example on a texture in a 3D scene. The
offscreen rendering in Electron uses a similar approach than the [Chromium
Embedded Framework](https://bitbucket.org/chromiumembedded/cef) project.
Two modes of rendering can be used and only the dirty area is passed in the
`'paint'` event to be more efficient. The rendering can be stopped, continued
and the frame rate can be set. The specified frame rate is a top limit value,
when there is nothing happening on a webpage, no frames are generated. The
maximum frame rate is 60, because above that there is no benefit, just
performance loss.
## Two modes of rendering
### GPU accelerated
GPU accelerated rendering means that the GPU is used for composition. Because of
that the frame has to be copied from the GPU which requires more performance,
thus this mode is quite a bit slower than the other one. The benefit of this
mode that WebGL and 3D CSS animations are supported.
### Software output device
This mode uses a software output device for rendering in the CPU, so the frame
generation is much faster, thus this mode is preferred over the GPU accelerated
one.
To enable this mode GPU acceleration has to be disabled by calling the
[`app.disableHardwareAcceleration()`][disablehardwareacceleration] API.
## Usage
``` javascript
const {app, BrowserWindow} = require('electron')
app.disableHardwareAcceleration()
let win
app.once('ready', () => {
win = new BrowserWindow({
webPreferences: {
offscreen: true
}
})
win.loadURL('http://github.com')
win.webContents.on('paint', (event, dirty, image) => {
// updateBitmap(dirty, image.getBitmap())
})
win.webContents.setFrameRate(30)
})
```
[disablehardwareacceleration]: ../api/app.md#appdisablehardwareacceleration

View file

@ -156,9 +156,9 @@ app.on('activate', () => {
패키징 하고 패키징한 앱을 실행할 수 있습니다. 또한 Electron 실행파일을 다운로드 받아
바로 실행해 볼 수도 있습니다.
### electron-prebuilt
### `electron`
[`electron-prebuilt`](https://github.com/electron-userland/electron-prebuilt)
[`electron`](https://github.com/electron-userland/electron-prebuilt)
Electron의 미리 컴파일된 바이너리를 포함하는 `npm` 모듈입니다.
만약 `npm`을 통해 전역에 이 모듈을 설치했다면, 애플리케이션 소스 디렉터리에서 다음
@ -176,8 +176,16 @@ electron app
npm 모듈을 로컬에 설치했다면 다음 명령으로 실행할 수 있습니다:
#### macOS / Linux
```bash
./node_modules/.bin/electron .
$ ./node_modules/.bin/electron .
```
#### Windows
```bash
$ .\node_modules\.bin\electron .
```
### 다운로드 받은 Electron 바이너리 사용
@ -230,4 +238,8 @@ $ cd electron-quick-start
$ npm install && npm start
```
더 많은 예시 앱을 보려면 대단한 Electron 커뮤니티에 의해 만들어진
[보일러플레이트 리스트](http://electron.atom.io/community/#boilerplates)를
참고하세요.
[share-data]: ../faq.md#어떻게-웹-페이지-간에-데이터를-공유할-수-있나요

View file

@ -18,7 +18,7 @@
$ npm install --save-dev spectron
```
```js
```javascript
// 윈도우가 제목과 함께 보이는지 검증하는 간단한 테스트.
var Application = require('spectron').Application
var assert = require('assert')