diff --git a/site/vue/css/style.css b/site/vue/css/style.css index 2361efc..88e4a67 100644 --- a/site/vue/css/style.css +++ b/site/vue/css/style.css @@ -593,6 +593,60 @@ input[type=color] { z-index: 80; } +#warning_perso_message { + display: none; + color: orange; + cursor: help; + margin-right: 5px; +} + +.fa-info-circle { + display: none; + cursor: help; + color: orange; +} + +.fa-info-circle:hover { + cursor: help; +} + +.tooltip { + position: relative; + display: inline-block; +} + +#warning_message { + display: flex; + align-items: center; + justify-content: center; +} + +.tooltip .tooltiptext { + visibility: hidden; + width: 700px; + background-color: black; + color: #fff; + text-align: center; + border-radius: 6px; + padding: 5px 0; + position: absolute; + z-index: 1; + bottom: 100%; + left: 50%; + margin-left: -350px; + margin-bottom: -15px; + + /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */ + opacity: 0; + transition: 0.2s; +} + +.tooltip:hover .tooltiptext { + margin-bottom: 0px; + visibility: visible; + opacity: 1; +} + @keyframes progressbar-countdown { 0% { width: 0%; diff --git a/site/vue/index.html b/site/vue/index.html index af9c7bb..63fdd92 100644 --- a/site/vue/index.html +++ b/site/vue/index.html @@ -71,6 +71,17 @@


+
+
+ Le générateur génère aléatoirement un chemin ainsi que des portes, toute + les portes sauf la porte NON ont 2 entrées, il y a donc une possibilité pour que l'aléatoire + décide de mettre des portes NON, et donc une seul entrée. Si c'est le cas, il se peut qu'il y + est trop de fork, le générateur peut donc se permettre d'ajouter une porte si besoin. +

Problèmes possible lors de la génération +

