Merge pull request #1 from mhuusko5/master

Some quick/small, but important changes to Hextris
This commit is contained in:
lengstrom 2014-05-18 16:52:15 -04:00
commit 2ac75f59de
13 changed files with 539 additions and 529 deletions

3
.gitignore vendored
View file

@ -1 +1,2 @@
.DS_Store
.DS_Store
.idea/*

View file

@ -1,135 +0,0 @@
// HackExeter
function getIndex(list,index) {
if(index>-1) {
return index%list.length;
}
else {
return list.length+index;
}
}
function scoreCheckHorizontal(clock,side,index) {
clockSides = clock.blocks;
if(clockSides[getIndex(clockSides,side)][index] && clockSides[getIndex(clockSides,side-1)][index] && clockSides[getIndex(clockSides,side-2)][index]) {
if(clockSides[getIndex(clockSides,side)][index].color == clockSides[getIndex(clockSides,side-1)][index].color && clockSides[getIndex(clockSides,side-1)][index].color == clockSides[getIndex(clockSides,side-2)][index].color) {
return -2;
}
}
if(clockSides[getIndex(clockSides,side)][index] && clockSides[getIndex(clockSides,side+1)][index] && clockSides[getIndex(clockSides,side-1)][index]) {
if(clockSides[getIndex(clockSides,side)][index].color == clockSides[getIndex(clockSides,side+1)][index].color && clockSides[getIndex(clockSides,side+1)][index].color == clockSides[getIndex(clockSides,side-1)][index].color) {
return -1;
}
}
if(clockSides[getIndex(clockSides,side)][index] && clockSides[getIndex(clockSides,side+1)][index] && clockSides[getIndex(clockSides,side+2)][index]) {
if(clockSides[getIndex(clockSides,side)][index].color == clockSides[getIndex(clockSides,side+1)][index].color && clockSides[getIndex(clockSides,side+1)][index].color == clockSides[getIndex(clockSides,side+2)][index].color) {
return 0;
}
}
return "false";
}
function scoreCheckVertical(clock,side,index) {
curSide = clock.blocks[side];
if(curSide[index] && curSide[index-2] && curSide[index-1]) {
if(curSide[index].color == curSide[index-2].color && curSide[index-2].color ==curSide[index-1].color) {
return -2;
}
}
if(curSide[index] && curSide[index+1] && curSide[index-1]) {
if(curSide[index].color == curSide[index+1].color && curSide[index+1].color == curSide[index-1].color) {
return -1;
}
}
if(curSide[index] && curSide[index+2] && curSide[index+1]) {
if(curSide[index].color == curSide[index+2].color&& curSide[index+2].color ==curSide[index+1].color) {
return 0;
}
}
return "false";
}
function consolidateBlocks(clock,side,index) {
horizontal = scoreCheckHorizontal(clock,side,index);
vertical = scoreCheckVertical(clock,side,index);
deleted = [];
if(horizontal != "false") {
scoreScalar *= 2;
deleted.push([side,index,horizontal]);
}
else {
deleted.push([]);
}
if(vertical != "false") {
scoreScalar *= 2;
deleted.push([side,index,vertical]);
}
else {
deleted.push([]);
}
eraseBlocks(clock,deleted);
return;
}
function eraseBlocks(clock,deleted) {
if(deleted[0].length>0){
side = deleted[0][0];
index = deleted[0][1];
horizontal = deleted[0][2];
length =3;
flag=0;
if(clock.blocks[getIndex(clock.blocks,side+horizontal+length+1)][index]){
try {
flag= clock.blocks[getIndex(clock.blocks,side+horizontal+length)][index].color == clock.blocks[getIndex(clock.blocks,side+horizontal+length+1)][index].color;
}
catch (e) {
console.log(e);
}
}
while(flag) {
if(clock.blocks[getIndex(clock.blocks,side+horizontal+length+1)][index]){
flag= clock.blocks[getIndex(clock.blocks,side+horizontal+length)][index].color == clock.blocks[getIndex(clock.blocks,side+horizontal+length+1)][index].color;
}
length++;
}
console.log(length);
for(var i=0;i<length;i++) {
clock.blocks[getIndex(clock.blocks,side+horizontal+i)].splice(index,1);
}
for(var i=0;i<length;i++) {
if(side+horizontal+i<clock.blocks.length) {
consolidateBlocks(clock,getIndex(clock.blocks,side+horizontal+i),index);
}
}
}
if(deleted[1].length>0){
side = deleted[1][0];
index = deleted[1][1];
vertical = deleted[1][2];
vertlength=3;
while(index+vertical+vertlength<clock.blocks[side].length-1 && (clock.blocks[slide][index+vertical+length].color ==clock.blocks[slide][index+vertical+length+1].color )) {
vertlength+=1;
}
clock.blocks[side].splice(index+vertical,2+(1*(!deleted[0].length>0)));
for(var i=0; i<clock.blocks[side].length-(index+vertical); i++) {
consolidateBlocks(clock,side,index+vertical+i);
}
}
sidesChanged = [];
if(deleted[1].length>0){
if(deleted[1][0] != "false") {
sidesChanged.push(deleted[1][0]);
}
}
if(deleted[0].length>0){
for(var i=0;i<length;i++) {
if(deleted[0][2] != "false" ) {
sidesChanged.push(getIndex(clock.blocks,deleted[0][0]+deleted[0][2]+i));
}
}
}
sidesChanged.forEach(function(o){
MainClock.blocks[o].forEach(function(block) {
block.settled = 0;
})
});
}

View file

@ -1,145 +0,0 @@
// HackExeter
//you can change these to sexier stuff
function Block(lane, color, distFromHex, settled) {
this.settled = (settled == undefined) ? 0 : 1;
this.height = 20;
this.width = 65;
this.lane = lane;
this.angle = 90 - (30 + 60 * lane);
if (this.angle < 0) {
this.angle += 360;
}
this.color = color;
if (distFromHex) {
this.distFromHex = distFromHex;
}
else {
this.distFromHex = 300;
}
this.draw = function() {
this.width = 2 * this.distFromHex / Math.sqrt(3);
this.widthswag = this.width + this.height + 3;
var p1 = rotatePoint(-this.width/2, this.height/2, this.angle);
var p2 = rotatePoint(this.width/2, this.height/2, this.angle);
var p3 = rotatePoint(this.widthswag/2, -this.height/2, this.angle);
var p4 = rotatePoint(-this.widthswag/2, -this.height/2, this.angle);
ctx.fillStyle=this.color;
var baseX = canvas.width/2 + Math.sin((this.angle) * (Math.PI/180)) * (this.distFromHex + this.height/2);
var baseY = canvas.height/2 - Math.cos((this.angle) * (Math.PI/180)) * (this.distFromHex + this.height/2);
ctx.beginPath();
ctx.moveTo(baseX + p1.x, baseY + p1.y);
ctx.lineTo(baseX + p2.x, baseY + p2.y);
ctx.lineTo(baseX + p3.x, baseY + p3.y);
ctx.lineTo(baseX + p4.x, baseY + p4.y);
ctx.lineTo(baseX + p1.x, baseY + p1.y);
ctx.closePath();
ctx.fill();
};
}
function Clock(sideLength) {
this.fillColor = '#2c3e50';
this.position = 0;
this.sides = 6;
this.blocks = [];
this.angle = 30;
this.sideLength = sideLength;
this.strokeColor = 'blue';
this.x = canvas.width / 2;
this.y = canvas.height / 2;
for(var i=0; i< this.sides; i++) {
this.blocks.push([]);
}
this.addBlock = function(block) {
block.settled = 1;
var lane = this.sides - block.lane;// -this.position;
lane += this.position;
while (lane < 0) {
lane += this.sides;
}
lane = lane % this.sides;
block.distFromHex = MainClock.sideLength / 2 * Math.sqrt(3) + block.height * this.blocks[lane].length;
this.blocks[lane].push(block);
consolidateBlocks(this,lane,this.blocks[lane].length-1);
};
this.doesBlockCollide = function(block, iter, position, tArr) {
if (block.settled) return;
var lane = this.sides - block.lane;// -this.position;
lane += this.position;
while (lane < 0) {
lane += this.sides;
}
lane = lane % this.sides;
var arr = this.blocks[lane];
if (position !== undefined) {
arr = tArr;
if (position <= 0) {
if (block.distFromHex - (this.sideLength/2) * Math.sqrt(3) <= 0) {
block.settled = 1;
if (iter == 2 && block.distFromHex + 1 - (this.sideLength/2) * Math.sqrt(3) <= 0) {
block.distFromHex--;
}
}
}
else {
if (block.distFromHex + iter - arr[position - 1].distFromHex - arr[position - 1].height <= 0) {
block.settled = 1;
if (iter == 2 && block.distFromHex + 1 + iter - arr[position - 1].distFromHex - arr[position - 1].height <= 0) {
block.distFromHex--;
}
}
}
}
else {
if (arr.length > 0) {
if (block.distFromHex + iter - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) {
if (iter == 2 && block.distFromHex + iter + 1 - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) {
block.distFromHex--;
}
this.addBlock(block);
}
}
else {
if (block.distFromHex + iter - (this.sideLength/2) * Math.sqrt(3) <= 0) {
if (iter == 2 && block.distFromHex + iter + 1 - (this.sideLength/2) * Math.sqrt(3) <= 0) {
block.distFromHex--;
}
this.addBlock(block);
}
}
}
};
this.rotate = function(steps) {
this.position += steps;
while (this.position < 0) {
this.position += 6;
}
this.position = this.position % this.sides;
this.blocks.forEach(function(blocks){
blocks.forEach(function(block){
block.angle = block.angle - steps * 60;
});
});
this.angle = this.angle + steps * 60;
};
this.draw = function() {
drawPolygon(this.x, this.y, this.sides, this.sideLength, this.angle, this.fillColor);
};
}

View file

@ -1,39 +1,41 @@
<!-- HackExeter -->
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
<!DOCTYPE html>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, minimal-ui"/>
<html>
<head>
<title>Wasted Time</title>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Roboto">
<style>
* {
padding: 0;
margin: 0;
}
body {
color: white;
font-family: 'Roboto', sans-serif;
font-size: 24px;
}
</style>
<title>Wasted Time</title>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Roboto">
<style>
* {
padding: 0;
margin: 0;
}
body {
color: white;
font-family: 'Roboto', sans-serif;
}
</style>
<script src="vendor/hammer.min.js"></script>
<script src="vendor/keypress.min.js"></script>
</head>
<body style="background-color:#2c3e50">
<div style='margin: 0 auto; width: 100%;text-align: center; margin-top: 20px;'><h1 style='color:#ecf0f1; font-size:50px;'>Hextris</h1>
<span id="score">0 (x1)</span>
</div>
<canvas id="canvas" width = '700' height = '700' style='background-color:#2c3e50; position:absolute;left:50%;margin-left:-350px'></canvas>
<div id="leftTap" style="position:absolute; left:0; top:0; height:400%;width:50%"></div>
<div id="rightTap" style="position:absolute; left:50%; top:0; height:400%;width:50%"></div>
<div style="margin: 1vmin auto 0 auto; width: 100%; text-align: center;">
<h1 style="color: #ecf0f1; font-size: 10vmin;">Hextris</h1>
<span id="score" style="color: #ecf0f1; font-size: 4vmin;">0 (x1)</span>
</div>
<canvas id="canvas" width="700" height="700" style="position: absolute; left: calc(50% - 80vmin / 2); height: 80vmin; width: 80vmin; background-color: #2c3e50;"></canvas>
<div id="leftTap" style="position: absolute; left: 0; top: 0; height: 100%; width: 50%;"></div>
<div id="rightTap" style="position: absolute; right: 0; top: 0; height :100%; width: 50%;"></div>
<script src="js/math.js"></script>
<script src="js/entities.js"></script>
<script src="js/input.js"></script>
<script src="js/checking.js"></script>
<script src="js/main.js"></script>
<script src="math.js"></script>
<script src="entities.js"></script>
<script src="math.js"></script>
<script src="hammer.min.js"></script>
<script src="keypress.min.js"></script>
<script src="input.js"></script>
<script src="checking.js"></script>
<script src="main.js"></script>
</body>
</html>

View file

@ -1,43 +0,0 @@
// HackExeter
keypress.register_combo({
keys: "left",
on_keyup: function(){MainClock.rotate(1)},
});
keypress.register_combo({
keys: "right",
on_keyup: function(){MainClock.rotate(-1)},
});
keypress.register_combo({
keys: "enter",
on_keyup: function(){
if (gameState != 1) {
init();
}
},
});
var tapLeft = Hammer(document.getElementById("leftTap")).on("tap", function(event) {
if (gameState != 1) {
init();
}
MainClock.rotate(1)
});
var tapRight = Hammer(document.getElementById("rightTap")).on("tap", function(event) {
if (gameState != 1) {
init();
}
MainClock.rotate(-1)
});
keypress.register_combo({
keys: "space",
on_keyup: function(){
iter = 1;
scoreAdditionCoeff = 1;
},
on_keydown: function() {
iter = 2;
scoreAdditionCoeff = 2;
}
});

131
js/checking.js Normal file
View file

@ -0,0 +1,131 @@
// HackExeter
function getIndex(list, index) {
if (index > -1) {
return index % list.length;
} else {
return list.length + index;
}
}
function scoreCheckHorizontal(clock, side, index) {
clockSides = clock.blocks;
if (clockSides[getIndex(clockSides, side)][index] && clockSides[getIndex(clockSides, side - 1)][index] && clockSides[getIndex(clockSides, side - 2)][index]) {
if (clockSides[getIndex(clockSides, side)][index].color == clockSides[getIndex(clockSides, side - 1)][index].color && clockSides[getIndex(clockSides, side - 1)][index].color == clockSides[getIndex(clockSides, side - 2)][index].color) {
return -2;
}
}
if (clockSides[getIndex(clockSides, side)][index] && clockSides[getIndex(clockSides, side + 1)][index] && clockSides[getIndex(clockSides, side - 1)][index]) {
if (clockSides[getIndex(clockSides, side)][index].color == clockSides[getIndex(clockSides, side + 1)][index].color && clockSides[getIndex(clockSides, side + 1)][index].color == clockSides[getIndex(clockSides, side - 1)][index].color) {
return -1;
}
}
if (clockSides[getIndex(clockSides, side)][index] && clockSides[getIndex(clockSides, side + 1)][index] && clockSides[getIndex(clockSides, side + 2)][index]) {
if (clockSides[getIndex(clockSides, side)][index].color == clockSides[getIndex(clockSides, side + 1)][index].color && clockSides[getIndex(clockSides, side + 1)][index].color == clockSides[getIndex(clockSides, side + 2)][index].color) {
return 0;
}
}
return "false";
}
function scoreCheckVertical(clock, side, index) {
curSide = clock.blocks[side];
if (curSide[index] && curSide[index - 2] && curSide[index - 1]) {
if (curSide[index].color == curSide[index - 2].color && curSide[index - 2].color == curSide[index - 1].color) {
return -2;
}
}
if (curSide[index] && curSide[index + 1] && curSide[index - 1]) {
if (curSide[index].color == curSide[index + 1].color && curSide[index + 1].color == curSide[index - 1].color) {
return -1;
}
}
if (curSide[index] && curSide[index + 2] && curSide[index + 1]) {
if (curSide[index].color == curSide[index + 2].color && curSide[index + 2].color == curSide[index + 1].color) {
return 0;
}
}
return "false";
}
function consolidateBlocks(clock, side, index) {
horizontal = scoreCheckHorizontal(clock, side, index);
vertical = scoreCheckVertical(clock, side, index);
deleted = [];
if (horizontal != "false") {
scoreScalar *= 2;
deleted.push([side, index, horizontal]);
} else {
deleted.push([]);
}
if (vertical != "false") {
scoreScalar *= 2;
deleted.push([side, index, vertical]);
} else {
deleted.push([]);
}
eraseBlocks(clock, deleted);
return;
}
function eraseBlocks(clock, deleted) {
if (deleted[0].length > 0) {
side = deleted[0][0];
index = deleted[0][1];
horizontal = deleted[0][2];
length = 3;
flag = 0;
if (clock.blocks[getIndex(clock.blocks, side + horizontal + length + 1)][index]) {
try {
flag = clock.blocks[getIndex(clock.blocks, side + horizontal + length)][index].color == clock.blocks[getIndex(clock.blocks, side + horizontal + length + 1)][index].color;
} catch (e) {
console.log(e);
}
}
while (flag) {
if (clock.blocks[getIndex(clock.blocks, side + horizontal + length + 1)][index]) {
flag = clock.blocks[getIndex(clock.blocks, side + horizontal + length)][index].color == clock.blocks[getIndex(clock.blocks, side + horizontal + length + 1)][index].color;
}
length++;
}
console.log(length);
for (var i = 0; i < length; i++) {
clock.blocks[getIndex(clock.blocks, side + horizontal + i)].splice(index, 1);
}
for (var i = 0; i < length; i++) {
if (side + horizontal + i < clock.blocks.length) {
consolidateBlocks(clock, getIndex(clock.blocks, side + horizontal + i), index);
}
}
}
if (deleted[1].length > 0) {
side = deleted[1][0];
index = deleted[1][1];
vertical = deleted[1][2];
vertlength = 3;
while (index + vertical + vertlength < clock.blocks[side].length - 1 && (clock.blocks[slide][index + vertical + length].color == clock.blocks[slide][index + vertical + length + 1].color )) {
vertlength += 1;
}
clock.blocks[side].splice(index + vertical, 2 + (1 * (!deleted[0].length > 0)));
for (var i = 0; i < clock.blocks[side].length - (index + vertical); i++) {
consolidateBlocks(clock, side, index + vertical + i);
}
}
sidesChanged = [];
if (deleted[1].length > 0) {
if (deleted[1][0] != "false") {
sidesChanged.push(deleted[1][0]);
}
}
if (deleted[0].length > 0) {
for (var i = 0; i < length; i++) {
if (deleted[0][2] != "false") {
sidesChanged.push(getIndex(clock.blocks, deleted[0][0] + deleted[0][2] + i));
}
}
}
sidesChanged.forEach(function(o) {
MainClock.blocks[o].forEach(function(block) {
block.settled = 0;
})
});
}

143
js/entities.js Normal file
View file

@ -0,0 +1,143 @@
// HackExeter
//you can change these to sexier stuff
function Block(lane, color, distFromHex, settled) {
this.settled = (settled == undefined) ? 0 : 1;
this.height = 20;
this.width = 65;
this.lane = lane;
this.angle = 90 - (30 + 60 * lane);
if (this.angle < 0) {
this.angle += 360;
}
this.color = color;
if (distFromHex) {
this.distFromHex = distFromHex;
} else {
this.distFromHex = 300;
}
this.draw = function() {
this.width = 2 * this.distFromHex / Math.sqrt(3);
this.widthswag = this.width + this.height + 3;
var p1 = rotatePoint(-this.width / 2, this.height / 2, this.angle);
var p2 = rotatePoint(this.width / 2, this.height / 2, this.angle);
var p3 = rotatePoint(this.widthswag / 2, -this.height / 2, this.angle);
var p4 = rotatePoint(-this.widthswag / 2, -this.height / 2, this.angle);
ctx.fillStyle = this.color;
var baseX = canvas.originalWidth / 2 + Math.sin((this.angle) * (Math.PI / 180)) * (this.distFromHex + this.height / 2);
var baseY = canvas.originalHeight / 2 - Math.cos((this.angle) * (Math.PI / 180)) * (this.distFromHex + this.height / 2);
ctx.beginPath();
ctx.moveTo(baseX + p1.x, baseY + p1.y);
ctx.lineTo(baseX + p2.x, baseY + p2.y);
ctx.lineTo(baseX + p3.x, baseY + p3.y);
ctx.lineTo(baseX + p4.x, baseY + p4.y);
ctx.lineTo(baseX + p1.x, baseY + p1.y);
ctx.closePath();
ctx.fill();
};
}
function Clock(sideLength) {
this.fillColor = '#2c3e50';
this.position = 0;
this.sides = 6;
this.blocks = [];
this.angle = 30;
this.sideLength = sideLength;
this.strokeColor = 'blue';
this.x = canvas.originalWidth / 2;
this.y = canvas.originalHeight / 2;
for (var i = 0; i < this.sides; i++) {
this.blocks.push([]);
}
this.addBlock = function(block) {
block.settled = 1;
var lane = this.sides - block.lane;// -this.position;
lane += this.position;
while (lane < 0) {
lane += this.sides;
}
lane = lane % this.sides;
block.distFromHex = MainClock.sideLength / 2 * Math.sqrt(3) + block.height * this.blocks[lane].length;
this.blocks[lane].push(block);
consolidateBlocks(this, lane, this.blocks[lane].length - 1);
};
this.doesBlockCollide = function(block, iter, position, tArr) {
if (block.settled) {
return;
}
var lane = this.sides - block.lane;// -this.position;
lane += this.position;
while (lane < 0) {
lane += this.sides;
}
lane = lane % this.sides;
var arr = this.blocks[lane];
if (position !== undefined) {
arr = tArr;
if (position <= 0) {
if (block.distFromHex - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
block.settled = 1;
if (iter == 2 && block.distFromHex + 1 - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
block.distFromHex--;
}
}
} else {
if (block.distFromHex + iter - arr[position - 1].distFromHex - arr[position - 1].height <= 0) {
block.settled = 1;
if (iter == 2 && block.distFromHex + 1 + iter - arr[position - 1].distFromHex - arr[position - 1].height <= 0) {
block.distFromHex--;
}
}
}
} else {
if (arr.length > 0) {
if (block.distFromHex + iter - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) {
if (iter == 2 && block.distFromHex + iter + 1 - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) {
block.distFromHex--;
}
this.addBlock(block);
}
} else {
if (block.distFromHex + iter - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
if (iter == 2 && block.distFromHex + iter + 1 - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
block.distFromHex--;
}
this.addBlock(block);
}
}
}
};
this.rotate = function(steps) {
this.position += steps;
while (this.position < 0) {
this.position += 6;
}
this.position = this.position % this.sides;
this.blocks.forEach(function(blocks) {
blocks.forEach(function(block) {
block.angle = block.angle - steps * 60;
});
});
this.angle = this.angle + steps * 60;
};
this.draw = function() {
drawPolygon(this.x, this.y, this.sides, this.sideLength, this.angle, this.fillColor);
};
}

50
js/input.js Normal file
View file

@ -0,0 +1,50 @@
// HackExeter
keypress.register_combo({
keys: "left",
on_keyup: function() {
MainClock.rotate(1)
}
});
keypress.register_combo({
keys: "right",
on_keyup: function() {
MainClock.rotate(-1)
}
});
keypress.register_combo({
keys: "enter",
on_keyup: function() {
if (gameState != 1) {
init();
}
}
});
var tapLeft = Hammer(document.getElementById("leftTap")).on("tap", function(event) {
if (gameState != 1) {
init();
}
MainClock.rotate(1)
});
var tapRight = Hammer(document.getElementById("rightTap")).on("tap", function(event) {
if (gameState != 1) {
init();
}
MainClock.rotate(-1)
});
keypress.register_combo({
keys: "space",
on_keyup: function() {
iter = 1;
scoreAdditionCoeff = 1;
},
on_keydown: function() {
iter = 2;
scoreAdditionCoeff = 2;
}
});

169
js/main.js Normal file
View file

@ -0,0 +1,169 @@
// HackExeter
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
canvas.originalHeight = canvas.height;
canvas.originalWidth = canvas.width;
if (window.devicePixelRatio) {
canvas.width *= window.devicePixelRatio;
canvas.height *= window.devicePixelRatio;
ctx.scale(window.devicePixelRatio, window.devicePixelRatio);
}
var gameState = 0; // 0 - start, 1 - playing, 2 - end
var framerate = 60;
var score = 0;
var scoreScalar = 1;
ct = 0;
window.requestAnimFrame = (function() {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) {
window.setTimeout(callback, 1000 / framerate);
};
})();
var blocks = [];
var MainClock;
var iter;
var lastGen;
var prevScore;
var nextGen;
function init() {
score = 0;
scoreScalar = 1;
gameState = 1;
ct = 0;
blocks = [];
MainClock = new Clock(65);
iter = 1;
lastGen = Date.now();
prevScore = Date.now();
nextGen = 1000;
requestAnimFrame(animloop);
}
var colors = ["#e74c3c", "#f1c40f", "#3498db"];
var hexagonBackgroundColor = 'rgb(236, 240, 241)';
var hexagonBackgroundColorClear = 'rgba(236, 240, 241, 0.5)';
var swegBlue = '#2c3e50'; //tumblr?
var scoreAdditionCoeff = 1;
function render() {
document.getElementById("score").innerHTML = score + " (x" + scoreScalar * scoreAdditionCoeff + ")";
var now = Date.now();
if (now - lastGen > nextGen) {
blocks.push(new Block(randInt(0, 6), colors[randInt(0, colors.length)]));
lastGen = Date.now();
var minTime = 500 / iter;
if (minTime < 100) {
minTime = 100;
}
nextGen = randInt(minTime, 1500 / iter);
}
if (now - prevScore > 1000) {
score += 5 * (scoreScalar * scoreAdditionCoeff);
prevScore = now;
iter += 0.1;
}
ctx.clearRect(0, 0, canvas.originalWidth, canvas.originalHeight);
drawPolygon(canvas.originalWidth / 2, canvas.originalHeight / 2, 6, canvas.originalWidth / 2, 30, hexagonBackgroundColor);
var objectsToRemove = [];
var i;
for (i in MainClock.blocks) {
for (var j = 0; j < MainClock.blocks[i].length; j++) {
var block = MainClock.blocks[i][j];
MainClock.doesBlockCollide(block, iter, j, MainClock.blocks[i]);
if (!MainClock.blocks[i][j].settled) {
MainClock.blocks[i][j].distFromHex -= iter;
}
block.draw();
}
}
for (i in blocks) {
MainClock.doesBlockCollide(blocks[i], iter);
if (!blocks[i].settled) {
blocks[i].distFromHex -= iter;
} else {
objectsToRemove.push(i);
}
blocks[i].draw();
}
objectsToRemove.forEach(function(o) {
blocks.splice(o, 1);
});
MainClock.draw();
drawPolygon(canvas.originalWidth / 2, canvas.originalHeight / 2, 6, 270, 30, "gray", false);
}
function animloop() {
if (gameState == 0) {
showModal('Start!', 'Press enter to start!');
} else if (gameState == 1) {
requestAnimFrame(animloop);
render();
checkGameOver();
} else if (gameState == 2) {
showModal('Game over: ' + score + ' pts!', 'Press enter to restart!');
}
}
requestAnimFrame(animloop);
function drawPolygon(x, y, sides, radius, theta, color, fill) { // can make more elegant, reduce redundancy, fix readability
if (fill == undefined) {
fill = true;
}
if (fill) {
ctx.fillStyle = color;
} else {
ctx.strokeStyle = color;
}
ctx.beginPath();
var coords = rotatePoint(0, radius, theta);
ctx.moveTo(coords.x + x, coords.y + y);
var oldX = coords.x;
var oldY = coords.y;
for (var i = 0; i < sides; i++) {
coords = rotatePoint(oldX, oldY, 360 / sides);
ctx.lineTo(coords.x + x, coords.y + y);
// ctx.moveTo(coords.x + x, coords.y + y);
oldX = coords.x;
oldY = coords.y;
}
ctx.closePath();
if (fill) {
ctx.fill();
} else {
ctx.stroke();
}
};
function checkGameOver() { // fix font, fix size of hex
for (var i = 0; i < MainClock.sides; i++) {
if (MainClock.blocks[i].length > 8) {
gameState = 2;
}
}
}
function showModal(text, secondaryText) {
var buttonSize = 150;
var fontSizeLarge = 50;
var fontSizeSmall = 25;
drawPolygon(canvas.originalWidth / 2, canvas.originalHeight / 2, 6, canvas.originalWidth / 2, 30, hexagonBackgroundColorClear);
ctx.fillStyle = swegBlue;
// drawPolygon(canvas.originalWidth / 2, canvas.originalHeight / 2, 6, buttonSize, 30, swegBlue);
ctx.font = fontSizeLarge + 'px "Roboto"';
ctx.textAlign = 'center';
// ctx.fillStyle = hexagonBackgroundColor;
ctx.fillText(text, canvas.originalWidth / 2, canvas.originalHeight / 2 + (fontSizeLarge / 4));
ctx.font = fontSizeSmall + 'px "Roboto"';
ctx.fillText(secondaryText, canvas.originalWidth / 2, canvas.originalHeight / 2 + fontSizeLarge / 4 + fontSizeSmall / 4 + 30);
}

View file

@ -1,22 +1,24 @@
// HackExeter
function rotatePoint(x, y, theta) {
var thetaRad = theta * (Math.PI / 180);
var rotX = Math.cos(thetaRad) * x - Math.sin(thetaRad) * y;
var rotY = Math.sin(thetaRad) * x + Math.cos(thetaRad) * y;
var thetaRad = theta * (Math.PI / 180);
var rotX = Math.cos(thetaRad) * x - Math.sin(thetaRad) * y;
var rotY = Math.sin(thetaRad) * x + Math.cos(thetaRad) * y;
return {
x: rotX,
y: rotY,
};
return {
x: rotX,
y: rotY
};
}
function randInt(min, max) {
return Math.floor((Math.random() * max) + min);
return Math.floor((Math.random() * max) + min);
}
//http://stackoverflow.com/questions/15397036/drawing-dashed-lines-on-html5-canvas
CanvasRenderingContext2D.prototype.dashedLine = function (x1, y1, x2, y2, dashLen) {
if (dashLen == undefined) dashLen = 2;
CanvasRenderingContext2D.prototype.dashedLine = function(x1, y1, x2, y2, dashLen) {
if (dashLen == undefined) {
dashLen = 2;
}
this.moveTo(x1, y1);
var dX = x2 - x1;

165
main.js
View file

@ -1,165 +0,0 @@
// HackExeter
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var gameState = 0; // 0 - start, 1 - playing, 2 - end
var framerate = 60;
var score = 0;
var scoreScalar = 1;
ct = 0;
window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
function( callback ) {
window.setTimeout(callback, 1000 / framerate);
};
})();
var blocks = [];
var MainClock;
var iter;
var lastGen;
var prevScore;
var nextGen;
function init() {
score = 0;
scoreScalar = 1;
gameState = 1;
ct = 0;
blocks = [];
MainClock = new Clock(65);
iter = 1;
lastGen = Date.now();
prevScore = Date.now();
nextGen = 1000;
requestAnimFrame(animloop);
}
var colors = ["#e74c3c", "#f1c40f","#3498db"];
var hexagonBackgroundColor = 'rgb(236, 240, 241)';
var hexagonBackgroundColorClear = 'rgba(236, 240, 241, 0.5)';
var swegBlue = '#2c3e50'; //tumblr?
var scoreAdditionCoeff = 1;
function render() {
document.getElementById("score").innerHTML = score + " (x"+scoreScalar * scoreAdditionCoeff+")";
var now = Date.now();
if(now - lastGen > nextGen) {
blocks.push(new Block(randInt(0, 6), colors[randInt(0, colors.length)]));
lastGen = Date.now();
var minTime = 500/iter;
if(minTime < 100) {
minTime = 100;
}
nextGen = randInt(minTime, 1500/iter);
}
if(now - prevScore > 1000) {
score += 5 * (scoreScalar * scoreAdditionCoeff);
prevScore = now;
iter += 0.1;
}
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawPolygon(canvas.width / 2, canvas.height / 2, 6, canvas.width / 2, 30, hexagonBackgroundColor);
var objectsToRemove = [];
var i;
for (i in MainClock.blocks) {
for (var j = 0; j < MainClock.blocks[i].length; j++) {
var block = MainClock.blocks[i][j];
MainClock.doesBlockCollide(block, iter, j, MainClock.blocks[i]);
if (!MainClock.blocks[i][j].settled) {
MainClock.blocks[i][j].distFromHex -= iter;
}
block.draw();
}
}
for (i in blocks) {
MainClock.doesBlockCollide(blocks[i], iter);
if (!blocks[i].settled) {
blocks[i].distFromHex -= iter;
}
else {
objectsToRemove.push(i);
}
blocks[i].draw();
}
objectsToRemove.forEach(function(o){
blocks.splice(o, 1);
});
MainClock.draw();
drawPolygon(canvas.width/2, canvas.height/2, 6, 270, 30, "gray", false);
}
function animloop(){
if (gameState == 0) {
showModal('Start!', 'Press enter to start!');
}
else if (gameState == 1) {
requestAnimFrame(animloop);
render();
checkGameOver();
}
else if (gameState == 2) {
showModal('Game over: '+score+' pts!', 'Press enter to restart!');
}
}
requestAnimFrame(animloop);
function drawPolygon(x, y, sides, radius, theta, color, fill) { // can make more elegant, reduce redundancy, fix readability
if(fill==undefined)
fill = true;
if(fill)
ctx.fillStyle = color;
else
ctx.strokeStyle = color;
ctx.beginPath();
var coords = rotatePoint(0, radius, theta);
ctx.moveTo(coords.x + x, coords.y + y);
var oldX = coords.x;
var oldY = coords.y;
for (var i = 0; i < sides; i++) {
coords = rotatePoint(oldX, oldY, 360 / sides);
ctx.lineTo(coords.x + x, coords.y + y);
// ctx.moveTo(coords.x + x, coords.y + y);
oldX = coords.x;
oldY = coords.y;
}
ctx.closePath();
if(fill)
ctx.fill();
else
ctx.stroke();
};
function checkGameOver() { // fix font, fix size of hex
for(var i=0; i<MainClock.sides;i++) {
if(MainClock.blocks[i].length>8)
{
gameState = 2;
}
}
}
function showModal(text, secondaryText) {
var buttonSize = 150;
var fontSizeLarge = 50;
var fontSizeSmall = 25;
drawPolygon(canvas.width / 2, canvas.height / 2, 6, canvas.width / 2, 30, hexagonBackgroundColorClear);
ctx.fillStyle = swegBlue;
// drawPolygon(canvas.width / 2, canvas.height / 2, 6, buttonSize, 30, swegBlue);
ctx.font = fontSizeLarge+'px "Roboto"';
ctx.textAlign = 'center';
// ctx.fillStyle = hexagonBackgroundColor;
ctx.fillText(text, canvas.width / 2, canvas.height / 2 + (fontSizeLarge / 4));
ctx.font = fontSizeSmall+'px "Roboto"';
ctx.fillText(secondaryText, canvas.width/2, canvas.height/2 + fontSizeLarge / 4 + fontSizeSmall / 4 + 30);
}