Skip to content

Commit 83e9afe

Browse files
LeeDDHHLeeDDHH
committed
translate sections/system/app-sys-information.html
1 parent bc4b317 commit 83e9afe

File tree

5 files changed

+47
-36
lines changed

5 files changed

+47
-36
lines changed

‎renderer-process/system/app-information.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@ appInfoBtn.addEventListener('click', () => {
77
})
88

99
ipcRenderer.on('got-app-path', (event, path) => {
10-
const message = `This app is located at: ${path}`
10+
const message = `このアプリが配置されているパス: ${path}`
1111
document.getElementById('got-app-info').innerHTML = message
1212
})

‎renderer-process/system/screen-information.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ const screenInfoBtn = document.getElementById('screen-info')
44
const size = screen.getPrimaryDisplay().size
55

66
screenInfoBtn.addEventListener('click', () => {
7-
const message = `Your screen is: ${size.width}px x ${size.height}px`
7+
const message = `ディスプレイの解像度: ${size.width}px x ${size.height}px`
88
document.getElementById('got-screen-info').innerHTML = message
99
})

‎renderer-process/system/sys-information.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ const homeDir = os.homedir()
44
const sysInfoBtn = document.getElementById('sys-info')
55

66
sysInfoBtn.addEventListener('click', () => {
7-
const message = `Your system home directory is: ${homeDir}`
7+
const message = `ホームディレクトリの場所: ${homeDir}`
88
document.getElementById('got-sys-info').innerHTML = message
99
})

‎renderer-process/system/version-information.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,6 @@ const versionInfoBtn = document.getElementById('version-info')
33
const electronVersion = process.versions.electron
44

55
versionInfoBtn.addEventListener('click', () => {
6-
const message = `This app is using Electron version: ${electronVersion}`
6+
const message = `このアプリのElectronのバージョン: ${electronVersion}`
77
document.getElementById('got-version-info').innerHTML = message
88
})

‎sections/system/app-sys-information.html

Lines changed: 43 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -4,59 +4,62 @@
44
<div class="section-wrapper">
55
<h1>
66
<svg class="section-icon"><use xlink:href="assets/img/icons.svg#icon-system"></use></svg>
7-
Get app and system information
7+
アプリとシステム情報を取得する
88
</h1>
9-
<h3>With a few Node.js and Electron modules you can gather information about the user's system, app or screen.</h3>
10-
<p>Links to the relevant documentation are in the demos below.</p>
9+
<h3>いくつかのNode.jsおよびElectronモジュールを使用すると、ユーザーのシステム、アプリ、または画面に関する情報の取得ができます。</h3>
10+
<p>関連するドキュメントへのリンクは、以下のデモからご覧ください。</p>
1111
</div>
1212
</header>
1313

1414
<div class="demo">
1515
<div class="demo-wrapper">
16-
<button id="app-info-demo-toggle" class="js-container-target demo-toggle-button">Get app information
16+
<button id="app-info-demo-toggle" class="js-container-target demo-toggle-button">アプリ情報を取得する
1717
<div class="demo-meta u-avoid-clicks">Supports: Win, macOS, Linux <span class="demo-meta-divider">|</span> Process: Both</div>
1818
</button>
1919
<div class="demo-box">
2020
<div class="demo-controls">
2121
<button class="demo-button" id="app-info">View Demo</button>
2222
<span class="demo-response" id="got-app-info"></span>
2323
</div>
24-
<p>The main process <code>app</code> module can be used to get the path at which your app is located on the user's computer.</p>
25-
<p>In this example, to get that information from the renderer process, we use the <code>ipc</code> module to send a message to the main process requesting the app's path.</p>
26-
<p>See the <a href="http://electron.atom.io/docs/api/app">app module documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> for more.</p>
27-
<h5>Renderer Process</h5>
24+
<p>メインプロセスの<code>app</code>モジュールを使って、ユーザーのPC上に配置されているアプリのパスが取得できます。</p>
25+
<p>このデモでは、レンダラープロセスからその情報を取得するために、<code>ipc</code>モジュールを使って、アプリのパスをリクエストするメッセージをメインプロセスに送ります。</p>
26+
<p>詳しくは、 <a href="http://electron.atom.io/docs/api/app">appモジュールドキュメント<span class="u-visible-to-screen-reader">(新しいウィンドウが開きます)</span></a>からご覧ください。</p>
27+
<h5>レンダラープロセス</h5>
2828
<pre><code data-path="renderer-process/system/app-information.js"></code></pre>
29-
<h5>Main Process</h5>
29+
<h5>メインプロセス</h5>
3030
<pre><code data-path="main-process/system/app-information.js"></code></pre>
3131
</div>
3232
</div>
3333
</div>
3434

