Adding webpack dev server support.

Makefile

@@ -25,6 +25,10 @@ dev:
 	npx webpack --config webpack.dev.js --env.assets ./$(assets)
 
 rundev:
+	webpack-dev-server --open --config webpack.dev.js --env.assets ./$(assets)
+# make interactive
+
+rundevserver:
 	make interactive
 
 prod: src/server/farm
@@ -35,7 +39,7 @@ install:
 	npm install
 
 interactive:
-	cd dist/ && csi -include-path $(assets) -include-path ../src/server -s farm.scm
+	csi -include-path $(assets) -include-path src/server -s src/server/farm.scm
 
 src/server/farm: src/server/farm.scm src/server/db.scm
 	cd src/server/ && csc -include-path ../../$(assets) -O3 farm.scm

package.json

@@ -13,8 +13,8 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "webpack --config webpack.dev.js",
-      "prod": "webpack --config webpack.prod.js",
+    "prod": "webpack --config webpack.prod.js",
-      "cypress:open": "cypress open"
+    "cypress:open": "cypress open"
   },
   "keywords": [],
   "author": "",
@@ -45,6 +45,7 @@
     "terser-webpack-plugin": "^2.3.5",
     "webpack": "^4.41.5",
     "webpack-cli": "^3.3.10",
+    "webpack-dev-server": "^3.11.0",
     "webpack-merge": "^4.2.2"
   },
   "dependencies": {

src/components/farm/Board.jsx

@@ -120,18 +120,16 @@ class PlayerResources extends React.Component {
                 <ResourceUnit img={TractorImg} h='240' s='100' label='Tractors'
                               amount={player.assets.tractor}>
                     {player.assets.tractor}
+                </ResourceUnit>{' '}
+                <ResourceUnit img={CakeImg} h='240' s='100' label='Birthday'
+                              amount={player.assets.birthday ? player.assets.birthday : 0}>
+                    {player.assets.birthday ? player.assets.birthday : 0}
                 </ResourceUnit>
             </div>
         );
     }
 }
 
-/* {' '}
- * <ResourceUnit img={CakeImg} h='240' s='100' label='Birthday'
- * amount={player.assets.birthday ? player.assets.birthday : 0}>
- * {player.assets.birthday ? player.assets.birthday : 0}
- * </ResourceUnit> */
-
 // http://stackoverflow.com/questions/149055
 function formatMoney(n) {
     return n.toFixed(1).replace(/(\d)(?=(\d{3})+\.)/g, '$1,').slice(0, -2); }
@@ -1813,21 +1811,23 @@ class AlertOverlay extends React.Component {
                          <FontAwesomeIcon icon={faTimes} />
                      </div>
                 ) : (<></>)}
-                <div className='alert-overlay-contents'>
+                <div className='alert-container'>
-                    {this.props.children}
+                    <div className='alert-overlay-contents'>
-                    <br />
+                        {this.props.children}
-                    <div>
+                        <br />
-                        <Button onClick={this.buttonClick} disabled={!!this.props.disabled}>{this.props.buttonText}</Button>
+                        <div>
-                        {this.props.cancelButtonText ? (
+                            <Button onClick={this.buttonClick} disabled={!!this.props.disabled}>{this.props.buttonText}</Button>
-                             <>
+                            {this.props.cancelButtonText ? (
-                                 {' '}
+                                 <>
-                                 <Button onClick={this.cancelButtonClick} disabled={!!this.props.cancelDisabled}>
+                                     {' '}
-                                     {this.props.cancelButtonText}
+                                     <Button onClick={this.cancelButtonClick} disabled={!!this.props.cancelDisabled}>
-                                 </Button>
+                                         {this.props.cancelButtonText}
-                             </>
+                                     </Button>
-                        ): (<></>)}
+                                 </>
+                            ): (<></>)}
+                        </div>
+                        {!this.props.preventHiding ? (<a onClick={this.hide}>close</a>) : (<></>)}
                     </div>
-                    {!this.props.preventHiding ? (<a onClick={this.hide}>close</a>) : (<></>)}
                 </div>
             </div>
         );
