fofana/Projet_Web
3
2
Fork 0
Code Issues Pull requests Releases Wiki Activity

bafo

Browse source
This commit is contained in:
El Haji Fofana 2022-12-02 16:02:07 +01:00
commit d74d5858cd
11 changed files with 428 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
JustePrix.css Normal file
View file

@ -0,0 +1,72 @@
header
{
display: flex;
justify-content: center;
background-color: white;
padding: 1em;
margin: 0 -5px;
}
.Lagaf
{
display: flex;
margin: auto;
}
body
{
display: flex;
flex-direction: column;
background-color: #17a2b8;
margin: 0%;
padding: 0%;
min-height: 100vh;
}
a
{
text-decoration: none;
color: grey;
font-size: 1.2em;
margin: 0 5px;
}
section
{
padding-top: 3em;
padding-bottom: 3em;
background-color: lightgrey;
margin: 20em;
margin-top : 5em;
margin-bottom: 5em;
border-radius: 0.5em;
}
article
{
text-align: center;
}
.list a
{
background-color: white;
padding-top:1em;
padding-bottom: 1em;
border-radius: 0.5em;
}
.list
{
display: grid;
grid-template-columns: repeat(2,1fr);
gap: 1em;
padding: 1em;
}
.Titre
{
margin: auto;
text-align: center;
}
.BoiteNb
{
margin: auto;
text-align: center;
}
footer
{
margin-top: auto;
}

37
JustePrix.html
View file

@ -1,3 +1,4 @@
<<<<<<< HEAD
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -13,4 +14,40 @@
<input type="text" name="Valeur" id="Valeur"> <input type="text" name="Valeur" id="Valeur">
</div> </div>
</body> </body>
=======
<!DOCTYPE HTML>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="JustePrix.css" type="text/css">
<script src="JustePrix.js"></script>
<html>
<head>
<title>JustePrix</title>
</head>
<body>
<header>
<nav>
<a href="Page1.html">Home</a>
<a href="Puissance4.html">Puissance 4</a>
<a href="Morpion.html">Morpion</a>
<a href="Snake.html">Snake</a>
<a href="JustePrix.html">Juste Prix</a>
</nav>
</header>
<main>
<p></p>
<p class="Titre"><strong>Le Juste Prix</strong></p>
<img src="Lagaf.jpg" class="Lagaf">
<p>Bonjour mon ami et Bienvenue dans le JUSTE PRIX </p>
<div id="BoiteNb" class="BoiteNb">
<label for="Inp_Valeur"> Veuillez rentrer votre nombre</label>
<input type="text" id="Inp_Valeur">
<button name="btntent" id="btntent">Verification</button>
</div>
</main>
<footer>&copy; Copyright 2019 by ME. All Rights Reserved.</footer>
</body>
>>>>>>> c529b88e94d23093a509bad7d6be092aafb2290b
</html> </html>

34
JustePrix.js Normal file
View file

@ -0,0 +1,34 @@
let NbJoueur= document.getElementById("Inp_Valeur");
let Nb_a_Trouver = 5;
let btnver = document.getElementById("btntent");
btnver.addEventListener("click",Verif)
function Verif()
{
const NbJoueur2 = parseFloat(NbJoueur); //Verifie qu'il s'agit dun nombre
if(NbJoueur2 == isNaN(NbJoueur))
{
alert("La Valeur rentre est errone");
}
else
{
alert("La valeur est bonne");
}
}
function Trouver(NbJoueur)
{
if(Nb_a_Trouver == NbJoueur)
{
return true
}
else
{
return false
}
}

BIN
Lagaf.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

51
Leo.html Normal file
View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css" type="text/css">
<html>
<title>Morpion</title>
<header>
<nav>
<a href="Page1.html">Home</a>
<a href="Puissance4.html">Puissance 4</a>
<a href="Morpion.html">Morpion</a>
<a href="Snake.html">Snake</a>
<a href="JustePrix.html">Juste Prix</a>
</nav>
</header>
<body>
<h1 id="TitreMorp">Bienvenue sur le TIC-TAC-TOE </h1>
<p id="RegleMorp">Règles du jeu: à 2 joueurs, vous jouez au tour par tour. Il faut aligner 3 symboles pour gagner.</p>
<table id="tmorp">
<tr>
<td class="case"></td>
<td class="case"></td>
<td class="case"></td>
</tr>
<tr>
<td class="case"></td>
<td class="case"></td>
<td class="case"></td>
</tr>
<tr>
<td class="case"></td>
<td class="case"></td>
<td class="case"></td>
</tr>
</table>
<script type="text/javascript" src="leo.js"></script>
</body>
<footer>
</footer>
</html>
<!-- [0,1,2]
[3,4,5]
[6,7,8]
-->

46
Main.html
View file