3535
<div class="demo">
3636
<div class="demo-wrapper">
37-
<button id="app-version-demo-toggle" class="js-container-target demo-toggle-button">Get version information
37+
<button id="app-version-demo-toggle" class="js-container-target demo-toggle-button">バージョンを取得する
3838
<div class="demo-meta u-avoid-clicks">Supports: Win, macOS, Linux <span class="demo-meta-divider">|</span> Process: Both</div>
3939
</button>
4040
<div class="demo-box">
4141
<div class="demo-controls">
4242
<button class="demo-button" id="version-info">View Demo</button>
4343
<span class="demo-response" id="got-version-info"></span>
4444
</div>
45-
<p>The <code>process</code> module is built into Node.js (therefore you can use this in both the main and renderer processes) and in Electron apps this object has a few more useful properties on it.</p>
46-
<p>The example below gets the version of Electron in use by the app.</p>
47-
<p>See the <a href="http://electron.atom.io/docs/api/process">process documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> for more.</p>
48-
<h5>Renderer Process</h5>
45+
<p><code>process</code>モジュールはNode.jsに組み込まれているため（メインプロセスとレンダラープロセスの両方でこれを使用できます）、Electronでは、このオブジェクトのいくつかの便利なプロパティが使えます。</p>
46+
<p>以下のデモでは、アプリで使われているElectronのバージョンを取得します。</p>
47+
<p>詳しくは、<a href="http://electron.atom.io/docs/api/process">processドキュメント<span class="u-visible-to-screen-reader">(新しいウィンドウが開きます)</span></a>からご覧ください。</p>
48+
<h5>レンダラープロセス</h5>
4949
<pre><code data-path="renderer-process/system/version-information.js"></code></pre>
5050

5151
<div class="demo-protip">
5252
<h2>ProTip</h2>
53-
<strong>Find versions of Chromium, Node.js and V8.</strong>
54-
<p>Electron also includes versions of Chromium, Node.js and V8 within the <code>process.versions</code> object. You can get there quickly by opening up developer tools in an Electron app and typing <code>process.versions</code>.</p>
55-
<pre><code class="language-js">// Returns version of Chromium in use
53+
<strong>Chromium、Node.js、V8のバージョンを確認する</strong>
54+
<p>
55+
Electronの<code>process.versions</code>オブジェクトには、Chromium、Node.js、V8のバージョンも含まれています。<br>
56+
Electronアプリで開発者ツールを開き、<code>process.versions</code>と入力することで、すぐに取得できます。
57+
</p>
58+
<pre><code class="language-js">// 使っているChromiumのバージョンを返します
5659
process.versions.chrome
57-
// Returns version of V8 in use
60+
// 使っているV8のバージョンを返します
5861
process.versions.v8
59-
// Returns version of Node in use
62+
// 使っているNodeのバージョンを返しいます
6063
process.versions.node</code></pre>
6164
</div>
6265
</div>
@@ -65,46 +68,54 @@ <h2>ProTip</h2>
6568

