Clean build processes and npm scripts - add .env file

.env

@@ -0,0 +1,18 @@
+//    1. Game server
+
+  // a. If you want to test app with local server (npm run server-dev) :
+SERVER_HOST="localhost"
+  // b. If you want to test app directly with running server online :
+//SERVER_HOST="149.91.81.94"
+
+
+//    2. Game DB (if "localhost" selected above)
+
+  // a. If MariaDB installed on local computer use for dev :
+//DB="localhost"
+//DB_NAME="twelve_heroes"
+
+  // b. If not, for DEV use test database : (can be managed at http://149.91.81.94:1990/phpmyadmin/)
+DB="149.91.81.94"
+DB_PORT=1986
+DB_NAME="test_twelve_heroes"

.gitignore

@@ -54,9 +54,6 @@ typings/
 # Yarn Integrity file
 .yarn-integrity
 
-# dotenv environment variables file
-.env
-
 # next.js build output
 .next
 

app-server/app-server.js

@@ -2,5 +2,5 @@ const express = require('express');
 const app = express();
 const port = 2612;
 
-app.use(express.static('webpack'));
-app.listen(port, () => console.log(`Example app listening at http://localhost:${port}`));
+app.use(express.static('www_web'));
+app.listen(port, () => console.log(`Serving 12 Heroes App at http://localhost:${port}`));

package-lock.json

@@ -4430,6 +4430,12 @@
         "is-obj": "^1.0.0"
       }
     },
+    "dotenv": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
+      "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
+      "dev": true
+    },
     "duplexer3": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",

package.json

@@ -6,22 +6,27 @@
     "ecosystem:cordova"
   ],
   "scripts": {
+    "dev": "DEV=true webpack --watch",
+    "start": "npm-run-all --parallel dev lint:watch",
+    "server-dev": "cd server && npm run server-dev",
+    "dev-all": "npm-run-all --parallel server dev lint:watch",
+    "build-web-app": "WEB=true webpack --mode=production",
+    "appserver": "node app-server/app-server.js",
     "server": "cd server && npm start",
-    "dev": "DEV=true SERVER_PORT=2610 SERVER_URL='http://localhost' webpack --watch",
-    "build-web-serve": "DEV=true webpack --mode=production",
-    "build": "webpack --mode=production",
-    "postbuild": "cordova prepare",
+    "dev-cordova": "DEV=true CORDOVA=true webpack",
+    "postdev-cordova": "cordova prepare",
+    "build-cordova": "CORDOVA=true webpack --mode=production",
+    "postbuild-cordova": "cordova prepare",
+    "cordova-browser": "cordova run browser",
     "win-build": "cordova build windows --win",
     "preandroid-build": "set ORG_GRADLE_PROJECT_cdvMinSdkVersion=20 ",
     "android-build": "cordova build android",
-    "browser": "cordova run browser",
-    "appserver": "node app-server/app-server.js",
     "win": "cordova run windows --win",
     "android": "cordova run android --emulator",
-    "start": "npm-run-all --parallel server dev lint:watch",
-    "start-client": "npm-run-all --parallel dev lint:watch",
     "lint": "esw webpack.config.* src --color",
     "lint:watch": "npm run lint -- --watch",
+    "lint-server": "esw server* --color",
+    "lint-server:watch": "npm run lint-server -- --watch",
     "localtunnel": "lt --port 3000",
     "share": "npm-run-all --parallel open:src localtunnel",
     "test": "mocha --reporter progress \"src/**/*.test.js\"",
@@ -55,6 +60,7 @@
     "copy-webpack-plugin": "^5.1.1",
     "cordova": "^9.0.0",
     "cordova-plugin-whitelist": "^1.3.4",
+    "dotenv": "^8.2.0",
     "eslint": "6.4.0",
     "eslint-plugin-import": "2.18.2",
     "eslint-watch": "6.0.1",

server/db/mariadb-connector.js

@@ -1,16 +1,36 @@
 'use strict';
 import mariadb from 'mariadb';
 
+const JOJOAPPS_SERVER_DB='localhost';
+// const JOJOAPPS_SERVER_DB_PORT= 1986;
+const JOJOAPPS_SERVER_DB_SOCKET= '/run/mysqld/mysqld.sock';
+const DATABASE_NAME='twelve_heroes';
+
 export default class MariadbConnector {
   constructor() {
-    this.pool = mariadb.createPool({
-      host: 'localhost',
-      port:1986,
+    let host = process.env.DB || JOJOAPPS_SERVER_DB;
+    let port = process.env.DB_PORT || 0;
+    let database = process.env.DB_NAME || DATABASE_NAME;
+    console.log('DB server : ' + host);
+    console.log('DB database : ' + database);
+
+    let mariaDbConfig={
+      host,
       user: 'node',
       password: 'nodejs1234',
-      database: 'twelve_heroes',
+      database,
       connectionLimit: 5
-    });
+    };
+
+    if (port === 0) {
+      mariaDbConfig.socketPath = JOJOAPPS_SERVER_DB_SOCKET;
+      console.log('Will use DB UNIX socket : ' + mariaDbConfig.socketPath);
+    } else {
+      mariaDbConfig.port=port;
+      console.log('Will use DB port : ' + port);
+    }
+
+    this.pool = mariadb.createPool(mariaDbConfig);
   }
 
   async getUsernames() {

server/package-lock.json

@@ -2687,6 +2687,11 @@
       "resolved": "https://registry.npmjs.org/denque/-/denque-1.4.1.tgz",
       "integrity": "sha512-OfzPuSZKGcgr96rf1oODnfjqBFmr1DVoc/TrItj3Ohe0Ah1C5WX5Baquw/9U9KovnQ88EqmJbD66rKYUQYN1tQ=="
     },
+    "dotenv": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
+      "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw=="
+    },
     "duplexer3": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",

server/package.json

@@ -7,6 +7,7 @@
   ],
   "scripts": {
     "start": "babel-node server.js",
+    "server-dev": "babel-node -r ../node_modules/dotenv/config server.js dotenv_config_path=../.env",
     "tools": "node tools/server-tools.js"
   },
   "author": "JOJO",

