version v0.0.9
This commit is contained in:
		
							parent
							
								
									ba13bb6a32
								
							
						
					
					
						commit
						b5064543e4
					
				| @ -7,12 +7,12 @@ | ||||
|   <title>nodePong, a multiplayer online pong based on nodejs and socket.io</title> | ||||
|   <link rel="stylesheet" type="text/css" media="all" href="./css/main.css"> | ||||
|   <script type="text/javascript" src="http://127.0.0.1:8042/socket.io/socket.io.js"></script> | ||||
|   <script type="text/javascript" src="./src/jquery-2.1.3.min.js"></script> | ||||
|   <script type="text/javascript" src="./js/npg_client.js"></script> | ||||
|   <script type="text/javascript" src="./js/socket/socketio_handler.js"></script> | ||||
|   <script type="text/javascript" src="./js/keyboard/event_handler.js"></script> | ||||
|   <script type="text/javascript" src="./js/core/page_base.js"></script> | ||||
|   <script type="text/javascript" src="./js/pages/login_page.js"></script> | ||||
|   <script type="text/javascript" src="./jquery/jquery-2.1.3.min.js"></script> | ||||
|   <script type="text/javascript" src="./lib/npg_client.js"></script> | ||||
|   <script type="text/javascript" src="./lib/socket/socketio_handler.js"></script> | ||||
|   <script type="text/javascript" src="./lib/keyboard/event_handler.js"></script> | ||||
|   <script type="text/javascript" src="./lib/core/page_base.js"></script> | ||||
|   <script type="text/javascript" src="./lib/pages/login_page.js"></script> | ||||
| </head> | ||||
| 
 | ||||
| <body>   | ||||
|  | ||||
							
								
								
									
										4
									
								
								client/jquery/jquery-2.1.3.min.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										4
									
								
								client/jquery/jquery-2.1.3.min.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										13
									
								
								client/lib/config/NPGClientConfig.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								client/lib/config/NPGClientConfig.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,13 @@ | ||||
| /** | ||||
|  * @file NPGClientConfig.js | ||||
|  */ | ||||
| 
 | ||||
| var NPGClient.Config = { | ||||
| 
 | ||||
|         | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| } | ||||
							
								
								
									
										114
									
								
								client/lib/core/page_base.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										114
									
								
								client/lib/core/page_base.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,114 @@ | ||||
| /** | ||||
|  * @file AppPage.js | ||||
|  * @author frtk@tetalab | ||||
|  */ | ||||
| 
 | ||||
| NPGClient.AppPage = function(n) {  | ||||
|      | ||||
|   Object.defineProperty(this, 'id', { value: NPGClient.pageCount++ }); | ||||
|     | ||||
|   this.name = n || ''; | ||||
|   // draw loop paramaters
 | ||||
|   this.loopIntervalId = 0; | ||||
|   this.loopDelay = 40;  | ||||
|   // canvas 
 | ||||
|   this.canvas_id = ""; | ||||
|   this.canvas_bcol = ""; | ||||
|   this.canvas = {}; | ||||
|   this.ctx = {}; | ||||
| 
 | ||||
|   // ui elements   
 | ||||
|   this.uiElems = []; | ||||
| 
 | ||||
| }; | ||||
| 
 | ||||
