Redefnition du constructeur + Ajout de la gen de toutes les cartes possibles

Golfier
yasevret 5 years ago
parent d213046247
commit d0b6b8f192

@ -1,152 +1,152 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head lang="fr"> <head lang="fr">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>SwishGame</title> <title>SwishGame</title>
<link rel="stylesheet" href="css/base.css"> <link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/Resp1.css"> <link rel="stylesheet" href="css/Resp1.css">
<link rel="stylesheet" href="css/Resp2.css"> <link rel="stylesheet" href="css/Resp2.css">
<link rel="stylesheet" href="css/Resp3.css"> <link rel="stylesheet" href="css/Resp3.css">
<link rel="stylesheet" href="css/PageDaccueil.css"> <link rel="stylesheet" href="css/PageDaccueil.css">
<link rel="stylesheet" href="css/PartieGame.css"> <link rel="stylesheet" href="css/PartieGame.css">
<script type="text/javascript" src="js/main.js"></script> <script type="text/javascript" src="js/main.js"></script>
</head> </head>
<body onload="ChoisirPseudo()"> <body onload="ChoisirPseudo()">
<div id="pageAccueil"> <div id="pageAccueil">
<div class="logo"> <div class="logo">
<a onclick="journuit()"> <a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo"> <img src="imgs/swishjour.png" id="imglogo">
</a> </a>
</div> </div>
<div id="infosec"> <div id="infosec">
<div class="inner"> <div class="inner">
<ul class="activity"> <ul class="activity">
<li id="listeinfobtn"> <li id="listeinfobtn">
<a id="info" href="#popup1">i</a> <a id="info" href="#popup1">i</a>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<div id="containpseudo"> <div id="containpseudo">
<a onclick="lancerpartie()"> <a onclick="lancerpartie()">
<div id="contourbuttonvalider"> <div id="contourbuttonvalider">
<div class="bouttonvalider"> <div class="bouttonvalider">
<h1 id="textjouer">JOUER</h1> <h1 id="textjouer">JOUER</h1>
</div> </div>
</div> </div>
</a> </a>
</div> </div>
<div id="popup1" class="overlay"> <div id="popup1" class="overlay">
<div class="popup"> <div class="popup">
<h2>Les Règles :</h2> <h2>Les Règles :</h2>
<a class="close" href="#">&times;</a> <a class="close" href="#">&times;</a>
<div class="content"> <div class="content">
Swish : Jeu de 60 cartes compos&eacute chacun de billes et de cerceaux, de 4 couleurs Swish : Jeu de 60 cartes compos&eacute chacun de billes et de cerceaux, de 4 couleurs
diff&eacuterentes possibles. 16 cartes sont pos&eacutes sur une table et le joueur doit faire superposer diff&eacuterentes possibles. 16 cartes sont pos&eacutes sur une table et le joueur doit faire superposer
des cartes de mani&egravere que chaque bille soit dans le cerceau de m&ecircme couleur dune autre des cartes de mani&egravere que chaque bille soit dans le cerceau de m&ecircme couleur dune autre
carte. carte.
</div> </div>
</div> </div>
</div> </div>
<!-- <!--
<div id="containpseudo"> <div id="containpseudo">
<div id="pseudoenter"> <div id="pseudoenter">
<div id="fondinput"> <div id="fondinput">
<input onkeypress="ajouterplayer(event)" maxlength="12" id="inputpseudo"> <input onkeypress="ajouterplayer(event)" maxlength="12" id="inputpseudo">
</div> </div>
</div> </div>
<a onclick="EnvoyerNouveauNom()"> <a onclick="EnvoyerNouveauNom()">
<div id="contourbuttonvalider"> <div id="contourbuttonvalider">
<div class="bouttonvalider" > <div class="bouttonvalider" >
<h1 id="textjouer">JOUER</h1> <h1 id="textjouer">JOUER</h1>
</div> </div>
</div> </div>
</a> </a>
<div id="buttonadd"> <div id="buttonadd">
<a onclick="addplayer()"> <a onclick="addplayer()">
<h2 id="textplus">+</h2> <h2 id="textplus">+</h2>
</a> </a>
</div> </div>
</div> </div>
<div id="containplayers"> <div id="containplayers">
</div> </div>
--> -->
<div id="ContainBottom"> <div id="ContainBottom">
<!-- Forme : rond--> <!-- Forme : rond-->
<div class="containform"> <div class="containform">
<div class="anneau"> <div class="anneau">
<div class="rondinterieur inté"></div> <div class="rondinterieur inté"></div>
</div> </div>
</div> </div>
<div class="containform"> <div class="containform">
<div class="rond"></div> <div class="rond"></div>
</div> </div>
<!-- Forme : carré--> <!-- Forme : carré-->
<div class="containform"> <div class="containform">
<div class="carre"> <div class="carre">
<div class="carreinterieur inté"></div> <div class="carreinterieur inté"></div>
</div> </div>
</div> </div>
<div class="containform"> <div class="containform">
<div class="pcarre"></div> <div class="pcarre"></div>
</div> </div>
</div> </div>
<div class="mounts"> <div class="mounts">
<img src="imgs/lightcloud.png" id="cloud"> <img src="imgs/lightcloud.png" id="cloud">
<img src="imgs/mount1.png" id="mount1"> <img src="imgs/mount1.png" id="mount1">
<img src="imgs/mount2.png" id="mount2"> <img src="imgs/mount2.png" id="mount2">
</div> </div>
</div> </div>
<div id="pageGame"> <div id="pageGame">
<div class="menuhaut"> <div class="menuhaut">
<div id="Redistribution"> <div id="Redistribution">
<a onclick="creePartie()" id="relancerbtn"> <a onclick="creePartieDeTest()" id="relancerbtn">
<div id="contourbuttonvalider"> <div id="contourbuttonvalider">
<div class="bouttonvalider"> <div class="bouttonvalider">
<h1 id="textjouer2">RELANCER</h1> <h1 id="textjouer2">RELANCER</h1>
</div> </div>
</div> </div>
</a> </a>
</div> </div>
<div id="Redistribution2"> <div id="Redistribution2">
<a id="relancerbtn" onclick="test()"> <a id="relancerbtn" onclick="test()">
<div id="contourbuttonvalider"> <div id="contourbuttonvalider">
<div class="bouttonvalider2"> <div class="bouttonvalider2">
<h1 id="btnvalider2">VALIDER</h1> <h1 id="btnvalider2">VALIDER</h1>
</div> </div>
</div> </div>
</a> </a>
</div> </div>
<div class="logop2"> <div class="logop2">
<a onclick="journuit()"> <a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo2"> <img src="imgs/swishjour.png" id="imglogo2">
</a> </a>
</div> </div>
<a class="retourstp" onclick="retour()"> <a class="retourstp" onclick="retour()">
<div class="buttonretour"> <div class="buttonretour">
<h1 class="txt">X</h1> <h1 class="txt">X</h1>
</div> </div>
</a> </a>
</div> </div>
<div id="containcards" class="containcards"> <div id="containcards" class="containcards">
</div> </div>
</div> </div>
</body> </body>
</html> </html>

