mirrors/electron
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

docs: Updated "recent documents" fiddle tutorial (#29242)

Browse source 
* Port recent-documents fiddle to 12-x-y.

* Update recent-documents tutorial.

* update for review comments

Co-authored-by: Ethan Arrowood <ethan.arrowood@gmail.com>
This commit is contained in:
Kevin Hartman 2021-06-06 21:43:24 -04:00 committed by GitHub
parent 1a30f9f974
commit dd98fa3cd3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 51 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
docs/fiddles/features/recent-documents/index.html
View file

@ -2,15 +2,14 @@
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
<title>Recent Documents</title>
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
</head>
<body>
<h1>Hello World!</h1>
<h1>Recent Documents</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>.
Right click on the app icon to see recent documents.
You should see `recently-used.md` added to the list of recent files
</p>
</body>
</html>

8
docs/fiddles/features/recent-documents/main.js
View file

@ -5,17 +5,15 @@ const path = require('path')
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
height: 600
})
win.loadFile('index.html')
}
const fileName = 'recently-used.md'
fs.writeFile(fileName, 'Lorem Ipsum', () => {
app.addRecentDocument(path.join(process.cwd(), `${fileName}`))
app.addRecentDocument(path.join(__dirname, fileName))
})
app.whenReady().then(createWindow)

BIN
docs/images/recent-documents.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 37 KiB

65
docs/tutorial/recent-documents.md
View file

@ -13,39 +13,62 @@ __Application dock menu:__
![macOS Dock Menu][dock-menu-image]
To add a file to recent documents, you need to use the
[app.addRecentDocument][addrecentdocument] API.
## Example
### Add an item to recent documents
Starting with a working application from the
[Quick Start Guide](quick-start.md), add the following lines to the
`main.js` file:
### Managing recent documents
```javascript fiddle='docs/fiddles/features/recent-documents'
const { app } = require('electron')
const { app, BrowserWindow } = require('electron')
const fs = require('fs')
const path = require('path')
app.addRecentDocument('/Users/USERNAME/Desktop/work.type')
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('index.html')
}
const fileName = 'recently-used.md'
fs.writeFile(fileName, 'Lorem Ipsum', () => {
app.addRecentDocument(path.join(__dirname, fileName))
})
app.whenReady().then(createWindow)
app.on('window-all-closed', () => {
app.clearRecentDocuments()
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})
```
#### Adding a recent document
To add a file to recent documents, use the
[app.addRecentDocument][addrecentdocument] API.
After launching the Electron application, right click the application icon.
You should see the item you just added. In this guide, the item is a Markdown
file located in the root of the project:
In this guide, the item is a Markdown file located in the root of the project.
You should see `recently-used.md` added to the list of recent files:
![Recent document](../images/recent-documents.png)
### Clear the list of recent documents
#### Clearing the list of recent documents
To clear the list of recent documents, you need to use
[app.clearRecentDocuments][clearrecentdocuments] API in the `main.js` file:
```javascript
const { app } = require('electron')
app.clearRecentDocuments()
```
To clear the list of recent documents, use the
[app.clearRecentDocuments][clearrecentdocuments] API.
In this guide, the list of documents is cleared once all windows have been
closed.
## Additional information