Copy static assets from GUI, load GUI from dist/

package.json

@@ -17,6 +17,7 @@
     "@babel/preset-react": "^7.0.0",
     "babel-eslint": "^10.0.0",
     "babel-plugin-react-intl": "^3.0.1",
+    "copy-webpack-plugin": "^4.5.2",
     "electron": "2.0.7",
     "electron-builder": "^20.28.1",
     "electron-webpack": "^2.1.2",

src/main/index.js

@@ -8,7 +8,11 @@ const isDevelopment = process.env.NODE_ENV !== 'production';
 let mainWindow;
 
 const createMainWindow = () => {
-    const window = new BrowserWindow();
+    const window = new BrowserWindow({
+        width: 1096,
+        height: 715,
+        useContentSize: true
+    });
 
     if (isDevelopment) {
         window.webContents.openDevTools();

src/renderer/index.jsx

@@ -1,29 +1,22 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 
-import GUI, {AppStateHOC} from 'scratch-gui/src/index';
+import GUI, {AppStateHOC} from 'scratch-gui/dist/scratch-gui';
+import styles from 'scratch-gui/src/playground/index.css';
 
 // Register "base" page view
 // analytics.pageview('/');
 
-const appTarget = document.createElement('div');
+const appTarget = document.getElementById('app');
-// appTarget.className = styles.app;
+appTarget.className = styles.app || 'app'; // TODO
 document.body.appendChild(appTarget);
 
 GUI.setAppElement(appTarget);
 const WrappedGui = AppStateHOC(GUI);
 
-// TODO a hack for testing the backpack, allow backpack host to be set by url param
-const backpackHostMatches = window.location.href.match(/[?&]backpack_host=([^&]*)&?/);
-const backpackHost = backpackHostMatches ? backpackHostMatches[1] : null;
-
-const backpackOptions = {
-    visible: true,
-    host: backpackHost
-};
 if (process.env.NODE_ENV === 'production' && typeof window === 'object') {
     // Warn before navigating away
     window.onbeforeunload = () => true;
 }
 
-ReactDOM.render(<WrappedGui backpackOptions={backpackOptions} />, appTarget);
+ReactDOM.render(<WrappedGui />, appTarget);

webpack.renderer.additions.js

@@ -1,5 +1,7 @@
 const path = require('path');
 
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
 module.exports = {
     module: {
         rules: [
@@ -33,5 +35,11 @@ module.exports = {
                 }
             }
         ]
-    }
+    },
+    plugins: [
+        new CopyWebpackPlugin([{
+            from: path.resolve(__dirname, 'node_modules', 'scratch-gui', 'dist', 'static'),
+            to: 'static'
+        }])
+    ]
 };