6669
<div class="demo">
6770
<div class="demo-wrapper">
68-
<button id="sys-info-demo-toggle" class="js-container-target demo-toggle-button">Get system information
71+
<button id="sys-info-demo-toggle" class="js-container-target demo-toggle-button">システム情報を取得する
6972
<div class="demo-meta u-avoid-clicks">Supports: Win, macOS, Linux <span class="demo-meta-divider">|</span> Process: Both</div>
7073
</button>
7174
<div class="demo-box">
7275
<div class="demo-controls">
7376
<button class="demo-button" id="sys-info">View Demo</button>
7477
<span class="demo-response" id="got-sys-info"></span>
7578
</div>
76-
<p>The Node.js <code>os</code> module provides useful information about the user's operating system. It's built into Node.js and can be used in both the main and renderer proesses.</p>
77-
<p>In the example below we require the module and then return the location of the home directory.</p>
79+
<p>
80+
Node.jsの<code>os</code>モジュールは、ユーザーのOSに関する情報を提供します。<br>
81+
Node.jsに組み込まれており、メインプロセスとレンダラープロセスの両方で使用できます。
82+
</p>
83+
<p>以下のデモでは、モジュールを使ってホームディレクトリの場所を返します。</p>
7884

79-
<p>See the full <a href="https://nodejs.org/api/os.html"> os documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> for more.</p>
80-
<h5>Renderer Process</h5>
85+
<p>詳しくは、<a href="https://nodejs.org/api/os.html">osドキュメント<span class="u-visible-to-screen-reader">(新しいウィンドウが開きます)</span></a>からご覧ください。</p>
86+
<h5>レンダラープロセス</h5>
8187
<pre><code data-path="renderer-process/system/sys-information.js"></code></pre>
8288
</div>
8389
</div>
8490
</div>
8591

8692
<div class="demo">
8793
<div class="demo-wrapper">
88-
<button id="screen-info-demo-toggle" class="js-container-target demo-toggle-button">Get screen information
94+
<button id="screen-info-demo-toggle" class="js-container-target demo-toggle-button">スクリーン情報を取得する
8995
<div class="demo-meta u-avoid-clicks">Supports: Win, macOS, Linux <span class="demo-meta-divider">|</span> Process: Both</div>
9096
</button>
9197
<div class="demo-box">
9298
<div class="demo-controls">
9399
<button class="demo-button" id="screen-info">View Demo</button>
94100
<span class="demo-response" id="got-screen-info"></span>
95101
</div>
96-
<p>The Electron <code>screen</code> module retrieves information about screen size, displays, cursor position, etc. In the example below we retrieve the dimensions of the monitor in use.</p>
102+
<p>
103+
Electronの<code>screen</code>モジュールは、画面サイズ、ディスプレイ、カーソル位置などに関する情報を取得します。<br>
104+
以下のデモでは、使用中のディスプレイの解像度を取得します。
105+
</p>
97106

98-
<p>See the full <a href="http://electron.atom.io/docs/api/screen">screen documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> for more.</p>
99-
<h5>Renderer Process</h5>
107+
<p>詳しくは、<a href="http://electron.atom.io/docs/api/screen">screenドキュメント<span class="u-visible-to-screen-reader">(新しいウィンドウが開きます)</span></a>からご覧ください。</p>
108+
<h5>レンダラープロセス</h5>
100109
<pre><code data-path="renderer-process/system/screen-information.js"></code></pre>
101110

102111
<div class="demo-protip">
103112
<h2>ProTip</h2>
104-
<strong>Differences in dimensions.</strong>
105-
<p>The <code>.size</code> method in the example returns the raw dimensions of the screen but because of system menu bars this may not be the actual space available for your app.</p>
106-
107-
<p>To get the dimensions of the available screen space use the <code>.workAreaSize</code> method. Using <code>.workArea</code> will return the coordinates as well as the dimensions of the available screen space.</p>
113+
<strong>解像度の違い</strong>
114+
<p>この例の<code>.size</code>メソッドは画面の元のサイズを返しますが、システムメニューバーのような要素によって、アプリで実際に使えるスペースではない場合があります。</p>
115+
<p>
116+
利用可能な画面スペースのサイズを取得するには、<code>.workAreaSize</code>メソッドを使用します。<br>
117+
<code>.workArea</code>を使用すると、使用可能な画面スペースの座標と解像度が返されます。
118+
</p>
108119
</div>
109120
</div>
110121
</div>

0 commit comments

Comments
 (0)