| NPGClient.AppPage.prototype = { | ||||
| 
 | ||||
|   constructor: NPGClient.AppPage, | ||||
| 
 | ||||
|   //
 | ||||
|   setLoopDelay: function(d) { | ||||
|     this.loopDelay = d; | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   startDrawLoop: function() { | ||||
|     var self = this; | ||||
|     self.loopIntervalId = setInterval(function() {  | ||||
|       self.run();  | ||||
|     }, self.loopDelay); | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   stopDrawLoop: function() { | ||||
|     var self = this; | ||||
|     clearInterval(self.loopIntervalId);  | ||||
|     self.loopIntervalId = 0;             | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   run: function() { | ||||
|     var self = this; | ||||
|     self.drawUI(); | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   configUI: function(id, w, h, c) { | ||||
|     var self = this; | ||||
|     self.canvas_id = id; | ||||
|     self.canvas = document.getElementById(id);  | ||||
|     self.ctx = self.canvas.getContext("2d"); | ||||
|     self.canvas.width = w; | ||||
|     self.canvas.height = h; | ||||
|     self.canvas_bcol = c; | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   addUIObject: function(c) { | ||||
|     var self = this; | ||||
|     self.uiElems.push(c); | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   getUIElemByName: function(name) { | ||||
|     var self = this; | ||||
|     if (self.uiElems.length > 0) { | ||||
|       for (var i = 0; i < self.uiElems.length; i++) | ||||
|  	if (self.uiElems[i].name == name) return self.uiElems[i]; | ||||
|     } | ||||
|     return undefined; | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   drawUI: function() { | ||||
|     var self = this; | ||||
|     self.clear(); | ||||
|     self.drawUIBackground(); | ||||
|     self.drawUIObjects();	 | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   drawUIBackground: function() { | ||||
|     var self = this; | ||||
|     self.ctx.fillStyle = self.canvas_bcol; | ||||
|     self.ctx.fillRect(0, 0, self.canvas.width, self.canvas.height); | ||||
|   }, | ||||
|    | ||||
|   //
 | ||||
|   drawUIObjects: function() { | ||||
|     var self = this; | ||||
|     if (self.uiElems.length > 0) { | ||||
|       for (var i = 0; i < self.uiElems.length; i++) | ||||
| 	self.uiElems[i].draw(self.ctx); | ||||
|     } | ||||
|   }, | ||||
| 
 | ||||
|   //
 | ||||
|   clear: function() { | ||||
|     var self = this; | ||||
|     self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);  | ||||
|   }, | ||||
| 
 | ||||
|      | ||||
| }; | ||||
| 
 | ||||
							
								
								
									
										51
									
								
								client/lib/keyboard/event_handler.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										51
									
								
								client/lib/keyboard/event_handler.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,51 @@ | ||||
| /** | ||||
|  * @file event_handling.js | ||||
|  * @autour frtk@tetalab | ||||
|  */ | ||||
| 
 | ||||
| NPGClient.evtHandler = { | ||||
| 
 | ||||
|   keysList: { | ||||
|     F1 : 112, | ||||
|     SPACE : 32, | ||||
|     ESC : 27, | ||||
|     ARROW_UP : 38, | ||||
|     ARROW_DOWN : 40, | ||||
|     ENTER : 13, | ||||
|     DELETE : 46, | ||||
|     BACKSPACE : 8, | ||||
|   },   | ||||
|      | ||||
|   keyState: {}, | ||||
|    | ||||
|   //
 | ||||
|   init: function() { | ||||
|     var self = this; | ||||
|     //
 | ||||
|     self.keyState = {}; | ||||
|     for (k in self.keyList) { | ||||
|       self.keyState[self.keysList[k]] = false; | ||||
|     }                | ||||
|     //
 | ||||
|     document.addEventListener('keydown',function(e) { | ||||
|       self.keyState[e.keyCode || e.which] = true; | ||||
|       self.onKeyDown(e); | ||||
|     }, true); | ||||
|     //
 | ||||
|     document.addEventListener('keyup',function(e){ | ||||
|       self.keyState[e.keyCode || e.which] = false; | ||||
|     }, true);                        | ||||
|   }, | ||||
| 
 | ||||
|   // 
 | ||||
|   loginValidKey: function(k) { | ||||
|     return (key >= 48 && key <= 90); | ||||
|   }, | ||||
|     | ||||
|   //
 | ||||
|   onKeyDown : function(evt) { | ||||
|     console.log(evt.keyCode);  | ||||
|   }, | ||||
| 
 | ||||
| 
 | ||||
| } | ||||
							
								
								
									
										8
									
								
								client/lib/npg_client.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										8
									
								
								client/lib/npg_client.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,8 @@ | ||||
| /** | ||||
|  * @file NPGClient.js | ||||
|  * @author frtk | ||||
|  */ | ||||
| 
 | ||||
| var NPGClient = { 'version': '' }; | ||||
| 
 | ||||
| 
 | ||||
							
								
								
									
										13
									
								
								client/lib/pages/login_page.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								client/lib/pages/login_page.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,13 @@ | ||||
| /** | ||||
|  * @file login_page.js | ||||
|  * @author frtk@tetalab | ||||
|  */ | ||||
| 
 | ||||
| NPGClient.LoginPage = { | ||||
| 
 | ||||
|     pageIdx: 0, | ||||
|     page: new NPGClient.AppPage('login'), | ||||
|      | ||||
|      | ||||
| };  | ||||
| 
 | ||||
							
								
								
									
										77
									
								
								client/lib/socket/socketio_handler.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										77
									
								
								client/lib/socket/socketio_handler.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,77 @@ | ||||
| /** | ||||
|  * @file SocketIO.js | ||||
|  * @author frtk | ||||
|  */ | ||||
| 
 | ||||
| NPGClient.SocketIO = {  | ||||
| 
 | ||||
|   // Connection to server  
 | ||||
|   conn_nAttempts: 0, | ||||
|   conn_IntervalID: 0, | ||||
|   socket: {}, | ||||
|   isConnected: false, | ||||
| 
 | ||||
|   // start connection loop
 | ||||
|   initConnectLoop:  function() {  | ||||
|     var self = this; | ||||
|       console.log();   | ||||
|       self.startConnectLoop(); | ||||
|   }, | ||||
|   // start connection loop
 | ||||
|   startConnectLoop:  function() {  | ||||
|     var self = this; | ||||
|     self.conn_IntervalID = setInterval(function() { self.connect(); }, 1500);  | ||||
|   }, | ||||
|   // stop connection loop
 | ||||
|   stopConnectLoop:  function() {  | ||||
|     var self =  this; | ||||
|     clearInterval(self.conn_IntervalID); | ||||
|     self.conn_IntervalID = 0; | ||||
|     self.conn_nAttempts = 0; | ||||
|   }, | ||||
|   // connect socket
 | ||||
|   connect: function() { | ||||
|     var self = this;   | ||||
|     // check for connection
 | ||||
|     if (self.isConnected) { | ||||
|       return false;   | ||||
|     } | ||||
|     //
 | ||||
|     if (typeof io !== 'object') { | ||||
|       //console.log('[NPGClient.SocketIO] io object is unknown');
 | ||||
|     } | ||||
|     if ((typeof self.socket.socket === 'undefined')) {       | ||||
|       console.log('[NPGClient.SocketIO] attempting server connection...'); | ||||
|       self.socket = io.connect();   | ||||
|       self.defineSocketMsgs(); | ||||
|     } else if (!self.socket.socket.connected && !self.socket.socket.connecting) { | ||||
|       console.log('[NPGClient.SocketIO] attempting server connection...'); | ||||
|       self.socket.socket.connect();    | ||||
|     } | ||||
|   }, | ||||
|   // Define Socket Messages
 | ||||
|   defineSocketMsgs: function() { | ||||
|     var self = this;   | ||||
|     if (typeof self.socket === 'undefined') { | ||||
|       return false; | ||||
|     } | ||||
|     console.log('[NPGClient.SocketIO] deploying socket object features.'); | ||||
|     // 'connecting' 
 | ||||
|     self.socket.on('connecting', function () { | ||||
|       console.log('[NPGClient.SocketIO] connecting ...'); | ||||
|     }); | ||||
|     // 'connect'
 | ||||
|     self.socket.on('connect', function() { | ||||
|       console.log('[NPGClient.SocketIO] connected to server'); | ||||
|       self.stopConnectLoop(); | ||||
|       self.isConnected = true; | ||||
|     }); | ||||
|     // 'disconnect'
 | ||||
|     self.socket.on('disconnect', function() { | ||||
|       console.log('[NPGClient.SocketIO] > Server: socket disconnected.'); | ||||
|       self.startConnectLoop(); | ||||
|       self.isConnected = false; | ||||
|     });      | ||||
|   } | ||||
|    | ||||
| }; | ||||
							
								
								
									
										50
									
								
								npg_app.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										50
									
								
								npg_app.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,50 @@ | ||||
| /** | ||||
|  * @file nodePong.js | ||||
|  * @author frtk | ||||
|  */ | ||||
| 
 | ||||
| 
 | ||||
| /* | ||||
|  * nodejs modules | ||||
|  */ | ||||
| //--- 
 | ||||
| var fs = require('fs'); | ||||
| var express = require('express'); | ||||
| var http = require('http'); | ||||
| //--- server app libs & params
 | ||||
| //var servP = require('./server/server_config.js');  
 | ||||
| var npg = require('./server/server_core.js'); | ||||
| //--- nodePong config
 | ||||
| var cfg = require('./server/server_config.js'); | ||||
| 
 | ||||
| 
 | ||||
| //
 | ||||
| npg.NPGServer.init(cfg.Config); | ||||
| 
 | ||||
| 
 | ||||
| /* | ||||
|  * starting HTTP and socket.io services | ||||
|  */ | ||||
| //--- HTTP server
 | ||||
| npg.NPGServer.log("$ # starting http service on port " + npg.NPGServer.port); | ||||
| var app = express(); | ||||
| var httpserv = http.createServer(app); | ||||
| httpserv.listen(npg.NPGServer.port); | ||||
| //--- allow access to static files from "/client" directory
 | ||||
| app.use(express.static(__dirname + '/client/')); | ||||
| 
 | ||||
| //--- socket.io
 | ||||
| npg.NPGServer.log('$ # registering socket.io service on port ' + npg.NPGServer.port);   | ||||
| var io = require('socket.io').listen(httpserv, { log: true } ); | ||||
| //-- setup server socket handling features
 | ||||
| npg.NPGServer.socketHandling(io); | ||||
| //
 | ||||
| npg.NPGServer.log('$ #####'); | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /* | ||||
|  * running nodePong server | ||||
|  */ | ||||
| //---
 | ||||
| 
 | ||||
							
								
								
									
										13
									
								
								package.json
									
									
									
									
									
								
							
							
						
						
									
										13
									
								
								package.json
									
									
									
									
									
								
							| @ -1,11 +1,10 @@ | ||||
| { | ||||
|   "name": "nodePong.js", | ||||
|   "version": "0.0.1", | ||||
|   "name": "npg_app.js", | ||||
|   "version": "0.0.9", | ||||
|   "description": "Multiplayer online Pong Game using nodejs and socket.io", | ||||
|   "directories": { | ||||
|     "doc": "docs", | ||||
|     "example": "examples", | ||||
|     "test": "test" | ||||
|     "server": "server", | ||||
|     "client": "client", | ||||
|   }, | ||||
|   "repository": { | ||||
|     "type": "git", | ||||
| @ -20,5 +19,9 @@ | ||||
|   "author": "frtk@tetalab", | ||||
|   "license": "MIT", | ||||
|   "dependencies": { | ||||
|     "express": "", | ||||
|     "fs": "", | ||||
|     "http": "", | ||||
|     "socket.io": "" | ||||
|   } | ||||
| } | ||||
							
								
								
									
										141
									
								
								server/npg_server.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										141
									
								
								server/npg_server.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,141 @@ | ||||
| /** | ||||
|  * @file npg_server.js | ||||
|  * @author frtk                                                                                  | ||||
|  */ | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /** | ||||
|  * | ||||
|  * nodePong Server Object | ||||
|  * | ||||
|  */ | ||||
| var NPGServer = { | ||||
|    | ||||
|   /* | ||||
|    * Data  | ||||
|    */ | ||||
|   // app
 | ||||
|   version: '', | ||||
|   host: '', | ||||
|   port: 0, | ||||
| 
 | ||||
|   // Users and Games
 | ||||
|   users: [], | ||||
|   games: [], | ||||
| 
 | ||||
| 
 | ||||
|   /* | ||||
|    * | ||||
|    */ | ||||
|   //--- init()
 | ||||
|   init: function(o) { | ||||
|     var self = this; | ||||
|     self.version = o.VERSION || '';   | ||||
|     self.host = o.HTTP.host || '';  | ||||
|     self.port = o.HTTP.port || 8042;   | ||||
|     self.log('$ ##### nodePong - v'+self.version);   | ||||
|   }, | ||||
| 
 | ||||
| 
 | ||||
|   //--- setVersion(s)
 | ||||
|   setVersion: function(s) { | ||||
|     this.version = s; | ||||
|   }, | ||||
| 
 | ||||
| 
 | ||||
|   /* | ||||
|    * Server Messages | ||||
|    */  | ||||
|   //--- 
 | ||||
|   log: function(msg) { | ||||
|     var self = this; | ||||
|     return console.log(self.newDateToString() + msg); | ||||
|   }, | ||||
|   //--- dateToString
 | ||||
|   dateToString: function(date) { | ||||
|     var self = this; | ||||
|     return '[' + self.addZero(date.getHours(), 'h') + ':'  | ||||
|                + self.addZero(date.getMinutes(), 'm') + ':'  | ||||
|                + self.addZero(date.getSeconds(), 's') + ':'  | ||||
|                + self.addZero(date.getMilliseconds(), 'ms') + ']'; | ||||
|   }, | ||||
|   //--- addZero
 | ||||
|   addZero: function(value, type) { | ||||
|     switch(type) { | ||||
|       case 'h': | ||||
|       case 'm': | ||||
|       case 's': | ||||
|         if (value < 10) value = '0' + value; | ||||
|           break; | ||||
|       case 'ms': | ||||
|         if (value < 10) value = '00' + value; | ||||
|         else if (value >= 10 && value < 100) value = '0' + value; | ||||
|         break; | ||||
|       default: | ||||
|         break;                   | ||||
|     }; | ||||
|     return value; | ||||
|   }, | ||||
|   //--- return new date string
 | ||||
|   newDateToString: function() { | ||||
|     var self = this;   | ||||
|     return self.dateToString(new Date()); | ||||
|   }, | ||||
| 
 | ||||
| 
 | ||||
|     | ||||
|   /* | ||||
|    * Socket.io handling | ||||
|    */  | ||||
|   //--- 
 | ||||
|   socketHandling: function(io) { | ||||
|     var self = this; | ||||
|     io.sockets.on('connection', function (socket) { | ||||
|       //
 | ||||
|       self.log('$ User connected : id=' + socket.id); | ||||
| 
 | ||||
|       // 'disconnect'
 | ||||
|       socket.on('disconnect', function () {                                                                                 self.log('$ User disconnected : id=' + socket.id);                                                          | ||||
|       }); | ||||
| 
 | ||||
|       //  
 | ||||
|     }); | ||||
|   }, | ||||
| 
 | ||||
| 
 | ||||
| }; | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /** | ||||
|  * | ||||
|  * nodePong User Object | ||||
|  * | ||||
|  */ | ||||
| var User = function(name) { | ||||
| }; | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /** | ||||
|  * | ||||
|  * nodePong Game Object | ||||
|  * | ||||
|  */ | ||||
| var Game = function() { | ||||
| }; | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /** | ||||
|  * | ||||
|  * EXPORT | ||||
|  * | ||||
|  */ | ||||
| if (typeof exports !== "undefined") { | ||||
|   exports.NPGServer = NPGServer; | ||||
|   exports.User = User; | ||||
|   exports.Game = Game; | ||||
| } | ||||
							
								
								
									
										23
									
								
								server/npg_server_config.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										23
									
								
								server/npg_server_config.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,23 @@ | ||||
| /** | ||||
|  * @file npg_server_config.js | ||||
|  * @author frtk | ||||
|  */ | ||||
| 
 | ||||
| var Config = { | ||||
|   VERSION : '0.0.8', | ||||
|   HTTP: { | ||||
|     host: '127.0.0.1', | ||||
|     port: 8042 | ||||
|   }, | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /** | ||||
|  * | ||||
|  * EXPORTS | ||||
|  * | ||||
|  */ | ||||
| if (typeof exports !== "undefined") { | ||||
|   exports.Config = Config; | ||||
| } | ||||
							
								
								
									
										14
									
								
								version.md
									
									
									
									
									
								
							
							
						
						
									
										14
									
								
								version.md
									
									
									
									
									
								
							| @ -1,4 +1,18 @@ | ||||
| 
 | ||||
| ### **v0.0.9:** | ||||
| -------------------------- focus: renaming files/directories | ||||
| ---- App | ||||
| - nodePong.js -> npg_app.js | ||||
| - package.json: updated "directories" & "dependencies" parameters | ||||
| ---- Client | ||||
| - client/src -> client/jquery | ||||
| - client/js -> client/lib | ||||
| - updated index.html | ||||
| ---- Server | ||||
| - server_core.js -> npg_server.js | ||||
| - server_config.js -> npg_server_config.js | ||||
| 
 | ||||
| 
 | ||||
| ### **v0.0.8:** | ||||
| --- focus on client side | ||||
| - Renamed files (lower case + _ ) | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user