Cleaned code
This commit is contained in:
parent
8cf7f9336c
commit
ea18058098
2 changed files with 71 additions and 96 deletions
142
index.html
142
index.html
|
@ -15,8 +15,52 @@
|
|||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
|
||||
<script src="/socket.io/socket.io.js"></script>
|
||||
<script>
|
||||
/** Initialize Canvas **/
|
||||
var c = document.getElementById("test");
|
||||
var ctx = c.getContext("2d");
|
||||
c.width = $(window).width();
|
||||
c.height = $(window).height();
|
||||
|
||||
/** FPS Vars **/
|
||||
var lastCalledTime,
|
||||
lastFPSshown,
|
||||
fps;
|
||||
|
||||
/** Global Configuration **/
|
||||
var localcoop = false, // Local Coop in 1 window CURRENTLY BORKEN [WONTFIX]
|
||||
width = $(window).width(),
|
||||
height = $(window).height();
|
||||
|
||||
/** Prop-Config **/
|
||||
var cube_width = 50,
|
||||
cube_height = 200,
|
||||
cube_speed = 7,
|
||||
ball_size = 15,
|
||||
ball_speed = 8,
|
||||
ballX = cube_width+ball_size,
|
||||
ballY = cube_height/2,
|
||||
ball_owner = 1,
|
||||
ball_VX = 0,
|
||||
ball_VY = 0,
|
||||
ball_maxAngle = 5*Math.PI/12;
|
||||
|
||||
/** Game Variables **/
|
||||
var pid,
|
||||
leftY = 0,
|
||||
rightY = 0,
|
||||
leftV = 0,
|
||||
rightV = 0,
|
||||
leftColor = 'red',
|
||||
rightColor = 'blue',
|
||||
score = [0,0],
|
||||
gameState = 0; // 0 == Waiting for Players, 1 == Countdown, 2 == inGame, 3 == ??Win??
|
||||
|
||||
/** Initalize Socketio **/
|
||||
var socket = io();
|
||||
var pid;
|
||||
|
||||
/** ############## **/
|
||||
/** SERVER EVENTS **/
|
||||
/** ############# **/
|
||||
socket.on('handshake', function(id, state, c_width, c_height, sp, score, fn){
|
||||
$('id').text(id);
|
||||
pid = id;
|
||||
|
@ -40,38 +84,16 @@
|
|||
gameState = state;
|
||||
});
|
||||
|
||||
socket.on('scoreChange', function(val){
|
||||
socket.on('score', function(val){
|
||||
score = val;
|
||||
});
|
||||
|
||||
// Obsolete
|
||||
// socket.on('shootball', function(y){
|
||||
// if(ball_owner == 1) leftY = y;
|
||||
// if(ball_owner == 2) rightY = y;
|
||||
// shootBall();
|
||||
// });
|
||||
|
||||
/** Make Countdown serversided No cheating possible **/
|
||||
/** Serversided Countdown to prevent desync **/
|
||||
socket.on('countdown', function(i){
|
||||
text = 'Starting in ' + i;
|
||||
});
|
||||
|
||||
socket.on('start', function(){
|
||||
leftOr = 'none';
|
||||
rightOr = 'none';
|
||||
leftY = 0;
|
||||
rightY = 0;
|
||||
leftV = 0;
|
||||
rightV = 0;
|
||||
ballX = cube_width+ball_size;
|
||||
ballY = cube_height/2;
|
||||
ball_owner = 1;
|
||||
ball_VX = 0;
|
||||
ball_VY = 0;
|
||||
gameState = 2;
|
||||
});
|
||||
|
||||
socket.on('changeV', function(pos, val, y){
|
||||
socket.on('paddlepos', function(pos, val, y){
|
||||
if(pos == 1){
|
||||
leftV = val;
|
||||
leftY = y;
|
||||
|
@ -92,48 +114,15 @@
|
|||
ball_owner = data['owner'];
|
||||
});
|
||||
|
||||
socket.on('test', function(arg){
|
||||
(arg);
|
||||
/** Print text in local console **/
|
||||
socket.on('debug', function(arg){
|
||||
console.log(arg);
|
||||
});
|
||||
/** Initialize Canvas **/
|
||||
var c = document.getElementById("test");
|
||||
var ctx = c.getContext("2d");
|
||||
c.width = $(window).width();
|
||||
c.height = $(window).height();
|
||||
|
||||
var leftY = 0;
|
||||
var rightY = 0;
|
||||
var leftV = 0;
|
||||
var rightV = 0;
|
||||
var leftColor = 'red';
|
||||
var rightColor = 'blue';
|
||||
var gameState = 0; // 0 == Waiting for Players, 1 == Countdown, 2 == inGame, 3 == ??Win??
|
||||
var score = [0,0];
|
||||
|
||||
/** FPS Vars **/
|
||||
var lastCalledTime,
|
||||
lastFPSshown,
|
||||
fps;
|
||||
|
||||
/** Global Configuration **/
|
||||
var localcoop = false, // Local Coop in 1 window
|
||||
width = $(window).width(),
|
||||
height = $(window).height();
|
||||
|
||||
/** Prop-Config **/
|
||||
var cube_width = 50,
|
||||
cube_height = 200,
|
||||
cube_speed = 7,
|
||||
ball_size = 15,
|
||||
ball_speed = 8,
|
||||
ballX = cube_width+ball_size,
|
||||
ballY = cube_height/2,
|
||||
ball_owner = 1,
|
||||
ball_VX = 0,
|
||||
ball_VY = 0,
|
||||
ball_maxAngle = 5*Math.PI/12;
|
||||
|
||||
|
||||
/** ############ **/
|
||||
/** DEBUG TOOLS **/
|
||||
/** ########### **/
|
||||
/** Meassure Ping and show **/
|
||||
setInterval(function(){
|
||||
var connTime = Date.now();
|
||||
|
@ -166,7 +155,7 @@
|
|||
lastFPSshown = Date.now();
|
||||
$('fps').text(Math.round(fps));
|
||||
|
||||
/** Use this timer for displaying loading indicator **/
|
||||
/** Use this timer to display loading indicator **/
|
||||
if(gameState == 0)
|
||||
switch(texti){
|
||||
case 0: text = nativtext; texti++; break;
|
||||
|
@ -176,14 +165,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
/** ############## **/
|
||||
/** CLIENT RENDER **/
|
||||
/** ############# **/
|
||||
/** Clear Drawing-Region **/
|
||||
ctx.fillStyle = 'white';
|
||||
ctx.fillRect(0, 0, width, height);
|
||||
|
||||
|
||||
|
||||
|
||||
/** Points **/
|
||||
var scoretxt = score[0] + ' : ' + score[1];
|
||||
ctx.fillStyle = 'black';
|
||||
|
@ -221,6 +210,8 @@
|
|||
ctx.fillStyle = rightColor;
|
||||
ctx.fillRect(width-cube_width, rightY, cube_width, cube_height);
|
||||
|
||||
|
||||
// NOTE Physics moved to Server
|
||||
// /** Move Ball with Paddle if owned by owner (@roundstart) **/
|
||||
// if(ball_owner == 1){
|
||||
// ballX = cube_width+ball_size,
|
||||
|
@ -269,7 +260,6 @@
|
|||
// }
|
||||
// }
|
||||
//
|
||||
// /** TODO INCREASE SPEED ON PADDLE HIT (weiter außen = schneller) **/
|
||||
//
|
||||
// /** Collide with walls **/
|
||||
// if(ballY <= 0 || ballY >= height-ball_size){
|
||||
|
@ -331,16 +321,7 @@
|
|||
if(localcoop){
|
||||
switch(e.keyCode) {
|
||||
case 38 :
|
||||
case 40 :
|
||||
//TODO (maybe) add Smooth stopping to Paddles
|
||||
// case 40 : var i = 100;
|
||||
// var interval = setInterval(function(){
|
||||
// i--;
|
||||
// leftV = i/100*(0,002-i/100);
|
||||
// if(i == 0) clearInterval(interval);
|
||||
// }, Math.round((1*delta)*60)*10);
|
||||
setV(1, 0);
|
||||
break;
|
||||
case 40 : setV(1, 0); break;
|
||||
case 87 :
|
||||
case 83 : setV(2, 0); break;
|
||||
}
|
||||
|
@ -380,6 +361,7 @@
|
|||
}
|
||||
|
||||
function shootBall() {
|
||||
// NOTE moved to Server
|
||||
// console.log('### Ball shoot event ###');
|
||||
// /** TODO Tewak and Add MAX_Speed **/
|
||||
// if(ball_owner == 1){
|
||||
|
|
25
index.js
25
index.js
|
@ -23,7 +23,6 @@ var cube_width = 50,
|
|||
/** Networking-Config **/
|
||||
var tickrate = 20;
|
||||
|
||||
|
||||
/** Ball-Config **/
|
||||
var ball_size = 15,
|
||||
ball_speed = 15,
|
||||
|
@ -66,10 +65,6 @@ if(gameState > 0) socket.emit('size', width, height);
|
|||
/** Ballshoot **/
|
||||
/** ######### **/
|
||||
socket.on('ballshoot', function(y){
|
||||
// shottball event obsolet
|
||||
// socket.emit('shootball', y);
|
||||
// socket.broadcast.emit('shootball', y);
|
||||
|
||||
console.log('### Ball shoot event ###');
|
||||
if(ball_owner == 1){
|
||||
ball_VX = ball_speed;
|
||||
|
@ -114,8 +109,8 @@ if(gameState > 0) socket.emit('size', width, height);
|
|||
// console.log('Diff:' + diff);
|
||||
// console.log('Got: ' + y + ' @ ' + timestamp);
|
||||
// console.log('Expected:' + players[pos-1].y + ' @ ' + Date.now());
|
||||
socket.emit('changeV', pos, val, players[pos-1].y);
|
||||
socket.broadcast.emit('changeV', pos, val, players[pos-1].y);
|
||||
// socket.emit('changeV', pos, val, players[pos-1].y);
|
||||
// socket.broadcast.emit('changeV', pos, val, players[pos-1].y);
|
||||
});
|
||||
|
||||
/** ########## **/
|
||||
|
@ -133,7 +128,7 @@ if(gameState > 0) socket.emit('size', width, height);
|
|||
clients.splice(index, 1);
|
||||
console.log('Client disconnected. ID=' + (oldid+1));
|
||||
if(clients.length == 1){
|
||||
clients[0].socket.emit('test', 'player_left'); //TODO win-event
|
||||
clients[0].socket.emit('debug', 'player_left'); //TODO win-event
|
||||
console.log('Only one Player left. Sending win-event');
|
||||
// Debug Restart:
|
||||
gameState = 0;
|
||||
|
@ -204,8 +199,8 @@ function setUp(socket){
|
|||
clearInterval(startinterval);
|
||||
gameState = 2;
|
||||
broadcastGameState(socket);
|
||||
socket.emit('start');
|
||||
socket.broadcast.emit('start');
|
||||
socket.emit('gamestate');
|
||||
socket.broadcast.emit('gamestate');
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
|
@ -229,8 +224,8 @@ function calculatePlayerPosition(){
|
|||
if(player.y > height-player.height || player.y < 0) player.vY = 0;
|
||||
if(player.y < 0) player.y = 0;
|
||||
if(player.y > height-player.height) player.y = height-player.height;
|
||||
player.socket.emit('changeV', player.id, player.vY, player.y);
|
||||
player.socket.broadcast.emit('changeV', player.id, player.vY, player.y);
|
||||
player.socket.emit('paddlepos', player.id, player.vY, player.y);
|
||||
player.socket.broadcast.emit('paddlepos', player.id, player.vY, player.y);
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -289,8 +284,6 @@ function calculateBallPosition(){
|
|||
}
|
||||
}
|
||||
|
||||
/** TODO INCREASE SPEED ON PADDLE HIT (weiter außen = schneller) **/
|
||||
|
||||
/** Collide with walls **/
|
||||
if(ballY <= 0 || ballY >= height-ball_size){
|
||||
ball_VY = -ball_VY;
|
||||
|
@ -311,8 +304,8 @@ function calculateBallPosition(){
|
|||
|
||||
function changeScore(id, val){
|
||||
score[id-1] = val;
|
||||
players[0].socket.emit('scoreChange', score);
|
||||
players[0].socket.broadcast.emit('scoreChange', score);
|
||||
players[0].socket.emit('score', score);
|
||||
players[0].socket.broadcast.emit('score', score);
|
||||
}
|
||||
|
||||
function resetPlayers(){
|
||||
|
|
Reference in a new issue