2048
HTML
<div id="everything">
<table id="maintable" class="tableclass">
<tr class="rowclass">
<td class="columnclass">
<label id="td1"></label>
</td>
<td class="columnclass">
<label id="td2"></label>
</td>
<td class="columnclass">
<label id="td3"></label>
</td>
<td class="columnclass">
<label id="td4"></label>
</td>
</tr>
<tr class="rowclass">
<td class="columnclass">
<label id="td5"></label>
</td>
<td class="columnclass">
<label id="td6"></label>
</td>
<td class="columnclass">
<label id="td7"></label>
</td>
<td class="columnclass">
<label id="td8"></label>
</td>
</tr>
<tr class="rowclass">
<td class="columnclass">
<label id="td9"></label>
</td>
<td class="columnclass">
<label id="td10"></label>
</td>
<td class="columnclass">
<label id="td11"></label>
</td>
<td class="columnclass">
<label id="td12"></label>
</td>
</tr>
<tr class="rowclass">
<td class="columnclass">
<label id="td13"></label>
</td>
<td class="columnclass">
<label id="td14"></label>
</td>
<td class="columnclass">
<label id="td15"></label>
</td>
<td class="columnclass">
<label id="td16"></label>
</td>
</tr>
</table>
<br/>
<button id="testbutton">Reset</button>
</div>
<div class="mobilemode">
<table>
<tr>
<td class="fixedcell">
</td>
<td class="fixedcell">
<button onclick="slideUp()">▲</button>
</td>
<td class="fixedcell">
</td>
</tr>
<tr>
<td class="fixedcell">
...
CSS
.tableclass {
border : solid 1px;
border-collapse : collapse;
}
.rowclass {
border : solid 1px;
border-collapse : collapse;
}
.columnclass {
border : solid 1px;
border-collapse : collapse;
width : 30px;
height : 30px;
text-align : center;
}
.mobilemode {
}
.fixedcell {
width : 30px;
height : 30px;
}
JavaScript
hvar maintab;
$(document).keydown(function (e) {
debugger;
switch (e.which) {
case 37:
// left
slideLeft();
break;
case 38:
// up
slideUp();
break;
case 39:
// right
slideRight();
break;
case 40:
// down
slideDown();
break;
case 72:
// H
$(everything).hide();
break;
case 83:
// H
$(everything).show();
break;
default:
return; // exit this handler for other keys
}
e.preventDefault(); // prevent the default action (scroll / move caret)
});
function slideUp() {
var anythingChanged = false;
for (var r = 0; r <4; r++) {
for (var c = 0; c < 4; c++) {
while (slideNumberUp(r, c) == true)
{
anythingChanged = true;
r = r -1;
}
}
}
getRidOfImmunities();
if (anythingChanged == true)
generateRandom2();
displayTab();
}
function slideNumberUp(r, c) {
if (r == 0 || maintab[r][c].Value == 0) return false;
if (maintab[r-1][c].Value == 0) {
maintab[r-1][c].Value = maintab[r][c].Value;
maintab[r-1][c].Immunity = maintab[r][c].Immunity;
maintab[r][c].Value = 0;
maintab[r][c].Immunity = false;
return true;
}
if (maintab[r-1][c].Value == maintab[r][c].Value) {
if (maintab[r-1][c].Immunity == false && maintab[r][c].Immunity == false) {
maintab[r-1][c].Value = maintab[r-1][c].Value + maintab[r-1][c].Value;
maintab[r][c].Value = 0;
maintab[r-1][c].Immunity = true;
maintab[r][c].Immunity = false;
return true;
} else return false;
}
return false;
}
function slideDown()...