Skip to content

Instantly share code, notes, and snippets.

@zhouzhongyuan
Created April 5, 2015 14:33
Show Gist options
  • Save zhouzhongyuan/1727e34143101347e002 to your computer and use it in GitHub Desktop.
Save zhouzhongyuan/1727e34143101347e002 to your computer and use it in GitHub Desktop.
git remote add origin https://github.com/yawenzhongyuan/2048.git git push -u origin master
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$" />
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectLevelVcsManager" settingsEditedManually="false">
<OptionsSetting value="true" id="Add" />
<OptionsSetting value="true" id="Remove" />
<OptionsSetting value="true" id="Checkout" />
<OptionsSetting value="true" id="Update" />
<OptionsSetting value="true" id="Status" />
<OptionsSetting value="true" id="Edit" />
<ConfirmationsSetting value="0" id="Add" />
<ConfirmationsSetting value="0" id="Remove" />
</component>
<component name="ProjectRootManager" version="2" />
</project>
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/2048.iml" filepath="$PROJECT_DIR$/.idea/2048.iml" />
</modules>
</component>
</project>
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="main.css" rel="stylesheet">
</head>
<body>
<div id="newGame">NEW GAME</div>
<div id="table">
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
</div>
<script src="main.js" type="text/javascript"></script>
</body>
</html>
body{
background-color: #FAF8EF;
}
#newGame{
height: 50px;
line-height: 50px;
width:100px;
background-color: #8F7A66;
color: #FFFFFF;
border-radius: 3px;
text-align: center;
font-size: 1em;
font-family: "Clear Sans", "Helvetica Neue", Arial, sans-serif;
font-weight: bold;
margin-right: auto;
margin-left: auto;
margin: 50px auto 50px;
}
#table{
position: absolute;
width: 480px;
height:480px;
background-color: #BBADA0;
border-radius: 5px;
padding: 10px;
}
.table:after{
clear: both;
}
.cell,.cellON{
float: left;
width: 100px;
height: 100px;
background-color: #CCC0B3;
margin: 10px ;
border-radius: 3px;
line-height: 100px;
font-size: 55px;
text-align: center;
font-family: "Clear Sans", "Helvetica Neue", Arial, sans-serif;
font-weight: bold;
}
.cellON{
animation:myfirst 2s;
background-color: #EEE4DA;
position: absolute;
-webkit-animation:appear 200ms ease 100ms;
/*ease 100ms;/!* Safari and Chrome *!/*/
-webkit-animation-fill-mode: backwards;
}
@-webkit-keyframes appear {
0% {
opacity: 0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
transform: scale(0); }
100% {
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
transform: scale(1); }
}
/**
* Created by Zhongyuan on 2015/4/5.
*/
var game = document.getElementById('table');
window.onload = function(){
var newGame = document.getElementById('newGame');
ramdomTwo();
newGame.addEventListener('click',function(){
clearAll();
ramdomTwo();
},false)
}
function drawBlock(x,y,textValue){
var newOne = document.createElement('div');
newOne.className = 'cellON';
var newOneText = document.createTextNode(textValue);
newOne.appendChild(newOneText);
newOne.style.left = x + 'px';
newOne.style.top = y + 'px';
game.appendChild(newOne);
}
function randomPosition(){
var i = Math.floor( Math.random()*4 );
var j = Math.floor( Math.random()*4 );
var x = 10+i*120;
var y = 10+j*120;
return {x:x,y:y};
}
function clearAll(){
//清除所有
var cellON = document.getElementsByClassName('cellON');
for(var i=cellON.length-1;i>=0;i--) {
cellON[i].parentNode.removeChild(cellON[i]);
}
}
//生成两个随机块
function ramdomTwo(){
var x = randomPosition().x;
var y = randomPosition().y;
newGame.style.cursor = 'pointer';
drawBlock(x,y,2);
var x = randomPosition().x;
var y = randomPosition().y;
drawBlock(x,y,2);
}
document.keydown(function(event){
switch (event.keyCode){
case 37:
if ( moveLeft() ){
generateOneNumber();
isGameOver();
};
break;
case 38:
break;
case 39:
break;
case 40:
break;
default:
break;
}
});
//function moveLeft(){
// if( !canMoveLeft() ){
// return false;
// }
// else{
//
// }
//}
//function canMoveLeft(){
// for(var i=0;i<4;i++)
// for(var j=1;j<4;j++){
// if(board[i][j] != 0 )
// if(board[i][j-1] ==0 || board[i][j-1] == board[i][j])
// return true;
// }
//
// return false;
//}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment