UPDATE AHHH

master
sundowndev 2017-12-09 01:33:49 +01:00
parent aaa697c579
commit 767598b60c
3 changed files with 49 additions and 23 deletions

View File

@ -42,8 +42,3 @@ body{
display: inline-block;
}
.line-3 > .col-12{
background: url(../img/tank_bg.png) no-repeat;
background-position: 0px 0px;
}

View File

@ -1,7 +1,11 @@
var player = document.querySelector('#player');
var x = 0;
var y = 0;
var maxX = document.querySelectorAll('.line-1 .col').length;
var maxY = document.querySelectorAll('.line').length;
var x = 1;
var y = 5;
var controls = {
up: 'z',
@ -10,8 +14,35 @@ var controls = {
right: 'd'
}
function setPosition () {
//
var rotation = {
up: '0px -50px',
down: '-50px -50px',
left: '-50px 0px',
right: '0px 0px',
}
var direction = rotation.right;
function setPosition (posX, posY, direction) {
gridX = x;
gridY = y;
var grids = document.querySelectorAll('.col');
grids.forEach(function(e){
e.style.background = '';
e.style.backgroundPosition = '';
});
var grid = document.querySelector('.line-'+posY+' .col-'+posX);
grid.style.background = 'url(./assets/img/tank_bg.png) no-repeat';
grid.style.backgroundPosition = direction;
x = posX;
y = posY;
console.log(posX+' pour '+maxX);
}
function getPosition () {
@ -21,19 +52,20 @@ function getPosition () {
function move(event) {
var k = event.key;
if(k == controls.up){
y++;
setPosition();
} else if(k == controls.down){
y--;
setPosition();
} else if(k == controls.left){
x--;
setPosition();
} else if(k == controls.right){
x++;
setPosition();
if(k == controls.up && y > 1){
var newY = y-1;
setPosition(x, newY, rotation.up);
} else if(k == controls.down && y < maxY){
var newY = y+1;
setPosition(x, newY, rotation.down);
} else if(k == controls.left && x > 1){
var newX = x-1;
setPosition(newX, y, rotation.left);
} else if(k == controls.right && x < maxX){
var newX = x+1;
setPosition(newX, y, rotation.right);
}
}
document.addEventListener('keydown', move, false);
setPosition(x, y, direction);

View File

@ -4,7 +4,6 @@
<meta charset="UTF-8">
<title>de_tank</title>
<link rel="stylesheet" href="./assets/css/style.css">
</head>
<body>