build + run

README.md

@@ -1,15 +1,44 @@
-# 🚀 Welcome to your new awesome project!
+# Asteroids
 
-This project has been created using **webpack scaffold**, you can now run
-
-```
-npm run build
-```
-
-or
+## Demo
 
+
+## Usage
+Multiplayer web based game of space battle.
+
+### Run
 ```
+npm start
+# or
 yarn build
 ```
 
+Uses port 8000 by default unless `PORT` environment variable is defined.
+
+### Build
+This project has been created using **webpack scaffold**, you can now run
+```
+npm run build
+# or
+yarn build
+```
 to bundle your application
+
+## How it works?
+
+This project is based on a custom geometrical library based on native canvas for drawing geometrical objects
+
+### Game hierarchy 
+![asteroids](./out/uml/asteroids/asteroids.png)
+
+### Geometrical hierarchy 
+![forms](./out/uml/forms/forms.png)
+
+### Maths hierarchy 
+![maths](./out/uml/maths/maths.png)
+
+## Credits
+Made by Marc Partensky and Alexandre Bigot
+
+## License
+**MIT**

dist/main.js

@@ -90,10 +90,11 @@
 /*!**************************!*\
   !*** ./models/client.js ***!
   \**************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-eval("\n\n\n\n\n\n\nvar canvas = document.getElementById(\"canvas\");\n\nvar context = new ContextAdapter(canvas.getContext(\"2d\"));\n\n\ncontext.width = canvas.width = window.innerWidth;\ncontext.height = canvas.height = window.innerHeight;\n\ncontext.plane.units.position = new Vector(0.2, 0.2);\n\n// var name = prompt(\"name\");\nvar host = String(document.location);\nvar socket = io.connect(host) //, {query: \"name=\"+name});\n\n\n\n// var group = SuperGroup.random();\n// var game = new Game(group);\nvar game = Game.random();\n\n\n\ngameClient = new GameClient(canvas, game, socket)\n\ngameClient.main();\n\n\n\n//# sourceURL=webpack:///./models/client.js?");
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony default export */ __webpack_exports__[\"default\"] = (\"import Tensor from '../libs/tensor.js';\\nimport Vector from '../libs/vector.js';\\nimport Matrix from '../libs/matrix.js';\\nimport Motion from '../libs/motion.js';\\nimport Body from '../libs/body.js';\\n\\nimport Point from '../libs/point.js';\\nimport Figure from '../libs/figure.js';\\nimport Form from '../libs/form.js';\\nimport BasePolygon from '../libs/basepolygon.js';\\nimport Square from '../libs/square.js';\\nimport Rectangle from '../libs/rectangle.js';\\nimport Segment from '../libs/segment.js';\\nimport Polygon from '../libs/polygon.js';\\n\\nimport Life, {LifeBar} from './life.js';\\nimport Follower from './follower.js';\\nimport Shooter from './shooter.js';\\n\\nimport Spaceship from './spaceship.js';\\nimport Missile from './missile.js';\\nimport Asteroid, {AsteroidForm} from './asteroid.js';\\nimport Meteor from './meteor.js';\\n\\nimport Group from '../libs/group.js';\\nimport SuperGroup from './supergroup.js';\\nimport SpaceshipGroup from './spaceshipgroup.js';\\nimport MissileGroup from './missilegroup.js';\\nimport AsteroidGroup from './asteroidgroup.js';\\nimport MeteorGroup from './missilegroup.js';\\n\\nimport GameMap from './gamemap.js';\\nimport { SuperCollider,MissileSpaceshipCollider} from './collider.js';\\n\\n\\nvar canvas = document.getElementById(\\\"canvas\\\");\\n\\nvar context = new ContextAdapter(canvas.getContext(\\\"2d\\\"));\\n\\n\\ncontext.width = canvas.width = window.innerWidth;\\ncontext.height = canvas.height = window.innerHeight;\\n\\ncontext.plane.units.position = new Vector(0.2, 0.2);\\n\\n// var name = prompt(\\\"name\\\");\\nvar host = String(document.location);\\nvar socket = io.connect(host) //, {query: \\\"name=\\\"+name});\\n\\n\\n\\n// var group = SuperGroup.random();\\n// var game = new Game(group);\\nvar game = Game.random();\\n\\n\\n\\ngameClient = new GameClient(canvas, game, socket)\\n\\ngameClient.main();\\n\\n\");\n\n//# sourceURL=webpack:///./models/client.js?");
 
 /***/ })
 

