Playing with some dialogs

src/electron/websocket-events.js

@@ -1,11 +1,13 @@
-const {getExifTags} = require('./exif-helpers');
 /**
  * Websocket event handlers
  */
-const {JSONMessage} = require('../helpers/web-socket');
+const {dialog, BrowserWindow} = require('electron');
 // eslint-disable-next-line
 const WebSocket = require('ws');
 
+const {getExifTags} = require('./exif-helpers');
+const {JSONMessage} = require('../helpers/web-socket');
+
 const wss = new WebSocket.Server({
 	perMessageDeflate: false,
 	port: 65432,
@@ -22,17 +24,47 @@ wss.broadcast = (data) => {
 wss.on('connection', ws => {
 	ws.send(JSONMessage('server-log', 'Connected to client!'));
 	ws.on('message', async (...args) => {
-		const [type, message] = JSON.parse(args);
-		switch (type) {
-			case 'dropped-files':
-				const filemap = await Promise.all(
-					message.map(file => getExifTags(file))
-				);
-				wss.broadcast(JSONMessage('parsed-exif-tags', await filemap));
-				break;
+		try {
+			const [type, message] = JSON.parse(args);
+			switch (type) {
+				case 'dropped-files':
+					const filemap = await Promise.all(
+						message.map(file => getExifTags(file))
+					);
+					wss.broadcast(JSONMessage('parsed-exif-tags', await filemap));
+					break;
 
-			default:
-				return ws.send(JSONMessage('server-log', [type, message]));
+				case 'show-open-dialog':
+					const files = dialog.showOpenDialog(BrowserWindow.getFocusedWindow(), {
+						filters: [{
+							extension: ['jpg', 'jpeg', 'tif', 'tiff', 'dng'],
+							name: 'EXIF image types',
+						}, {
+							extensions: ['*'],
+							name: 'All Files',
+						}],
+						properties: [
+							'openFile',
+							'multiSelections',
+						],
+					});
+					wss.broadcast(JSONMessage('selected-files', files));
+					break;
+
+				case 'show-save-dialog':
+					const saveFile = dialog.showSaveDialog(BrowserWindow.getFocusedWindow());
+					wss.broadcast(JSONMessage('save-file-location', saveFile));
+					break;
+
+				case 'show-error-box':
+					dialog.showErrorBox('An Error has Occured',	message);
+					break;
+
+				default:
+					return ws.send(JSONMessage('server-log', [type, message]));
+			}
+		} catch (e) {
+			console.info(args);
 		}
 	});
 });

src/views/HomeView.js

@@ -1,4 +1,6 @@
 import {
+	Button,
+	Col,
 	Container,
 	Jumbotron,
 	Row,
@@ -22,6 +24,21 @@ function handleDragOver (e) {
 	e.stopPropagation();
 }
 
+function showOpenDialog () {
+	window.clientWS.send(JSONMessage('show-open-dialog', {}));
+}
+
+function showSaveDialog () {
+	window.clientWS.send(JSONMessage('show-save-dialog', {}));
+}
+
+function showErrorDialog () {
+	window.clientWS.send(JSONMessage(
+		'show-error-box',
+		'Looks like there was a problem. (╥﹏╥) \n (╯°□°）╯︵ ┻━┻'
+	));
+}
+
 export const HomeView = (props) => {
 	return (
 		<Jumbotron onDrop={handleDrop} onDragover={handleDragOver}>
@@ -36,6 +53,17 @@ export const HomeView = (props) => {
 						Drop files here.
 					</p>
 				</Row>
+				<Row>
+					<Col md={4}>
+						<Button onClick={showOpenDialog}>Show Open Dialog</Button>
+					</Col>
+					<Col md={4}>
+						<Button onClick={showSaveDialog}>Show Save Dialog</Button>
+					</Col>
+					<Col md={4}>
+						<Button onClick={showErrorDialog}>Show Error Dialog</Button>
+					</Col>
+				</Row>
 			</Container>
 		</Jumbotron>
 	);