mamarilmanson/index.js

## index.js
'use strict';
const electron = require('electron');

const app = electron.app;

// adds debug features like hotkeys for triggering dev tools and reload
require('electron-debug')();

// prevent window being garbage collected
var mainWindow;

function onClosed() {
	// dereference the window
	// for multiple windows store them in an array
	mainWindow = null;
}

function createMainWindow() {
	const win = new electron.BrowserWindow({
		width: 400,
		height: 600,
	});

	win.loadURL(`file://${__dirname}/main.html`);
	win.setMenu(null);
	win.on('closed', onClosed);

	win.isResizable(false);
	// createAppWindow();

	return win;
}


function createAppWindow() {
	var appwindow = new electron.BrowserWindow({
		minWidth: 400,
		width: 1270,
		height: 768,
	});

	appwindow.loadURL(`file://${__dirname}/app/app.html`);
	appwindow.on('closed', function () { appwindow = null });

	return appwindow;
}

function minimizeWindow() {
	BrowserWindow.getFocusedWindow().minimize();
}


app.on('window-all-closed', () => {
	if (process.platform !== 'darwin') {
		app.quit();
	}
});

app.on('activate', () => {
	if (!mainWindow) {
		mainWindow = createMainWindow();
	}
});

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


const ipc = require('electron').ipcMain
const dialog = require('electron').dialog

ipc.on('open-error-dialog', function (event) {
  dialog.showErrorBox('An Error Message', 'Demonstrating an error message.')
})

## main.html
<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<title>Electron boilerplate</title>
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css" />
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="main.css" />

	<script>
		window.$ = window.jQuery = require('./bootstrap/js/jquery.min.js');
	</script>
	<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="main.js"></script>
</head>

<body>
	<div class="container-fluid">
		<!-- <div style="height: 50px">
			<button onclick="javascript:window.close()" class="btn pull-right">
				<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
			</button>
		</div> -->
		<form class="login">
			<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Employee No.">
			<input type="password" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Password">
			<button type="button" id="login" class="btn btn-primary btn-block">Login</button>
		</form>
	</div>
</body>

</html>

## main.js
const ipc = require('electron').ipcRenderer

const errorBtn = document.getElementById('login')

errorBtn.addEventListener('click', function (event) {
  ipc.send('open-error-dialog')
})
	'use strict';
	const electron = require('electron');

	const app = electron.app;

	// adds debug features like hotkeys for triggering dev tools and reload
	require('electron-debug')();

	// prevent window being garbage collected
	var mainWindow;

	function onClosed() {
	// dereference the window
	// for multiple windows store them in an array
	mainWindow = null;
	}

	function createMainWindow() {
	const win = new electron.BrowserWindow({
	width: 400,
	height: 600,
	});

	win.loadURL(`file://${__dirname}/main.html`);
	win.setMenu(null);
	win.on('closed', onClosed);

	win.isResizable(false);
	// createAppWindow();

	return win;
	}


	function createAppWindow() {
	var appwindow = new electron.BrowserWindow({
	minWidth: 400,
	width: 1270,
	height: 768,
	});

	appwindow.loadURL(`file://${__dirname}/app/app.html`);
	appwindow.on('closed', function () { appwindow = null });

	return appwindow;
	}

	function minimizeWindow() {
	BrowserWindow.getFocusedWindow().minimize();
	}


	app.on('window-all-closed', () => {
	if (process.platform !== 'darwin') {
	app.quit();
	}
	});

	app.on('activate', () => {
	if (!mainWindow) {
	mainWindow = createMainWindow();
	}
	});

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


	const ipc = require('electron').ipcMain
	const dialog = require('electron').dialog

	ipc.on('open-error-dialog', function (event) {
	dialog.showErrorBox('An Error Message', 'Demonstrating an error message.')
	})
	<!doctype html>
	<html>

	<head>
	<meta charset="utf-8">
	<title>Electron boilerplate</title>
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css" />
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="main.css" />

	<script>
	window.$ = window.jQuery = require('./bootstrap/js/jquery.min.js');
	</script>
	<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="main.js"></script>
	</head>

	<body>
	<div class="container-fluid">
	<!-- <div style="height: 50px">
	<button onclick="javascript:window.close()" class="btn pull-right">
	<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
	</button>
	</div> -->
	<form class="login">
	<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Employee No.">
	<input type="password" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Password">
	<button type="button" id="login" class="btn btn-primary btn-block">Login</button>
	</form>
	</div>
	</body>

	</html>
	const ipc = require('electron').ipcRenderer

	const errorBtn = document.getElementById('login')

	errorBtn.addEventListener('click', function (event) {
	ipc.send('open-error-dialog')
	})