docs: add app information example (#20487)
* docs: add app information example * Code review changes * Remove demo-control css class, link href change
This commit is contained in:
		
					parent
					
						
							
								eaf2c61bef
							
						
					
				
			
			
				commit
				
					
						06285f0bf1
					
				
			
		
					 4 changed files with 49 additions and 0 deletions
				
			
		| 
						 | 
				
			
			@ -0,0 +1,26 @@
 | 
			
		|||
<!DOCTYPE html>
 | 
			
		||||
<html>
 | 
			
		||||
  <head>
 | 
			
		||||
    <meta charset="UTF-8">
 | 
			
		||||
  </head>
 | 
			
		||||
  <body>
 | 
			
		||||
    <div>
 | 
			
		||||
      <div>
 | 
			
		||||
        <h1>App Information</h1>
 | 
			
		||||
        <div>
 | 
			
		||||
          <div>
 | 
			
		||||
            <button id="app-info">View Demo</button>
 | 
			
		||||
            <span id="got-app-info"></span>
 | 
			
		||||
          </div>
 | 
			
		||||
          <p>The main process <code>app</code> module can be used to get the path at which your app is located on the user's computer.</p>
 | 
			
		||||
          <p>In this example, to get that information from the renderer process, we use the <code>ipc</code> module to send a message to the main process requesting the app's path.</p>
 | 
			
		||||
          <p>See the <a id="electron-docs" href="https://electronjs.org/docs/api/app">app module documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> for more.</p>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <script>
 | 
			
		||||
      // You can also require other files to run in this process
 | 
			
		||||
      require('./renderer.js')
 | 
			
		||||
    </script>
 | 
			
		||||
  </body>
 | 
			
		||||
</html> 
 | 
			
		||||
| 
						 | 
				
			
			@ -0,0 +1,5 @@
 | 
			
		|||
const {app, ipcMain} = require('electron')
 | 
			
		||||
 | 
			
		||||
ipcMain.on('get-app-path', (event) => {
 | 
			
		||||
  event.sender.send('got-app-path', app.getAppPath())
 | 
			
		||||
})
 | 
			
		||||
| 
						 | 
				
			
			@ -0,0 +1,18 @@
 | 
			
		|||
const {ipcRenderer} = require('electron')
 | 
			
		||||
 | 
			
		||||
const appInfoBtn = document.getElementById('app-info')
 | 
			
		||||
const electron_doc_link = document.querySelectorAll('a[href]')
 | 
			
		||||
 | 
			
		||||
appInfoBtn.addEventListener('click', () => {
 | 
			
		||||
  ipcRenderer.send('get-app-path')
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
ipcRenderer.on('got-app-path', (event, path) => {
 | 
			
		||||
  const message = `This app is located at: ${path}`
 | 
			
		||||
  document.getElementById('got-app-info').innerHTML = message
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
electron_doc_link.addEventListener('click', (e) => {
 | 
			
		||||
  e.preventDefault()
 | 
			
		||||
  shell.openExternal(url)
 | 
			
		||||
})
 | 
			
		||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue