Ccc
Hhh
<html>
<head>
<style>
#puzzle {
display: inline-grid;
grid-template-columns: repeat(4, 1fr);
padding: 30vw;
padding-top: 10px;
}
input {
width: 10vw;
height: 10vw;
margin: 1px;
text-align: center;
font-size: 5vw;
}
</style>
<script>
numberOfButtons = 16;
playGround = new Array(numberOfButtons);
for(i=0; i<numberOfButtons; i++){
playGround[i] = 0;
}
playGround[0] = 2;
playGround[1] = 2;
playGround.sort(()=>Math.random()-0.5);
btn = new Array(numberOfButtons);
function play(B){
n = btn.indexOf(B);
if(n == 1 | n == 2){ // Вверх
for(j=0; j<3; j++){
for(i=4; i<16; i++){
if(playGround[i-4]==0){
playGround[i-4] = playGround[i];
playGround[i] = 0;
}
}}
for(i=4; i<16; i++){
if(playGround[i-4] == playGround[i]){
playGround[i-4] = playGround[i]*2;
playGround[i] = 0;
}
else if(playGround[i-4]==0){
playGround[i-4] = playGround[i];
playGround[i] = 0;
}
}
}
else if(n == 13 | n == 14){ // Вниз
for(j=0; j<3; j++){
for(i=11; i>=0; i--){
if(playGround[i+4]==0){
playGround[i+4] = playGround[i];
playGround[i] = 0;
}
}}
for(i=11; i>=0; i--){
if(playGround[i+4] == playGround[i]){
playGround[i+4] = playGround[i]*2;
playGround[i] = 0;
}
else if(playGround[i+4]==0){
playGround[i+4] = playGround[i];
playGround[i] = 0;
}
}
}
else if(n == 4 | n == 8){ // Влево
for(j=0; j<3; j++){
for(i=1; i<16; i++){
if(playGround[i-1]==0 & i%4 != 0){
playGround[i-1] = playGround[i];
playGround[i] = 0;
}
}}
for(i=1; i<16; i++){
if(playGround[i-1] == playGround[i]){
playGround[i-1] = playGround[i]*2;
playGround[i] = 0;
}
else if(playGround[i-1]==0 & i%4 != 0){
playGround[i-1] = playGround[i];
playGround[i] = 0;
}
}
}
else if(n == 7 | n == 11){ // Вправо
for(j=0; j<3; j++){
for(i=14; i>=0; i--){
if(playGround[i+1]==0 & (i+1)%4 != 0){
playGround[i+1] = playGround[i];
playGround[i] = 0;
}
}}
for(i=14; i>=0; i--){
if(playGround[i+1] == playGround[i]){
playGround[i+1] = playGround[i]*2;
playGround[i] = 0;
}
else if(playGround[i+1]==0 & (i+1)%4 != 0){
playGround[i+1] = playGround[i];
playGround[i] = 0;
}
}
}
else {return}
a = new Array(0);
for(i=0; i<numberOfButtons; i++){
if(playGround[i]==0){
a = a.concat([i]);
}
}
a.sort(()=>Math.random()-0.5);
b = [2, 2, 2, 4];
b.sort(()=>Math.random()-0.5);
console.log(b)
playGround[a[0]] = b[0];
for(i=0; i<numberOfButtons; i++){
btn[i].value = playGround[i]==0 ? " " : playGround[i];
}
}
</script>
</head>
<body>
<div id=puzzle>
</div>
<script>
for(i=0; i<numberOfButtons; i++){
btn[i] = document.createElement("input");
btn[i].type = "button";
btn[i].value = playGround[i]==0 ? " " : playGround[i];
btn[i].onclick = function() {play(this)};
document.getElementById('puzzle').appendChild(btn[i]);
}
</script>
</body>
</html>Gvv