libs/tensor.js

@@ -8,6 +8,7 @@ export default class Tensor extends Array {
   Every tensor has a norm, order, format and size. Here are stored default values.
   */
   static norm = 2;
+  // static norm = 2;
   static order = 1;
   static format = [1];
 

models/client.js

@@ -1,8 +1,36 @@
-// import Tensor from "../libs/tensor.js";
-// import Vector from "../libs/vector.js";
-// import zip from "../libs/iterator.js";
+import Tensor from '../libs/tensor.js';
+import Vector from '../libs/vector.js';
+import Matrix from '../libs/matrix.js';
+import Motion from '../libs/motion.js';
+import Body from '../libs/body.js';
 
+import Point from '../libs/point.js';
+import Figure from '../libs/figure.js';
+import Form from '../libs/form.js';
+import BasePolygon from '../libs/basepolygon.js';
+import Square from '../libs/square.js';
+import Rectangle from '../libs/rectangle.js';
+import Segment from '../libs/segment.js';
+import Polygon from '../libs/polygon.js';
 
+import Life, {LifeBar} from './life.js';
+import Follower from './follower.js';
+import Shooter from './shooter.js';
+
+import Spaceship from './spaceship.js';
+import Missile from './missile.js';
+import Asteroid, {AsteroidForm} from './asteroid.js';
+import Meteor from './meteor.js';
+
+import Group from '../libs/group.js';
+import SuperGroup from './supergroup.js';
+import SpaceshipGroup from './spaceshipgroup.js';
+import MissileGroup from './missilegroup.js';
+import AsteroidGroup from './asteroidgroup.js';
+import MeteorGroup from './missilegroup.js';
+
+import GameMap from './gamemap.js';
+import { SuperCollider,MissileSpaceshipCollider} from './collider.js';
 
 
 var canvas = document.getElementById("canvas");

models/game.js

@@ -31,6 +31,7 @@ import Segment from '../libs/segment.js';
 import Polygon from '../libs/polygon.js';
 import BasePolygon from '../libs/basepolygon.js';
 import { SuperCollider,MissileSpaceshipCollider} from './collider.js';
+
 export default class Game {
     static dt = 0.1;
     static mapTypes = [
@@ -74,7 +75,7 @@ export default class Game {
         Polygon,
         BasePolygon,
     ]
-        
+
     static reviver(key, value) {
         if(typeof value === 'object' && value !== null) {
             for (const type of Game.mapTypes) {
@@ -182,4 +183,4 @@ export default class Game {
         const entities = this.group.getAll();
         this.gameMap.limit(entities);
     }
-}
+}

models/gamemap.js

@@ -9,7 +9,7 @@ export default class GameMap {
     constructor(rectangle) {
         this.rectangle = rectangle;
     }
-    
+
     get r() {
         return this.rectangle;
     }
@@ -17,8 +17,6 @@ export default class GameMap {
         this.rectangle = value;
     }
 
-
-    
     compute(position) {
         let x,y
         if (Math.abs(position.x) > this.r.w / 2) {
@@ -38,7 +36,7 @@ export default class GameMap {
         }
         return new Vector(x, y);
     }
-    
+
     compute2(position) {
         const t = this.r.size.rdiv(2);
         // console.log(position)
@@ -54,20 +52,19 @@ export default class GameMap {
         return position;
     }
 
-    
-    
+
     limit(entities) {
         for (const entity of entities) {
             entity.position = this.compute(entity.position);
         }
     }
-    
+
     show(ctx) {
         this.rectangle.show(ctx)
     }
 
-    
+
     update(dt) {
 
         }
-}
+}

package.json

@@ -1,10 +1,12 @@
 {
   "name": "asteroids",
   "version": "1.0.0",
-  "description": "A space battle with asteroids and spaceships.",
-  "private": true,
-  "main": "server.js",
+  "description": "A spacebattle with spaceships and asteroids.",
+  "private": "true",
+  "type": "module",
   "scripts": {
+    "watch": "npx webpack --watch",
+    "build": "npx webpack",
     "test": "echo \"Error: no test specified\" && exit 1",
     "start": "node server.js"
   },
@@ -13,7 +15,10 @@
     "url": "git+ssh://git@github.com/MarcPartensky/Web.git"
   },
   "keywords": [
-    "asteroids"
+    "spaceships",
+    "asteroids",
+    "space",
+    "war"
   ],
   "author": "Marc Partensky",
   "license": "ISC",
@@ -23,10 +28,11 @@
   "homepage": "https://github.com/MarcPartensky/Web#readme",
   "dependencies": {
     "express": "^4.17.1",
-    "socket.io": "^2.3.0"
+    "socket.io": "^2.4.0"
   },
   "devDependencies": {
+    "raw-loader": "^4.0.1",
     "webpack": "^4.43.0",
-    "webpack-cli": "^4.0.0-beta.8"
+    "webpack-cli": "^3.3.12"
   }
 }

server-agario.js

@@ -1,100 +0,0 @@
-const express = require('express'), // for easier syntax;
-    http = require('http'),
-    socket = require('socket.io'), // for easier connexion
-    ent = require('ent'), // html url security
-    os = require('os'), // os access
-    fs = require('fs'), // file system
-    vm = require('vm'), // to execute scripts
-    ss = require('socket.io-stream'); // to stream data
-
-const app = express();
-const server = http.createServer(app);
-const io = socket.listen(server);
-
-// server.maxConnections = 10;
-
-
-
-const files = [
-  "libs/tools.js",
-  "libs/test.js",
-  "libs/iterator.js",
-  "libs/group.js",
-  "libs/tensor.js",
-  "libs/vector.js",
-  "libs/matrix.js",
-  "libs/color.js",
-  "libs/point.js",
-  "libs/figure.js",
-  "libs/form.js",
-  "libs/polygon.js",
-  "libs/rectangle.js",
-  "libs/circle.js",
-  "libs/motion.js",
-  "libs/body.js",
-  "libs/plane.js",
-  "libs/context.js",
-  "libs/manager.js",
-
-  "model/basecircle.js",
-  "model/game/ball.js",
-  "model/game/food.js",
-  "model/game/virus.js",
-  "model/game/collider.js",
-  "model/game/supergroup.js",
-  "model/game/player.js",
-  "model/game/gamemap.js",
-  "model/game/game.js",
-  "model/game/gameclient.js",
-  "model/game/gameserver.js",
-];
-
-for (const file of files) {
-  let data = fs.readFileSync(file);
-  let script = new vm.Script(data);
-  script.runInThisContext();
-}
-
-app.use('/libs', express.static('libs'));
-app.use('/public', express.static('model/game'));
-app.use('/view/home/', express.static('../view'));
-
-var path = __dirname.split("/");
-path = path.slice(0,-1).join("/");
-
-app.get('/', function (req, res) {
-  res.sendFile(path + "/view/game/index.html");
-});
-
-
-app.get('/game', function (req, res) {
-  res.sendFile(path + "/view/game/index.html");
-});
-
-
-io.on('connection', function (socket, name) {
-  socket.on('play-button', function(name) {
-    console.log("play button pressed");
-    res.redirect('/game?name=${name}');
-  });
-  socket.on('disconnect', function() {
-    console.log('disconnected');
-  });
-  socket.on("message", function(message) {
-    console.log(message);
-  })
-
-});
-
-server.listen(process.env.PORT || 8000)
-
-
-var game = Game.random(5);
-game.updateMap();
-// console.log(game.map);
-var gameServer= new GameServer(game);
-// console.log(io.sockets.broadcast);
-
-
-gameServer.main(io, ss);
-

server.js

@@ -16,54 +16,22 @@ import vm from 'vm';
 import fs from 'fs';
 import socket from 'socket.io';
 import GameServer from './models/gameserver.js';
-// "type": "module",
-  // "exports": {
-  //   "./libs": "./libs",
-  //   "./models": "./models",
-  //   "node": {
-  //     "import": "./libs",
-  //     "require": "./libs"
-  //   }
-  // },
 
 const app = express();
 const server = http.createServer(app);
 const io = socket.listen(server);
 
-// import './libs/tensor.js';
-import Tensor from './libs/tensor.js';
-
-// import Group from './libs/group.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-// import {Tensor} from './libs/tensor.js';
-
 import Game from './models/game.js';
 
 const files = [
     // Tools and tests
     // "libs/tools.js",
     // "libs/test.js",
-    // Base types  
+    // Base types
     "libs/iterator.js",
     "libs/dict.js",
     "libs/tree.js",
-    // Math types    
+    // Math types
     "libs/group.js",
     // "libs/tensor.js",
     // "libs/vector.js",
@@ -108,25 +76,25 @@ const files = [
     "models/gameserver.js",
 ];
 
-
-
-server.listen(process.env.PORT || 8000)
-
-app.use('/libs', express.static('libs'));
-app.use('/models', express.static('models'));
-
-
 // for (const file of files) {
 //     console.log(file);
 //     let data = fs.readFileSync(file);
 //     let script = new vm.Script(data);
 //     script.runInThisContext();
 //   }
-  
-// import * from "libs";
 
-// import * from "./libs/tensor.js"
 
+server.listen(process.env.PORT || 8000)
+
+app.use('/libs', express.static('libs'));
+app.use('/models', express.static('models'));
+app.use('/dist', express.static('dist'));
+
+
+import path from 'path';
+const __dirname = path.resolve();
+
+console.log(__dirname)
 
 // var path = __dirname.split("/");
 // path = path.slice(0,-1).join("/");
@@ -141,4 +109,4 @@ const game = Game.random();
 //console.log(`Le group ${game.group.get('asteroidGroup')}`);
 const gameServer = new GameServer(game, io);
 gameServer.setUp();
-gameServer.main();
+gameServer.main();

src.js

@@ -1 +0,0 @@
-console.log("Hello World from pageThree main file!");

todo.md

@@ -0,0 +1,5 @@
+# Todo
+- Régler le problème des attributs static de classes pour webpack.
+- Utiliser [webpack](https://webpack.js.org/)
+- Regarder [Meteor](https://www.meteor.com/) pour propulser le projet vers l'infini
+- Utiliser du protobuf

todo.txt

@@ -1,9 +0,0 @@
-Utiliser webAPck
-https://webpack.js.org/
-
-
-
-Regarder Meteor pour propulser le projet vers l'infini
-https://www.meteor.com/
-
-Utiliser du protobuf

views/index.html

@@ -74,6 +74,7 @@
     <script src="models/gameclient.js" charset="utf-8"></script> -->
     <!-- Entry point -->
     <!-- <script src="models/client.js" charset="utf-8"></script> -->
-    <script src="dist/clients.bundle.js"></script>
+    <script src="/dist/main.js"></script>
   </body>
 </html>
+

webpack.config.ancien

@@ -1,11 +0,0 @@
-//const path = require('path');
-//import path from "path";
-module.exports = {
-    mode:  "development",
-    watch:  'true',
-    entry: './models/client.js',
-        output: {
-        path: path.resolve(__dirname, 'dist'),
-        filename: 'client.bundle.js'
-    }
-};

webpack.config.js

@@ -1,25 +1,15 @@
-// module = {
-//   entry: './client.js',
-//   output: {
-//     filename: 'main.js',
-//   },
-// };
-
-// export module;
-
-
 const path = require('path');
 
 module.exports = {
       entry: './models/client.js',
-    mode:"development",
+      mode:"development",
   output: {
-    filename: 'main.js',
     path: path.resolve(__dirname, 'dist'),
+    filename: 'main.js',
   },
   module: {
     rules: [
-      { test: new RegExp('[libs|models]*\.js'), use: 'raw-loader' }
+          { test: /\.js$/, use: 'raw-loader' }//new RegExp('[libs|models]*\.js')
     ]
   },
 };

webpack.config.jswtf

@@ -1,11 +0,0 @@
-import path from "path";
-
-module = {
-    mode: "development",
-    watch:  'true',
-    entry: './models/client.js',
-        output: {
-        path: path.resolve(__dirname, 'dist'),
-        filename: 'client.bundle.js'
-    }
-};

webpack.config.jswtff

@@ -1,120 +0,0 @@
-//const path = require('path');
-// const webpack = require('webpack');
-import path from 'path';
-import webpack from 'webpack';
-/*
- * SplitChunksPlugin is enabled by default and replaced
- * deprecated CommonsChunkPlugin. It automatically identifies modules which
- * should be splitted of chunk by heuristics using module duplication count and
- * module category (i. e. node_modules). And splits the chunks…
- *
- * It is safe to remove "splitChunks" from the generated configuration
- * and was added as an educational example.
- *
- * https://webpack.js.org/plugins/split-chunks-plugin/
- *
- */
-
-/*
- * We've enabled MiniCssExtractPlugin for you. This allows your app to
- * use css modules that will be moved into a separate CSS file instead of inside
- * one of your module entries!
- *
- * https://github.com/webpack-contrib/mini-css-extract-plugin
- *
- */
-
-// const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-import MiniCssExtraPlugin from 'mini-css-extract-plugin';
-
-/*
- * We've enabled TerserPlugin for you! This minifies your app
- * in order to load faster and run less javascript.
- *
- * https://github.com/webpack-contrib/terser-webpack-plugin
- *
- */
-
-// const TerserPlugin = require('terser-webpack-plugin');
-import TerserPlugin from 'terser-webpack-plugin'
-
-// const workboxPlugin = require('workbox-webpack-plugin');
-import workboxPlugin from 'workbox-webpack-plugin';
-
-module.exports = {
-	mode: 'development',
-
-	entry: {
-		pageOne: './src.js',
-		pageTwo: './src.js'
-	},
-
-	output: {
-		chunkFilename: '[name].[chunkhash].js',
-		filename: '[name].[chunkhash].js'
-	},
-
-	plugins: [
-		new webpack.ProgressPlugin(),
-		new MiniCssExtractPlugin({ filename: 'main.scss.[chunkhash].css' }),
-		new workboxPlugin.GenerateSW({
-			swDest: 'sw.js',
-			clientsClaim: true,
-			skipWaiting: false
-		})
-	],
-
-	module: {
-		rules: [
-			{
-				test: /.(js|jsx)$/,
-				include: [],
-				loader: 'babel-loader'
-			},
-			{
-				test: /.(scss|css)$/,
-
-				use: [
-					{
-						loader: MiniCssExtractPlugin.loader
-					},
-					{
-						loader: 'style-loader'
-					},
-					{
-						loader: 'css-loader',
-
-						options: {
-							sourceMap: true
-						}
-					},
-					{
-						loader: 'sass-loader',
-
-						options: {
-							sourceMap: true
-						}
-					}
-				]
-			}
-		]
-	},
-
-	optimization: {
-		minimizer: [new TerserPlugin()],
-
-		splitChunks: {
-			cacheGroups: {
-				vendors: {
-					priority: -10,
-					test: /[\\/]node_modules[\\/]/
-				}
-			},
-
-			chunks: 'async',
-			minChunks: 1,
-			minSize: 30000,
-			name: true
-		}
-	}
-};