Browse code

v0.0.8

frtk authored on 12/02/2016 23:42:38
Showing 11 changed files
... ...
@@ -8,8 +8,11 @@
8 8
   <link rel="stylesheet" type="text/css" media="all" href="./css/main.css">
9 9
   <script type="text/javascript" src="http://127.0.0.1:8042/socket.io/socket.io.js"></script>
10 10
   <script type="text/javascript" src="./src/jquery-2.1.3.min.js"></script>
11
-  <script type="text/javascript" src="./js/NPGClient.js"></script>
12
-  <script type="text/javascript" src="./js/socket/SocketIO.js"></script>
11
+  <script type="text/javascript" src="./js/npg_client.js"></script>
12
+  <script type="text/javascript" src="./js/socket/socketio_handler.js"></script>
13
+  <script type="text/javascript" src="./js/keyboard/event_handler.js"></script>
14
+  <script type="text/javascript" src="./js/core/page_base.js"></script>
15
+  <script type="text/javascript" src="./js/pages/login_page.js"></script>
13 16
 </head>
14 17
 
15 18
 <body>  
... ...
@@ -21,37 +24,11 @@
21 21
 
22 22
 </html>
23 23
 
24
-<!--
25
-<script type="text/javascript">
26
-  //console.log(io);
27
-  var socket = {};
28
-  if (typeof io !== 'object') {
29
-      console.log('Client: io object is unknown');
30
-  }
31
-  if ((typeof self.socket.socket === 'undefined')) {
32
-     console.log('[#SocketClient] attempting server connection...');
33
-     socket = io.connect();  // socket connection                                                                
34
-     console.log('[#SocketClient] attempting server connection...');
35
-     //socket.socket.connect();
36
-  }
37
-  socket.emit('data', 'yo');
38
-</script>
39
-
40
-<!--
41
-<script type="text/javascript">
42
-  console.log(io);
43
-//  NPGClient.io = io;
44
-//  NPGClient.SocketClient.setIO(io);
45
-  NPGClient.SocketClient.connect();
46
-  NPGClient.SocketClient.socket.emit('data','yo');
47
-</script>
48
-
49
-
50 24
 <script type="text/javascript">
51 25
 $(document).ready(function() {
52
-  NPGClient.SocketIO.startConnectLoop();;
26
+  NPGClient.evtHandler.init();
27
+  NPGClient.SocketIO.startConnectLoop();
28
+
53 29
   if (NPGClient.SocketIO.isConnected) NPGClient.SocketIO.socket.emit('data','yo');
54 30
 });
55 31
 </script>
56 32
new file mode 100644
... ...
@@ -0,0 +1,13 @@
0
+/**
1
+ * @file NPGClientConfig.js
2
+ */
3
+
4
+var NPGClient.Config = {
5
+
6
+       
7
+
8
+
9
+
10
+
11
+
12
+}
0 13
new file mode 100644
... ...
@@ -0,0 +1,114 @@
0
+/**
1
+ * @file AppPage.js
2
+ * @author frtk@tetalab
3
+ */
4
+
5
+NPGClient.AppPage = function(n) { 
6
+    
7
+  Object.defineProperty(this, 'id', { value: NPGClient.pageCount++ });
8
+   
9
+  this.name = n || '';
10
+  // draw loop paramaters
11
+  this.loopIntervalId = 0;
12
+  this.loopDelay = 40; 
13
+  // canvas 
14
+  this.canvas_id = "";
15
+  this.canvas_bcol = "";
16
+  this.canvas = {};
17
+  this.ctx = {};
18
+
19
+  // ui elements   
20
+  this.uiElems = [];
21
+
22
+};
23
+
24
+NPGClient.AppPage.prototype = {
25
+
26
+  constructor: NPGClient.AppPage,
27
+
28
+  //
29
+  setLoopDelay: function(d) {
30
+    this.loopDelay = d;
31
+  },
32
+
33
+  //
34
+  startDrawLoop: function() {
35
+    var self = this;
36
+    self.loopIntervalId = setInterval(function() { 
37
+      self.run(); 
38
+    }, self.loopDelay);
39
+  },
40
+
41
+  //
42
+  stopDrawLoop: function() {
43
+    var self = this;
44
+    clearInterval(self.loopIntervalId); 
45
+    self.loopIntervalId = 0;            
46
+  },
47
+
48
+  //
49
+  run: function() {
50
+    var self = this;
51
+    self.drawUI();
52
+  },
53
+
54
+  //
55
+  configUI: function(id, w, h, c) {
56
+    var self = this;
57
+    self.canvas_id = id;
58
+    self.canvas = document.getElementById(id); 
59
+    self.ctx = self.canvas.getContext("2d");
60
+    self.canvas.width = w;
61
+    self.canvas.height = h;
62
+    self.canvas_bcol = c;
63
+  },
64
+
65
+  //
66
+  addUIObject: function(c) {
67
+    var self = this;
68
+    self.uiElems.push(c);
69
+  },
70
+
71
+  //
72
+  getUIElemByName: function(name) {
73
+    var self = this;
74
+    if (self.uiElems.length > 0) {
75
+      for (var i = 0; i < self.uiElems.length; i++)
76
+ 	if (self.uiElems[i].name == name) return self.uiElems[i];
77
+    }
78
+    return undefined;
79
+  },
80
+
81
+  //
82
+  drawUI: function() {
83
+    var self = this;
84
+    self.clear();
85
+    self.drawUIBackground();
86
+    self.drawUIObjects();	
87
+  },
88
+
89
+  //
90
+  drawUIBackground: function() {
91
+    var self = this;
92
+    self.ctx.fillStyle = self.canvas_bcol;
93
+    self.ctx.fillRect(0, 0, self.canvas.width, self.canvas.height);
94
+  },
95
+  
96
+  //
97
+  drawUIObjects: function() {
98
+    var self = this;
99
+    if (self.uiElems.length > 0) {
100
+      for (var i = 0; i < self.uiElems.length; i++)
101
+	self.uiElems[i].draw(self.ctx);
102
+    }
103
+  },
104
+
105
+  //
106
+  clear: function() {
107
+    var self = this;
108
+    self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height); 
109
+  },
110
+
111
+    
112
+};
113
+
0 114
new file mode 100644
... ...
@@ -0,0 +1,51 @@
0
+/**
1
+ * @file event_handling.js
2
+ * @autour frtk@tetalab
3
+ */
4
+
5
+NPGClient.evtHandler = {
6
+
7
+  keysList: {
8
+    F1 : 112,
9
+    SPACE : 32,
10
+    ESC : 27,
11
+    ARROW_UP : 38,
12
+    ARROW_DOWN : 40,
13
+    ENTER : 13,
14
+    DELETE : 46,
15
+    BACKSPACE : 8,
16
+  },  
17
+    
18
+  keyState: {},
19
+  
20
+  //
21
+  init: function() {
22
+    var self = this;
23
+    //
24
+    self.keyState = {};
25
+    for (k in self.keyList) {
26
+      self.keyState[self.keysList[k]] = false;
27
+    }               
28
+    //
29
+    document.addEventListener('keydown',function(e) {
30
+      self.keyState[e.keyCode || e.which] = true;
31
+      self.onKeyDown(e);
32
+    }, true);
33
+    //
34
+    document.addEventListener('keyup',function(e){
35
+      self.keyState[e.keyCode || e.which] = false;
36
+    }, true);                       
37
+  },
38
+
39
+  // 
40
+  loginValidKey: function(k) {
41
+    return (key >= 48 && key <= 90);
42
+  },
43
+   
44
+  //
45
+  onKeyDown : function(evt) {
46
+    console.log(evt.keyCode); 
47
+  },
48
+
49
+
50
+}
0 51
new file mode 100644
... ...
@@ -0,0 +1,8 @@
0
+/**
1
+ * @file NPGClient.js
2
+ * @author frtk
3
+ */
4
+
5
+var NPGClient = { 'version': '' };
6
+
7
+
0 8
new file mode 100644
... ...
@@ -0,0 +1,13 @@
0
+/**
1
+ * @file login_page.js
2
+ * @author frtk@tetalab
3
+ */
4
+
5
+NPGClient.LoginPage = {
6
+
7
+    pageIdx: 0,
8
+    page: new NPGClient.AppPage('login'),
9
+    
10
+    
11
+}; 
12
+
0 13
new file mode 100644
... ...
@@ -0,0 +1,77 @@
0
+/**
1
+ * @file SocketIO.js
2
+ * @author frtk
3
+ */
4
+
5
+NPGClient.SocketIO = { 
6
+
7
+  // Connection to server  
8
+  conn_nAttempts: 0,
9
+  conn_IntervalID: 0,
10
+  socket: {},
11
+  isConnected: false,
12
+
13
+  // start connection loop
14
+  initConnectLoop:  function() { 
15
+    var self = this;
16
+      console.log();  
17
+      self.startConnectLoop();
18
+  },
19
+  // start connection loop
20
+  startConnectLoop:  function() { 
21
+    var self = this;
22
+    self.conn_IntervalID = setInterval(function() { self.connect(); }, 1500); 
23
+  },
24
+  // stop connection loop
25
+  stopConnectLoop:  function() { 
26
+    var self =  this;
27
+    clearInterval(self.conn_IntervalID);
28
+    self.conn_IntervalID = 0;
29
+    self.conn_nAttempts = 0;
30
+  },
31
+  // connect socket
32
+  connect: function() {
33
+    var self = this;  
34
+    // check for connection
35
+    if (self.isConnected) {
36
+      return false;  
37
+    }
38
+    //
39
+    if (typeof io !== 'object') {
40
+      //console.log('[NPGClient.SocketIO] io object is unknown');
41
+    }
42
+    if ((typeof self.socket.socket === 'undefined')) {      
43
+      console.log('[NPGClient.SocketIO] attempting server connection...');
44
+      self.socket = io.connect();  
45
+      self.defineSocketMsgs();
46
+    } else if (!self.socket.socket.connected && !self.socket.socket.connecting) {
47
+      console.log('[NPGClient.SocketIO] attempting server connection...');
48
+      self.socket.socket.connect();   
49
+    }
50
+  },
51
+  // Define Socket Messages
52
+  defineSocketMsgs: function() {
53
+    var self = this;  
54
+    if (typeof self.socket === 'undefined') {
55
+      return false;
56
+    }
57
+    console.log('[NPGClient.SocketIO] deploying socket object features.');
58
+    // 'connecting' 
59
+    self.socket.on('connecting', function () {
60
+      console.log('[NPGClient.SocketIO] connecting ...');
61
+    });
62
+    // 'connect'
63
+    self.socket.on('connect', function() {
64
+      console.log('[NPGClient.SocketIO] connected to server');
65
+      self.stopConnectLoop();
66
+      self.isConnected = true;
67
+    });
68
+    // 'disconnect'
69
+    self.socket.on('disconnect', function() {
70
+      console.log('[NPGClient.SocketIO] > Server: socket disconnected.');
71
+      self.startConnectLoop();
72
+      self.isConnected = false;
73
+    });     
74
+  }
75
+  
76
+};
... ...
@@ -13,39 +13,33 @@ var express = require('express');
13 13
 var http = require('http');