+
+ +
Générer le niveau @@ -263,6 +274,64 @@
+ +
diff --git a/site/vue/js/creator.js b/site/vue/js/creator.js index 8abc79c..7079a86 100644 --- a/site/vue/js/creator.js +++ b/site/vue/js/creator.js @@ -36,7 +36,7 @@ function createGame2() { timeEnd = 40; colonneTot = 3; - numberPerColonne = [1,1,3]; + numberPerColonne = [1, 1, 3]; initTimer(); @@ -58,10 +58,11 @@ function createGame2() { initEnd(); } -function tuto(){ +function tuto() { timeEnd = 1000; initTimer(); + setMode("Tuto"); var logiqueCount = 0; @@ -74,7 +75,7 @@ function tuto(){ numberPerColonne[0] = 1; insertLogiqueColonne("logique" + logiqueCount, "et", 0); - + logiques.forEach(function (element) { createLinkAuto(element.name); @@ -90,7 +91,7 @@ function tuto(){ initEnd(); } -function creatorRandomPyramid(){ +function creatorRandomPyramid() { timeEnd = getRandomArbitrary(15, 50); initTimer(); @@ -100,7 +101,7 @@ function creatorRandomPyramid(){ let still = premiereColonne; let nmbColonne = 1; - while(still != 1){ + while (still != 1) { still = still / 2; nmbColonne++; } @@ -136,7 +137,7 @@ function creatorRandomPyramid(){ insertLogiqueColonne("logique" + logiqueCount, type, i); } } - + logiques.forEach(function (element) { createLinkAuto(element.name); }); @@ -187,7 +188,7 @@ function generatorGame() { insertLogiqueColonne("logique" + logiqueCount, type, i); } } - + logiques.forEach(function (element) { createLinkAuto(element.name); }); diff --git a/site/vue/js/func.js b/site/vue/js/func.js index e964480..6bfede5 100644 --- a/site/vue/js/func.js +++ b/site/vue/js/func.js @@ -467,8 +467,6 @@ function invertLine() { distance2 = getSwitchFromLine(logique.id2).y; else distance2 = getLogiqueFromLine(logique.id2).y; if (distance2 < distance1) { - console.log("croisement pour " + logique.name + " " + logique.type); - if (getLogiqueFromLine(logique.id1) === null && getLogiqueFromLine(logique.id2) === null) { let switch1Id = getSwitchFromLine(logique.id1).id; let switch2Id = getSwitchFromLine(logique.id2).id; @@ -808,6 +806,18 @@ function ErrorMessage(message) { document.querySelector("#error_perso").innerHTML = message; } +function WarningMessage(message) { + if (message === "") { + document.querySelector("#warning_perso_message").style.display = "none"; + document.querySelector(".fa-info-circle").style.display = "none"; + } else { + document.querySelector("#warning_perso_message").innerHTML = message; + document.querySelector("#warning_perso_message").style.display = "block"; + document.querySelector(".fa-info-circle").style.display = "block"; + } +} + + function wait(mode, btn) { var time = 300; spin(btn); @@ -892,6 +902,16 @@ function launchTuto() { timer.reset(); resetAllTabs(false); tuto(); + while (checkIfEnd()) { + resetAllTabs(false); + tuto(); + + } + +} + +function setMode(mode) { + document.querySelector("#modeDeJeu").innerHTML = mode; } function launchTest() { diff --git a/site/vue/js/generateGame.js b/site/vue/js/generateGame.js index 653ad31..bda44fd 100644 --- a/site/vue/js/generateGame.js +++ b/site/vue/js/generateGame.js @@ -148,9 +148,10 @@ function calcul(launch) { var count = []; for (let i = 0; i < col.length; i++) count[i] = 0; var error = null; + var warning = null; document.querySelectorAll(".div_gen_col_fork").forEach(function (element) { - element.childNodes[0].innerHTML = "Ajouter un fork pour la colonne " + element.childNodes[1].value + " qui se divise en " + element.childNodes[2].value; + element.childNodes[0].innerHTML = "Ajouter un fork pour la colonne " + element.childNodes[1].value + " qui se divise en " + element.childNodes[2].value + " "; count[(parseInt(element.childNodes[1].value) - 1)] = count[(parseInt(element.childNodes[1].value) - 1)] + parseInt(element.childNodes[2].value); matchs.push([(parseInt(element.childNodes[1].value) + 1), parseInt(element.childNodes[2].value)]); fork.push([parseInt(element.childNodes[1].value), parseInt(element.childNodes[2].value)]); @@ -160,15 +161,40 @@ function calcul(launch) { } else { element.childNodes[1].style.borderColor = "white"; } - if (count[(parseInt(element.childNodes[1].value) - 1)] > col[count[(parseInt(element.childNodes[1].value) - 1)]]) { + if (count[(parseInt(element.childNodes[1].value) - 1)] > col[parseInt(element.childNodes[1].value)] * 2 || count[(parseInt(element.childNodes[1].value) - 1)] > col[parseInt(element.childNodes[1].value) - 1]) { error = "Problème nombre de porte dans la colonne"; element.childNodes[2].style.borderColor = "red"; } else { element.childNodes[2].style.borderColor = "white"; } + //calcul des erreur de sorties/entrees potentiels : + if (count[(parseInt(element.childNodes[1].value) - 1)] > col[parseInt(element.childNodes[1].value)]) + warning = "Problèmes possible lors de la génération "; + if (element.childNodes[1].value === "" || element.childNodes[1].value === null || element.childNodes[1].value === undefined || element.childNodes[2].value === "" || element.childNodes[2].value === null || element.childNodes[2].value === undefined) + error = "Element(s) vide"; }); - if (error !== null) ErrorMessage(error); - if (launch !== undefined && launch !== null && launch === true) { + if (error !== null) { + ErrorMessage(error); + stopspin(document.querySelector("#generate_button_perso")); + document.querySelector("#generate_button_perso").addEventListener('mouseenter', e => { + document.querySelector("#generate_button_perso").style.cursor = 'not-allowed'; + }); + document.querySelector("#generate_button_perso").addEventListener('mouseleave', e => { + document.querySelector("#generate_button_perso").style.cursor = 'default'; + }); + } else { + ErrorMessage(""); + document.querySelector("#generate_button_perso").addEventListener('mouseenter', e => { + document.querySelector("#generate_button_perso").style.cursor = 'pointer'; + }); + document.querySelector("#generate_button_perso").addEventListener('mouseleave', e => { + document.querySelector("#generate_button_perso").style.cursor = 'default'; + }); + } + if (warning) + WarningMessage(warning) + else WarningMessage(""); + if (launch !== undefined && launch !== null && launch === true && error === null) { generate2(col, matchs, fork); } } @@ -197,6 +223,7 @@ function addGenForkInput() { i.className = "fa fa-trash"; i.onclick = function () { this.parentElement.remove(); + calcul(); } div.append(i); document.querySelector("#gen_fork_div").appendChild(div); @@ -204,6 +231,7 @@ function addGenForkInput() { } function tuto(niveau) { + setMode("Tuto"); windowWidth = window.innerWidth; windowHeight = window.innerHeight; var numberColonne1 = 2; @@ -290,7 +318,7 @@ function createGameOne(niveau) { numberColonne2 = 1; timeEnd = 20; break; - //Fin premiere serie + //Fin premiere serie case 5: firstTime.push("inv"); isNotAllowed = true; @@ -443,42 +471,50 @@ function generate2(col, matchs, fork) { compt.push([i, "normal"]); } - //creation et lien + //attribution groupe var listeLogiqueObj = new Array(); let i = 0; + let colTemp = col; compt.forEach(function (element) { - if (element[1] === "normal") { - listeLogiqueObj.push({ + if (colTemp[element[0] - 1] !== 0) { + var newLogiqueObj = { id: "logique" + i, col: element[0], id1: null, id2: null, id3: null, matchId1: null, + matchId2: null, type: null, - }); + } + if (element[1] === "normal") { + newLogiqueObj.matchId1 = null; + } else { + newLogiqueObj.matchId1 = element[1]; + } + listeLogiqueObj.push(newLogiqueObj); + colTemp[element[0] - 1]--; } else { - listeLogiqueObj.push({ - id: "logique" + i, - col: element[0], - id1: null, - id2: null, - id3: null, - matchId1: element[1], - type: null, + var allowed = []; + listeLogiqueObj.forEach(function (logique) { + if (logique.col === element[0] && logique.same !== element[1]) + allowed.push(logique); }); + allowed[getRandomArbitrary(0, allowed.length)].matchId2 = element[1]; } i++; }); + console.log(listeLogiqueObj); //Attribution des types //num = liste de comptatibilité - let num2 = getRandomArbitrary(0, 3); + let num2 = getRandomArbitrary(0, 5); for (x in compt) { if (listeLogiqueObj[x].matchId1 !== null) { if (getElementArray(listeLogiqueObj[x].matchId1, listeSame)[1] === null) { getElementArray(listeLogiqueObj[x].matchId1, listeSame)[1] = num2; - num2 = getRandomArbitrary(0, 3); + num2 = getRandomArbitrary(0, 5); + } else { listeSame[x] = getElementArray(listeLogiqueObj[x].matchId1, listeSame); } @@ -486,15 +522,22 @@ function generate2(col, matchs, fork) { } createStage("play_container"); stage.add(layer); - timeEnd = 1000; + timeEnd = 999; for (let i = 0; i < colonneTot; i++) { liveColonneNumber.push([]); } + var col = []; + listeLogiqueObj.forEach(function (logique) { + if (col[logique.col - 1] === null || col[logique.col - 1] === undefined || col[logique.col - 1] === 0) + col[logique.col - 1] = 1; + else col[logique.col - 1]++; + }); + numberPerColonne = col; initTimer(); //creation logique listeLogiqueObj.forEach(function (logique) { - if (getTypeFromSameMatch(listeSame, logique.matchId1) === null) logique.type = getRandomArbitrary(0, 3); + if (getTypeFromSameMatch(listeSame, logique.matchId1) === null) logique.type = getRandomArbitrary(0, 5); else logique.type = getTypeFromSameMatch(listeSame, logique.matchId1); switch (logique.type) { case 0: @@ -506,12 +549,19 @@ function generate2(col, matchs, fork) { case 2: insertLogiqueColonne(logique.id, "inv", logique.col - 1); break; + case 3: + insertLogiqueColonne(logique.id, "nonou", logique.col - 1); + break; + case 4: + insertLogiqueColonne(logique.id, "etnon", logique.col - 1); + break; } }); + var logiquesGen; //creation de liens entre les portes logiques : for (let col = 1; col < colonneTot; col++) { - //recuperer tout les logiques : + //recuperer tout les logiques : logiquesGen = new Array(); listeLogiqueObj.forEach(function (logique) { if (logique.col === col && logique.id3 === null) logiquesGen.push(logique); diff --git a/site/vue/js/init.js b/site/vue/js/init.js index 3fb7835..18d0415 100644 --- a/site/vue/js/init.js +++ b/site/vue/js/init.js @@ -34,6 +34,11 @@ function compareLogiqueForEnd(a, b) { return -1; if (a.y < b.y) return 1; + if (a.y == b.y) { + if (a.x > b.x) + return -1; + else return 1; + } return 0; } diff --git a/site/vue/js/main.js b/site/vue/js/main.js index d81c5ba..d7ebdcc 100644 --- a/site/vue/js/main.js +++ b/site/vue/js/main.js @@ -60,6 +60,7 @@ function resetAllTabs(save) { if (!save) { circles = []; logiques = []; + click = 0; numberPerColonne = []; liveColonneNumber = [];