JokingJoker25
Neues Mitglied
Hallo,
könnte jemand mal über den Code hier schauen:
Die Frucht wird zwar neu positioniert aber die neu gespawnten teile des Körpers der Schlange folgen dem Kopf nicht und sie erscheinen irgendwie zufällig.
Vielen Dank schonmal im voraus!
könnte jemand mal über den Code hier schauen:
Code:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style>
#field{
width: 525px;
height: 500px;
border: 5px solid black;
margin-top: 100px;
margin-left: auto;
margin-right: auto;
}
#Head{
width: 25px;
height: 25px;
background-color: blue;
position: relative;
}
#food{
width: 25px;
height: 25px;
background-color: green;
margin-bottom: -25px;
position: relative;
}
.Body{
width: 25px;
height: 25px;
background-color: blue;
position: relative;
}
</style>
</head>
<body>
<div id="field">
<div id="food"></div>
<div class="snake" id="Head"></div>
</div>
<script type="text/javascript">
//Head
var HeadStyle = document.getElementById("Head").style;
document.getElementById("food").style.right = "-500px";
document.getElementById("food").style.bottom = "-50px";
//start position
var currentRight = -200;
var currentDown = -50;
//set start position
HeadStyle.right = currentRight + "px";
HeadStyle.bottom = currentDown + "px";
//moveBools
var moveRight = true;
var moveLeft = false;
var moveDown = false;
var moveUp = false;
var eat = false;
var body = [];
var bodiesInt = 0;
function GameLoop()
{
//Move
var HeadRightBeforeMove = HeadStyle.right;
var HeadBottomBeforeMove = HeadStyle.bottom;
if(moveRight){
currentRight -= 25;
HeadStyle.right = currentRight + "px";
}
else if(moveLeft){
currentRight += 25;
HeadStyle.right = currentRight + "px";
}
else if(moveUp){
currentDown += 25;
HeadStyle.bottom = currentDown + "px";
}
else if(moveDown){
currentDown -= 25;
HeadStyle.bottom = currentDown + "px";
}
//Eat
var FoodStyle = document.getElementById("food").style;
if(HeadStyle.bottom == FoodStyle.bottom && HeadStyle.right == FoodStyle.right){
for(var i = 0; i < 1; i++){
var randright = Math.random();
randright *= 20;
randright = Math.floor(randright);
randright = -randright;
randright *= 25;
var randbottom = Math.random();
randbottom *= 20;
randbottom = Math.floor(randbottom);
randbottom = -randbottom;
randbottom *= 25;
if(randright == FoodStyle.right || randbottom == FoodStyle.bottom){
i -= 1;
}
else{
eat = true
FoodStyle.bottom = randbottom + "px";
FoodStyle.right = randright + "px";
var node = document.createElement("div");
document.getElementById("field").appendChild(node);
node.className = "Body";
node.id = "Body" + bodiesInt;
body[bodiesInt] = node;
bodiesInt++;
}
}
}
if(!eat && bodiesInt > 0){
document.getElementById("Body" + body[length - 1]).style.right = HeadRightBeforeMove;
document.getElementById("Body" + body[length - 1]).style.bottom = HeadBottomBeforeMove;
var lastbody = body.pop();
body.unshift(lastbody);
console.log(body);
}
else if(eat){
node.style.right = HeadRightBeforeMove;
node.style.bottom = HeadBottomBeforeMove;
eat = false;
}
}
setInterval(function(){
GameLoop();
}, 250);
document.addEventListener("keydown", function(event){
//Left
if((event.keyCode == 65 || event.keyCode == 37) && !moveRight) {
moveLeft = true;
moveUp = false;
moveDown = false;
moveRight = false;
}
//Right
else if((event.keyCode == 68 || event.keyCode == 39) && !moveLeft){
moveLeft = false;
moveUp = false;
moveDown = false;
moveRight = true;
}
//Up
else if((event.keyCode == 87 || event.keyCode == 38) && !moveDown){
moveLeft = false;
moveUp = true;
moveDown = false;
moveRight = false;
}
//Down
else if((event.keyCode == 83 || event.keyCode == 40) && !moveUp){
moveLeft = false;
moveUp = false;
moveDown = true;
moveRight = false;
}
});
</script>
</body>
</html>
Die Frucht wird zwar neu positioniert aber die neu gespawnten teile des Körpers der Schlange folgen dem Kopf nicht und sie erscheinen irgendwie zufällig.
Vielen Dank schonmal im voraus!