refacto(scipts): reorganized & support dev server

scripts/server-backend.js

@@ -1,4 +1,7 @@
-var PORT = 8080; //Set port for the app
+const { getArgs } = require("./utils");
+const path = require("path");
+
+function startBackendServer(port) {
     var accessToken = ""; //Can be set here or as start parameter (node server.js --accesstoken=MYTOKEN)
     var disableSmallestScreen = false; //Can be set to true if you dont want to show (node server.js --disablesmallestscreen=true)
     var webdav = false; //Can be set to true if you want to allow webdav save (node server.js --webdav=true)
@@ -17,12 +20,11 @@ const { createClient } = require("webdav");
     var s_whiteboard = require("./s_whiteboard.js");
     
     var app = express();
-app.use(express.static(__dirname + '/public'));
+    app.use(express.static(path.join(__dirname, '..', 'public')));
     var server = require('http').Server(app);
-server.listen(PORT);
+    server.listen(port);
-var io = require('socket.io')(server);
+    var io = require('socket.io')(server, {path: "/ws-api", });
-console.log("Webserver & socketserver running on port:" + PORT);
+    console.log("Webserver & socketserver running on port:" + port);
-
     if (process.env.accesstoken) {
         accessToken = process.env.accesstoken;
     }
@@ -54,7 +56,7 @@ if (webdav) {
         console.log("Webdav save is enabled!");
     }
     
-app.get('/loadwhiteboard', function (req, res) {
+    app.get('/api/loadwhiteboard', function (req, res) {
         var wid = req["query"]["wid"];
         var at = req["query"]["at"]; //accesstoken
         if (accessToken === "" || accessToken == at) {
@@ -67,7 +69,7 @@ app.get('/loadwhiteboard', function (req, res) {
         }
     });
     
-app.post('/upload', function (req, res) { //File upload
+    app.post('/api/upload', function (req, res) { //File upload
         var form = new formidable.IncomingForm(); //Receive form
         var formData = {
             files: {},
@@ -266,28 +268,10 @@ function escapeAllContentStrings(content, cnt) {
         return content;
     }
     
-function getArgs() {
-    const args = {}
-    process.argv
-        .slice(2, process.argv.length)
-        .forEach(arg => {
-            // long arg
-            if (arg.slice(0, 2) === '--') {
-                const longArg = arg.split('=')
-                args[longArg[0].slice(2, longArg[0].length)] = longArg[1]
-            }
-            // flags
-            else if (arg[0] === '-') {
-                const flags = arg.slice(1, arg.length).split('')
-                flags.forEach(flag => {
-                    args[flag] = true
-                })
-            }
-        })
-    return args
-}
-
     process.on('unhandledRejection', error => {
         // Will print "unhandledRejection err is not defined"
         console.log('unhandledRejection', error.message);
     })
+}
+
+module.exports = startBackendServer;

scripts/server-frontend-dev.js

@@ -0,0 +1,32 @@
+const webpack = require("webpack");
+const WebpackDevServer = require("webpack-dev-server");
+const config = require("../config/webpack.dev");
+
+const devServerConfig = {
+  hot: true,
+  inline: true,
+  stats: {
+    children: false,
+    maxModules: 0
+  },
+  proxy: {
+    '/api': 'http://localhost:3000',
+    '/ws-api': {
+      target: 'ws://localhost:3000',
+      ws: true,
+    }
+  }
+}
+
+function startFrontendDevServer(port) {
+  new WebpackDevServer(webpack(config), devServerConfig)
+    .listen(port, (err) => {
+      if (err) {
+        console.log(err);
+      }
+
+      console.log("Listening on port " + port);
+    });
+}
+
+module.exports = startFrontendDevServer;

scripts/server.js

@@ -0,0 +1,25 @@
+const { getArgs } = require("./utils");
+const startFrontendDevServer = require("./server-frontend-dev");
+const startBackendServer = require("./server-backend");
+
+const SERVER_MODES = {
+    PRODUCTION: 1,
+    DEVELOPMENT: 2
+}
+
+const args = getArgs();
+
+if ( typeof args.mode === "undefined" || (args.mode !== "production" && args.mode !== "development")) {
+    throw new Error("--mode=development or --mode=production is expected")
+}
+
+const server_mode = args.mode === "production" ? SERVER_MODES.PRODUCTION : SERVER_MODES.DEVELOPMENT;
+
+if (server_mode === SERVER_MODES.DEVELOPMENT){
+    console.info("Starting server in development mode.");
+    startFrontendDevServer(8080);
+    startBackendServer(3000);
+} else {
+    console.info("Starting server in production mode.");
+    startBackendServer(8080);
+}

scripts/utils.js

@@ -0,0 +1,22 @@
+function getArgs() {
+    const args = {}
+    process.argv
+        .slice(2, process.argv.length)
+        .forEach(arg => {
+            // long arg
+            if (arg.slice(0, 2) === '--') {
+                const longArg = arg.split('=')
+                args[longArg[0].slice(2, longArg[0].length)] = longArg[1]
+            }
+            // flags
+            else if (arg[0] === '-') {
+                const flags = arg.slice(1, arg.length).split('')
+                flags.forEach(flag => {
+                    args[flag] = true
+                })
+            }
+        })
+    return args
+}
+
+module.exports.getArgs = getArgs;