pascal.lafourcade
/
makeittrue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mode de jeux et fix de quelques bugs

Browse Source
master
pisouvigne 5 years ago
parent 66607aa1ad
commit 8fda008546
9 changed files with 315 additions and 126 deletions
Show Stats Download Patch File Download Diff File

8
site/vue/css/style.css
Unescape View File

@ -92,6 +92,10 @@ html {
margin-left: 25px;
}
.fa-check {
margin-left: 25px;
}
#pseudo_show {
color: var(--cool-color);
}
@ -692,4 +696,8 @@ input[type=color] {
.fa-edit:hover {
color: var(--cool-color);
}
#win_pannel {
display: none;
}

38
site/vue/index.html
Unescape View File

@ -27,6 +27,10 @@
<a>Tutoriel</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
</div>
<div class="border background dys listenerHover" onclick="wait('vanilla', this)">
<a>Vanilla</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
</div>
<div class="border background dys listenerHover" onclick="wait('normal', this)">
<a>Normal</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
@ -35,17 +39,13 @@
<a>Mode Perso</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
</div>
<div class="border background dys listenerHover">
<a>Caméléon</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
</div>
</div>
</div>
<!--Test Generateur-->
<div id="TestNouveauGenerateur" class="background">
<div id="header_selection" align=center>
<i class="fa fa-arrow-left home" onclick="closePerso(this);" aria-hidden="true"></i>
<h1 class="dys" id="title_perso_setup">Generateur</h1>
<h1 class="dys" id="title_perso_setup">Générateur</h1>
<label></label>
</div>
<hr id="hr">
@ -111,7 +111,7 @@
</div>
<!--Play Page-->
<div id="playPage">
<div id="success" class="modal">
<!--<div id="success" class="modal">
<div class="modal-content info-content">
<div class="modal-body border background success_modal_body" align=center>
<span class="close" onclick="closeModal('success');nextLevel();">&times;</span>
@ -138,7 +138,7 @@
id="success_check_input" onclick="successCheck();" checked></p>
</div>
</div>
</div>
</div>-->
<div id="firstTimeet" class="modal">
<div class="modal-content info-content">
<div class="modal-body border background" align=center>
@ -350,6 +350,26 @@
<div id="progress_bar" class="progress_bar border backgroundInv"></div>
</div>
<br>
<div id="win_pannel" class="border background" align=center>
<h1 class="txt dys" id="successTitle"></h1>
<hr id="hr">
<p class="dys"><a class="txt" id="successInfo"></a><a id="click_number"></a><a> click(s)</a>
</p>
<div id="choice_button_div">
<div class="border background dys listenerHover choice retry_tuto" id="retry_tuto_button"
onclick="closeModal('success');retry();"">
<a>Refaire le niveau</a>
<i class=" fa fa-retweet" id="margin-left-10" aria-hidden="true"></i>
</div>
<div class="border background dys listenerHover choice" id="next_level_button"
onclick="closeModal('success');nextLevel();">
<a id="niveauSuivantText">Niveau suivant</a>
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
</div>
</div>
</div>
<br>
<div id="play_container" class="border">
</div>
@ -495,10 +515,6 @@
id="TempsTotGameOver">40</a> s</p>
<p><a class="dys">Niveau max : </a><a class="dys" id="niveauGameOver"></a></p>
<hr id="hr">
<p class="dys">Entrez votre pseudo : <input type="text" class="border background color"><button
class="border background">Valider</button></p>
<br>
<hr id="hr">
<br>
<p><i class="fa fa-star" id="star1" aria-hidden="true"></i>
<i class="fa fa-star" id="star2" aria-hidden="true"></i>

1
site/vue/js/const.js
Unescape View File

@ -23,6 +23,7 @@ const tension = 0;
//objectif
var colorEnd = "#fe8a71";
var endHeight = 200;
//switch
const SwitchHeight = 25;

41
site/vue/js/createElement.js
Unescape View File

