Created
October 10, 2019 20:33
-
-
Save harryi3t/a33c2931ad61a9be60a1e2f472b6dd6b to your computer and use it in GitHub Desktop.
Electron Fiddle Gist
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| </head> | |
| <body> | |
| <div> | |
| <h3>Take a Screenshot</h3> | |
| <i>Supports: Win, macOS, Linux <span>|</span> Process: Renderer</i> | |
| <div> | |
| <div> | |
| <div> | |
| <button id="screen-shot">View Demo</button> | |
| <span id="screenshot-path"></span> | |
| </div> | |
| <p>This demo uses the <code>desktopCapturer</code> module to gather screens in use and select the entire screen and take a snapshot of what is visible.</p> | |
| <p>Clicking the demo button will take a screenshot of your current screen and open it in your default viewer.</p> | |
| </div> | |
| </div> | |
| <script> | |
| // You can also require other files to run in this process | |
| require('./renderer.js') | |
| </script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const { BrowserWindow, app } = require('electron') | |
| let mainWindow = null | |
| function createWindow () { | |
| const windowOptions = { | |
| width: 600, | |
| height: 300, | |
| title: 'Desktop Capturer', | |
| webPreferences: { | |
| nodeIntegration: true | |
| } | |
| } | |
| mainWindow = new BrowserWindow(windowOptions) | |
| mainWindow.loadFile('index.html') | |
| mainWindow.on('closed', () => { | |
| mainWindow = null | |
| }) | |
| } | |
| app.on('ready', () => { | |
| createWindow() | |
| }) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const {desktopCapturer} = require('electron') | |
| const {screen, shell} = require('electron').remote | |
| const fs = require('fs') | |
| const os = require('os') | |
| const path = require('path') | |
| const screenshot = document.getElementById('screen-shot') | |
| const screenshotMsg = document.getElementById('screenshot-path') | |
| screenshot.addEventListener('click', (event) => { | |
| screenshotMsg.textContent = 'Gathering screens...' | |
| const thumbSize = determineScreenShotSize() | |
| let options = { types: ['screen'], thumbnailSize: thumbSize } | |
| desktopCapturer.getSources(options, (error, sources) => { | |
| if (error) return console.log(error) | |
| sources.forEach((source) => { | |
| if (source.name === 'Entire screen' || source.name === 'Screen 1') { | |
| const screenshotPath = path.join(os.tmpdir(), 'screenshot.png') | |
| fs.writeFile(screenshotPath, source.thumbnail.toPNG(), (error) => { | |
| if (error) return console.log(error) | |
| shell.openExternal(`file://${screenshotPath}`) | |
| const message = `Saved screenshot to: ${screenshotPath}` | |
| screenshotMsg.textContent = message | |
| }) | |
| } | |
| }) | |
| }) | |
| }) | |
| function determineScreenShotSize () { | |
| const screenSize = screen.getPrimaryDisplay().workAreaSize | |
| const maxDimension = Math.max(screenSize.width, screenSize.height) | |
| return { | |
| width: maxDimension * window.devicePixelRatio, | |
| height: maxDimension * window.devicePixelRatio | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment