correction erreur input si pas de pseudo sur aide_ami et attente avant de pouvoir faire défiler
This commit is contained in:
parent
196add2314
commit
118152bfc9
6 changed files with 30 additions and 18 deletions
|
@ -111,28 +111,23 @@ body {
|
|||
#text p {
|
||||
margin: 0.1vh 0 0.1vh 0;
|
||||
}
|
||||
|
||||
#inputBox {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#friendInput{
|
||||
font-family:'Special Elite',cursive;
|
||||
font-size:1.5vw;
|
||||
border-radius:1vw;
|
||||
height:2.5vh;
|
||||
width: 15vw;
|
||||
padding:0.5vw 0.7vw 0.3vw 0.7vw;
|
||||
}
|
||||
|
||||
#friendInput:focus{
|
||||
outline:none;
|
||||
font-family:'Special Elite',cursive;
|
||||
font-size:1.5vw;
|
||||
border-radius:1vw;
|
||||
padding:0.5vw 0.7vw 0.3vw 0.7vw;
|
||||
}
|
||||
#friendInput:focus{
|
||||
outline:none;
|
||||
font-family:'Special Elite',cursive;
|
||||
font-size:1.5vw;
|
||||
border-radius:1vw;
|
||||
padding:0.5vw 0.7vw 0.3vw 0.7vw;
|
||||
}
|
||||
|
||||
#arrowBlock{
|
||||
display:flex;
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>INSAïde</title>
|
||||
<link rel="shortcut icon" href="../Images/Logo.png" type="image/png">
|
||||
<link rel="stylesheet" href="../CSS/aide_ami.css">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
|
||||
|
@ -24,7 +25,7 @@
|
|||
<p id="firstText">La photo est.. correcte. Au moins vous n'avez pas oublié de retirer le flash !</p>
|
||||
<p class="textWillAppear">Vous avez passé une nuit mouvementée par des questionnements incessants</p>
|
||||
<p class="textWillAppear">En même temps, c'est compréhensible vu ce que vous venez de vivre. <span>On dirait que l'aventure n'est pas finie pour autant...</span></p>
|
||||
<p class="textWillAppear">Le lendemain, vous vous hâtez vers votre plus fidèle ami <span id="inputBox"><input id="friendInput" type="text"/><span></span></span> pour tout lui expliquer.</p>
|
||||
<p class="textWillAppear">Le lendemain, vous vous hâtez vers votre plus fidèle ami <span id="inputBox"><input id="friendInput" type="text" placeholder=""/><span id="errorMsg"></span></span> pour tout lui expliquer.</p>
|
||||
<div id="arrowBlock">
|
||||
<p id="space">Press enter</p>
|
||||
<img id="arrow" src="../Images/Lecture.png" alt="Texte suivant"/>
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>INSAïde</title>
|
||||
<link rel="shortcut icon" href="../Images/Logo.png" type="image/png">
|
||||
<link rel="stylesheet" href="../CSS/couloir.css">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>INSAïde</title>
|
||||
<link rel="shortcut icon" href="../Images/Logo.png" type="image/png">
|
||||
<link rel="stylesheet" href="../CSS/couloir_ami.css">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
|
||||
|
|
|
@ -55,12 +55,24 @@ function handleButtonClicked(event) {
|
|||
button.click();
|
||||
} else {
|
||||
button.removeAttribute('href');
|
||||
errorMsg.innerHTML = "Entrez un pseudo !";
|
||||
errorMsg.style.cssText = "color: #BF0909; font-size: 2vh";
|
||||
button.removeEventListener("click", handleButtonClicked);
|
||||
let repeater = setInterval(() => {
|
||||
friendInput.setAttribute("placeholder", "");
|
||||
setTimeout(() => {
|
||||
friendInput.setAttribute("placeholder", "Et votre ami ?");
|
||||
}, 100);
|
||||
}, 200);
|
||||
setTimeout(() => {
|
||||
clearInterval(repeater);
|
||||
button.addEventListener("click", handleButtonClicked);
|
||||
}, 1000);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//------------------ Gestion events ------------------//
|
||||
document.addEventListener("keypress", makeNextTextAppear);
|
||||
setTimeout(() => {
|
||||
document.addEventListener("keypress", makeNextTextAppear);
|
||||
}, 2000);
|
||||
friendInput.addEventListener("input", handleInputChange);
|
||||
button.addEventListener("click", handleButtonClicked);
|
|
@ -42,5 +42,7 @@ function handleDisplayEye(){
|
|||
|
||||
//listeners
|
||||
boisson.addEventListener("change",handleSelectChange)
|
||||
document.addEventListener("keypress",handleDisplayText)
|
||||
setInterval(() => {
|
||||
document.addEventListener("keypress",handleDisplayText)
|
||||
}, 1000);
|
||||
safeButton.addEventListener("click",handleDisplayEye)
|
Loading…
Reference in a new issue