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

Correction de la surbrillance

Browse Source
upgrade-menu
adplantade 5 years ago
parent 417f39005d
commit 1c806ffa0c
3 changed files with 74 additions and 46 deletions
Show Stats Download Patch File Download Diff File

18
code/button_displayer.js
Unescape View File

@ -15,6 +15,17 @@ modes.forEach(element => {
tab.item(i).width=size;
tab.item(i).addEventListener("mousedown",function(e)
{
var tab=document.getElementById("modeSelection").children;
for(var cpt=1;cpt<tab.length;cpt++)
{
var tabChilds=document.getElementById(tab.item(cpt).id).children;
for(var cptChild=0;cptChild<tabChilds.length;cptChild++)
{
tabChilds.item(cptChild).classList.remove("selected");
}
}
document.getElementById(e.currentTarget.id).classList.add("selected");
modeSelected= e.currentTarget.id;
if(modeSelected!=null && diffSelected!=null)
{
@ -30,7 +41,12 @@ diffs.forEach(element => {
eval("btn_"+element).addEventListener("mousedown",function(e)
{
diffSelected= e.currentTarget.id;
var tab=document.getElementById("diff").children;
for(var cpt=0;cpt<tab.length;cpt++)
{
tab.item(cpt).classList.remove("selected");
}
document.getElementById(e.currentTarget.id).classList.add("selected");
if(modeSelected!=null && diffSelected!=null)
{
document.getElementById("btn_play").disabled = false;

10
code/index.css
Unescape View File

@ -7,4 +7,14 @@
margin: 5px;
}
.button {
padding: 2px;
}
.selected {
-webkit-box-shadow:inset 0px 0px 0px 5px black;
-moz-box-shadow:inset 0px 0px 0px 5px black;
box-shadow:inset 0px 0px 0px 5px black;
}

92
code/index.html
Unescape View File

@ -1,47 +1,49 @@
<html>
<head>
<title>On The Dot</title>
<link rel="stylesheet" type="text/css" href="index.css"/>
</head>
<body>
Jouer la partie en : </br>
<ul id="modes" class="all-container">
<img id="btn_points" src="./ress/button_mode_points.png"/>
<img id="btn_temps" src="./ress/button_mode_temps.png"/>
<img id="btn_survie" src="./ress/button_mode_survie.png"/>
</ul>
<ul id="points" class="all-container">
<img id="5p" src="./ress/button_points_5.png"/>
<img id="10p" src="./ress/button_points_10.png"/>
<img id="15p" src="./ress/button_points_15.png"/>
<img id="20p" src="./ress/button_points_20.png"/>
</ul>
<ul id="temps" class="all-container">
<img id="5m" src="./ress/button_temps_5.png"/>
<img id="10m" src="./ress/button_temps_10.png"/>
</ul>
<ul id="survie" class="all-container">
<img id="surv" src="./ress/button_mode_survie.png"/>
</ul>
<ul id="diff" class="all-container">
<img id="btn_easy" src="./ress/button_diff_easy.png"/>
<img id="btn_med" src="./ress/button_diff_normal.png"/>
<img id="btn_hard" src="./ress/button_diff_hard.png"/>
</ul>
Entrez votre pseudo (optionnel, mais n&eacute;cessaire si vous voulez sauvegarder votre score):
<input type="text" id="field_pseudo" />
<button id="btn_play" onClick="play()" disabled>Jouer ?</button>
<script src="button_displayer.js"></script>
<div>
Partie en points : la partie finit quand vous obtenez le nombre de points choisi. Mettez le moins de temps possible ! </br>
Partie en temps : la partie finit quand le temps imparti est &eacute;coul&eacute;. Obtenez le plus de points possible ! </br>
Partie en survie : la partie finit quand le temps atteint 0. Gagner un point vous rajoute 30s, obtenez le plus de points possible ! </br>
</div>
</body>
<head>
<title>On The Dot</title>
<link rel="stylesheet" type="text/css" href="index.css"/>
</head>
<body>
Jouer la partie en : </br>
<div id="modeSelection">
<ul id="modes" class="all-container">
<img id="btn_points" class="button" src="./ress/button_mode_points.png"/>
<img id="btn_temps" class="button" src="./ress/button_mode_temps.png"/>
<img id="btn_survie" class="button" src="./ress/button_mode_survie.png"/>
</ul>
<ul id="points" class="all-container">
<img id="5p" class="button" src="./ress/button_points_5.png"/>
<img id="10p" class="button" src="./ress/button_points_10.png"/>
<img id="15p" class="button" src="./ress/button_points_15.png"/>
<img id="20p" class="button" src="./ress/button_points_20.png"/>
</ul>
<ul id="temps" class="all-container">
<img id="5m" class="button" src="./ress/button_temps_5.png"/>
<img id="10m" class="button" src="./ress/button_temps_10.png"/>
</ul>
<ul id="survie" class="all-container">
<img id="surv" class="button" src="./ress/button_mode_survie.png"/>
</ul>
</div>
<ul id="diff" class="all-container">
<img id="btn_easy" class="button" src="./ress/button_diff_easy.png"/>
<img id="btn_med" class="button" src="./ress/button_diff_normal.png"/>
<img id="btn_hard" class="button" src="./ress/button_diff_hard.png"/>
</ul>
Entrez votre pseudo (optionnel, mais n&eacute;cessaire si vous voulez sauvegarder votre score):
<input type="text" id="field_pseudo" />
<button id="btn_play" onClick="play()" disabled>Jouer ?</button>
<script src="button_displayer.js"></script>
<div>
Partie en points : la partie finit quand vous obtenez le nombre de points choisi. Mettez le moins de temps possible ! </br>
Partie en temps : la partie finit quand le temps imparti est &eacute;coul&eacute;. Obtenez le plus de points possible ! </br>
Partie en survie : la partie finit quand le temps atteint 0. Gagner un point vous rajoute 30s, obtenez le plus de points possible ! </br>
</div>
</body>
</html>

Write Preview
Loading…
Cancel
Save