Fauntleroy/index.html Secret

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
    <style>

    </style>
  </head>
  <body>
    <h1>Hello World!</h1>
    <!-- All of the Node.js APIs are available in this renderer process. -->
    We are using Node.js <script>document.write(process.versions.node)</script>,<br />
    Chromium <script>document.write(process.versions.chrome)</script>,<br />
    and Electron <script>document.write(process.versions.electron)</script>.<br />

    <button id="trigger-accessibility" type="button">Accessibility</button><br />
    <strong>Window: </strong><select id="window-selector"></select><br />
    <strong>Columns: </strong><input id="columns" type="number" value="5" />
    <strong>Rows: </strong><input id="rows" type="number" value="5" />
    <div class="rows-and-cols">
      <div class="start">
        [<input id="start-column" type="number" placeholder="1"/>,
        <input id="start-row" type="number" placeholder="3" />]
      </div>
      <span> to </span>
      <div class="end">
        [<input id="end-column" type="number" placeholder="1"/>,
        <input id="end-row" type="number" placeholder="3" />]
      </div>
    </div>

    <button id="trigger-set-window-size" type="button">Up</button><br />

    <script>
      // You can also require other files to run in this process
      require('./renderer.js')
    </script>
  </body>
</html>

## main.js
// window manager
const { windowManager } = require('node-window-manager');

// Modules to control application life and create native browser window
const { app, ipcMain, BrowserWindow } = require('electron');
const ipc = ipcMain;

// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let mainWindow

function createWindow () {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  // and load the index.html of the app.
  mainWindow.loadFile('index.html')

  // Open the DevTools.
  // mainWindow.webContents.openDevTools()

  // Emitted when the window is closed.
  mainWindow.on('closed', function () {
    // Dereference the window object, usually you would store windows
    // in an array if your app supports multi windows, this is the time
    // when you should delete the corresponding element.
    mainWindow = null
  })
}

// 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.on('ready', createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', function () {
  // On OS X 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 OS X 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 (mainWindow === null) {
    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.


ipc.on('accessibility', function () {
  windowManager.requestAccessibility(); // required on macOS
});

function getWindowById (id) {
  const _windows = windowManager.getWindows();

  for (_window of _windows) {
    if (_window.id === id) {
      return _window;
    }
  }
}

ipc.on('set-window-size', function (event, windowId, columns, rows, startColumn, startRow, endColumn, endRow) {
  console.log('go up');
  const { screen } = require('electron');


  const window = getWindowById(windowId);
  console.log('window', window);
  // const windowBounds = window.getBounds();
  // const display = screen.getDisplayMatching(window.getBounds());
  const display = screen.getPrimaryDisplay();

  // Moves the window.
  const displayWidth = display.workArea.width;
  const displayHeight = display.workArea.height;
  const resizeX = displayWidth * (startColumn / columns);
  const resizeY = displayHeight * (startRow / rows);
  const resizeWidth = (displayWidth * (endColumn / columns)) - resizeX;
  const resizeHeight = (displayHeight * (endRow / rows)) - resizeY;
console.log('cant set bounds?');
  window.setBounds({ x: resizeX, y: resizeY, width: resizeWidth, height: resizeHeight });
});

## renderer.js
// This file is required by the index.html file and will
// be executed in the renderer process for that window.
// All of the Node.js APIs are available in this process.

const { ipcRenderer } = require('electron');
const { windowManager } = require('node-window-manager');
const ipc = ipcRenderer;

const setWindowSizeElement = document.querySelector('#trigger-set-window-size');
const windowSelectorElement = document.querySelector('#window-selector');

// generate window selector options
const _windows = windowManager.getWindows();
for (_window of _windows) {
  const optionElement = document.createElement('option');
  optionElement.value = _window.id;
  optionElement.innerText = _window.path;
  windowSelectorElement.appendChild(optionElement);
}

setWindowSizeElement.addEventListener('click', function () {
  const windowId = parseInt(windowSelectorElement.value);
  const columns = parseInt(document.querySelector('#columns').value);
  const rows = parseInt(document.querySelector('#rows').value);
  const startColumn = parseInt(document.querySelector('#start-column').value);
  const startRow = parseInt(document.querySelector('#start-row').value);
  const endColumn = parseInt(document.querySelector('#end-column').value);
  const endRow = parseInt(document.querySelector('#end-row').value);

  ipc.send('set-window-size', windowId, columns, rows, startColumn, startRow, endColumn, endRow);
});

const triggerAccessibilityElement = document.querySelector('#trigger-accessibility');

