Skip to content

Instantly share code, notes, and snippets.

@vmars316

vmars316/index.html

Last active January 15, 2022 22:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vmars316/3b9c3d226e3fb87178423ee981079901 to your computer and use it in GitHub Desktop.
Save vmars316/3b9c3d226e3fb87178423ee981079901 to your computer and use it in GitHub Desktop.
Download ZIP
SafeBrowser-05
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<header>
<div id="mainDiv" style="text-align: center;">
<button id="back"><-</button>
<button id="forward">-></button>
<input id="url" type="url" value="https://google.com"/>
<button id="go">Go</button>
<button id="devtools">Toggle devtools</button>
</div>
</header>
</body>
<script>
// require('electron').ipcRenderer.on('Send-url', (__event, url) => {
// console.log("require('electron').ipcRenderer.on('Send-url" + url);
// document.getElementById("url").value = url;
// }
let url ;
document.getElementById('back')
.addEventListener('click', () => browserview.back())
document.getElementById('forward')
.addEventListener('click', () => browserview.forward())
document.getElementById('go')
.addEventListener('click', () => browserview.loadURL(document.getElementById('url').value))
document.getElementById('devtools')
.addEventListener('click', () => browserview.toggleDevtools())
</script>
</html>
Raw
main.js
const { app, BrowserWindow, BrowserView, ipcMain } = require('electron')
const path = require('path')
const url = require('url')
let win ;
let view ;
let urL ;
async function main() {
await app.whenReady()
win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
preload: path.join(__dirname, 'preload.js')
}
})
win.loadFile(path.join(__dirname, 'index.html'))
view = new BrowserView()
view.setBounds({
// y: 21,
y: 30,
x: 0,
width: win.getBounds().width,
// height: win.getBounds().height - 21
height: win.getBounds().height - 30
})
view.setAutoResize({
width: true, height: true
})
win.setBrowserView(view)
// view.webContents.loadURL("https://duckduckgo.com")
view.webContents.loadURL("http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html")
/* view.setBounds({
// y: 21,
y: 40,
x: 0,
width: win.getBounds().width,
// height: win.getBounds().height - 21
height: win.getBounds().height - 30
})
*/
view.webContents.openDevTools({ mode: 'detach' });
// win.webContents.openDevTools({ mode: 'detach' });
// ==============================================
view.webContents.on('will-navigate', (event, urL) => {
console.log(" 1 main.js view.webContents.on( will-navigate = " + urL)
win.webContents.send('Send-url', urL) ;
})
view.webContents.on('dom-ready', (event) => {
console.log(" 3 main.js view.webContents.on('dom-ready') ")
win.webContents.send('dom-ready') ;
})
/*
view.webContents.on('did-start-navigation', (event, urL) => {
console.log("2 main.js 'did-start-navigation' = " + urL)
win.webContents.send('Send-url', urL) ;
}) // 'did-start-navigation'
*/
ipcMain.on('browserview-load-url', (_, url) => {
console.log('main.js Loading URL', url)
view.webContents.loadURL(url)
})
ipcMain.on('browserview-back', () => {
console.log('Going back in history...')
view.webContents.goBack()
})
ipcMain.on('browserview-forward', () => {
console.log('Going forward in history...')
view.webContents.goForward()
})
ipcMain.on('browserview-toggle-devtools', () => {
console.log('Toggling devtools')
view.webContents.toggleDevTools()
})
}
main()
Raw
package.json
{
"name": "delirious-seat-read-iapok",
"productName": "delirious-seat-read-iapok",
"description": "My Electron application description",
"keywords": [],
"main": "./main.js",
"version": "1.0.0",
"author": "vmars",
"scripts": {
"start": "electron ."
},
"dependencies": {},
"devDependencies": {
"electron": "16.0.5"
}
}
Raw
preload.js
const { ipcRenderer, contextBridge, webcontents } = require('electron')
let urL ;
let contents;
let Target = [];
contextBridge.exposeInMainWorld('browserview', {
loadURL: (url) => ipcRenderer.send('browserview-load-url', url),
back: () => ipcRenderer.send('browserview-back'),
forward: () => ipcRenderer.send('browserview-forward'),
toggleDevtools: () => ipcRenderer.send('browserview-toggle-devtools'),
})
ipcRenderer.on('Send-url', (event , urL) => {
alert('4 preload.js ipcRenderer.on urL = ' + urL)
document.getElementById("url").value = urL;
alert(webContents)
})
function ChangeBlankToSelf() {
Target = document.getElementsByTagName('A');
// This shows undefined
alert("Target = " + Target[0])
// This isn't working
if (typeof Target !== 'undefined' || Target.length === 0){
alert("typeof Target !== 'undefined' || Target.length === 0")
} else {
// array is defined but has no element
for (var i = 0; i < Target.length; i++) {
alert("Target = ", Target[i]);
if (Target[i].hasAttribute("target")) {
Target[i].setAttribute("target", "_self");
}
}
}
// This works
alert('End of: ChangeBlankToSelf()')
}
// This works
ipcRenderer.on('dom-ready' , (event) => {
alert("5 preload.js NOW EDIT Target='_blank' ")
ChangeBlankToSelf()
})
Raw
renderer.js
// This file is required by the index.html file and will
// be executed in the renderer process for that window.
// No Node.js APIs are available in this process because
// `nodeIntegration` is turned off. Use `preload.js` to
// selectively enable features needed in the rendering
// process.
Raw
styles.css
/* styles.css */
/* Add styles here to customize the appearance of your app */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment