title: How to take screenshot using electronjs?
body: <p>I'm building a cross-platform desktop application. I'm using electronjs framework for my desktop app development.And I want to add a functionality of taking screenshot every 5 minutes when my app starts!</p>
  
  <p>help will be appreciated
  my main.js</p>
  
  <pre><code>// Modules to control application life and create native browser window
  const {app, BrowserWindow,Tray,Menu} = require('electron')
  const path = require('path')
  const iconz = path.join(__dirname,'/img/download.png')
  const fs = require('fs')
  var config = require('./login.json');
  const shell = require('electron').shell
  
  
  
  let tray = null
  
  
  
  function createWindow () {
  
    tray = new Tray(iconz)
    const contextMenu = Menu.buildFromTemplate([
      { label: 'User:'+ config.username, type: 'radio',enabled:false},
      {type:'separator'},
      { label: 'Show DeskTime', type: 'radio',
      click() { 
        shell.openExternal('http://coinmarketcap.com')
        } 
      },
      {type:'separator'},
      { label: 'Private Time', type: 'radio',
      click() { 
        checked:true
        } 
      },
      {type:'separator'},
      { label: 'LogOut', type: 'radio' },
      {type:'separator'},
      { label: 'Quit', type: 'radio',
        click() { 
            app.quit() 
        }
      }
    ])
    tray.setToolTip('This is my application.')
    tray.setContextMenu(contextMenu)
  
  
  
    console.log(config.username + ' ' + config.password);
    if(config.username == ""){
  
     // Create the browser window.
    const mainWindow = new BrowserWindow({
      width: 800,
      height: 600,
      webPreferences: {
        preload: path.join(__dirname, 'preload.js')
      }
    })
  
   // and load the index.html of the app.
    mainWindow.loadFile('index.html')
  
    }
  
  
  
    // Open the DevTools.
    // mainWindow.webContents.openDevTools()
  }
  
  // This method will be called when Electron has finished
  // initialization and is ready to create browser windows.
  // Some APIs can only be used after this event occurs.
  app.whenReady().then(createWindow)
  
  // Quit when all windows are closed.
  app.on('window-all-closed', function () {
    // On macOS it is common for applications and their menu bar
    // to stay active until the user quits explicitly with Cmd + Q
    if (process.platform !== 'darwin') app.quit()
  })
  
  
  
  app.on('activate', function () {
  
    // On macOS it's common to re-create a window in the app when the
    // dock icon is clicked and there are no other windows open.
    if (BrowserWindow.getAllWindows().length === 0) createWindow()
  })
  
  // In this file you can include the rest of your app's specific main process
  // code. You can also put them in separate files and require them here.
  
  </code></pre>
  
  <p>my index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;style&gt;
  body {font-family: Arial, Helvetica, sans-serif;}
  form {border: 3px solid #f1f1f1;}
  
  input[type=text], input[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }
  
  button {
    background-color: #4CAF50;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
  }
  
  button:hover {
    opacity: 0.8;
  }
  
  .cancelbtn {
    width: auto;
    padding: 10px 18px;
    background-color: #f44336;
  }
  
  .imgcontainer {
    text-align: center;
    margin: 12px 0 6px 0;
  }
  
  img.avatar {
    width: 20%;
    border-radius: 40%;
  }
  
  .container {
    padding: 16px;
  }
  
  span.psw {
    float: right;
    padding-top: 16px;
  }
  
  /* Change styles for span and cancel button on extra small screens */
  @media screen and (max-width: 300px) {
    span.psw {
       display: block;
       float: none;
    }
    .cancelbtn {
       width: 100%;
    }
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;h2&gt;Login Form&lt;/h2&gt;
  
  &lt;form action="/action_page.php" method="post"&gt;
    &lt;div class="imgcontainer"&gt;
      &lt;img src="login_logo.png" alt="Avatar" class="avatar"&gt;
    &lt;/div&gt;
  
    &lt;div class="container"&gt;
      &lt;label for="uname"&gt;&lt;b&gt;Username&lt;/b&gt;&lt;/label&gt;
      &lt;input type="text" placeholder="Enter Username" name="uname" required&gt;
  
      &lt;label for="psw"&gt;&lt;b&gt;Password&lt;/b&gt;&lt;/label&gt;
      &lt;input type="password" placeholder="Enter Password" name="psw" required&gt;
  
      &lt;button type="submit"&gt;Login&lt;/button&gt;
      &lt;label&gt;
        &lt;input type="checkbox" checked="checked" name="remember"&gt; Remember me
      &lt;/label&gt;
  
    &lt;/div&gt;
  
    &lt;div class="container" style="background-color:#f1f1f1"&gt;
  
  
      &lt;span class="psw"&gt;Forgot &lt;a href="#"&gt;password?&lt;/a&gt;&lt;/span&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  &lt;label id="screenshot-path"&gt;Path:&lt;/label&gt;
  &lt;button  id="screen-shot" type="button" class="cancelbtn"&gt;Singup&lt;/button&gt;
  &lt;/body&gt;
  
     &lt;script src="./renderer.js"&gt;&lt;/script&gt;
  
  
  &lt;/html&gt;
  
  
  
  
  </code></pre>
  
  <p>My codes are given above, please go through this and help me to take screenshot on a certain interval.And also how to save in screen shots in predefined folder.</p>