@ -3,14 +3,19 @@ function createEnd() {
//find X and Y
var X = stage.width() - stage.width() / 100 * 5;
var Y = stage.height() / 2.5 - 5;
if (endHeight === 50) {
var Y = stage.height() / 2 - endHeight;
} else {
var Y = stage.height() / 2 - endHeight;
}
var endShape = new Konva.Rect({
x: X - 25,
y: Y - 25,
fill: colorEnd,
width: 50,
height: 50,
height: endHeight,
stroke: 'black',
strokeWidth: 4,
id: "end",
@ -27,23 +32,18 @@ function createEnd() {
layer.add(endShape);
}
function createCircle(x, y, name) {
name.forEach(function (idLine) {
var circle = new Konva.Circle({
id: "circle" + idLine,
x: x,
y: y,
radius: 10,
fill: 'black',
stroke: 'black',
strokeWidth: 4,
});
circles.push("circle" + idLine);
layer.add(circle);
function createCircle(x, y, logiqueName) {
var circle = new Konva.Circle({
id: "circle" + circles.length,
x: x,
y: y,
radius: 10,
fill: 'black',
stroke: 'black',
strokeWidth: 4,
});
circles.push("circle" + idLine);
layer.add(circle);
}
function createSwitch(id, x, y) {
@ -282,9 +282,8 @@ function createLink(entre, sortie, infoId) {
break;
default:
endLines.push(lineId);
if (end.position === 1) createLine([entre.x + imageWidth, entre.y + imageHeight / 2, sortie.x, (end.y + (50 / (end.position + 1) * (end.let - end.position)))], "line" + lineId, true);
else createLine([entre.x + imageWidth, entre.y + imageHeight / 2, sortie.x, (end.y + (50 / (end.position + 1) * (end.let + 1 - end.position)))], "line" + lineId, true);
if (end.position === 1) createLine([entre.x + imageWidth, entre.y + imageHeight / 2, sortie.x, (stage.findOne("#end").getY() + endHeight / 2)], "line" + lineId, true);
else createLine([entre.x + imageWidth, entre.y + imageHeight / 2, sortie.x, (stage.findOne("#end").getY() + endHeight / (end.position + 1) * end.let)], "line" + lineId, true);
setLine(entre, "id3", "line" + lineId);
end.let--;

32
site/vue/js/creator.js
Unescape View File

@ -58,38 +58,7 @@ function createGame2() {
initEnd();
}
function tuto() {
timeEnd = 1000;
initTimer();
setMode("Tuto");
var logiqueCount = 0;
colonneTot = 1;
for (let i = 0; i < colonneTot; i++) {
liveColonneNumber.push([]);
}
numberPerColonne[0] = 1;
insertLogiqueColonne("logique" + logiqueCount, "et", 0);
logiques.forEach(function (element) {
createLinkAuto(element.name);
});
calculNombreSwitch();
switchCreator(numberOfSwitch);
createAllLinkSwitch();
initAllSwitch();
createEnd();
initEnd();
}
function creatorRandomPyramid() {
timeEnd = getRandomArbitrary(15, 50);
@ -153,7 +122,6 @@ function creatorRandomPyramid() {
}
function generatorGame() {
timeEnd = getRandomArbitrary(15, 50);
initTimer();

152
site/vue/js/func.js
Unescape View File

@ -224,6 +224,21 @@ function changeLineColorInput(idLine, color) {
line.stroke(color);
}
function changeCircleBlack(logiqueId) {
circles.forEach(function (cir) {
if (cir[1] === logiqueId) {
stage.findOne("#" + cir[0]).fill(colorLineInnactive);
}
});
}
function changeCircleYellow(logiqueId) {
circles.forEach(function (cir) {
if (cir[1] === logiqueId) {
stage.findOne("#" + cir[0]).fill(colorLineActive);
}
});
}
function changeLineColorBlack(idLine) {
setLineStateFalse(idLine);
let line = stage.findOne("#" + idLine);
@ -384,10 +399,12 @@ function checkSortieLogique(logiqueId) {
if (line1State == true && line2State == true) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else {
element.id3.forEach(function (line) {
changeLineColorBlack(line);
changeCircleBlack(logique.name);
});
}
break;
@ -395,10 +412,12 @@ function checkSortieLogique(logiqueId) {
if (line1State == false) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else {
element.id3.forEach(function (line) {
changeLineColorBlack(line);
changeCircleBlack(logique.name);
});
}
break;
@ -406,10 +425,12 @@ function checkSortieLogique(logiqueId) {
if (line1State == true || line2State == true) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else {
element.id3.forEach(function (line) {
changeLineColorBlack(line);
changeCircleBlack(logique.name);
});
}
break;
@ -417,10 +438,12 @@ function checkSortieLogique(logiqueId) {
if (line1State == true || line2State == true) {
element.id3.forEach(function (line) {
changeLineColorBlack(line);
changeCircleBlack(logique.name);
});
} else {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
}
break;
@ -428,18 +451,22 @@ function checkSortieLogique(logiqueId) {
if (line1State == false && line2State == false) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else if (line1State == false && line2State == true) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else if (line1State == true && line2State == false) {
element.id3.forEach(function (line) {
changeLineColorYellow(line);
changeCircleYellow(logique.name);
});
} else {
element.id3.forEach(function (line) {
changeLineColorBlack(line);
changeCircleBlack(logique.name);
});
}
break;
@ -605,6 +632,7 @@ function checkEnd(mode) {
}
function success(mode) {
console.log(mode)
timeTot = timeTot + timer.getTimeValues().seconds;
timer.stop();
stage.findOne("#end").fill(colorSwitchActiveBackground);
@ -612,20 +640,21 @@ function success(mode) {
if (mode != undefined && mode != null && mode === "tuto") {
document.querySelector(".retry_tuto").style.display = "flex";
document.querySelector("#retry_tuto_button").onclick = function () {
closeModal('success');
//closeModal('success');
launchTuto();
}
} else {
document.querySelector(".retry_tuto").style.display = "none";
}
if (successPanel) {
openModal("success");
document.querySelector("#win_pannel").style.display = "block";
//openModal("success");
document.querySelector("#click_number").innerHTML = click;
document.querySelector("#next_level_button").onclick = function () {
closeModal('success');
//closeModal('success');
nextLevel(mode);
}
var previewStage = new Konva.Stage({
/*var previewStage = new Konva.Stage({
container: 'show_stage',
width: window.innerWidth / 1.5,
height: window.innerHeight / 2.5,
@ -636,7 +665,7 @@ function success(mode) {
hitGraphEnabled: false
});
previewStage.add(previewLayer);
previewLayer.batchDraw();
previewLayer.batchDraw();*/
} else {
setTimeout(() => {
nextLevel(mode);
@ -654,7 +683,7 @@ function nextLevel(mode) {
if (mode != undefined && mode != null && mode === "tuto") {
launchTuto();
} else {
generate2(tempCol, tempMatchs, tempFork, tempPortes);
launchGameOne(mode);
}
}
@ -785,9 +814,16 @@ function playNormal() {
showDiv(document.querySelector("#playPage"));
niveauActuel = 1;
timeTot = 0;
launchGameOne();
launchGameOne("normal");
}
function playVanilla() {
hideDiv(document.querySelector("#levelSelectionPage"));
showDiv(document.querySelector("#playPage"));
niveauActuel = 1;
timeTot = 0;
launchGameOne("vanilla");
}
function modeTuto() {
hideDiv(document.querySelector("#levelSelectionPage"));
showDiv(document.querySelector("#playPage"));
@ -828,6 +864,10 @@ function wait(mode, btn) {
setTimeout(playNormal, time);
setMode("Normal");
break;
case "vanilla":
setTimeout(playVanilla, time);
setMode("Vanilla")
break;
case "perso":
setTimeout(modePerso, time);
setMode("Perso")
@ -894,15 +934,104 @@ function show_more_perso(div) {
}
}
function launchGameOne() {
function launchGameOne(mode) {
document.querySelector(".niveau").innerHTML = niveauActuel;
document.querySelector("#win_pannel").style.display = "none";
timer.stop();
timer.reset();
resetAllTabs(false);
gameOne();
var col = [];
var matchs = [];
var porteLogique = [];
var time = 20;
switch (niveauActuel) {
case 1:
col = [2, 1];
porteLogique = [[true, "et"], [true, "ou"]];
break;
case 2:
col = [2, 2];
porteLogique = [[true, "et"], [true, "ou"]];
break;
case 3:
col = [3, 2];
matchs = [[1, 2]];
porteLogique = [[true, "et"], [true, "ou"]];
break;
case 4:
col = [3, 2];
porteLogique = [[true, "et"], [true, "inv"]];
break;
case 5:
col = [3, 3];
matchs = [[1, 2]];
porteLogique = [[true, "et"], [true, "inv"]];
break;
case 7:
case 6:
col = [4, 3];
matchs = [[1, 2]];
porteLogique = [[true, "et"], [true, "inv"], [true, "ou"]];
break;
case 8:
case 9:
case 10:
case 11:
col = [5, 4, 3];
matchs = [[1, 3], [2, 2]];
porteLogique = [[true, "et"], [true, "ou"], [true, "inv"]];
break;
case 12:
case 13:
case 14:
case 15:
case 16:
col = [5, 4, 4];
matchs = [[1, 3], [2, 2]];
porteLogique = [[true, "et"], [true, "nonou"], [true, "ou"], [true, "inv"]];
break;
default:
col = [4, 3, 2];
matchs = [[1, 2], [2, 2]];
porteLogique = [[true, "et"], [true, "ou"]];
break;
}
for (let i = 0; i < 200; i++) {
tentative = i;
if (generator(matchs, col, porteLogique, mode, time) === false)
break;
}
if (mode === "normal") {
switchsInfoCopy.forEach(function (sw) {
if (getRandomArbitrary(0, 3) === 1) {
activeSwitch(sw.id);
checkAllSortieLogique();
}
});
}
while (checkIfEnd()) {
for (let i = 0; i < 200; i++) {
tentative = i;
if (generator(matchs, col, porteLogique, mode, time) === false)
break;
}
if (mode === "normal") {
switchsInfoCopy.forEach(function (sw) {
switchsInfoCopy.forEach(function (sw) {
if (getRandomArbitrary(0, 3) === 1) {
activeSwitch(sw.id);
checkAllSortieLogique();
}
});
});
}
}
}
function launchTuto() {
document.querySelector("#win_pannel").style.display = "none";
document.querySelector(".niveau").innerHTML = niveauActuel;
timer.stop();
timer.reset();
@ -912,10 +1041,11 @@ function launchTuto() {
while (checkIfEnd()) {
resetAllTabs(false);
tuto();
break;
}
} else {
document.querySelector("#niveauSuivantText").innerHTML = "Niveau Suivant";
document.querySelector(".niveauSuivantIcon").className = "fa fa fa-arrow-right niveauSuivantIcon";
hideDiv(document.querySelector("#playPage"));
showDiv(document.querySelector("#mainPage"));
}

158
site/vue/js/generateGame.js
Unescape View File

@ -121,6 +121,10 @@ function calcul(launch) {
var col = new Array();
let i = 0;
let reste = 0;
//Calcul
if (number === 1) {
col = [1];
}
while (number > 1) {
number = number / 2;
if (!Number.isInteger(number) && number > 1) reste = 1;
@ -155,7 +159,7 @@ function calcul(launch) {
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)]);
if (parseInt(element.childNodes[1].value) < 1 || parseInt(element.childNodes[1].value) > col.length) {
if (parseInt(element.childNodes[1].value) < 1 || parseInt(element.childNodes[1].value) > col.length - 1) {
error = "Problème sur le numéro de colonne";
element.childNodes[1].style.borderColor = "red";
} else {
@ -242,17 +246,10 @@ function addGenForkInput() {
}
function tuto(niveau) {
setMode("Tuto");
finish = false;
isTutoriel = true;
windowWidth = window.innerWidth;
windowHeight = window.innerHeight;
var numberColonne1 = 2;
var numberColonne2 = 1;
var isEtNonAllowed = false;
var isOuNonAllowed = false;
var isNotAllowed = false;
var isOuAllowed = false;
var finish = false;
var firstTime = [];
switch (niveauActuel) {
case 1:
@ -268,6 +265,8 @@ function tuto(niveau) {
firstTime.push("etnon");
break;
case 5:
document.querySelector("#niveauSuivantText").innerHTML = "Terminer le tutoriel";
document.querySelector("#next_level_button").children[1].className = "fa fa fa-check niveauSuivantIcon";
firstTime.push("nonou");
break;
default:
@ -275,31 +274,24 @@ function tuto(niveau) {
break;
}
if (!finish) {
isTuto = false;
createStage("play_container");
stage.add(layer);
colonneTot = 3;
numberPerColonne = [numberColonne1, numberColonne2, 2];
var logiqueCount = 0;
if (firstTime.length > 0) {
numberColonne1 = 1;
numberColonne2 = 0;
numberPerColonne = [numberColonne1, numberColonne2];
liveColonneNumber.push([]);
timeEnd = 99;
insertLogiqueColonne("logique" + logiqueCount, firstTime[0], 0);
if (allowedInfoPorte) {
openModal('firstTime' + firstTime[0]);
timer.pause();
}
generator([], [1], [[true, firstTime[0]]], "tuto");
while (checkIfEnd()) {
switchsInfoCopy.forEach(function (element) {
if (getRandomArbitrary(0, 2) === 1)
activeSwitch(element.id);
checkAllSortieLogique();
});
}
}
logiques.forEach(function (element) {
createLinkAuto(element.name);
});
initEndGame("tuto");
}
} else {
}
}
@ -452,10 +444,9 @@ function createGameOne(niveau) {
}
function generator(matchs, col, listePorteLogique) {
console.log(col)
function generator(matchs, col, listePorteLogique, mode, time) {
var regen = false;
endHeight = 100;
isTutoriel = false;
isTuto = false;
hideDiv(document.querySelector('#TestNouveauGenerateur'));
@ -463,7 +454,9 @@ function generator(matchs, col, listePorteLogique) {
resetAllTabs(false);
createStage("play_container");
stage.add(layer);
timeEnd = 999;
if (time === undefined || time === null || time === -1)
timeEnd = 999;
else timeEnd = time;
var groupes = [];
var colCopy = [];
@ -514,6 +507,8 @@ function generator(matchs, col, listePorteLogique) {
//Selection de la sortie au hasard dans la colonne i
var index = getRandomArbitrary(0, logiqueCol.length);
var logiqueUse = logiqueCol[index];
//Création du rond du fork
circles.push(["circle" + circles.length, logiqueUse.id]);
logiqueCol.splice(index, 1);
//Selection du groupes
groupes.forEach(function (group, index) {
@ -605,6 +600,28 @@ function generator(matchs, col, listePorteLogique) {
}
});
//calcul de id3 :
logiquesTemp.forEach(function (logique) {
if (logique.col === i) {
if (i === col.length) {
logique.id3 = 1;
} else {
//Attribution du signal id3
var isNull = null;
//console.log("Colonne : " + i + " ---------------------")
links.forEach(function (link) {
if (isNull === null) {
if (link[0] === logique.id) {
logique.id3 = link[3];
isNull = 1;
}
}
});
if (isNull === null) logique.id3 = 1;
}
}
});
//Calcul du signal souhaité à chaque porte de la colonne i
var logiqueTemp2 = [];
for (let k = 0; k < logiquesTemp.length; k++) logiqueTemp2[k] = logiquesTemp[k];
@ -615,7 +632,6 @@ function generator(matchs, col, listePorteLogique) {
//Attribution du signal :
//Si dernière colonne
if (i === col.length) {
logique.id3 = 1;
//Opération pour les entrée :
switch (logique.type) {
case "et":
@ -663,18 +679,6 @@ function generator(matchs, col, listePorteLogique) {
break;
}
} else {
//Attribution du signal id3
var isNull = null;
//console.log("Colonne : " + i + " ---------------------")
links.forEach(function (link) {
if (isNull === null) {
if (link[0] === logique.id) {
logique.id3 = link[3];
isNull = 1;
}
}
});
if (isNull === null) logique.id3 = 1;
//Calcul valeur d'entrée
if (logique.id3 === 1) {
switch (logique.type) {
@ -773,6 +777,8 @@ function generator(matchs, col, listePorteLogique) {
}
}
});
//Check si y a assez de portes :
var usedLogique = [];
matchs.forEach(function (element) {
if (element[0] === i - 1) {
@ -988,8 +994,68 @@ function generator(matchs, col, listePorteLogique) {
if (link[1] !== "end")
createLink(findLogique(link[0]), findLogique(link[1]), link[2]);
});
initEndGame();
//createLink(findLogique("logique5"), findLogique("logique1"))
//On place les rond si fork :
//On check la valeur entre 2 colonne :
var d1 = 0, tot = 0;
logiques.forEach(function (logique) {
if (d1 === 0) d1 = logique.x;
else if (d1 !== logique.x && tot === 0) {
tot = logique.x - d1;
}
});
circles.forEach(function (cir) {
logiques.forEach(function (logique) {
if (logique.name === cir[1]) {
var circle = new Konva.Circle({
id: cir[0],
x: logique.x + imageWidth + (tot / 100 * pourcentageBreak),
y: logique.y + imageHeight / 2,
radius: 10,
fill: 'black',
stroke: 'black',
strokeWidth: 4,
});
layer.add(circle);
}
})
});
//On init la fin
initEndGame(mode);
//On change les lignes de places :
logiques.forEach(function (logique) {
if (logique.type !== "inv") {
var distance1;
var distance2;
if (getLogiqueFromLine(logique.id1) === null)
distance1 = getSwitchFromLine(logique.id1).y;
else distance1 = getLogiqueFromLine(logique.id1).y;
if (getLogiqueFromLine(logique.id2) === null)
distance2 = getSwitchFromLine(logique.id2).y;
else distance2 = getLogiqueFromLine(logique.id2).y;
if (distance2 < distance1) {
if (getLogiqueFromLine(logique.id1) === null && getLogiqueFromLine(logique.id2) === null) {
let switch1Id = getSwitchFromLine(logique.id1).id;
let switch2Id = getSwitchFromLine(logique.id2).id;
removeLine(logique.id1);
removeLine(logique.id2);
logique.id1 = null;
logique.id2 = null;
createLink(stage.findOne("#" + switch1Id), logique);
createLink(stage.findOne("#" + switch2Id), logique);
}
}
}
});
}
return regen;

10
site/vue/js/init.js
Unescape View File

@ -16,11 +16,11 @@ function initAllSwitch(mode) {
document.body.style.cursor = "default";
});
//faire le random de l'inversion de switch
//if (getRandomArbitrary(0, 3) == 1) {
//activeSwitch(switche.id());
//if (checkIfEnd())
//activeSwitch(switche.id());
//}
if (isTutoriel && getRandomArbitrary(0, 3) == 1) {
activeSwitch(switche.id());
if (checkIfEnd())
activeSwitch(switche.id());
}
});
}

1
site/vue/js/main.js
Unescape View File

@ -33,6 +33,7 @@ var layer = new Konva.Layer();
tutoCreateLayer();
function tutoCreateLayer() {
endHeight = 50;
isTuto = true;
width = window.innerWidth - window.innerWidth / 100 * 30;
height = window.innerHeight / 2.5;

Write Preview
Loading…
Cancel
Save