create update.js, render.js

This commit is contained in:
Michael Yang 2014-05-25 21:49:03 -04:00
parent 79e79c5a32
commit 5dc31d2e54
9 changed files with 171 additions and 177 deletions

View file

@ -49,19 +49,21 @@
<body>
<canvas id="canvas"></canvas>
<div id='devtools' style='z-index:3;display:none;position:absolute;left:50%;width:400px;height:400px;top:50%;margin-top:-200px;margin-left:-200px;'>
<h2 id = 'clickToExit' style = 'background-color:#fff;color:#000'>Click to exit</h2>
<textarea id ='devtoolsText' style = 'height:300px;width:400px;'></textarea>
</div>
<script type = 'text/javascript' src="vendor/hammer.min.js"></script>
<script type = 'text/javascript' src="vendor/keypress.min.js"></script>
<script type = 'text/javascript' src="vendor/jquery.js"></script>
<script type = 'text/javascript' src="js/view.js"></script>
<script type = 'text/javascript' src="js/wavegen.js"></script>
<script type = 'text/javascript' src="js/math.js"></script>
<script type = 'text/javascript' src="js/entities.js"></script>
<script type = 'text/javascript' src="js/input.js"></script>
<script type = 'text/javascript' src="js/checking.js"></script>
<script type = 'text/javascript' src="js/main.js"></script>
<script type = 'text/javascript' src="js/analytics.js"></script>
<h2 id = 'clickToExit' style = 'background-color:#fff;color:#000'>Click to exit</h2>
<textarea id ='devtoolsText' style = 'height:300px;width:400px;'></textarea>
</div>
<script type = 'text/javascript' src="vendor/hammer.min.js"></script>
<script type = 'text/javascript' src="vendor/keypress.min.js"></script>
<script type = 'text/javascript' src="vendor/jquery.js"></script>
<script type = 'text/javascript' src="js/view.js"></script>
<script type = 'text/javascript' src="js/wavegen.js"></script>
<script type = 'text/javascript' src="js/math.js"></script>
<script type = 'text/javascript' src="js/entities.js"></script>
<script type = 'text/javascript' src="js/input.js"></script>
<script type = 'text/javascript' src="js/checking.js"></script>
<script type = 'text/javascript' src='js/update.js'></script>
<script type = 'text/javascript' src='js/render.js'></script>
<script type = 'text/javascript' src="js/main.js"></script>
<script type = 'text/javascript' src="js/analytics.js"></script>
</body>
</html>

View file

