avant reteste de son

This commit is contained in:
Chiara 2019-12-06 04:12:43 +01:00
parent 975df5f68f
commit 8207db92d0
7 changed files with 122 additions and 44 deletions

View File

@ -7,44 +7,71 @@
<head>
<meta charset="UTF8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
canvas {
border-bottom: 2px solid #0d0d0d;
}
.center {
text-align: center;
}
button {
margin-top: +50px;
display: block;
margin-left: auto;
margin-right: auto;
}
img {
margin-top: +130px;
margin-left: +300px;
}
</style>
<link rel="stylesheet" type="text/css" href="./styles.css" />
</head>
<body>
<!--Jeux principal-->
<h1 class="center">Fuyez l'homme en noir !</h1>
<script src="./scores.js">
startGame()
</script>
<!--Tableau des scores-->
<h3 class="cote">Meilleur score</h3>
<script src="./script.js">
load()
</script>
<table class="tab">
<tbody>
<tr>
<td>
<p>1ST</p>
</td>
<td>
<script>
document.write(getPremier());
</script>
</td>
</tr>
<tr>
<td>
<p>2ND</p>
</td>
<td>
<script>
document.write(getSecond());
</script>
</td>
</tr>
<tr>
<td>
<p>3RD</p>
</td>
<td>
<script>
document.write(getTroisieme());
</script>
</td>
</tr>
</tbody>
</table>
<!--gif homme en noir qui marche-->
<img src="./gifs/homme trop swag.gif" alt="homme en noir" height="150" width="150">
<br>
<button onmousedown="sauter(-0.5)" onmouseup="sauter(0.05)">SAUTER</button>
<!--Insertion de l'audio a chaque saut-->
<audio id="myAudio">
<source src="./sons/OhPonyBoy_-_WOUTIPOUP.ogg" type="audio/ogg">
<source src="./sons/OhPonyBoy_-_WOUTIPOUP.mp3" type="audio/mpeg">
</audio>
<!--bouton evenement-->
<br>
<button onmousedown="sauter(-0.05)" onmouseup="sauter(0.05)">SAUTER</audio></button>
<button onclick="playAudio()">MUSIC</audio></button>
<!--lancer le jeux-->
<script>
startGame()
load()

View File

@ -1,43 +1,47 @@
//VARIABLES
var premier = 0;
var deuxieme = 0;
var troisième = 0;
var ligne;
var score = new Array("1ST", "2ND", "3RD");
var premier = score["1ST"];
var deuxieme = score["2ND"];
var troisième = score["3RD"];
var premier = localStorage.setItem('premier', 0);
var deuxieme = localStorage.setItem('deuxieme', 0);
var troisieme = localStorage.setItem('troisieme', 0);
var tableau = {
canvas: document.createElement("canvas"),
start: function() {
this.canvas.width = 200;
this.canvas.height = 150;
this.context = this.canvas.getContext("2d");
this.canvas.style = "position:absolute; margin-write: +500px; border: 2px solid #0d0d0d;";
var ctx = this.canvas.getContext("2d");
this.canvas.style = "position:absolute; margin-top: +50px; border: 2px solid #0d0d0d;";
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
this.interval = setInterval(updateGameArea, 20);
},
clear: function() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
}
}
//METHODES
function update(score) {
if (score > premier)
this.premier = score;
localStorage.setItem('premier', score);
else if (score > deuxieme)
this.deuxieme = score;
else if (score > troisième)
this.troisième = score;
localStorage.setItem('deuxieme', score);
else if (score > troisieme)
localStorage.setItem('troisieme', score);
}
function load() {
update();
//for (var i = 0; i < score.lenght; i++)
update(getScore());
tableau.start();
}
//GETTER
function getPremier() {
return localStorage.getItem('premier');
}
function getSecond() {
return localStorage.getItem('deuxieme');
}
function getTroisieme() {
return localStorage.getItem('troisieme');
}

View File

@ -119,5 +119,12 @@ function everyinterval(n) {
}
function sauter(n) {
let audio = new Audio("./");
audio.play();
personnage.gravity = n;
}
//GETTER
function getScore() {
return score;
}

9
Jeux_404/sons.js Normal file
View File

@ -0,0 +1,9 @@
var x = document.getElementById("myAudio");
function playAudio() {
x.play();
}
function pauseAudio() {
x.pause();
}

Binary file not shown.

Binary file not shown.

31
Jeux_404/styles.css Normal file
View File

@ -0,0 +1,31 @@
canvas {
border-bottom: 2px solid #0d0d0d;
}
.center {
text-align: center;
}
.cote {
margin-top: -40px;
}
button {
margin-top: +50px;
display: block;
margin-left: auto;
margin-right: auto;
}
img {
margin-top: -10px;
margin-left: +300px;
}
.tab {
margin-top: -10px;
}
.marge {
margin-left: 5em;
}