@@ -2110,7 +2110,7 @@ class BoardApp extends React.Component {
                               buttonText='Close'
                               hideHandler={() => 'nothing'}
                               handler={() => { return false; }}>
-                    <Fragment>
+                    <div className="game-over">
                         <h1>Game Over!</h1>
                         {alert.contents.results.map((e, i) => (
                             <p key={i}>{e}</p>
@@ -2121,7 +2121,14 @@ class BoardApp extends React.Component {
                         <p>{alert.contents.stats.emergency}</p>
                         <p>{alert.contents.stats.highRoller}</p>
                         <p>{alert.contents.stats.lowRoller}</p>
-                    </Fragment>
+                        {alert.contents.stats.players.map(p => (
+                            <div key={p.name}>
+                                <p><b>{p.name} Harvests:</b></p>
+                                <p>Total: ${formatMoney(p.harvestTotal)} Expenses: ${formatMoney(Math.abs(p.operatingExpenses))}</p>
+                                <p>Avg ${formatMoney(p.harvestAverage)} rolling {p.harvestRoll} for {p.numHarvests} harvests</p>
+                                <p>Hay: ${formatMoney(p.hay)} Grain: ${formatMoney(p.grain)} Fruit: ${formatMoney(p.fruit)} Cows: ${formatMoney(p.cows)}</p>
+                            </div>))}
+                    </div>
                 </AlertOverlay>
             );
         } else if (alert && alert.type === ALERTS.auditCalled) {

src/server/farm.scm

@@ -172,7 +172,12 @@
                                    (tax-person . 0)
                                    (emergency . 0)
                                    (num-harvests . 0)
-                                   (harvest-rolls . 0)))
+                                   (harvest-rolls . 0)
+                                   (operating-expenses . 0)
+                                   (hay . 0)
+                                   (grain . 0)
+                                   (fruit . 0)
+                                   (cows . 0)))
      (alist-ref 'ai? args eqv? #f)
      (alist-ref 'processing-turn args eqv? #f))))
 
@@ -555,7 +560,7 @@
     ;; (session-set! (sid) 'game *game*)
     ;; (set-startup-otbs (session-ref (sid) 'player) 2)
     )
-  (send-static-file "main.html")
+  (send-static-file "index.html")
   ;; (with-headers `((connection close)
   ;;                 (content-type text/html))
   ;;               (lambda ()
@@ -1015,7 +1020,31 @@
                                                                                 (* (/ (alist-ref 'harvest-rolls (player-stats p))
                                                                                       (max (alist-ref 'num-harvests (player-stats p)) 1))
                                                                                    10))
-                                                                               10)) ")"))))))
+                                                                               10)) ")")))
+                 (players . ,(list->vector
+                              (map (lambda (p)
+                                     (let ((stats (player-stats p)))
+                                       `((name . ,(player-name p))
+                                         (numHarvests . ,(alist-ref 'num-harvests stats))
+                                         (hay . ,(alist-ref 'hay stats))
+                                         (grain . ,(alist-ref 'grain stats))
+                                         (fruit . ,(alist-ref 'fruit stats))
+                                         (cows . ,(alist-ref 'cows stats))
+                                         (harvestAverage . ,(exact->inexact
+                                                             (round
+                                                              (/ (fold + 0 (map (lambda (c) (alist-ref c stats))
+                                                                                '(hay grain fruit cows)))
+                                                                 (alist-ref 'num-harvests stats)))))
+                                         (harvestTotal . ,(fold + 0 (map (lambda (c) (alist-ref c stats))
+                                                                         '(hay grain fruit cows))))
+                                         (operatingExpenses . ,(alist-ref 'operating-expenses stats))
+                                         (harvestRoll . ,(exact->inexact
+                                                          (/ (round
+                                                              (* (/ (alist-ref 'harvest-rolls stats)
+                                                                    (max (alist-ref 'num-harvests stats) 1))
+                                                                 10))
+                                                             10))))))
+                                   (game-players game)))))))
      type: "end-of-game")))
 
 (define (create-ws-response player event misc)
@@ -2299,7 +2328,7 @@
 (define (make-player-stat stat amount)
   (lambda (p)
     (safe-set! (player-stats p)
-               (alist-update stat (+ (alist-ref stat (player-stats p)) amount)
+               (alist-update stat (+ (alist-ref stat (player-stats p) eqv? 0) amount)
                              (player-stats p)))))
 
 (define (get-actions player space)
@@ -2522,6 +2551,7 @@
                  (begin
                    ((make-player-stat 'num-harvests 1) player)
                    ((make-player-stat 'harvest-rolls rolled) player)
+                   ((make-player-stat crop income) player)
                    (safe-set! (player-cash player)
                      (+ (player-cash player) income))
                    (safe-set! (player-harvest-mult player) 1)
@@ -2535,6 +2565,9 @@
                                                                      (player-name player))))
                                                     (game-players game)))))
                      ((alist-ref 'action operating-expense) player)
+                     ((make-player-stat 'operating-expenses
+                                        (- (player-cash player) previous-cash))
+                      player)
                      `((rolled . ,rolled)
                        (rolls . ,(list->vector (make-rolls 22)))
                        (income . ,income)

src/style.scss

@@ -919,8 +919,6 @@ $trade-margin: 3rem;
     color: white; }
 
 .alert-overlay-contents {
-    max-height: 90vh;
-    overflow: auto;
     background: $light-color;
     padding: 2rem;
     display: flex;
@@ -928,6 +926,10 @@ $trade-margin: 3rem;
     justify-content: center;
     align-items: center; }
 
+.alert-container {
+    max-height: 90vh;
+    overflow: auto; }
+
 .moving {
     display: flex;
     justify-content: center;
@@ -1062,3 +1064,9 @@ ul {
     font-family: 'IndieFlower-Regular';
     width: 0;
     height: 0; }
+
+.game-over p {
+    margin-bottom: 0.2rem;
+    text-align: left;
+    width: 100%;
+}

webpack.common.js

@@ -28,7 +28,7 @@ const CssUrlRelativePlugin = require('css-url-relative-plugin')
 
 module.exports = {
     entry: {
-        app: './src/main.jsx',
+        app: './src/index.jsx',
     },
     output: {
         filename: './assets/[name].[contenthash].js',
@@ -50,7 +50,7 @@ module.exports = {
         new CleanWebpackPlugin(),
         new HtmlWebpackPlugin({
             title: 'Alpha Centauri Farming',
-            filename: 'main.html',
+            filename: 'index.html',
             meta: {viewport: 'width=device-width, initial-scale=1'},
         }),
         new FaviconsWebpackPlugin('./assets/img/tractor.svg'),

webpack.dev.js

@@ -24,6 +24,16 @@ module.exports = function(env) {
     return merge(common, {
         mode: 'development',
         devtool: 'inline-source-map',
+        devServer: {
+            port: 9000,
+            contentBase: './dist',
+            proxy: {
+                '/websocket': {
+                    target: 'ws://localhost:8080',
+                    ws: true
+                },
+            },
+        },
         resolve: {
             modules: [path.resolve(__dirname, 'src'),
                       path.resolve(__dirname, env.assets),