14 14
 //--- server app libs & params
15 15
 //var servP = require('./server/server_config.js');  
16
-var nPong = require('./server/server_core.js');
16
+var npg = require('./server/server_core.js');
17 17
 //--- nodePong config
18
-var config = require('./server/server_config.js');
19
-
18
+var cfg = require('./server/server_config.js');
20 19
 
21 20
 
22 21
 //
23
-nPong.Server.setVersion(config.VERSION);
24
-nPong.Server.log("$ ##### nodePong - v" + nPong.Server.version);
22
+npg.NPGServer.init(cfg.Config);
25 23
 
26 24
 
27 25
 /*
28 26
  * starting HTTP and socket.io services
29 27
  */
30 28
 //--- HTTP server
31
-nPong.Server.log("$ # starting http service on port " + config.HTTP.port);
29
+npg.NPGServer.log("$ # starting http service on port " + npg.NPGServer.port);
32 30
 var app = express();
33 31
 var httpserv = http.createServer(app);
34
-httpserv.listen(config.HTTP.port);
32
+httpserv.listen(npg.NPGServer.port);
35 33
 //--- allow access to static files from "/client" directory
36 34
 app.use(express.static(__dirname + '/client/'));
37 35
 
38 36
 //--- socket.io
39
-nPong.Server.log('$ # registering socket.io service on port ' + config.HTTP.port);  
37
+npg.NPGServer.log('$ # registering socket.io service on port ' + npg.NPGServer.port);  
40 38
 var io = require('socket.io').listen(httpserv, { log: true } );
41 39
 //-- setup server socket handling features
42
-nPong.Server.socketHandling(io);
43
-
40
+npg.NPGServer.socketHandling(io);
44 41
 //
45
-nPong.Server.log('$ #####');
46
-
47
-
48
-
42
+npg.NPGServer.log('$ #####');
49 43
 
