Skip to content

Commit

Permalink
Adding legacy implementation
Browse files Browse the repository at this point in the history
  • Loading branch information
@marler8997
marler8997 committed Jun 27, 2015
1 parent 3ed3e5b commit c181171
Showing 1 changed file with 340 additions and 0 deletions.
340 changes: 340 additions & 0 deletions SlimeVolleyballLegacy.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,340 @@
<html><head>
<script type="text/javascript" src="Input.js"></script>
<script type="text/javascript">

var physicsLog = 0;

// Objects rendered in the slime engine
// need an x and a y parameter
function newBall(radius,color) {
return {
radius:radius,
color:color,
x:0,
y:0,
velocityX:0,
velocityY:0,
render: function() {
var xPix = this.x * pixelsPerUnitX;
var yPix = (4 * gameHeight / 5) - (this.y * pixelsPerUnitY);

//yPix /= 2;

var radiusPix = this.radius * pixelsPerUnitY;
ctx.fillStyle = this.color;
ctx.beginPath();
ctx.arc(xPix, yPix, radiusPix, 0, 2*Math.PI);
ctx.fill();
}
};
}
function newSlime(radius,color) {
return {
radius:radius,
color:color,
x:0,
y:0,
velocityX:0,
velocityY:0,
render: function() {
var xPix = this.x * pixelsPerUnitX;
var yPix = (4 * gameHeight / 5) - (this.y * pixelsPerUnitY);

//yPix /= 2;

var radiusPix = this.radius * pixelsPerUnitY;
ctx.fillStyle = this.color;
ctx.beginPath();
ctx.arc(xPix, yPix, radiusPix, Math.PI, 2*Math.PI);
ctx.fill();
}
};
}

// RENDER DATA
var ctx;
var canvas;
var gameWidth,gameHeight;
var pixelsPerUnitX;
var pixelsPerUnitY;
var updatesToPaint;


// GAME DATA
var ball;
var slime1;
var slime2;
var slime1Score;
var slime2Score;

// Game Update Functions
function updateSlimeVelocities(s,left,right,up) {
// update velocities
if(keysDown[left]) {
if(keysDown[right]) {
s.velocityX = 0;
} else {
s.velocityX = -8;
}
} else if(keysDown[right]) {
s.velocityX = 8;
} else {
s.velocityX = 0;
}
if(s.y == 0 && keysDown[up]) {
s.velocityY = 31;
}
}
function updateSlime(s, leftLimit, rightLimit) {
if(s.velocityX != 0) {
s.x += s.velocityX;
if(s.x < leftLimit) s.x = leftLimit;
else if(s.x > rightLimit) s.x = rightLimit;
}
if(s.velocityY != 0 || s.y > 0) {
s.velocityY -= 2;
s.y += s.velocityY;
if(s.y < 0) {
s.y = 0;
s.velocityY = 0;
}
}
}

var logString;
function log(msg)
{
logString += msg + '\n';
}
var MAX_VELOCITY_X = 15;
var MAX_VELOCITY_Y = 22;
function collisionBallSlime(s) {
var dx = 2 * (ball.x - s.x);
var dy = ball.y - s.y;
var dist = Math.trunc(Math.sqrt(dx * dx + dy * dy));
//console.log("dist = " + dist);

var dVelocityX = ball.velocityX - s.velocityX;
var dVelocityY = ball.velocityY - s.velocityY;

if(dy > 0 && dist < ball.radius + s.radius && dist > FUDGE) {
var oldBall = {x:ball.x,y:ball.y,velocityX:ball.velocityX,velocityY:ball.velocityY};
if(physicsLog > 0) {
log("Collision:");
log(" dx " + dx);
log(" dy " + dy);
log(" dist " + dist);
log(" dvx " + dVelocityX);
log(" dvy " + dVelocityY);
log(" oldBallX " + ball.x);
log(" oldBallY " + ball.y);
log(" [DBG] s.x : " + s.x);
log(" [DBG] s.rad : " + s.radius);
log(" [DBG] b.rad : " + ball.radius);
log(" [DBG] 0 : " + Math.trunc((s.radius + ball.radius) / 2));
log(" [DBG] 1 : " + Math.trunc((s.radius + ball.radius) / 2)*dx);
log(" [DBG] 2 : " + Math.trunc(Math.trunc((s.radius + ball.radius) / 2)*dx/dist));
}
ball.x = s.x + Math.trunc(Math.trunc((s.radius + ball.radius) / 2) * dx / dist);
ball.y = s.y + Math.trunc((s.radius + ball.radius) * dy / dist);

var something = Math.trunc((dx * dVelocityX + dy * dVelocityY) / dist);
if(physicsLog > 0) {
log(" newBallX " + ball.x);
log(" newBallY " + ball.y);
log(" something " + something);
}

if(something <= 0) {
ball.velocityX += Math.trunc(s.velocityX - 2 * dx * something / dist);
ball.velocityY += Math.trunc(s.velocityY - 2 * dy * something / dist);
if( ball.velocityX < -MAX_VELOCITY_X) ball.velocityX = -MAX_VELOCITY_X;
else if(ball.velocityX > MAX_VELOCITY_X) ball.velocityX = MAX_VELOCITY_X;
if( ball.velocityY < -MAX_VELOCITY_Y) ball.velocityY = -MAX_VELOCITY_Y;
else if(ball.velocityY > MAX_VELOCITY_Y) ball.velocityY = MAX_VELOCITY_Y;
if(physicsLog > 0) {
log(" ballVX " + ball.velocityX);
log(" ballVY " + ball.velocityY);
}
}
/*
console.log("Collision something: " + something +
", dy: " + dy +
", dist: " + dist + ", y:" + oldBall.y + ">" + ball.y +
", velocityY: " + oldBall.velocityY + ">" + ball.velocityY);*/
}
}
var FUDGE = 5; // not sure why this is needed
function updateBall() {
ball.velocityY += -1; // gravity
if(ball.velocityY < -MAX_VELOCITY_Y) {
ball.velocityY = -MAX_VELOCITY_Y;
}

ball.x += ball.velocityX;
ball.y += ball.velocityY;

collisionBallSlime(slime1);
collisionBallSlime(slime2);

// handle wall hits
if (ball.x < 15) {
ball.x = 15;
ball.velocityX = -ball.velocityX;
} else if(ball.x > 985){
ball.x = 985;
ball.velocityX = -ball.velocityX;
}
// hits the post
if (ball.x > 480 && ball.x < 520 && ball.y < 140) {
// bounces off top of net
if (ball.velocityY < 0 && ball.y > 130) {
ball.velocityY *= -1;
ball.y = 130;
} else if (ball.x < 500) { // hits side of net
ball.x = 480;
ball.velocityX = ball.velocityX >= 0 ? -ball.velocityX : ball.velocityX;
} else {
ball.x = 520;
ball.velocityX = ball.velocityX <= 0 ? -ball.velocityX : ball.velocityX;
}
}

if(ball.y < 0) {
if(ball.x > 500) {
slime1Score++;
initRound(true);
} else {
slime2Score++;
initRound(false);
}
}
}
function updateFrame() {
updateSlimeVelocities(slime1, KEY_A,KEY_D,KEY_W);
updateSlimeVelocities(slime2, KEY_LEFT,KEY_RIGHT,KEY_UP);

updateSlime(slime1, 50 , 445);
updateSlime(slime2, 555, 950);

// Allows slimes to go accross the net
//updateSlime(slime1, 0, 1000);
//updateSlime(slime2, 0, 1000);

updateBall();
}


