wbrawner/hextris
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'leereilly-twitter-summary-card' into gh-pages

Browse source
This commit is contained in:
Garrett Finucane 2014-08-22 20:48:34 -04:00
commit 5b2438dab3
21 changed files with 115 additions and 90 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
images/twitter-opengraph.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 KiB

50
index.html
View file

@ -15,27 +15,38 @@
<meta property="og:image" content="http://hextris.github.io/hextris/images/facebook-opengraph.png" /> <meta property="og:image" content="http://hextris.github.io/hextris/images/facebook-opengraph.png" />
<meta property="og:image:width" content="1200" /> <meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" /> <meta property="og:image:height" content="630" />
<meta property="twitter:card" content="summary" />
<meta property="twitter:site" content="@hextris" />
<meta property="twitter:site:id" content="2742209678" />
<meta property="twitter:creator" content="@hextris" />
<meta property="twitter:creator:id" content="2742209678" />
<meta property="twitter:domain" content="http://hextris.github.io" />
<meta property="twitter:title" content="Hextris" />
<meta property="twitter:description" content="An addictive puzzle game inspired by Tetris." />
<meta property="twitter:image:src" content="http://hextris.github.io/hextris/images/twitter-opengraph.png" />
<meta property="twitter:image:width" content="512" />
<meta property="twitter:image:height" content="512" />
<link rel="icon" type="image/png" href="favicon.ico"> <link rel="icon" type="image/png" href="favicon.ico">
<link rel="stylesheet" type="text/css" href="style/style.css"> <link rel="stylesheet" type="text/css" href="style/style.css">
<link rel="stylesheet" href="style/fa/css/font-awesome.min.css"> <link rel="stylesheet" href="style/fa/css/font-awesome.min.css">
<script type = 'text/javascript' src="vendor_prod_v4/hammer.min.js"></script> <script type = 'text/javascript' src="vendor_v6/hammer.min.js"></script>
<script type = 'text/javascript' src="vendor_prod_v4/jsonfn.min.js"></script> <script type = 'text/javascript' src="vendor_v6/jsonfn.min.js"></script>
<script type = 'text/javascript' src="vendor_prod_v4/keypress.min.js"></script> <script type = 'text/javascript' src="vendor_v6/keypress.min.js"></script>
<script type = 'text/javascript' src="vendor_prod_v4/jquery.js"></script> <script type = 'text/javascript' src="vendor_v6/jquery.js"></script>
<script type = 'text/javascript' src="js_prod_v4/save-state.js"></script> <script type = 'text/javascript' src="js_v6/save-state.js"></script>
<script type = 'text/javascript' src="js_prod_v4/view.js"></script> <script type = 'text/javascript' src="js_v6/view.js"></script>
<script type = 'text/javascript' src="js_prod_v4/wavegen.js"></script> <script type = 'text/javascript' src="js_v6/wavegen.js"></script>
<script type = 'text/javascript' src="js_prod_v4/math.js"></script> <script type = 'text/javascript' src="js_v6/math.js"></script>
<script type = 'text/javascript' src="js_prod_v4/Block.js"></script> <script type = 'text/javascript' src="js_v6/Block.js"></script>
<script type = 'text/javascript' src="js_prod_v4/Hex.js"></script> <script type = 'text/javascript' src="js_v6/Hex.js"></script>
<script type = 'text/javascript' src="js_prod_v4/Text.js"></script> <script type = 'text/javascript' src="js_v6/Text.js"></script>
<script type = 'text/javascript' src="js_prod_v4/comboTimer.js"></script> <script type = 'text/javascript' src="js_v6/comboTimer.js"></script>
<script type = 'text/javascript' src="js_prod_v4/checking.js"></script> <script type = 'text/javascript' src="js_v6/checking.js"></script>
<script type = 'text/javascript' src='js_prod_v4/update.js'></script> <script type = 'text/javascript' src='js_v6/update.js'></script>
<script type = 'text/javascript' src='js_prod_v4/render.js'></script> <script type = 'text/javascript' src='js_v6/render.js'></script>
<script type = 'text/javascript' src="js_prod_v4/input.js"></script> <script type = 'text/javascript' src="js_v6/input.js"></script>
<script type = 'text/javascript' src="js_prod_v4/main.js"></script> <script type = 'text/javascript' src="js_v6/main.js"></script>
<script type = 'text/javascript' src="js_prod_v4/initialization.js"></script> <script type = 'text/javascript' src="js_v6/initialization.js"></script>
<script type = 'text/javascript' charset = 'utf-8' src = 'cordova.js'></script> <script type = 'text/javascript' charset = 'utf-8' src = 'cordova.js'></script>
</head> </head>
<body> <body>
@ -46,7 +57,8 @@
js = d.createElement(s); js.id = id; js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0"; js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs); fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script> }(document, 'script', 'facebook-jssdk'));
</script>
<canvas id="canvas"></canvas> <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;'> <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> <h2 id = 'clickToExit' style = 'background-color:#fff;color:#000'>Click to exit</h2>

11
js_prod_v4/Block.js → js_v6/Block.js
View file

@ -46,7 +46,7 @@ function Block(fallingLane, color, iter, distFromHex, settled) {
MainHex.shakes.push({lane:tLane, magnitude:3 * (window.devicePixelRatio ? window.devicePixelRatio : 1) * (settings.scale)}); MainHex.shakes.push({lane:tLane, magnitude:3 * (window.devicePixelRatio ? window.devicePixelRatio : 1) * (settings.scale)});
} }
//fade out the opacity //fade out the opacity
this.opacity = this.opacity - 0.075; this.opacity = this.opacity - 0.075 * MainHex.dt;
if (this.opacity <= 0) { if (this.opacity <= 0) {
//slate for final deletion //slate for final deletion
this.opacity = 0; this.opacity = 0;
@ -79,10 +79,10 @@ function Block(fallingLane, color, iter, distFromHex, settled) {
attached = false; attached = false;
if(this.angle > this.targetAngle) { if(this.angle > this.targetAngle) {
this.angularVelocity -= angularVelocityConst; this.angularVelocity -= angularVelocityConst * MainHex.dt;
} }
else if(this.angle < this.targetAngle) { else if(this.angle < this.targetAngle) {
this.angularVelocity += angularVelocityConst; this.angularVelocity += angularVelocityConst * MainHex.dt;
} }
if (Math.abs(this.angle - this.targetAngle + this.angularVelocity) <= Math.abs(this.angularVelocity)) { //do better soon if (Math.abs(this.angle - this.targetAngle + this.angularVelocity) <= Math.abs(this.angularVelocity)) { //do better soon
@ -102,6 +102,9 @@ function Block(fallingLane, color, iter, distFromHex, settled) {
var p4; var p4;
if (this.initializing) { if (this.initializing) {
var rat = ((MainHex.ct - this.ict)/this.initLen); var rat = ((MainHex.ct - this.ict)/this.initLen);
if (rat > 1) {
rat = 1;
}
p1 = rotatePoint((-this.width / 2) * rat, this.height / 2, this.angle); p1 = rotatePoint((-this.width / 2) * rat, this.height / 2, this.angle);
p2 = rotatePoint((this.width / 2) * rat, this.height / 2, this.angle); p2 = rotatePoint((this.width / 2) * rat, this.height / 2, this.angle);
p3 = rotatePoint((this.widthWide / 2) * rat, -this.height / 2, this.angle); p3 = rotatePoint((this.widthWide / 2) * rat, -this.height / 2, this.angle);
@ -162,7 +165,7 @@ function Block(fallingLane, color, iter, distFromHex, settled) {
ctx.lineTo(baseX + p1.x, baseY + p1.y); ctx.lineTo(baseX + p1.x, baseY + p1.y);
ctx.closePath(); ctx.closePath();
ctx.fill(); ctx.fill();
this.tint -= 0.02; this.tint -= 0.02 * MainHex.dt;
if (this.tint < 0) { if (this.tint < 0) {
this.tint = 0; this.tint = 0;
} }

15
js_prod_v4/Hex.js → js_v6/Hex.js
View file

@ -5,6 +5,7 @@ function Hex(sideLength) {
this.angularVelocity = 0; this.angularVelocity = 0;
this.position = 0; this.position = 0;
this.dy = 0; this.dy = 0;
this.dt = 1;
this.sides = 6; this.sides = 6;
this.blocks = []; this.blocks = [];
this.angle = 180 / this.sides; this.angle = 180 / this.sides;
@ -31,7 +32,7 @@ function Hex(sideLength) {
var dy = Math.sin(angle) * obj.magnitude; var dy = Math.sin(angle) * obj.magnitude;
gdx -= dx; gdx -= dx;
gdy += dy; gdy += dy;
obj.magnitude /= 2; obj.magnitude /= 2 * this.dt;
if (obj.magnitude < 1) { if (obj.magnitude < 1) {
for (var i = 0; i < this.shakes.length; i++) { for (var i = 0; i < this.shakes.length; i++) {
if (this.shakes[i] == obj) { if (this.shakes[i] == obj) {
@ -63,7 +64,7 @@ function Hex(sideLength) {
if (position !== undefined) { if (position !== undefined) {
arr = tArr; arr = tArr;
if (position <= 0) { if (position <= 0) {
if (block.distFromHex - block.iter * settings.scale - (this.sideLength / 2) * Math.sqrt(3) <= 0) { if (block.distFromHex - block.iter * this.dt * settings.scale - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
block.distFromHex = (this.sideLength / 2) * Math.sqrt(3); block.distFromHex = (this.sideLength / 2) * Math.sqrt(3);
block.settled = 1; block.settled = 1;
block.checked = 1; block.checked = 1;
@ -72,7 +73,7 @@ function Hex(sideLength) {
block.iter = 1.5 + (waveone.difficulty/15) * 3; block.iter = 1.5 + (waveone.difficulty/15) * 3;
} }
} else { } else {
if (arr[position - 1].settled && block.distFromHex - block.iter * settings.scale - arr[position - 1].distFromHex - arr[position - 1].height <= 0) { if (arr[position - 1].settled && block.distFromHex - block.iter * this.dt * settings.scale - arr[position - 1].distFromHex - arr[position - 1].height <= 0) {
block.distFromHex = arr[position - 1].distFromHex + arr[position - 1].height; block.distFromHex = arr[position - 1].distFromHex + arr[position - 1].height;
block.settled = 1; block.settled = 1;
block.checked = 1; block.checked = 1;
@ -90,12 +91,12 @@ function Hex(sideLength) {
var arr = this.blocks[lane]; var arr = this.blocks[lane];
if (arr.length > 0) { if (arr.length > 0) {
if (block.distFromHex + block.iter * settings.scale - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) { if (block.distFromHex + block.iter * this.dt * settings.scale - arr[arr.length - 1].distFromHex - arr[arr.length - 1].height <= 0) {
block.distFromHex = arr[arr.length - 1].distFromHex + arr[arr.length - 1].height; block.distFromHex = arr[arr.length - 1].distFromHex + arr[arr.length - 1].height;
this.addBlock(block); this.addBlock(block);
} }
} else { } else {
if (block.distFromHex + block.iter * settings.scale - (this.sideLength / 2) * Math.sqrt(3) <= 0) { if (block.distFromHex + block.iter * this.dt * settings.scale - (this.sideLength / 2) * Math.sqrt(3) <= 0) {
block.distFromHex = (this.sideLength / 2) * Math.sqrt(3); block.distFromHex = (this.sideLength / 2) * Math.sqrt(3);
this.addBlock(block); this.addBlock(block);
} }
@ -146,10 +147,10 @@ function Hex(sideLength) {
this.shake(this.shakes[i]); this.shake(this.shakes[i]);
} }
if (this.angle > this.targetAngle) { if (this.angle > this.targetAngle) {
this.angularVelocity -= angularVelocityConst; this.angularVelocity -= angularVelocityConst * this.dt;
} }
else if(this.angle < this.targetAngle) { else if(this.angle < this.targetAngle) {
this.angularVelocity += angularVelocityConst; this.angularVelocity += angularVelocityConst * this.dt;
} }
if (Math.abs(this.angle - this.targetAngle + this.angularVelocity) <= Math.abs(this.angularVelocity)) { //do better soon if (Math.abs(this.angle - this.targetAngle + this.angularVelocity) <= Math.abs(this.angularVelocity)) { //do better soon

4
js_prod_v4/Text.js → js_v6/Text.js
View file

@ -21,7 +21,7 @@ function Text(x,y,text,font,color,incrementFunction){
} }
function fadeUpAndOut(text){ function fadeUpAndOut(text){
text.opacity -= Math.pow(Math.pow((1-text.opacity), 1/3)+1,3)/100; text.opacity -= MainHex.dt * Math.pow(Math.pow((1-text.opacity), 1/3)+1,3)/100;
text.alive = text.opacity; text.alive = text.opacity;
text.y-=3; text.y -= 3 * MainHex.dt;
} }

0
js_prod_v4/checking.js → js_v6/checking.js
View file

0
js_prod_v4/comboTimer.js → js_v6/comboTimer.js
View file

1
js_prod_v4/initialization.js → js_v6/initialization.js
View file

@ -20,6 +20,7 @@ function hidebottombar() {
} }
function initialize(a) { function initialize(a) {
window.lastTime = Date.now();
window.iframHasLoaded = false; window.iframHasLoaded = false;
window.colors = ["#e74c3c", "#f1c40f", "#3498db", "#2ecc71"]; window.colors = ["#e74c3c", "#f1c40f", "#3498db", "#2ecc71"];
window.hexColorsToTintedColors = { window.hexColorsToTintedColors = {

0
js_prod_v4/input.js → js_v6/input.js
View file

39
js_prod_v4/main.js → js_v6/main.js
View file

@ -203,25 +203,27 @@ function setStartScreen() {
gameState = 0; gameState = 0;
requestAnimFrame(animLoop); requestAnimFrame(animLoop);
} }
setInterval(function(){
if(gameState == 1 ){
if(!MainHex.delay) {
update();
}
else{
MainHex.delay--;
}
}
}, 17);
function animLoop() { function animLoop() {
switch (gameState) { switch (gameState) {
case 1: case 1:
requestAnimFrame(animLoop); requestAnimFrame(animLoop);
render(); render();
if (checkGameOver() && !importing) { var now = Date.now();
var dt = (now - lastTime)/16.666;
if(gameState == 1 ){
if(!MainHex.delay) {
update(dt);
}
else{
MainHex.delay--;
}
}
lastTime = now;
if (checkGameOver() && !importing) {
var saveState = localStorage.getItem("saveState") || "{}"; var saveState = localStorage.getItem("saveState") || "{}";
saveState = JSONfn.parse(saveState); saveState = JSONfn.parse(saveState);
gameState = 2; gameState = 2;
@ -246,10 +248,6 @@ function animLoop() {
case 0: case 0:
requestAnimFrame(animLoop); requestAnimFrame(animLoop);
if (importing) {
update();
}
render(); render();
break; break;
@ -259,9 +257,12 @@ function animLoop() {
break; break;
case 2: case 2:
var now = Date.now();
var dt = (now - lastTime)/16.666;
requestAnimFrame(animLoop); requestAnimFrame(animLoop);
update(); update(dt);
render(); render();
lastTime = now;
break; break;
case 3: case 3:
@ -282,6 +283,10 @@ function animLoop() {
setStartScreen(); setStartScreen();
break; break;
} }
if (!(gameState == 1 || gameState == 2)) {
lastTime = Date.now();
}
} }
function enableRestart() { function enableRestart() {

0
js_prod_v4/math.js → js_v6/math.js
View file

0
js_prod_v4/render.js → js_v6/render.js
View file

0
js_prod_v4/save-state.js → js_v6/save-state.js
View file

16
js_prod_v4/update.js → js_v6/update.js
View file

@ -1,10 +1,11 @@
//remember to update history function to show the respective iter speeds //remember to update history function to show the respective iter speeds
function update() { function update(dt) {
var now = MainHex.ct; MainHex.dt = dt;
if (gameState == 1) { if (gameState == 1) {
waveone.update(); waveone.update();
if (now - waveone.prevTimeScored > 1000) { if (MainHex.ct - waveone.prevTimeScored > 1000) {
waveone.prevTimeScored = now; waveone.prevTimeScored = MainHex.ct;
} }
} }
var lowestDeletedIndex = 99; var lowestDeletedIndex = 99;
@ -16,7 +17,7 @@ function update() {
for (i = 0; i < blocks.length; i++) { for (i = 0; i < blocks.length; i++) {
MainHex.doesBlockCollide(blocks[i]); MainHex.doesBlockCollide(blocks[i]);
if (!blocks[i].settled) { if (!blocks[i].settled) {
if (!blocks[i].initializing) blocks[i].distFromHex -= blocks[i].iter * settings.scale; if (!blocks[i].initializing) blocks[i].distFromHex -= blocks[i].iter * dt * settings.scale;
} else if (!blocks[i].removed) { } else if (!blocks[i].removed) {
blocks[i].removed = 1; blocks[i].removed = 1;
} }
@ -56,7 +57,7 @@ function update() {
MainHex.doesBlockCollide(block, j, MainHex.blocks[i]); MainHex.doesBlockCollide(block, j, MainHex.blocks[i]);
if (!MainHex.blocks[i][j].settled) { if (!MainHex.blocks[i][j].settled) {
MainHex.blocks[i][j].distFromHex -= block.iter * settings.scale; MainHex.blocks[i][j].distFromHex -= block.iter * dt * settings.scale;
} }
} }
} }
@ -67,5 +68,6 @@ function update() {
i--; i--;
} }
} }
MainHex.ct++;
MainHex.ct += dt;
} }

0
js_prod_v4/view.js → js_v6/view.js
View file

14
js_prod_v4/wavegen.js → js_v6/wavegen.js
View file

@ -1,6 +1,6 @@
function blockDestroyed() { function blockDestroyed() {
if (waveone.nextGen > 1350) { if (waveone.nextGen > 1350) {
waveone.nextGen -= 24 * settings.creationSpeedModifier; waveone.nextGen -= 20 * settings.creationSpeedModifier;
} else if (waveone.nextGen > 600) { } else if (waveone.nextGen > 600) {
waveone.nextGen -= 10 * settings.creationSpeedModifier; waveone.nextGen -= 10 * settings.creationSpeedModifier;
} else { } else {
@ -8,7 +8,7 @@ function blockDestroyed() {
} }
if (waveone.difficulty < 35) { if (waveone.difficulty < 35) {
waveone.difficulty += 0.17 * settings.speedModifier; waveone.difficulty += 0.11 * settings.speedModifier;
} else { } else {
waveone.difficulty = 35; waveone.difficulty = 35;
} }
@ -26,11 +26,11 @@ function waveGen(hex) {
this.dt = 0; this.dt = 0;
this.update = function() { this.update = function() {
this.currentFunction(); this.currentFunction();
this.dt = MainHex.ct * 16.6666667; this.dt = (settings.platform == 'mobile' ? 10.0 : 15) * MainHex.ct;
this.computeDifficulty(); this.computeDifficulty();
if ((this.dt - this.lastGen) * settings.creationSpeedModifier > this.nextGen) { if ((this.dt - this.lastGen) * settings.creationSpeedModifier > this.nextGen) {
if (this.nextGen > 600) { if (this.nextGen > 600) {
this.nextGen -= 10 * ((this.nextGen / 1300)) * settings.creationSpeedModifier; this.nextGen -= 14 * ((this.nextGen / 1300)) * settings.creationSpeedModifier;
} }
} }
}; };
@ -67,11 +67,11 @@ function waveGen(hex) {
this.computeDifficulty = function() { this.computeDifficulty = function() {
if (this.difficulty < 35) { if (this.difficulty < 35) {
if (this.difficulty < 8) { if (this.difficulty < 8) {
this.difficulty += (this.dt - this.last) / (2566667) * settings.speedModifier; this.difficulty += (this.dt - this.last) / (2066667) * settings.speedModifier;
} else if (this.difficulty < 15) { } else if (this.difficulty < 15) {
this.difficulty += (this.dt - this.last) / (53333333) * settings.speedModifier; this.difficulty += (this.dt - this.last) / (43333333) * settings.speedModifier;
} else { } else {
this.difficulty += (this.dt - this.last) / (120000000) * settings.speedModifier; this.difficulty += (this.dt - this.last) / (90000000) * settings.speedModifier;
} }
} }
}; };

23
style/style.css
View file

@ -10,14 +10,14 @@
} }
.tweet { .tweet {
font-size:2em; font-size:2rem;
color:#4099FF; color:#4099FF;
} }
@media only screen @media only screen
and (min-device-width : 320px) and (min-device-width : 320px)
and (max-device-width : 480px) { and (max-device-width : 480px) {
.tweet{ .tweet{
font-size:1em; font-size:1rem;
} }
} }
@ -190,18 +190,19 @@ and (max-device-width : 480px) {
} }
.centeredHeader { .centeredHeader {
font-size:5em; font-size:5vw;
text-align:center; text-align:center;
line-height:1em; line-height:4rem;
} }
.centeredSubHeader { .centeredSubHeader {
font-size:2em; font-size:2.2rem;
line-height:1em;
text-align:center; text-align:center;
} }
.centeredSubSubHeader { .centeredSubSubHeader {
font-size:1.4em; font-size:1.4rem;
text-align:center; text-align:center;
} }
#attributions { #attributions {
@ -211,7 +212,7 @@ and (max-device-width : 480px) {
left: 0%; left: 0%;
top: 72%; top: 72%;
text-align:center; text-align:center;
font-size:1.25em; font-size:1.25rem;
z-index:98; z-index:98;
} }
@ -219,17 +220,17 @@ and (max-device-width : 480px) {
and (min-device-width : 320px) and (min-device-width : 320px)
and (max-device-width : 580px) { and (max-device-width : 580px) {
.centeredHeader { .centeredHeader {
font-size:2em; font-size:2rem;
text-align:center; text-align:center;
line-height:0.6em; line-height:0.6rem;
} }
#attributions { #attributions {
font-size:.7em; font-size:.7rem;
} }
.centeredSubHeader { .centeredSubHeader {
font-size:1em; font-size:1rem;
text-align:center; text-align:center;
} }

0
vendor_prod_v4/hammer.min.js → vendor_v6/hammer.min.js vendored
View file

0
vendor_prod_v4/jquery.js → vendor_v6/jquery.js vendored
View file

0
vendor_prod_v4/jsonfn.min.js → vendor_v6/jsonfn.min.js vendored
View file

0
vendor_prod_v4/keypress.min.js → vendor_v6/keypress.min.js vendored
View file