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

docs: Updated "progress bar" fiddle feature in docs (#29237)

Browse source 
* improve progress bar fiddle

* add comments to code snippet

* edits to progress-bar tutorial

* remove versions and nodeIntegration

* limit line length to 100

* implement standard linter suggestions

* add indeterminate and clear timers

* update to have reader replace all of main.js

* remove extra button

* loop the progress bar

* add logic to show reset state briefly

* Update docs/tutorial/progress-bar.md

Co-authored-by: Erick Zhao <erick@hotmail.ca>

* chore: fix lint

Co-authored-by: Cheng Zhao <github@zcbenz.com>
Co-authored-by: Erick Zhao <erick@hotmail.ca>
This commit is contained in:
Jeremy Foster 2021-06-01 19:41:13 -07:00 • committed by GitHub
parent f9d2a7077e
commit dee4c4b908
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 82 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

9
docs/fiddles/features/progress-bar/index.html
View file

@ -7,10 +7,9 @@
</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>.
</p>
<p>Keep an eye on the dock (Mac) or taskbar (Windows, Unity) for this application!</p>
<p>It should indicate a progress that advances from 0 to 100%.</p>
<p>It should then show indeterminate (Windows) or pin at 100% (other operating systems)
briefly and then loop.</p>
</body>
</html>

30
docs/fiddles/features/progress-bar/main.js
View file

@ -1,21 +1,39 @@
const { app, BrowserWindow } = require('electron')
let progressInterval
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
height: 600
})
win.loadFile('index.html')
win.setProgressBar(0.5)
}
const INCREMENT = 0.03
const INTERVAL_DELAY = 100 // ms
let c = 0
progressInterval = setInterval(() => {
// update progress bar to next value
// values between 0 and 1 will show progress, >1 will show indeterminate or stick at 100%
win.setProgressBar(c)
// increment or reset progress bar
if (c < 2) {
c += INCREMENT
} else {
c = (-INCREMENT * 5) // reset to a bit less than 0 to show reset state
}
}, INTERVAL_DELAY)
}
app.whenReady().then(createWindow)
// before the app is terminated, clear both timers
app.on('before-quit', () => {
clearInterval(progressInterval)
})
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {