Merge pull request #5 from oslabs-beta/staging

Frontend

.gitignore

@@ -1,2 +1,3 @@
 /node_modules
-/.vscode
+/.vscode
+/dist

README.md

@@ -1 +1 @@
-SeeQR: A database analytic tool that allows a developer to compare the efficiency of different schemas and queries on a granular level to make better informed architectural decisions regarding SQL databases at various scales.
+SeeQR: A database analytic tool that allows a developer to compare the efficiency of different schemas and queries on a granular level to make better informed architectural decisions regarding SQL databases at various scales.

backend/main.js

@@ -0,0 +1,89 @@
+// main.js is the entry point to the main process (the node process)
+
+// Import parts of electron to use
+const { app, BrowserWindow } = require('electron');
+const path = require('path');
+const url = require('url');
+
+/************************************************************
+********* CREATE & CLOSE WINDOW UPON INITIALIZATION *********
+************************************************************/
+
+// 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;
+
+// Keep a reference for dev mode
+let dev = false;
+if (process.env.NODE_ENV !== undefined && process.env.NODE_ENV === 'development') {
+  dev = true;
+}
+
+// Create browser window
+function createWindow() {
+  mainWindow = new BrowserWindow({
+    width: 1600,
+    height: 1200,
+    minWidth: 800,
+    minHeight: 600,
+    title: "SeeQR",
+    show: false,
+    webPreferences: {
+      nodeIntegration: true,
+    },
+  });
+
+  // Load index.html of the app
+  let indexPath;
+  if (dev && process.argv.indexOf('--noDevServer') === -1) {
+    indexPath = url.format({
+      protocol: 'http:',
+      host: 'localhost:8080',
+      pathname: 'index.html',
+      slashes: true,
+    });
+    mainWindow.webContents.openDevTools();
+  } else {
+    // In production mode, load the bundled version of index.html inside the dist folder.
+    indexPath = url.format({
+      protocol: 'file:',
+      pathname: path.join(__dirname, '../dist', 'index.html'),
+      slashes: true,
+    });
+  }
+
+  mainWindow.loadURL(indexPath);
+  // Don't show until we are ready and loaded
+  mainWindow.once('ready-to-show', () => {
+    mainWindow.show();
+  });
+  // Emitted when the window is closed.
+  mainWindow.on('closed', function () {
+    // De-reference 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;
+  });
+}
+
+// Invoke createWindow to create browser windows after 
+// Electron has been initialized.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', () => {
+  // On macOS 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', () => {
+  // On macOS 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();
+  }
+});

frontend/components/App.jsx

@@ -0,0 +1,51 @@
+import React from 'react';
+
+const { remote } = require('electron');
+const { dialog } = remote;
+
+
+class App extends React.Component {
+  constructor(props) {
+    super(props);
+    // this.handleFileClick = this.handleFileClick.bind(this);
+  }
+
+  // handleFileClick() {
+  //   const options = {
+  //     filters: [
+  //       { name: 'Images', extensions: ['png'] },
+  //       { name: 'Custom File Type', extensions: ['as'] },
+  //     ]
+  //   }
+
+  //   dialog.showOpenDialog({
+  //     properties: ['openFile', 'multiSelections']
+  //   }, function (files) {
+  //     if (files !== undefined) {
+  //       // handle files
+  //       console.log('file path undefined');
+  //     }
+  //   })
+  //     .then(result => {
+  //       console.log('result', result);
+  //     })
+  //     .catch(err => {
+  //       console.log(err);
+  //     })
+  // };
+
+  render() {
+    return (
+      <div>
+        <h1 style={{ "color": "black" }}>SeeQR</h1>
+        {/* <h3 style={{ "color": "black" }}>Welcome!</h3>
+        <h3 style={{ "color": "black" }}>Import database?</h3>
+        <button>Skip</button>
+        <button onClick={this.handleFileClick}>Yes</button> */}
+      </div >
+    )
+  }
+
+}
+
+export default App;

frontend/index.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { render } from 'react-dom';
+import App from './components/App';
+
+const root = document.createElement('div');
+root.id = 'root';
+document.body.appendChild(root);
+
+
+render(
+  <div>
+    <App />
+  </div>,
+  document.getElementById('root')
+);