Trier variables numériques entrées par utilisateur
Bonsoir,
Dans le cadre de l'élaboration d'un solveur de combat pour un JDR en ligne, je suis amené à m'occuper d'un onglet gérant l'initiative des joueurs, en gros qui agit avant qui.
Ainsi, le maitre de jeu est amené à introduire dans un input la valeur numérique de l'initiative du joueur ainsi que dans un autre input celle de son adversaire.
Je désirerai faire en sorte que dans un <span> s'affiche les deux valeurs triées par ordre croissant.
Voici le code:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
| <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>jQuery UI Example Page</title>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="stylesheet" />
<link type="text/css" href="css/design.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.11.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// ---------------------------------------------------------------
//gestion du formulaire pour l'initiative
$("#ini-but").click(function() {
// vide les champs générés par le JavaScript pour permettre de relancer le formulaire
$(" #ini-pj, #ini-adv, #ini-result-pj, #ini-result-adv, #triINI").empty();
// mise en Array des valeurs du formulaire
var Valeurs = new Array();
Valeurs ["ini-pj"] = parseInt($("#ini-pj").attr("value"));
Valeurs ["ini-adv"] = parseInt($("#ini-adv").attr("value"));
var resultatpj= "";
var resultatadv= "";
var triINI= "";
// vérifie si les champs sont corrects, et renvoit un message d'erreur en fonction
// /!\ faire le passage du nom de champs brut à un intitulé plus propre !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
var verif_champs = "";
for(val in Valeurs) {
if(isNaN(Valeurs[val]))
verif_champs += "le champs " + val + " n'est pas rempli ou n'est pas un nombre \n";
if( Valeurs[val]>20 || Valeurs[val]<0)
verif_champs += "le champs " + val + " doit être compris entre 0 et 20 \n";
}
//si souci avec le formulaire, on n'execute pas le script
if (verif_champs!="") {
alert (verif_champs);
return false;
}
//génère les jets de dés à utiliser
var inipjDice=Math.floor(Math.random()*20)+1;
var iniadvDice=Math.floor(Math.random()*20)+1;
// Traitement des données pour le PJ
if (inipjDice <= Valeurs ["ini-pj"]) {
resultatpj += "Le PJ a réussi son test d'INI(" + inipjDice + ") et bénéficie de 2 actions au premier tour. ";
}else {
resultatpj += "Le PJ a raté son test d'INI (" + inipjDice + ") et ne bénéficie que d'une action au premier tour.";
}
// Traitement des données pour l'adversaire
if (iniadvDice <= Valeurs ["ini-adv"]) {
resultatadv += "L'adversaire a réussi son test d'INI(" + iniadvDice + ") et bénéficie de 2 actions au premier tour. ";
}else {
resultatadv += "L'adversaire a raté son test d'INI (" + iniadvDice + ") et ne bénéficie que d'une action au premier tour.";
}
$("#ini-result-pj").append(resultatpj);
$("#ini-result-adv").append(resultatadv);
// Classement des INI selon données entrées dans #ini-pj et #ini-adv
function compare(x, y) {
return x - y;
}
var triINI = new Array(Valeurs ["ini-pj"], Valeurs ["ini-adv"]);
triINI.sort(compare);
$("#triINI").append(triINI);
});
// ---------------------------------------------------------------
});
</script> |
Et coté HTML, le formulaire:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| <div id="tabs-1">
<table width="1019">
<tr>
<td width="140" align="center">Initiative PJ</td>
<td width="250"><input type="text" id="ini-pj"/></td>
<td width="158" align="center">Initiative de l'adversaire</td>
<td width="451"><input type="text" id="ini-adv"/></td>
<td><span id="ini-but"><img src="img/de2-gris.png" height="30px" onclick="roll(champDe2);champDe2.style.backgroundColor = '#DDDDFF';" onmouseout="champDe2.style.backgroundColor = '';" style="cursor:pointer;" /></span></td>
</tr>
<tr>
<td align="center"><em><strong> Résultat du premier tour: </strong></em></td>
<td colspan="4"> <span id ="ini-result-pj"></span><span id ="ini-result-adv"></span></td>
</tr>
<tr>
<td align="center"><em><strong> Classement des tours suivants: </strong></em></td>
<td><span id="#triINI"></span></td>
</tr>
</table>
</div> |
J'ai essayé via function compare(x, y) mais à mon avis, je code mal la création de l'array ou alors ca coince au niveau du <span id="#triINI"></span>
Merci d'avance !
NB: le solveur: http://warforum-jdr.com/solveur/
je ne suis pas le codeur original de l'entièreté du solveur, la base (l'onglet Corps à corps) n'est pas de moi mais d'un autre membrede mon forum, et je me suis basé sur son travail pour reprendre le flambeau. Il était parti sur une base de jquery par choix personnel. Ne connaissant pas ce langage (ni le javascript plus que ça en fait), j'ai préféré continuer en js sur la base jquery en me servant au maximum de son code original pour les ajouts d'autres modules.
NB: le code n'est peut être (voir sûrement) pas ultra propre ni optimisé, je suis preneur de toute modification en ce sens :)