@ -10,15 +10,21 @@ var darktercia = "#606060";
var carteselect = []; var carteselect = [];
var deckPartie = []; //Ensemble des cartes affichées à l'écran var deckPartie = []; //Ensemble des cartes affichées à l'écran
class Carte { class Carte {
constructor(id/*,row,column,nbForme*/) { //à décommenter quand il y aura des prametres de partie constructor(id, allFigure/*,row,column,nbForme*/) { //à décommenter quand il y aura des prametres de partie
//Attribut de Classe //Attribut de Classe
this.identifiant = id; this.identifiant = id;
this.row = 4 /*row*/; this.row = 4 /*row*/;
this.column = 3 /*column*/; this.column = 3 /*column*/;
this.Matrice = creaMatrice(this.row, this.column); this.Matrice = creaMatrice(this.row, this.column);
this.SesFigures = []; this.SesFigures = [];
for (var i = 0; i < allFigure.length; i++) {
this.SesFigures.push(allFigure[i]);
}
//lien clicable //lien clicable
this.link = document.createElement('a'); this.link = document.createElement('a');
@ -33,30 +39,17 @@ class Carte {
var divcase = document.createElement('div'); var divcase = document.createElement('div');
divcase.className = "item-form"; divcase.className = "item-form";
var ajouté = true;
// Point ou anneau trouvé => création for (var j = 0; j < this.SesFigures.length; j++) {
if (this.Matrice[i % 3][Math.floor(i / 3)] == 1) { if (i == this.SesFigures[j].X + (this.SesFigures[j].Y * 3)) {
ajouté = false;
//TEST : CRéation d'une figure Pleine => Rond var uneFigure = new Figure(this.SesFigures[j].type[0], this.SesFigures[j].forme, this.SesFigures[j].X, this.SesFigures[j].Y);
var uneFigure = new Figure(TypeFigure.Petit, FormeFigure.Rond, i % 3, Math.floor(i / 3)); divconteneur.appendChild(uneFigure.CodeHTML);
this.SesFigures.push(uneFigure); }
}
divconteneur.appendChild(uneFigure.getHTML); if (ajouté) {
divconteneur.appendChild(divcase);
}
} else if (this.Matrice[i % 3][Math.floor(i / 3)] == 2) { // Point ou anneau trouvé => création
//TEST : CRéation d'une figure Pleine => Anneau
var uneFigure = new Figure(TypeFigure.Moyen, FormeFigure.Rond, i % 3, Math.floor(i / 3));
this.SesFigures.push(uneFigure);
divconteneur.appendChild(uneFigure.getHTML);
} else divconteneur.appendChild(divcase);
} }
this.link.appendChild(divconteneur); this.link.appendChild(divconteneur);
@ -66,7 +59,6 @@ class Carte {
var lacarte = "card" + macarte; var lacarte = "card" + macarte;
var laCarte = deckPartie[this.id - 1]; //Carte liée avec le code HTML var laCarte = deckPartie[this.id - 1]; //Carte liée avec le code HTML
if (document.getElementById(lacarte).style.boxShadow != "") { if (document.getElementById(lacarte).style.boxShadow != "") {
var pos = carteselect.indexOf(laCarte); var pos = carteselect.indexOf(laCarte);
carteselect.splice(pos, 1); carteselect.splice(pos, 1);
@ -147,6 +139,7 @@ class Carte {
} }
} }
class Figure { class Figure {
constructor(leType, forme, Cox, Coy) { constructor(leType, forme, Cox, Coy) {
@ -158,6 +151,7 @@ class Figure {
var pos = this.X + this.Y * 3; var pos = this.X + this.Y * 3;
var divcase = document.createElement('div'); var divcase = document.createElement('div');
divcase.className = "item-form"; divcase.className = "item-form";
//Pour chaque type on regarde les formes
switch (this.forme) { switch (this.forme) {
case FormeFigure.Rond: case FormeFigure.Rond:
switch (this.type[0]) { switch (this.type[0]) {
@ -169,7 +163,7 @@ class Figure {
var unCercle = document.createElement('div'); var unCercle = document.createElement('div');
unCercle.className = "anneau"; unCercle.className = "anneau";
unCercle.style.backgroundColor = "var(--colorbase)";
if (pos == 0 || pos == 2 || pos == 9 || pos == 11) { if (pos == 0 || pos == 2 || pos == 9 || pos == 11) {
unCercle.style.backgroundColor = "var(--colorone)"; unCercle.style.backgroundColor = "var(--colorone)";
} }
@ -196,15 +190,16 @@ class Figure {
var unRond = document.createElement('div'); var unRond = document.createElement('div');
unRond.className = "rond"; unRond.className = "rond";
//unRond.style.backgroundColor = "#000DFF"; unRond.style.backgroundColor = "var(--colorbase)";
if (pos == 0 || pos == 2 || pos == 9 || pos == 11) { if (pos == 0 || pos == 2 || pos == 9 || pos == 11) {
unRond.style.backgroundColor = "#00CBFF"; unRond.style.backgroundColor = "var(--colorone)";
} }
if (pos == 1 || pos == 10) { if (pos == 1 || pos == 10) {
unRond.style.backgroundColor = "#00FF6E"; unRond.style.backgroundColor = "var(--colortwo)";
} }
if (pos == 4 || pos == 7) { if (pos == 4 || pos == 7) {
unRond.style.backgroundColor = "#C800FF"; unRond.style.backgroundColor = "var(--colorthree)";
} }
divContainForm.appendChild(unRond); divContainForm.appendChild(unRond);
divcase.appendChild(divContainForm); divcase.appendChild(divContainForm);
@ -303,7 +298,8 @@ function journuit() {
function lancerpartie() { function lancerpartie() {
document.getElementById("pageAccueil").style.visibility = "hidden"; document.getElementById("pageAccueil").style.visibility = "hidden";
creePartie(); //fonction de création de partie à changer en fonction du test voulu
genererTouteslesCartes3_4Possibles();
document.getElementById("pageGame").style.visibility = "visible"; document.getElementById("pageGame").style.visibility = "visible";
} }
@ -320,10 +316,39 @@ function rechargerGAME() {
document.getElementById("containcards").appendChild(deckPartie[i].getHTML); document.getElementById("containcards").appendChild(deckPartie[i].getHTML);
} }
} }
//================================================================================================================================================================
//Fonction créations de game
function genererTouteslesCartes3_4Possibles() {
deckPartie = [];
carteselect = [];
while (document.getElementById("containcards").firstElementChild != null) {
document.getElementById("containcards").firstElementChild.remove();
}
for (var k = 0; k < 2; k++) {
for (var j = 0; j < 2; j++) {
for (var i = 0; i < 12; i++) {
var AllFigure = [];
AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, k, j));
if (i != k + 3 * j) {
if (k == 0) {
AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, i % 3, Math.floor(i / 3)));
var uneCarte = new Carte(i + 12 * j, AllFigure);
deckPartie.push(uneCarte);
document.getElementById("containcards").appendChild(uneCarte.link);
} else if (i != 2 && i != 5 && i != 8 && i != 11) {
AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, i % 3, Math.floor(i / 3)));
var uneCarte = new Carte(i + 12 * j, AllFigure);
deckPartie.push(uneCarte);
document.getElementById("containcards").appendChild(uneCarte.link);
}
}
}
}
}
}
function creePartieDeTest() {
function creePartie() {
deckPartie = []; deckPartie = [];
carteselect = []; carteselect = [];
while (document.getElementById("containcards").firstElementChild != null) { while (document.getElementById("containcards").firstElementChild != null) {
@ -331,14 +356,33 @@ function creePartie() {
} }
for (var j = 1; j <= 16; j++) { for (var j = 1; j <= 16; j++) {
var uneCarte = new Carte(j); var AllFigure = [];
var Cox1, Coy1, Cox2, Coy2;
Cox1 = getRandom(0, 2);
Coy1 = getRandom(0, 3);
AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, Cox1, Coy1));
Cox2 = getRandom(0, 2);
Coy2 = getRandom(0, 3);
while (Cox2 == Cox1 && Coy1 == Coy2) {
Cox2 = getRandom(0, 2);
Coy2 = getRandom(0, 3);
}
AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, Cox2, Coy2));
//Code de Génération de Figure
var uneCarte = new Carte(j, AllFigure);
deckPartie.push(uneCarte); deckPartie.push(uneCarte);
document.getElementById("containcards").appendChild(uneCarte.getHTML); document.getElementById("containcards").appendChild(uneCarte.link);
} }
} }
//========================================================================================================================================================
//Changer les cartes
function changerlesCartes() { function changerlesCartes() {
while (carteselect.length != 0) { while (carteselect.length != 0) {
remplacerLaCarte(carteselect[0]); remplacerLaCarte(carteselect[0]);
@ -349,7 +393,22 @@ function changerlesCartes() {
function remplacerLaCarte(uneCarte) { function remplacerLaCarte(uneCarte) {
pos = deckPartie.indexOf(uneCarte); pos = deckPartie.indexOf(uneCarte);
var newCarte = new Carte(pos + 1); var AllFigure = [];
var Cox1, Coy1, Cox2, Coy2;
Cox1 = getRandom(0, 2);
Coy1 = getRandom(0, 3);
AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, Cox1, Coy1));
Cox2 = getRandom(0, 2);
Coy2 = getRandom(0, 3);
while (Cox2 == Cox1 && Coy1 == Coy2) {
Cox2 = getRandom(0, 2);
Coy2 = getRandom(0, 3);
}
AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, Cox2, Coy2));
var newCarte = new Carte(pos + 1, AllFigure);
deckPartie[pos] = newCarte; deckPartie[pos] = newCarte;
} }
@ -431,11 +490,6 @@ function test() {
for (var i = 0; i < carteselect.length; i++) { for (var i = 0; i < carteselect.length; i++) {
copie.push(carteselect[i]); copie.push(carteselect[i]);
} }
/*var uneTable = copieListeDeCarte(copie);
uneTable.splice(0, 1);
var TEST = AssemblageARBRE(uneTable, copie[0]);
changerlesCartes();*/
var tab = []; var tab = [];
tab = AssemblageARBRE(copieListeDeCarte(copie), carteselect[0]); tab = AssemblageARBRE(copieListeDeCarte(copie), carteselect[0]);
var solution = true; var solution = true;
@ -443,9 +497,8 @@ function test() {
for (var i = 0; i < tab.length; i++) { for (var i = 0; i < tab.length; i++) {
tabCode.push(tab[i].code); tabCode.push(tab[i].code);
} }
//window.alert(tabCode)
for (var i = 0; i < tab.length; i++) { for (var i = 0; i < tab.length; i++) {
if (tab[i].code == copie.length) { if (tab[i].code == carteselect.length) {
solution = false; solution = false;
changerlesCartes(); changerlesCartes();
} }
@ -459,10 +512,13 @@ function test() {
} }
} catch (e) { } catch (e) {
window.alert("Assemblage Impossible"); window.alert(e);
} }
} }
//===================================================================================
//Function de copie diverse
function copieListeDeCarte(Liste) { function copieListeDeCarte(Liste) {
var copie = []; var copie = [];
for (var i = 0; i < Liste.length; i++) { for (var i = 0; i < Liste.length; i++) {
@ -470,26 +526,12 @@ function copieListeDeCarte(Liste) {
} }
return copie; return copie;
} }
function Verticale(coCarte) {
var laCarte;
laCarte = copieCarte(coCarte);
laCarte = laCarte.carteVerticale;
return laCarte;
}
function Horizontale(coCarte) {
var laCarte;
laCarte = copieCarte(coCarte);
laCarte = laCarte.carteHorizontale;
return laCarte;
}
function copieCarte(uneCarte) { function copieCarte(uneCarte) {
if (uneCarte == null) { if (uneCarte == null) {
return null; return null;
} }
var carte = new Carte(uneCarte.getIdentifiant); var carte = new Carte(uneCarte.getIdentifiant, uneCarte.SesFigures);
carte.SesFigures = new Array(); carte.SesFigures = new Array();
for (var i = 0; i < uneCarte.SesFigures.length; i++) { for (var i = 0; i < uneCarte.SesFigures.length; i++) {
carte.SesFigures.push(new Figure(uneCarte.SesFigures[i].type[0], uneCarte.SesFigures[i].getForme, uneCarte.SesFigures[i].getX, uneCarte.SesFigures[i].getY)); carte.SesFigures.push(new Figure(uneCarte.SesFigures[i].type[0], uneCarte.SesFigures[i].getForme, uneCarte.SesFigures[i].getX, uneCarte.SesFigures[i].getY));
@ -503,6 +545,41 @@ function copieCarte(uneCarte) {
return carte; return carte;
} }
function copieLiseDeFigure(Liste) {
var copie = [];
for (var i = 0; i < Liste.length; i++) {
copie.push(copieFigure(Liste[i]));
window.alert("code " + copie[i].CodeHTML)
}
return copie;
}
function copieFigure(uneFigure) {
window.alert("Avant copiage " + uneFigure.CodeHTML)
if (uneFigure == null) {
return null;
}
window.alert("je fais la copie")
var copie = new Figure(uneFigure.type, uneFigure.forme, uneFigure.X, uneFigure.Y);
return copie;
}
//=====================================================================================================
//Function de manipulataion de Carte
function Verticale(coCarte) {
var laCarte;
laCarte = copieCarte(coCarte);
laCarte = laCarte.carteVerticale;
return laCarte;
}
function Horizontale(coCarte) {
var laCarte;
laCarte = copieCarte(coCarte);
laCarte = laCarte.carteHorizontale;
return laCarte;
}
//============================================================================================================================== //==============================================================================================================================
//FONCTION POUR TESTER L'ARBRE //FONCTION POUR TESTER L'ARBRE

Loading…
Cancel
Save