50 44
 
51 45
 
... ...
@@ -3,13 +3,12 @@
3 3
  * @author frtk
4 4
  */
5 5
 
6
-var VERSION = '0.0.5';
7
-
8
-/**
9
- * HTTP Service
10
- */
11
-var HTTP = {
12
-  port: 8042,
6
+var Config = {
7
+  VERSION : '0.0.8',
8
+  HTTP: {
9
+    host: '127.0.0.1',
10
+    port: 8042
11
+  },
13 12
 }
14 13
 
15 14
 
... ...
@@ -20,6 +19,5 @@ var HTTP = {
20 20
  *
21 21
  */
22 22
 if (typeof exports !== "undefined") {
23
-  exports.HTTP = HTTP;
24
-  exports.VERSION = VERSION;
23
+  exports.Config = Config;
25 24
 }
... ...
@@ -10,13 +10,16 @@
10 10
  * nodePong Server Object
11 11
  *
12 12
  */
13
-var Server = {
13
+var NPGServer = {
14 14
   
15 15
   /*
16 16
    * Data 
17 17
    */
18
-  // version
18
+  // app
19 19
   version: '',
20
+  host: '',
21
+  port: 0,
22
+
20 23
   // Users and Games
21 24
   users: [],
22 25
   games: [],
... ...
@@ -26,9 +29,12 @@ var Server = {
26 26
    *
27 27
    */
28 28
   //--- init()
29
-  init: function() {
29
+  init: function(o) {
30 30
     var self = this;
31
-
31
+    self.version = o.VERSION || '';  
32
+    self.host = o.HTTP.host || ''; 
33
+    self.port = o.HTTP.port || 8042;  
34
+    self.log('$ ##### nodePong - v'+self.version);  
32 35
   },
33 36
 
34 37
 
... ...
@@ -37,10 +43,6 @@ var Server = {
37 37
     this.version = s;
38 38
   },
39 39
 
40
-  //--- setIO(io)  
41
-  setIO: function(io) { 
42
-      
43
-  },
44 40
 
45 41
   /*
46 42
    * Server Messages
... ...
@@ -90,16 +92,14 @@ var Server = {
90 90
   socketHandling: function(io) {
91 91
     var self = this;
92 92
     io.sockets.on('connection', function (socket) {
93
-	
94
-	//
95
-	self.log('$ User connected : id=' + socket.id);
93
+      //
94
+      self.log('$ User connected : id=' + socket.id);
96 95
 
97
-	// 'disconnect'
98
-	socket.on('disconnect', function () {                                                                                  
99
-            self.log('$ User disconnected : id=' + socket.id);                                                         
100
-            connected = false;                                                                                                 
101
-	}); 
96
+      // 'disconnect'
97
+      socket.on('disconnect', function () {                                                                                 self.log('$ User disconnected : id=' + socket.id);                                                         
98
+      });
102 99
 
100
+      //  
103 101
     });
104 102
   },
105 103
 
... ...
@@ -135,7 +135,7 @@ var Game = function() {
135 135
  *
136 136
  */
137 137
 if (typeof exports !== "undefined") {
138
-  exports.Server = Server;
138
+  exports.NPGServer = NPGServer;
139 139
   exports.User = User;
140 140
   exports.Game = Game;
141 141
 }
... ...
@@ -1,7 +1,25 @@
1 1
 
2
+### **v0.0.8:**
3
+--- focus on client side
4
+- Renamed files (lower case + _ )
5
+- Client directory structure : config, core, keyboard, pages, socket 
6
+- added keyboard event handler basic features
7
+- added AppPage object definition
8
+- added login page skeletton
9
+- nothing crashed
10
+
11
+
12
+### **v0.0.7:**
13
+--- focus on server object
14
+- Renamed server object in server_core.js (Server -> NPGServer)
15
+- Removed setIO(io) function in NPGServer object
16
+- added init() function to NPGClient 
17
+- Changed server_config.js structure
18
+- updated nodePong.js 
19
+
2 20
 
3 21
 ### **v0.0.6:**
4
-- focus on socket.io client & server)
22
+--- focus on socket.io client & server)
5 23
 - Renamed SocketClient.js to SocketIO.js (files and objects)
6 24
 - Added SocketIO object (NGPClient lib in /client/js/)
7 25
 - Implemented socket.io client connection (with loop) => working