vmars316/index.html Secret

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Stay Safe Browser</title>
<!--    <link rel="stylesheet" type="text/css" href="./KidSafeBrowser.css">  -->
  </head>
  <body>
  <div id="mainDiv" style="text-align: center;">
	<button id="back">Back</button>
    <button id="forward">Forward</button>
	<button id="reload">Refresh</button>
	<button id="home">Home</button>
     <input id="url" style="width: 200px;"  type="url" value="http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html"/>
     <button id="go">Go</button>
     <button id="code">Source</button>
  </div>
    <script>
      // You can also require other files to run in this process
      require('./renderer.js')
    </script>
  </body>
</html>

## main.js
const {app, BrowserWindow, BrowserView, webContents, ipcMain} = require('electron') ;
var viewWebContents = [] ;
let win ;
let view ;
let code ;

// @vmars316 you can use view-source:file://path/to/file

function createWindow ( ) {
var win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true }
  })
  const view = new BrowserView({webpreference: {nodeIndegration: true }})
  win.setBrowserView(view)
  win.webContents.openDevTools({ mode: 'detach' })  // separate page
  win.loadFile('index.html')
  view.setBounds({ x: 0, y: 60, width: 800, height: 600 })
  view.webContents.loadURL('http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html')
  view.setAutoResize({width: true, height: true})
  view.webContents.openDevTools({ mode: 'detach' })  // separate page
var code = new BrowserWindow({ width: 700, height: 500, webPreferences: { nodeIntegration: true }
  })
code.loadFile('code.html') ;
// =========================================
  ipcMain.handle('go', (_event, url) => {  // Button issued-by-renderer.js
    holdUrl = url ;
	console.log("main.js  ipcMain.handle( GO = " + holdUrl)
  view.webContents.loadURL(holdUrl)
  }) // 'go'
// =========================================
  ipcMain.handle('code', (_event ) => {  // Button issued-by-renderer.js
	console.log("main.js  ipcMain.handle( 'code' ")

	  var contents = win.webContents
      console.log(contents)

	viewWebContents = view.webContents
    console.log(' viewWebContents = ' + viewWebContents )

    console.log(' viewWebContents = ' + viewWebContents )
	console.log(webContents)
	viewWebContents = view.getFocusedWebContents
    console.log(' viewWebContents = ' + viewWebContents )
  }) // 'code'
// =========================================
  ipcMain.handle('navigate', (_event, url) => {  // issued-by-renderer.js
    view.webContents.loadURL(url)
	console.log("main.js ipcMain.handle( navigate = " + url)
//    win.webContents.send('update-address-bar', url) ;
  }) // 'navigate'
//  ===========================================


// =========================================
} //  function createWindow ( )

app.on('ready', () => {
    createWindow() ;
})

app.on('window-all-closed', () => {
  app.quit()
})

## preload.js
// Empty

## renderer.js
const { ipcRenderer } = require('electron')
const back = document.getElementById('back')
const forward = document.getElementById('forward')
const refresh= document.getElementById('refresh')
const home = document.getElementById('home')
const url = document.getElementById('url')
const go = document.getElementById('go')
const search = document.getElementById('search')
const homeUrl = "http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html" ;

var holdUrl = "" ;
var isLoading = false;
var NavigateToo = "" ;
var SafeSite = false ;
var links = "" ;
var thisLinkClicked = "" ;

onload = function() {
}  // EndOf   onload = function

// === renderer.js addEventListener
go.addEventListener('click', () => {
  holdUrl = url.value ;
  ipcRenderer.invoke('go', holdUrl) ;
  })

code.addEventListener('click', () => {
  alert('Just Clicked codeButton  ')
  console.log('Just Clicked codeButton ')
  ipcRenderer.invoke('code') ;
  })
// === Endof  renderer.js  addEventListener

// === renderer.js is Called from ipcMain eventListeners

ipcRenderer.on('back-or-forward-navigated' , function(event , holdUrl){
 	document.getElementById("url").value = holdUrl ;
}) // 'back-or-forward-navigate'

ipcRenderer.on('update-address-bar-only' , function(event, url){
  holdUrl = url ;
  document.getElementById("url").value = url ;
  console.log("ipcRenderer.on('update-address-bar-only , function(event, url) =  " + holdUrl )
}) // 'update-address-bar-only'

ipcRenderer.on('update-address-bar-navigate' , function(event, url){
  holdUrl = url ;
  document.getElementById("url").value = url ;
//  console("function ipcRenderer.on('update-address-bar-navigate' =  " + holdUrl)
  ipcRenderer.invoke('navigate', url)
}) // 'update-address-bar-navigate'