// Rendering Functions
function renderBackground()
{
var courtHeight = gameHeight/5;
ctx.fillStyle='#0077ff'
ctx.fillRect(0, 0, gameWidth, gameHeight-courtHeight);
ctx.fillStyle='#ca6'
ctx.fillRect(0, gameHeight-courtHeight, gameWidth, courtHeight);
ctx.fillStyle='#fff'
ctx.fillRect(gameWidth/2-2,7*gameHeight/10,4,gameHeight/10+5);
}


// GAME CODE
function renderGame() {
if(updatesToPaint == 0) {
console.log("WARNING: render called but not ready to paint");
} else {
if(updatesToPaint > 1) {
console.log("WARNING: render missed " + (updatesToPaint - 1) + " frame(s)");
}
renderBackground();
ctx.font = "20px Georgia";
ctx.fillText("Score: " + slime1Score, 0, 20);
ctx.fillText("Score: " + slime2Score, gameWidth - 200, 20);
ball.render();
slime1.render();
slime2.render();
updatesToPaint = 0;
}
}

function gameIteration() {
if(updatesToPaint > 0) {
console.log("WARNING: updating frame before it was rendered");
}
if(physicsLog > 0) {
log("Frame");
log(" ball.x " + ball.x);
log(" ball.y " + ball.y);
log(" ball.vx " + ball.velocityX);
log(" ball.vy " + ball.velocityY);
physicsLog--;
if(physicsLog == 0) {
var logDom = document.createElement('pre');
logDom.innerHTML = logString;
document.body.appendChild(logDom);
}
}
updateFrame();
updatesToPaint++;
requestAnimationFrame(renderGame);
}

function initRound(server) {
ball.x = server ? 200 : 800;
ball.y = 356;
ball.velocityX = 0;
ball.velocityY = 0;

slime1.x = 200;
slime1.y = 0;
slime1.velocityX = 0;
slime1.velocityY = 0;

slime2.x = 800;
slime2.y = 0;
slime2.velocityX = 0;
slime2.velocityY = 0;
}

function updateWindowSize(width,height) {
gameWidth = width;
gameHeight = height;
console.log("WindowSize " + width + ", " + height);
pixelsPerUnitX = gameWidth / 1000;
pixelsPerUnitY = gameHeight / 1000;
}

function bodyload() {
// Create Render objects
var canvas = document.createElement("canvas");
ctx = canvas.getContext("2d");
canvas.width = 730;
canvas.height = 375;

// Setup Render Data
updateWindowSize(canvas.width,canvas.height);
document.body.appendChild(canvas);

// Initialize Logging
logString = '';
//logDom = document.createElement('p');
//document.body.appendChild(logDom);

// Initialize Game Data
ball = newBall( 25,'#ff0');
slime1 = newSlime(100,'#f00');
slime2 = newSlime(100,'#0f0');

slime1Score = 0;
slime2Score = 0;

initRound(true);

setInterval(gameIteration, 20);
}



</script>
</head><body onload="bodyload()">
</body></html>

0 comments on commit c181171

Please sign in to comment.