Home Explore 引导页 在线工具 Blog
Register Sign In
Pchen0
/
electron
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

docs: Update represented-file fiddle tutorial (#29693)

* Update represented-file fiddle.

* add index and code back to guide

Co-authored-by: Kevin Hartman <[email protected]>
Co-authored-by: Ethan Arrowood <[email protected]>
trop[bot] 3 years ago
parent
7958f3efbb
commit
7b2a4c9984
4 changed files with 28 additions and 13 deletions
Split View Show Diff Stats
  1. 4 3
      docs/fiddles/features/represented-file/index.html
  2. 1 4
      docs/fiddles/features/represented-file/main.js
  3. BIN
      docs/images/represented-file.png
  4. 23 6
      docs/tutorial/represented-file.md

+ 4 - 3
docs/fiddles/features/represented-file/index.html
View File 

@@ -4,13 +4,14 @@
 
     <meta charset="UTF-8">
 
     <title>Hello World!</title>
 
     <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
 
+    <link rel="stylesheet" type="text/css" href="./styles.css">
 
 </head>
 
 <body>
 
     <h1>Hello World!</h1>
 
     <p>
 
-        We are using node <script>document.write(process.versions.node)</script>,
 
-        Chrome <script>document.write(process.versions.chrome)</script>,
 
-        and Electron <script>document.write(process.versions.electron)</script>.
 
+      Click on the title with the <pre>Command</pre> or <pre>Control</pre> key pressed.
 
+      You should see a popup with the represented file at the top.
 
     </p>
 
+  </body>
 
 </body>
 
 </html>

+ 1 - 4
docs/fiddles/features/represented-file/main.js
View File 

@@ -4,10 +4,7 @@ const os = require('os');
 
 function createWindow () {
 
   const win = new BrowserWindow({
 
     width: 800,
 
-    height: 600,
 
-    webPreferences: {
 
-      nodeIntegration: true
 
-    }
 
+    height: 600
 
   })
 
 
   win.loadFile('index.html')

BIN
docs/images/represented-file.png
View File


+ 23 - 6
docs/tutorial/represented-file.md
View File 

@@ -20,23 +20,40 @@ To set the represented file of window, you can use the
 
 
 ## Example
 
 
-Starting with a working application from the
 
-[Quick Start Guide](quick-start.md), add the following lines to the
 
-`main.js` file:
 
-
 
 ```javascript fiddle='docs/fiddles/features/represented-file'
 
 const { app, BrowserWindow } = require('electron')
 
+const os = require('os');
 
+
 
+function createWindow () {
 
+  const win = new BrowserWindow({
 
+    width: 800,
 
+    height: 600
 
+  })
 
+}
 
 
 app.whenReady().then(() => {
 
   const win = new BrowserWindow()
 
 
-  win.setRepresentedFilename('/etc/passwd')
 
+  win.setRepresentedFilename(os.homedir())
 
   win.setDocumentEdited(true)
 
 })
 
+
 
+app.on('window-all-closed', () => {
 
+  if (process.platform !== 'darwin') {
 
+    app.quit()
 
+  }
 
+})
 
+
 
+app.on('activate', () => {
 
+  if (BrowserWindow.getAllWindows().length === 0) {
 
+    createWindow()
 
+  }
 
+})
 
 ```
 
 
 After launching the Electron application, click on the title with `Command` or
 
-`Control` key pressed. You should see a popup with the file you just defined:
 
+`Control` key pressed. You should see a popup with the represented file at the top.
 
+In this guide, this is the current user's home directory:
 
 
 ![Represented file](../images/represented-file.png)