triggerAccessibilityElement.addEventListener('click', function () {
  ipc.send('accessibility');
});
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Hello World!</title>
	<style>

	</style>
	</head>
	<body>
	<h1>Hello World!</h1>
	<!-- All of the Node.js APIs are available in this renderer process. -->
	We are using Node.js <script>document.write(process.versions.node)</script>,<br />
	Chromium <script>document.write(process.versions.chrome)</script>,<br />
	and Electron <script>document.write(process.versions.electron)</script>.<br />

	<button id="trigger-accessibility" type="button">Accessibility</button><br />
	<strong>Window: </strong><select id="window-selector"></select><br />
	<strong>Columns: </strong><input id="columns" type="number" value="5" />
	<strong>Rows: </strong><input id="rows" type="number" value="5" />
	<div class="rows-and-cols">
	<div class="start">
	[<input id="start-column" type="number" placeholder="1"/>,
	<input id="start-row" type="number" placeholder="3" />]
	</div>
	<span> to </span>
	<div class="end">
	[<input id="end-column" type="number" placeholder="1"/>,
	<input id="end-row" type="number" placeholder="3" />]
	</div>
	</div>

	<button id="trigger-set-window-size" type="button">Up</button><br />

	<script>
	// You can also require other files to run in this process
	require('./renderer.js')
	</script>
	</body>
	</html>
	// window manager
	const { windowManager } = require('node-window-manager');

	// Modules to control application life and create native browser window
	const { app, ipcMain, BrowserWindow } = require('electron');
	const ipc = ipcMain;

	// Keep a global reference of the window object, if you don't, the window will
	// be closed automatically when the JavaScript object is garbage collected.
	let mainWindow

	function createWindow () {
	// Create the browser window.
	mainWindow = new BrowserWindow({
	width: 800,
	height: 600,
	webPreferences: {
	nodeIntegration: true
	}
	})

	// and load the index.html of the app.
	mainWindow.loadFile('index.html')

	// Open the DevTools.
	// mainWindow.webContents.openDevTools()

	// Emitted when the window is closed.
	mainWindow.on('closed', function () {
	// Dereference the window object, usually you would store windows
	// in an array if your app supports multi windows, this is the time
	// when you should delete the corresponding element.
	mainWindow = null
	})
	}

	// 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.on('ready', createWindow)

	// Quit when all windows are closed.
	app.on('window-all-closed', function () {
	// On OS X 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 OS X 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 (mainWindow === null) {
	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.


	ipc.on('accessibility', function () {
	windowManager.requestAccessibility(); // required on macOS
	});

	function getWindowById (id) {
	const _windows = windowManager.getWindows();

	for (_window of _windows) {
	if (_window.id === id) {
	return _window;
	}
	}
	}

	ipc.on('set-window-size', function (event, windowId, columns, rows, startColumn, startRow, endColumn, endRow) {
	console.log('go up');
	const { screen } = require('electron');


	const window = getWindowById(windowId);
	console.log('window', window);
	// const windowBounds = window.getBounds();
	// const display = screen.getDisplayMatching(window.getBounds());
	const display = screen.getPrimaryDisplay();

	// Moves the window.
	const displayWidth = display.workArea.width;
	const displayHeight = display.workArea.height;
	const resizeX = displayWidth * (startColumn / columns);
	const resizeY = displayHeight * (startRow / rows);
	const resizeWidth = (displayWidth * (endColumn / columns)) - resizeX;
	const resizeHeight = (displayHeight * (endRow / rows)) - resizeY;
	console.log('cant set bounds?');
	window.setBounds({ x: resizeX, y: resizeY, width: resizeWidth, height: resizeHeight });
	});
	// This file is required by the index.html file and will
	// be executed in the renderer process for that window.
	// All of the Node.js APIs are available in this process.

	const { ipcRenderer } = require('electron');
	const { windowManager } = require('node-window-manager');
	const ipc = ipcRenderer;

	const setWindowSizeElement = document.querySelector('#trigger-set-window-size');
	const windowSelectorElement = document.querySelector('#window-selector');

	// generate window selector options
	const _windows = windowManager.getWindows();
	for (_window of _windows) {
	const optionElement = document.createElement('option');
	optionElement.value = _window.id;
	optionElement.innerText = _window.path;
	windowSelectorElement.appendChild(optionElement);
	}

	setWindowSizeElement.addEventListener('click', function () {
	const windowId = parseInt(windowSelectorElement.value);
	const columns = parseInt(document.querySelector('#columns').value);
	const rows = parseInt(document.querySelector('#rows').value);
	const startColumn = parseInt(document.querySelector('#start-column').value);
	const startRow = parseInt(document.querySelector('#start-row').value);
	const endColumn = parseInt(document.querySelector('#end-column').value);
	const endRow = parseInt(document.querySelector('#end-row').value);

	ipc.send('set-window-size', windowId, columns, rows, startColumn, startRow, endColumn, endRow);
	});

	const triggerAccessibilityElement = document.querySelector('#trigger-accessibility');

	triggerAccessibilityElement.addEventListener('click', function () {
	ipc.send('accessibility');
	});