@ -1,12 +1,36 @@
<!DOCTYPE html> <!DOCTYPE HTML>
<html lang="en"> <meta charset="UTF-8">
<head> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <link rel="stylesheet" href="style.css" type="text/css">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="Javascript" href="Page1.js">
<title>Document</title> <html>
</head> <head>
<body> <title>Projet Web</title>
</head>
</body>
<body>
<header>
<nav>
<a href="Page1.html">Home</a>
<a href="Puissance4.html">Puissance 4</a>
<a href="Morpion.html">Morpion</a>
<a href="Snake.html">Snake</a>
<a href="JustePrix.html">Juste Prix</a>
</nav>
</header>
<main>
<section>
<article>
<div class="list">
<a href="Puissance4.html">Puissance 4</a>
<a href="Morpion.html">Morpion</a>
<a href="Snake.html">Snake</a>
<a href="JustePrix.html">Juste Prix</a>
</ul>
</article>
</section>
</main>
<footer>&copy; Copyright 2019 by ME. All Rights Reserved.</footer>
</body>
</html> </html>

0
Page1.js
View file

39
Puissance4.html Normal file
View file

@ -0,0 +1,39 @@
<!DOCTYPE HTML>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css" type="text/css">
<link rel="Javascript" href="Page1.js">
<html>
<head>
<title>Puissance 4</title>
</head>
<body>
<header>
<nav>
<a href="Page1.html">Home</a>
<a href="Puissance4.html">Puissance 4</a>
<a href="Morpion.html">Morpion</a>
<a href="Snake.html">Snake</a>
<a href="JustePrix.html">Juste Prix</a>
</nav>
</header>
<main>
<section>
<article>
<div id="Puissance4Board">
<div class="one">1</div>
<div class="two">2</div>
<div class="three">3</div>
<div class="four">4</div>
<div class="five">5</div>
<div class="six">6</div>
</div>
</article>
</section>
</main>
<footer>&copy; Copyright 2019 by ME. All Rights Reserved.</footer>
</body>
</html>

15
READ.me Normal file
View file

@ -0,0 +1,15 @@
String object
Functions
Conditional Statements 
Loops: should include the use of at least While, for ... in and for .. of loop
Arrays
JavaScript Validation
Prototypes & User-defined objects
DOM, more specifically manipulation of HTML elements using JavaScript. Manipulation should include:
addition of HTML elements
remove of HTML elements
Update of HTML elements (changing the content or changing the style)
The web application should be hosted online. There are several online services that propose free hosting.

47
leo.js Normal file
View file

@ -0,0 +1,47 @@
let Jeu= true;
let Joueuractuel;
/*
function winverif(){
}
*/
let cases = document.querySelectorAll(".case");
for(let i = 0 ;i< cases.length;i++)
{
Joueuractuel = i%2;
if (Joueuractuel){
cases[i].addEventListener("click",(event)=>{
cases[i].innerHTML = "0";
})
}
else{
cases[i].addEventListener("click",(event)=>{
cases[i].innerHTML = "X";
})
}
}
/*
document.getElementById("demo1").onclick = function() {myFunction()};
function myFunction() {
document.getElementById("demo1").innerHTML = "O";
}
document.getElementById("demo2").onclick = function() {myFunction()};
function myFunction() {
document.getElementById("demo2").innerHTML = "O";
}
document.getElementById("demo3").onclick = function() {myFunction()};
function myFunction() {
document.getElementById("demo3").innerHTML = "O";
}*/

98
style.css Normal file
View file

@ -0,0 +1,98 @@
header
{
display: flex;
justify-content: center;
background-color: white;
padding: 1em;
margin: 0 -5px;
}
img
{
margin-right: auto;
}
body
{
display: flex;
flex-direction: column;
background-color: #17a2b8;
margin: 0%;
padding: 0%;
min-height: 100vh;
}
a
{
text-decoration: none;
color: grey;
font-size: 1.2em;
margin: 0 5px;
}
section
{
padding-top: 3em;
padding-bottom: 3em;
background-color: lightgrey;
margin: 20em;
margin-top : 5em;
margin-bottom: 5em;
border-radius: 0.5em;
}
article
{
text-align: center;
}
.list a
{
background-color: white;
padding-top:1em;
padding-bottom: 1em;
border-radius: 0.5em;
}
.list{
display: grid;
grid-template-columns: repeat(2,1fr);
gap: 1em;
padding: 1em;
}
footer{
margin-top: auto;
}
#Puissance4Board{
display: grid;
grid-template-columns: (6,7);
gap: 1em;
padding: 1em;
}
.one{
grid-column: 1;
grid-row: 1;
}
.two{
grid-column: 1;
grid-row: 1;
}
.three{
grid-column: 1;
grid-row: 1;
}
.four{
grid-column: 1;
grid-row: 1;
}
.five{
grid-column: 1;
grid-row: 1;
}
.six{
grid-column: 1;
grid-row: 1;
}
#RegleMorp{
background-color: lightgrey;
text-align: center;
margin-right:auto;
margin-left: auto;
}
#TitreMorp{
text-align: center;
}