mirror of https://github.com/sundowndev/Detank.git
Initialisation Map
parent
9d86626f5f
commit
d639fda0b0
|
@ -0,0 +1,39 @@
|
||||||
|
body{
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: sans-serif;
|
||||||
|
background: #232323;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header h1{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 42px;
|
||||||
|
padding-top: 15px;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map{
|
||||||
|
width: 1170px;
|
||||||
|
height: 658px;
|
||||||
|
border: solid 3px red;
|
||||||
|
background: url(../img/bg_sand.png) repeat;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.block{
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
background: green;
|
||||||
|
position: absolute;
|
||||||
|
left: 50px;
|
||||||
|
top: 50px;
|
||||||
|
}
|
Binary file not shown.
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
62
index.html
62
index.html
|
@ -1,63 +1,17 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Tank Breaker</title>
|
<title>de_tank</title>
|
||||||
<link rel="stylesheet" href="./assets/css/style.css">
|
<link rel="stylesheet" href="./assets/css/style.css">
|
||||||
|
|
||||||
<style>
|
|
||||||
body {
|
|
||||||
margin:0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jeu {
|
|
||||||
width: 1170px;
|
|
||||||
height: 658px;
|
|
||||||
}
|
|
||||||
|
|
||||||
canvas {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: #eee;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="jeu"></div>
|
<section class="header">
|
||||||
|
<h1>de_tank</h1>
|
||||||
<script src="./assets/js/script.js"></script>
|
</section>
|
||||||
|
<section class="map">
|
||||||
<script>
|
<div class="block"></div>
|
||||||
var keys = {
|
</section>
|
||||||
'player1': ['z','q','s','d'],
|
|
||||||
'player2': ['ArrowUp','ArrowLeft','ArrowDown','ArrowRight']
|
|
||||||
};
|
|
||||||
|
|
||||||
window.addEventListener("keydown", function(e){
|
|
||||||
console.log(e.key);
|
|
||||||
});
|
|
||||||
|
|
||||||
var game = document.getElementById("game");
|
|
||||||
|
|
||||||
function startGame() {
|
|
||||||
myGamePiece = new component(30, 30, "red", 10, 120);
|
|
||||||
myGamePiece.gravity = 0.05;
|
|
||||||
myScore = new component("30px", "Consolas", "black", 280, 40, "text");
|
|
||||||
myGameArea.start();
|
|
||||||
}
|
|
||||||
|
|
||||||
var myGameArea = {
|
|
||||||
canvas : document.createElement("canvas"),
|
|
||||||
start : function() {
|
|
||||||
this.canvas.width = 480;
|
|
||||||
this.canvas.height = 270;
|
|
||||||
this.context = this.canvas.getContext("2d");
|
|
||||||
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
|
|
||||||
this.frameNo = 0;
|
|
||||||
},
|
|
||||||
clear : function() {
|
|
||||||
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
|
<script src="assets/js/script.js"></script>
|
||||||
</html>
|
</html>
|
Loading…
Reference in New Issue