src/common/socket-service.js

@@ -9,7 +9,7 @@ import io from 'socket.io-client';
     - reconnect_failed
     -
 */
-const SERVER_URL = process.env.SERVER_URL;
+const SERVER_URL = 'http://' + process.env.SERVER_HOST;
 const SERVER_PORT = process.env.SERVER_PORT;
 
 

src/index.html

@@ -34,11 +34,11 @@
   <meta name="msapplication-tap-highlight" content="no">
   <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
   <!-- <link rel="stylesheet" type="text/css" href="css/index.css"> -->
-  <title>Hello World</title>
+  <title>Twelve Heroes</title>
 </head>
 
 <body>
-  <% if (!process.env.DEV || process.env.DEV === false) { %>
+  <% if (process.env.CORDOVA && process.env.CORDOVA === true) { %>
 
   <div class="app">
     <div id="deviceready" class="blink">

src/main.js

@@ -47,9 +47,9 @@ let app = {
 
 };
 
-console.log('cordova  :', process.env.DEV);
+console.log('cordova env ? :', process.env.CORDOVA);
 
-if (!process.env.DEV || process.env.DEV === false) {
+if (process.env.CORDOVA && process.env.CORDOVA === true) {
 
   app.initialize();
 } else {

webpack.config.js

@@ -5,20 +5,33 @@ var BrowserSyncPlugin = require('browser-sync-webpack-plugin');
 // var CopyWebpackPlugin = require('copy-webpack-plugin');
 var { CleanWebpackPlugin } = require('clean-webpack-plugin');
 
+require('dotenv').config({path: __dirname + '/.env'});
+
+const JOJOAPPS_SERVER = '149.91.81.94';
+const JOJOAPPS_SERVER_PORT = 2610;
+
+// Env variables have effect in app : main.js & socket-service.js & index.html
+// Also in Server : mariadb-connector.js
 var definePlugin = new webpack.DefinePlugin({
   'process.env.DEV': JSON.stringify(JSON.parse(process.env.DEV || 'false')),
-  'process.env.SERVER_URL': JSON.stringify(process.env.SERVER_URL || 'http://149.91.81.94'),
-  'process.env.SERVER_PORT': JSON.stringify(process.env.SERVER_PORT || '2610')
+  'process.env.WEB': JSON.stringify(JSON.parse(process.env.WEB || 'false')),
+  'process.env.CORDOVA': JSON.stringify(JSON.parse(process.env.CORDOVA || 'false')),
+  'process.env.SERVER_HOST': JSON.stringify(process.env.SERVER_HOST || JOJOAPPS_SERVER),
+  'process.env.SERVER_PORT': JSON.stringify(process.env.SERVER_PORT || JOJOAPPS_SERVER_PORT)
 });
 
 var outpath = './webpack/';
 
-if (!process.env.DEV || process.env.DEV === false) {
-  console.log('CORDOVA environment');
+if (process.env.CORDOVA && process.env.CORDOVA === true) {
   outpath = 'www/';
+  console.log('CORDOVA environment : output in ',outpath);
+} else if (process.env.WEB && process.env.WEB === true) {
+  console.log('WEB environment : output in ',outpath);
+  outpath = 'www_web/';
 } else {
-  console.log('DEV environment');
+  console.log('DEV env : output in ', outpath);
 }
+
 // new CopyWebpackPlugin([
 //   {
 //     context: path.resolve(__dirname, 'src', 'assets'),