|
|
|
@ -8,88 +8,30 @@ var darkprima = "#474747";
|
|
|
|
|
var darkseconda = "#393939";
|
|
|
|
|
var darktercia = "#606060";
|
|
|
|
|
var carteselect = [];
|
|
|
|
|
var deckPartie = []; //Ensemble des cartes affichées à l'écran
|
|
|
|
|
|
|
|
|
|
function journuit(){
|
|
|
|
|
//mode jour
|
|
|
|
|
if(mode%2 == 0){
|
|
|
|
|
//changer logo swish
|
|
|
|
|
document.getElementById("imglogo").src = "imgs/swishjour.png";
|
|
|
|
|
document.getElementById("imglogo2").src = "imgs/swishjour.png";
|
|
|
|
|
|
|
|
|
|
document.getElementById("fondinput").style.backgroundColor = lightsedonca;
|
|
|
|
|
document.getElementById("contourbuttonvalider").style.backgroundColor = lightsedonca;
|
|
|
|
|
document.getElementById("textjouer").style.color = lightsedonca;
|
|
|
|
|
document.getElementById("textplus").style.color = lightprima;
|
|
|
|
|
//changer montagnesfond
|
|
|
|
|
document.getElementById("mount1").src = "imgs/mount1.png";
|
|
|
|
|
document.getElementById("mount2").src = "imgs/mount2.png";
|
|
|
|
|
//nuages
|
|
|
|
|
document.getElementById("cloud").src = "imgs/lightcloud.png";
|
|
|
|
|
//changer background color
|
|
|
|
|
document.getElementById("containplayers").style.color = lightsedonca;
|
|
|
|
|
//maj couleur principales
|
|
|
|
|
document.documentElement.style.setProperty('--lightprima',lightprima);
|
|
|
|
|
document.documentElement.style.setProperty('--lightsedonca',lightsedonca);
|
|
|
|
|
document.documentElement.style.setProperty('--lighttercia',lighttercia);
|
|
|
|
|
}
|
|
|
|
|
//mode nuit
|
|
|
|
|
else {
|
|
|
|
|
//changer logo swish
|
|
|
|
|
document.getElementById("imglogo").src = "imgs/swishnuit.png";
|
|
|
|
|
document.getElementById("imglogo2").src = "imgs/swishnuit.png";
|
|
|
|
|
//bouttonjouer
|
|
|
|
|
document.getElementById("fondinput").style.backgroundColor = darkseconda;
|
|
|
|
|
document.getElementById("contourbuttonvalider").style.backgroundColor = darkseconda;
|
|
|
|
|
document.getElementById("textjouer").style.color = darkseconda;
|
|
|
|
|
document.getElementById("textplus").style.color = darkprima;
|
|
|
|
|
//changer montagnesfond
|
|
|
|
|
document.getElementById("mount1").src = "imgs/darkmount1.png";
|
|
|
|
|
document.getElementById("mount2").src = "imgs/darkmount2.png";
|
|
|
|
|
//nuages
|
|
|
|
|
document.getElementById("cloud").src = "imgs/darkcloud.png";
|
|
|
|
|
//mode nuit
|
|
|
|
|
//document.getElementById("containplayers").style.color = darkseconda;
|
|
|
|
|
//maj couleur principales
|
|
|
|
|
document.documentElement.style.setProperty('--lightprima',darkprima);
|
|
|
|
|
document.documentElement.style.setProperty('--lightsedonca',darkseconda);
|
|
|
|
|
document.documentElement.style.setProperty('--lighttercia',darktercia);
|
|
|
|
|
}
|
|
|
|
|
mode=mode+1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function lancerpartie() {
|
|
|
|
|
document.getElementById("pageAccueil").style.visibility = "hidden";
|
|
|
|
|
creecarte();
|
|
|
|
|
document.getElementById("pageGame").style.visibility = "visible";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function retour() {
|
|
|
|
|
document.getElementById("pageAccueil").style.visibility = "visible";
|
|
|
|
|
document.getElementById("pageGame").style.visibility = "hidden";
|
|
|
|
|
}
|
|
|
|
|
class Carte {
|
|
|
|
|
|
|
|
|
|
constructor(id) {
|
|
|
|
|
//Attribut de Classe
|
|
|
|
|
this.identifiant = id;
|
|
|
|
|
this.Matrice = creaMatrice();
|
|
|
|
|
|
|
|
|
|
function creecarte() {
|
|
|
|
|
|
|
|
|
|
while (document.getElementById("containcards").firstElementChild != null) {
|
|
|
|
|
document.getElementById("containcards").firstElementChild.remove();
|
|
|
|
|
}
|
|
|
|
|
for (var j = 1; j <= 16; j++) {
|
|
|
|
|
//lien clicable
|
|
|
|
|
var newlink = document.createElement('a');
|
|
|
|
|
newlink.id = j;
|
|
|
|
|
this.link = document.createElement('a');
|
|
|
|
|
this.link.id = this.identifiant;
|
|
|
|
|
//fonction de selection
|
|
|
|
|
newlink.onclick = function selectioncarte() {
|
|
|
|
|
macarte = this.id;
|
|
|
|
|
lacarte = "card" + macarte;
|
|
|
|
|
this.link.onclick = function selectioncarte() {
|
|
|
|
|
var macarte = this.id;
|
|
|
|
|
var lacarte = "card" + macarte;
|
|
|
|
|
if (document.getElementById(lacarte).style.boxShadow != "") {
|
|
|
|
|
var pos = carteselect.indexOf(lacarte);
|
|
|
|
|
var pos = carteselect.indexOf(this.getIdentifiant);
|
|
|
|
|
carteselect.splice(pos, 1);
|
|
|
|
|
document.getElementById(lacarte).style.boxShadow = "";
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
if (carteselect.length < 5) {
|
|
|
|
|
carteselect.push(lacarte);
|
|
|
|
|
carteselect.push(this.getIdentifiant);
|
|
|
|
|
document.getElementById(lacarte).style.boxShadow = "0 0 1vw red, 0 0 1vw red";
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
@ -99,20 +41,15 @@ function creecarte() {
|
|
|
|
|
//div carte
|
|
|
|
|
var divconteneur = document.createElement('div');
|
|
|
|
|
divconteneur.className = "flex-item";
|
|
|
|
|
divconteneur.id = "card" + j;
|
|
|
|
|
|
|
|
|
|
divconteneur.id = "card" + this.identifiant;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//div case
|
|
|
|
|
//ICI A VOIR POUR AJOUTER LES FORMES EN FONCTION DE LA MATRICE
|
|
|
|
|
var uneMatrice = creaMatrice();
|
|
|
|
|
for (var i = 0; i < 12; i++) {
|
|
|
|
|
|
|
|
|
|
var divcase = document.createElement('div');
|
|
|
|
|
divcase.className = "item-form";
|
|
|
|
|
|
|
|
|
|
// Point ou anneau trouvé => création
|
|
|
|
|
if (uneMatrice[i % 3][Math.floor(i / 3)] == 1) {
|
|
|
|
|
if (this.Matrice[i % 3][Math.floor(i / 3)] == 1) {
|
|
|
|
|
|
|
|
|
|
var divContainForm = document.createElement('div');
|
|
|
|
|
divContainForm.className = "containform";
|
|
|
|
@ -136,7 +73,7 @@ function creecarte() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Point ou anneau trouvé => création
|
|
|
|
|
if (uneMatrice[i % 3][Math.floor(i / 3)] == 2) {
|
|
|
|
|
if (this.Matrice[i % 3][Math.floor(i / 3)] == 2) {
|
|
|
|
|
|
|
|
|
|
var divContainForm = document.createElement('div');
|
|
|
|
|
divContainForm.className = "containform";
|
|
|
|
@ -165,8 +102,90 @@ function creecarte() {
|
|
|
|
|
//ajout de l'élément dans la carte
|
|
|
|
|
divconteneur.appendChild(divcase);
|
|
|
|
|
}
|
|
|
|
|
newlink.appendChild(divconteneur);
|
|
|
|
|
document.getElementById("containcards").appendChild(newlink);
|
|
|
|
|
|
|
|
|
|
this.link.appendChild(divconteneur);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
get HTML() {
|
|
|
|
|
return this.link;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
get getIdentifiant() {
|
|
|
|
|
return this.identifiant;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function journuit() {
|
|
|
|
|
//mode jour
|
|
|
|
|
if (mode % 2 == 0) {
|
|
|
|
|
//changer logo swish
|
|
|
|
|
document.getElementById("imglogo").src = "imgs/swishjour.png";
|
|
|
|
|
document.getElementById("imglogo2").src = "imgs/swishjour.png";
|
|
|
|
|
|
|
|
|
|
document.getElementById("fondinput").style.backgroundColor = lightsedonca;
|
|
|
|
|
document.getElementById("contourbuttonvalider").style.backgroundColor = lightsedonca;
|
|
|
|
|
document.getElementById("textjouer").style.color = lightsedonca;
|
|
|
|
|
document.getElementById("textplus").style.color = lightprima;
|
|
|
|
|
//changer montagnesfond
|
|
|
|
|
document.getElementById("mount1").src = "imgs/mount1.png";
|
|
|
|
|
document.getElementById("mount2").src = "imgs/mount2.png";
|
|
|
|
|
//nuages
|
|
|
|
|
document.getElementById("cloud").src = "imgs/lightcloud.png";
|
|
|
|
|
//changer background color
|
|
|
|
|
document.getElementById("containplayers").style.color = lightsedonca;
|
|
|
|
|
//maj couleur principales
|
|
|
|
|
document.documentElement.style.setProperty('--lightprima', lightprima);
|
|
|
|
|
document.documentElement.style.setProperty('--lightsedonca', lightsedonca);
|
|
|
|
|
document.documentElement.style.setProperty('--lighttercia', lighttercia);
|
|
|
|
|
}
|
|
|
|
|
//mode nuit
|
|
|
|
|
else {
|
|
|
|
|
//changer logo swish
|
|
|
|
|
document.getElementById("imglogo").src = "imgs/swishnuit.png";
|
|
|
|
|
document.getElementById("imglogo2").src = "imgs/swishnuit.png";
|
|
|
|
|
//bouttonjouer
|
|
|
|
|
document.getElementById("fondinput").style.backgroundColor = darkseconda;
|
|
|
|
|
document.getElementById("contourbuttonvalider").style.backgroundColor = darkseconda;
|
|
|
|
|
document.getElementById("textjouer").style.color = darkseconda;
|
|
|
|
|
document.getElementById("textplus").style.color = darkprima;
|
|
|
|
|
//changer montagnesfond
|
|
|
|
|
document.getElementById("mount1").src = "imgs/darkmount1.png";
|
|
|
|
|
document.getElementById("mount2").src = "imgs/darkmount2.png";
|
|
|
|
|
//nuages
|
|
|
|
|
document.getElementById("cloud").src = "imgs/darkcloud.png";
|
|
|
|
|
//mode nuit
|
|
|
|
|
//document.getElementById("containplayers").style.color = darkseconda;
|
|
|
|
|
//maj couleur principales
|
|
|
|
|
document.documentElement.style.setProperty('--lightprima', darkprima);
|
|
|
|
|
document.documentElement.style.setProperty('--lightsedonca', darkseconda);
|
|
|
|
|
document.documentElement.style.setProperty('--lighttercia', darktercia);
|
|
|
|
|
}
|
|
|
|
|
mode = mode + 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function lancerpartie() {
|
|
|
|
|
document.getElementById("pageAccueil").style.visibility = "hidden";
|
|
|
|
|
creePartie();
|
|
|
|
|
document.getElementById("pageGame").style.visibility = "visible";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function retour() {
|
|
|
|
|
document.getElementById("pageAccueil").style.visibility = "visible";
|
|
|
|
|
document.getElementById("pageGame").style.visibility = "hidden";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function creePartie() {
|
|
|
|
|
carteselect = [];
|
|
|
|
|
while (document.getElementById("containcards").firstElementChild != null) {
|
|
|
|
|
document.getElementById("containcards").firstElementChild.remove();
|
|
|
|
|
}
|
|
|
|
|
for (var j = 1; j <= 16; j++) {
|
|
|
|
|
|
|
|
|
|
var uneCarte = new Carte(j);
|
|
|
|
|
|
|
|
|
|
deckPartie.push(uneCarte);
|
|
|
|
|
|
|
|
|
|
document.getElementById("containcards").appendChild(uneCarte.HTML);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -232,17 +251,15 @@ function creaMatrice() {
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function ChoisirPseudo(){
|
|
|
|
|
function ChoisirPseudo() {
|
|
|
|
|
let nom = localStorage.getItem('nom');
|
|
|
|
|
if(nom==null){
|
|
|
|
|
nom="SWISH";
|
|
|
|
|
if (nom == null) {
|
|
|
|
|
nom = "SWISH";
|
|
|
|
|
}
|
|
|
|
|
document.getElementById('inputpseudo').setAttribute('value', nom);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
function EnvoyerNouveauNom(){
|
|
|
|
|
function EnvoyerNouveauNom() {
|
|
|
|
|
let pseudo = document.getElementById('inputpseudo').value;
|
|
|
|
|
localStorage.setItem('nom', pseudo);
|
|
|
|
|
document.location.reload(true);
|
|
|
|
@ -288,3 +305,4 @@ function ajouterplayer(event){
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|