## styles.css
/* Empty */
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Stay Safe Browser</title>
	<!-- <link rel="stylesheet" type="text/css" href="./KidSafeBrowser.css"> -->
	</head>
	<body>
	<div id="mainDiv" style="text-align: center;">
	<button id="back">Back</button>
	<button id="forward">Forward</button>
	<button id="reload">Refresh</button>
	<button id="home">Home</button>
	<input id="url" style="width: 200px;" type="url" value="http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html"/>
	<button id="go">Go</button>
	<button id="code">Source</button>
	</div>
	<script>
	// You can also require other files to run in this process
	require('./renderer.js')
	</script>
	</body>
	</html>
	const {app, BrowserWindow, BrowserView, webContents, ipcMain} = require('electron') ;
	var viewWebContents = [] ;
	let win ;
	let view ;
	let code ;

	// @vmars316 you can use view-source:file://path/to/file

	function createWindow ( ) {
	var win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true }
	})
	const view = new BrowserView({webpreference: {nodeIndegration: true }})
	win.setBrowserView(view)
	win.webContents.openDevTools({ mode: 'detach' }) // separate page
	win.loadFile('index.html')
	view.setBounds({ x: 0, y: 60, width: 800, height: 600 })
	view.webContents.loadURL('http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html')
	view.setAutoResize({width: true, height: true})
	view.webContents.openDevTools({ mode: 'detach' }) // separate page
	var code = new BrowserWindow({ width: 700, height: 500, webPreferences: { nodeIntegration: true }
	})
	code.loadFile('code.html') ;
	// =========================================
	ipcMain.handle('go', (_event, url) => { // Button issued-by-renderer.js
	holdUrl = url ;
	console.log("main.js ipcMain.handle( GO = " + holdUrl)
	view.webContents.loadURL(holdUrl)
	}) // 'go'
	// =========================================
	ipcMain.handle('code', (_event ) => { // Button issued-by-renderer.js
	console.log("main.js ipcMain.handle( 'code' ")

	var contents = win.webContents
	console.log(contents)

	viewWebContents = view.webContents
	console.log(' viewWebContents = ' + viewWebContents )

	console.log(' viewWebContents = ' + viewWebContents )
	console.log(webContents)
	viewWebContents = view.getFocusedWebContents
	console.log(' viewWebContents = ' + viewWebContents )
	}) // 'code'
	// =========================================
	ipcMain.handle('navigate', (_event, url) => { // issued-by-renderer.js
	view.webContents.loadURL(url)
	console.log("main.js ipcMain.handle( navigate = " + url)
	// win.webContents.send('update-address-bar', url) ;
	}) // 'navigate'
	// ===========================================





	// =========================================
	} // function createWindow ( )

	app.on('ready', () => {
	createWindow() ;
	})

	app.on('window-all-closed', () => {
	app.quit()
	})
	const { ipcRenderer } = require('electron')
	const back = document.getElementById('back')
	const forward = document.getElementById('forward')
	const refresh= document.getElementById('refresh')
	const home = document.getElementById('home')
	const url = document.getElementById('url')
	const go = document.getElementById('go')
	const search = document.getElementById('search')
	const homeUrl = "http://vmars.us/KidSafeBrowser/KidSafeBrowserHome.html" ;

	var holdUrl = "" ;
	var isLoading = false;
	var NavigateToo = "" ;
	var SafeSite = false ;
	var links = "" ;
	var thisLinkClicked = "" ;

	onload = function() {
	} // EndOf onload = function

	// === renderer.js addEventListener
	go.addEventListener('click', () => {
	holdUrl = url.value ;
	ipcRenderer.invoke('go', holdUrl) ;
	})

	code.addEventListener('click', () => {
	alert('Just Clicked codeButton ')
	console.log('Just Clicked codeButton ')
	ipcRenderer.invoke('code') ;
	})
	// === Endof renderer.js addEventListener

	// === renderer.js is Called from ipcMain eventListeners

	ipcRenderer.on('back-or-forward-navigated' , function(event , holdUrl){
	document.getElementById("url").value = holdUrl ;
	}) // 'back-or-forward-navigate'

	ipcRenderer.on('update-address-bar-only' , function(event, url){
	holdUrl = url ;
	document.getElementById("url").value = url ;
	console.log("ipcRenderer.on('update-address-bar-only , function(event, url) = " + holdUrl )
	}) // 'update-address-bar-only'

	ipcRenderer.on('update-address-bar-navigate' , function(event, url){
	holdUrl = url ;
	document.getElementById("url").value = url ;
	// console("function ipcRenderer.on('update-address-bar-navigate' = " + holdUrl)
	ipcRenderer.invoke('navigate', url)
	}) // 'update-address-bar-navigate'