@ -6,20 +6,20 @@ function search(twoD,oneD){
}
return false;
}
function floodFill(clock,side,index,deleting) {
function floodFill(clock, side, index, deleting) {
if (clock.blocks[side] === undefined || clock.blocks[side][index] === undefined) {
return;
}
var color = clock.blocks[side][index].color;
for(var x =-1;x<2;x++){
for(var y =-1;y<2;y++){
if(Math.abs(x)==Math.abs(y)){continue;}
var curSide =(side+x+clock.sides)%clock.sides;
for (var x =-1; x<2; x++){
for (var y =-1; y<2; y++){
if(Math.abs(x)==Math.abs(y)) continue;
var curSide =(side+x+clock.sides) % clock.sides;
var curIndex = index+y;
if(clock.blocks[curSide] === undefined){continue;}
if(clock.blocks[curSide][curIndex] !== undefined){
if(clock.blocks[curSide][curIndex].color == color && search(deleting,[curSide,curIndex]) === false && clock.blocks[curSide][curIndex].deleted == 0 ) {
if (clock.blocks[curSide] === undefined) continue;
if (clock.blocks[curSide][curIndex] !== undefined) {
if (clock.blocks[curSide][curIndex].color == color && search(deleting,[curSide,curIndex]) === false && clock.blocks[curSide][curIndex].deleted == 0) {
deleting.push([curSide,curIndex]);
floodFill(clock,curSide,curIndex,deleting);
}
@ -28,19 +28,19 @@ function floodFill(clock,side,index,deleting) {
}
}
function consolidateBlocks(clock,side,index){
var sidesChanged =[];
var deleting=[];
function consolidateBlocks(clock, side, index) {
var sidesChanged = [];
var deleting = [];
deleting.push([side,index]);
floodFill(clock,side,index,deleting);
var deleteList= deleting;
if(deleteList.length<3){return;}
if (deleteList.length<3){return;}
var i;
for(i in deleteList){
for (i in deleteList){
var arr = deleteList[i];
if(arr !== undefined && arr.length==2) {
if(sidesChanged.indexOf(arr[0])==-1){
if (arr !== undefined && arr.length==2) {
if (sidesChanged.indexOf(arr[0]) == -1){
sidesChanged.push(arr[0]);
}
clock.blocks[arr[0]][arr[1]].deleted = 1;

View file

@ -148,12 +148,12 @@ function Block(lane, color, iter, distFromHex, settled) {
// t: current time, b: begInnIng value, c: change In value, d: duration
function easeOutCubic(t, b, c, d) {
return c*((t=t/d-1)*t*t + 1) + b;
}
return c*((t=t/d-1)*t*t + 1) + b;
}
var colorSounds = {"#e74c3c": new Audio("../sounds/lowest.ogg"),
"#f1c40f":new Audio("../sounds/highest.ogg"),
"#3498db":new Audio("../sounds/middle.ogg"),
"#f1c40f":new Audio("../sounds/highest.ogg"),
"#3498db":new Audio("../sounds/middle.ogg"),
"#2ecc71":new Audio("../sounds/highest.ogg") //fix this later
};
@ -197,10 +197,10 @@ function Clock(sideLength) {
if (gameState != 1) return;
block.settled = 1;
block.tint = 0.6;
var lane = this.sides - block.fallingLane;// -this.position;
var lane = this.sides - block.fallingLane;// -this.position;
this.shakes.push({lane:block.fallingLane, magnitude:3});
lane += this.position;
lane = (lane+this.sides) % this.sides;
lane = (lane + this.sides) % this.sides;
block.distFromHex = MainClock.sideLength / 2 * Math.sqrt(3) + block.height * this.blocks[lane].length;
this.blocks[lane].push(block);
block.attachedLane = lane;
@ -212,7 +212,7 @@ function Clock(sideLength) {
if (block.settled) {
return;
}
if (position !== undefined) {
arr = tArr;
if (position <= 0) {

View file

@ -1,4 +1,3 @@
// HackExeter
var prevGameState;
keypress.register_combo({
@ -56,25 +55,25 @@ keypress.register_combo({
keypress.register_combo({
keys: "enter",
on_keydown: function() {
if (gameState != 1 && gameState != -2) {
init();
}
}
if (gameState != 1 && gameState != -2) {
init();
}
}
});
document.body.addEventListener('touchstart', function(e){
if( e.changedTouches[0].pageX<window.innerWidth/2){
if (gameState != 1 && gameState != -2) {
init();
}
MainClock.rotate(1);
}
if( e.changedTouches[0].pageX>window.innerWidth/2){
if (gameState != 1 && gameState != -2) {
init();
}
MainClock.rotate(-1);
}
document.body.addEventListener('touchstart', function(e) {
if (e.changedTouches[0].pageX<window.innerWidth/2) {
if (gameState != 1 && gameState != -2) {
init();
}
MainClock.rotate(1);
}
if (e.changedTouches[0].pageX>window.innerWidth/2) {
if (gameState != 1 && gameState != -2) {
init();
}
MainClock.rotate(-1);
}
}, false)

View file

@ -172,122 +172,6 @@ function exportHistory() {
toggleDevTools();
}
//remember to update history function to show the respective iter speeds
function update() {
settings.hexWidth = settings.baseHexWidth * settings.scale;
settings.blockHeight = settings.baseBlockHeight * settings.scale;
var now = Date.now();
if (importing) {
if (importedHistory[count]) {
if (importedHistory[count].block) {
addNewBlock(importedHistory[count].block.blocklane, importedHistory[count].block.color, importedHistory[count].block.iter, importedHistory[count].block.distFromHex, importedHistory[count].block.settled);
}
if (importedHistory[count].rotate) {
MainClock.rotate(importedHistory[count].rotate);
}
}
}
else if (gameState == 1) {
waveone.update();
if (now - waveone.prevTimeScored > 1000) {
waveone.prevTimeScored = now;
}
}
var i;
var objectsToRemove = [];
for (i in blocks) {
MainClock.doesBlockCollide(blocks[i]);
if (!blocks[i].settled) {
if (!blocks[i].initializing) blocks[i].distFromHex -= blocks[i].iter * settings.scale;
} else if (!blocks[i].removed) {
blocks[i].removed = 1;
}
}
var lDI;
for (i = 0; i < MainClock.blocks.length; i++) {
lDI = 99;
for (j = 0; j < MainClock.blocks[i].length; j++) {
block = MainClock.blocks[i][j];
if (block.deleted == 2) {
MainClock.blocks[i].splice(j,1);
if (j < lDI) lDI = j;
j--;
}
}
if (lDI < MainClock.blocks[i].length) {
for (var q = lDI; q < MainClock.blocks[i].length; q++) {
MainClock.blocks[i][q].settled = 0;
}
}
}
var block;
var j;
for (i in MainClock.blocks) {
for (j = 0; j < MainClock.blocks[i].length; j++) {
block = MainClock.blocks[i][j];
MainClock.doesBlockCollide(block, j, MainClock.blocks[i]);
if (!MainClock.blocks[i][j].settled) {
MainClock.blocks[i][j].distFromHex -= block.iter * settings.scale;
}
}
}
for(i=0;i<blocks.length;i++){
if(blocks[i].removed == 1){
blocks.splice(i,1);
i--;
}
}
count++;
if (score != prevScore) {
updateScoreboard();
prevScore = score;
}
}
function render() {
ctx.clearRect(0, 0, trueCanvas.width, trueCanvas.height);
clearGameBoard();
if (gameState == -2) {
if (Date.now() - startTime > 1300) {
var op = (Date.now() - startTime - 1300)/500;
if (op > 1) {
op = 1;
}
ctx.globalAlpha = op;
drawPolygon(trueCanvas.width / 2 , trueCanvas.height / 2 , 6, (settings.rows * settings.blockHeight) * (2/Math.sqrt(3)) + settings.hexWidth, 30, "#bdc3c7", false,6);
ctx.globalAlpha = 1;
}
} else {
drawPolygon(trueCanvas.width / 2 + gdx, trueCanvas.height / 2 + gdy, 6, (settings.rows * settings.blockHeight) * (2/Math.sqrt(3)) + settings.hexWidth, 30, '#bdc3c7', false, 6);
}
var i;
for (i in MainClock.blocks) {
for (var j = 0; j < MainClock.blocks[i].length; j++) {
var block = MainClock.blocks[i][j];
block.draw(true, j);
}
}
for (i in blocks) {
blocks[i].draw();
}
MainClock.draw();
settings.prevScale = settings.scale;
}
function stepInitialLoad() {
var dy = getStepDY(Date.now() - startTime, 0, (100 + trueCanvas.height/2), 1300);
if (Date.now() - startTime > 1300) {
@ -320,10 +204,10 @@ function animLoop() {
update();
render();
if (checkGameOver()) {
isGameOver--;
if (isGameOver === 0) {
// isGameOver--;
// if (isGameOver === 0) {
gameState = 2;
}
// }
}
}
else if (gameState === 0) {
@ -375,6 +259,6 @@ function checkGameOver() {
return false;
}
window.onblur = function (e) {
window.onblur = function(e) {
if (gameState == 1) gameState = -1;
};

View file

@ -1,4 +1,3 @@
// HackExeter
function rotatePoint(x, y, theta) {
var thetaRad = theta * (Math.PI / 180);
var rotX = Math.cos(thetaRad) * x - Math.sin(thetaRad) * y;

32
js/render.js Normal file
View file

@ -0,0 +1,32 @@
function render() {
ctx.clearRect(0, 0, trueCanvas.width, trueCanvas.height);
clearGameBoard();
if (gameState == -2) {
if (Date.now() - startTime > 1300) {
var op = (Date.now() - startTime - 1300)/500;
if (op > 1) {
op = 1;
}
ctx.globalAlpha = op;
drawPolygon(trueCanvas.width / 2 , trueCanvas.height / 2 , 6, (settings.rows * settings.blockHeight) * (2/Math.sqrt(3)) + settings.hexWidth, 30, "#bdc3c7", false,6);
ctx.globalAlpha = 1;
}
} else {
drawPolygon(trueCanvas.width / 2 + gdx, trueCanvas.height / 2 + gdy, 6, (settings.rows * settings.blockHeight) * (2/Math.sqrt(3)) + settings.hexWidth, 30, '#bdc3c7', false, 6);
}
for (var i in MainClock.blocks) {
for (var j = 0; j < MainClock.blocks[i].length; j++) {
var block = MainClock.blocks[i][j];
block.draw(true, j);
}
}
for (var i in blocks) {
blocks[i].draw();
}
MainClock.draw();
settings.prevScale = settings.scale;
}

78
js/update.js Normal file
View file

@ -0,0 +1,78 @@
//remember to update history function to show the respective iter speeds
function update() {
settings.hexWidth = settings.baseHexWidth * settings.scale;
settings.blockHeight = settings.baseBlockHeight * settings.scale;
var now = Date.now();
if (importing) {
if (importedHistory[count]) {
if (importedHistory[count].block) {
addNewBlock(importedHistory[count].block.blocklane, importedHistory[count].block.color, importedHistory[count].block.iter, importedHistory[count].block.distFromHex, importedHistory[count].block.settled);
}
if (importedHistory[count].rotate) {
MainClock.rotate(importedHistory[count].rotate);
}
}
}
else if (gameState == 1) {
waveone.update();
if (now - waveone.prevTimeScored > 1000) {
waveone.prevTimeScored = now;
}
}
var objectsToRemove = [];
for (var i in blocks) {
MainClock.doesBlockCollide(blocks[i]);
if (!blocks[i].settled) {
if (!blocks[i].initializing) blocks[i].distFromHex -= blocks[i].iter * settings.scale;
} else if (!blocks[i].removed) {
blocks[i].removed = 1;
}
}
var lowestDeletedIndex;
for (var i = 0; i < MainClock.blocks.length; i++) {
lowestDeletedIndex = 99;
for (j = 0; j < MainClock.blocks[i].length; j++) {
block = MainClock.blocks[i][j];
if (block.deleted == 2) {
MainClock.blocks[i].splice(j,1);
if (j < lowestDeletedIndex) lowestDeletedIndex = j;
j--;
}
}
if (lowestDeletedIndex < MainClock.blocks[i].length) {
for (var q = lowestDeletedIndex; q < MainClock.blocks[i].length; q++) {
MainClock.blocks[i][q].settled = 0;
}
}
}
for (var i in MainClock.blocks) {
for (var j = 0; j < MainClock.blocks[i].length; j++) {
var block = MainClock.blocks[i][j];
MainClock.doesBlockCollide(block, j, MainClock.blocks[i]);
if (!MainClock.blocks[i][j].settled) {
MainClock.blocks[i][j].distFromHex -= block.iter * settings.scale;
}
}
}
for(var i=0;i<blocks.length;i++){
if(blocks[i].removed == 1){
blocks.splice(i,1);
i--;
}
}
count++;
if (score != prevScore) {
updateScoreboard();
prevScore = score;
}
}

View file

@ -42,7 +42,7 @@ function clearGameBoard() {
drawPolygon(trueCanvas.width / 2, trueCanvas.height / 2, 6, trueCanvas.width / 2, 30, hexagonBackgroundColor, 0, 'rgba(0,0,0,0)');
}
function drawPolygon(x, y, sides, radius, theta, fillColor, lineWidth, lineColor) { // can make more elegant, reduce redundancy, fix readability
function drawPolygon(x, y, sides, radius, theta, fillColor, lineWidth, lineColor) {
ctx.fillStyle = fillColor;
ctx.lineWidth = lineWidth;
ctx.strokeStyle = lineColor;