Discussion :

[javatwister]

j'ai l'impression que d3LTa7 voulait calculer la probabilité après avoir fait plusieurs choix.
si par exemple la 1re proposition 10 est trop grande, il reste 9 possibilités.
mais ensuite si on propose 5 qui est trop petit, il reste seulement 4 possibilités, de 6 à 9.

Ah bon? Bravo à toi alors, d'avoir déchiffré cette énigme j'avoue que je n'ai toujours pas de certitude...

[javatwister]

Merci en tout cas, j'ai ajouté les lignes au fichier!

[danielhagnoul]

j'ai l'impression que d3LTa7 voulait calculer la probabilité après avoir fait plusieurs choix.
si par exemple la 1re proposition 10 est trop grande, il reste 9 possibilités.
mais ensuite si on propose 5 qui est trop petit, il reste seulement 4 possibilités, de 6 à 9.

j'ai repris le code de javatwister et j'ai rajouté les lignes 55 à 59 :
https://codesandbox.io/s/wizardly-banach-hy5er

Bel effort, mais il y a un petit problème, le programme compare systématiquement un string avec un nombre !

En conséquence, on peut casser le jeu en modifiant el("choix").value != alea en el("choix").value !== alea.

Cette manière de reconstruire chaque el() à chaque appel est non performante et un mauvais exemple pour un débutant qui risque de l'adopter dans tous ces codes.

[javatwister]

Oui, j'avoue que tout ça n'est pas très rigoureux mais j'assume et puis on est partis de loin...

J'ai un peu corrigé mais je garde ma fonction de raccourci el(), merci!

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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
window.addEventListener("load",()=>{
	const el = (bal)=>{return document.getElementById(bal)};
	el("start").addEventListener("click",()=>{
		let min, max;
		el("auto").style.visibility="visible";
		el("alerte").textContent="";
		el("aide").textContent="";
		el("val").disabled=false;
		let tot=0, lol;
 
		if(isNaN(el("nmin").value)||
		el("nmin").value > 999 || 
		el("nmin").value < 1 || 
		Number(el("nmin").value) > Number(el("nmax").value)-1 ||
		isNaN(el("nmax").value)|| 
		el("nmax").value < 1 || 
		el("nmax").value > 999){
			el("alerte").textContent="Saisissez des nombres valides, sinon les extrêmes seront automatiquement 1 et 20!";
			min=1; max=20;
		}
		else{
			min=Number(el("nmin").value); 
			max=Number(el("nmax").value);
		};
 
		el("nmin").value="";
		el("nmax").value="";
		el("text").textContent="";
 
		let alea=Math.floor(Math.random() * (max-min))+min;
		el("cons").textContent=`Choisissez un nombre entre ${min} et ${max}.`;
 
		el("val").addEventListener("click",()=>{	
			let test=Number(el("choix").value);
			el("auto").style.visibility="hidden";
			el("alerte").textContent="";
			tot++;
			if(isNaN(test)|| 
			test > max || 
			test < min){
				el("text").textContent="Vous n'avez rien compris... Relisez la consigne.";
				el("aide").textContent=`(entre ${min} et ${max})`;
			}
			else{
				el("text").textContent = (test !== alea) ?
				test < alea ?
				`Nombre de coups: ${tot} ==> Plus grand! Vous avez 1 chance sur ${max-test}.`:
				`Nombre de coups: ${tot} ==> Plus petit! Vous avez 1 chance sur ${test-min}.`:
				`Nombre de coups: ${tot} ==> Bravo! Vous pouvez tenter une nouvelle partie.`;
				if (test < alea) {
					min = test+1;
				}
				else {
					max = test-1;
				};
				if(test !== alea){
					lol= max - min > 1 ? "" : "Lol";
					el("aide").textContent = `(Faites un choix entre ${min} et ${max}. ${lol})`;
					el("val").disabled=false
				}
				else{
					el("aide").textContent = "";
					el("val").disabled=true
				}
			}
 
		},false)
	},false);
},false);

http://javatwist.imingo.net/plusmoins2.htm

[Invité]

Bonjour,

Puisque tout le monde s'amuse, voici ma version : https://codepen.io/jreaux62/pen/PooKLOw

[javatwister]

Joli
Comme quoi on arrive vite à des choses assez denses...
Vérifie juste tes probas (en général, le nombre de coups possibles est au-dessus de la réalité); pareil pour les "coups joués": le joueur peut reproposer les mini / maxi à exclure;
Tu avais aussi déclaré une paire de propriétés nb_Coup_Min et nb_Coup_Max et je ne crois pas que tu les aies utilisées?
Bonne idée aussi de juste interdire les saisies excentriques: ça simplifie largement les contrôles!

[Invité]

La moitié de mon code consiste à créer les éléments du DOM !

Tu avais aussi déclaré une paire de propriétés nb_Coup_Min et nb_Coup_Max et je ne crois pas que tu les aies utilisées?

En effet : je l'ai prévu, mais pas traité ici.

On peut aussi prévoir un tas d'autres options !

Avec le principe de la "Recherche dichotomique", on arrive assez vite au résultat (en moins de 7-8 coups).


N.B. Sur le même principe, j'ai réalisé avec un dessinateur : Le Voyage de Nephi - Le Jeu
(JS : 6600 lignes - CSS : 2500 lignes !)

[Invité]

@javatwister

J'ai amélioré mon script, en intégrant le "nombre d'essais". : https://codepen.io/jreaux62/pen/PooKLOw

Par la même occasion, j'ai ajouté la possibilité de cliquer simplement sur la touche "Enter" pour valider (en ajoutant la balise <form> + event.preventDefault()

Le code HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

	<div id="GuessTheNumber_TheGame"></div>

(et c'est tout !)

Le code JS :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
"use strict";
// -----------------
// JEU : Devinez le nombre
// -----------------
// Définition de l objet
var GuessTheNumber = {
	// -----------------
	// Initialisation
	game_Init:function()
	{
		var thisGame = this;
		// ---------
		this.numberToFind_Max = 100;
		// ---------
		// Nombre d essais
		this.nbre_Essais_Max = 10;
		// ---------
		this.html_Generate();
		// ---------
		this.game_Start();
		// ---------
	},
	// -----------------
	// Start / ou Replay
	game_Start:function()
	{
		// ---------
		// Le nombre à trouver
		this.numberToFind = Math.floor(Math.random()*(this.numberToFind_Max+1));
		// ---------
		// Probabilité
		this.Proba_Min = 1;
		this.Proba_Max = this.numberToFind_Max;
		// ---------
		this.You_Win = false;
		this.nbre_Essais_Count = 0;
		// ---------
		this.html_Msg_Error.textContent = "";
		this.html_Show_Proba.textContent = "";
		this.html_Show_Result.textContent = "";
		// ---------
		this.show_Probabilite();
		// ---------
		this.html_Button_Replay.style.display = "none";
		// ---------
	},
	// -----------------
	// HTML - GENERER le code HTML
	html_Generate:function()
	{
		var thisGame = this;
		var elt, div;
		// ---------
		// <div id="GuessTheNumber_TheGame"></div> : à mettre dans le HTML au départ
		this.html_Frame = document.querySelector('#GuessTheNumber_TheGame'); 
		// ---------
		// TITRE
		elt = document.createElement('h4');
		elt.textContent = "Trouvez le nombre entre 1 et "+this.numberToFind_Max+" : ";
		this.html_Frame.append( elt );
		// ---------
		// INPUT CHOIX + BUTTON PLAY
		div = document.createElement('form');
		this.html_Frame.append( div );
		// ----
		elt = document.createElement('label');
		elt.textContent = "Votre choix : ";
		div.append( elt );
		// ----
		elt = document.createElement('input');
		elt.id = 'GuessTheNumber-Input-Choice';
		elt.type = 'number';
		elt.min = 1;
		elt.max = this.numberToFind_Max;
		elt.value = '';
		div.append( elt );
		this.html_Input_Choice = document.querySelector('#'+elt.id);
		// ----
		elt = document.createElement('button');
		elt.id = 'GuessTheNumber-Play';
		elt.type = 'submit';
		elt.textContent = "OK";
		div.append( elt );
		this.html_Button_Play = document.querySelector('#'+elt.id);
		// ----
		elt = document.createElement('span');
		elt.id = 'GuessTheNumber-Error';
		div.append( elt );
		this.html_Msg_Error = document.querySelector('#'+elt.id);
		// ---------
		// PROBABILITE
		div = document.createElement('p');
		this.html_Frame.append( div );
		// ----
		elt = document.createElement('label');
		elt.textContent = "Probabilité : ";
		div.append( elt );
		// ----
		elt = document.createElement('span');
		elt.id = 'GuessTheNumber-Proba';
		div.append( elt );
		this.html_Show_Proba = document.querySelector('#'+elt.id);
		// ---------
		// RESULTATS
		div = document.createElement('div');
		this.html_Frame.append( div );
		// ----
		elt = document.createElement('label');
		elt.innerHTML = "Résultats : "+"<em>(vous avez droit à "+this.nbre_Essais_Max+" essais)</em>";
		div.append( elt );
		// ----
		elt = document.createElement('ul');
		elt.id = 'GuessTheNumber-Result';
		div.append( elt );
		this.html_Show_Result = document.querySelector('#'+elt.id);
		// ---------
		// BUTTON REPLAY
		div = document.createElement('p');
		this.html_Frame.append( div );
		// ----
		elt = document.createElement('button');
		elt.id = 'GuessTheNumber-Replay';
		elt.textContent = "Rejouer une partie ?";
		div.append( elt );
		this.html_Button_Replay = document.querySelector('#'+elt.id);
		// ---------
		// ACTIONS
		this.html_Action_Load();
		// ---------
	},
	// -------------------
	// ACTIONS
	html_Action_Load:function()
	{
		var thisGame = this;
		// ---------
		// PLAY
		this.html_Button_Play.addEventListener('click', function(event) {
			event.preventDefault();
			// ---------
			var val_user = Number(thisGame.html_Input_Choice.value);
			thisGame.html_Input_Choice.value = "";
			thisGame.html_Msg_Error.textContent = "";
			// ---------
			if( val_user < thisGame.Proba_Min || val_user > thisGame.Proba_Max )
			{
				thisGame.html_Msg_Error.textContent = " Choix incorrect";
			} else {
				if( !thisGame.You_Win ) {
					// -----
					thisGame.nbre_Essais_Count++;
					// -----
					if( !thisGame.You_Win && thisGame.nbre_Essais_Count > thisGame.nbre_Essais_Max )
					{
						thisGame.append_Result( "Vous avez épuisé vos "+thisGame.nbre_Essais_Max+" essais. <b>Vous avez perdu !</b>" );
						// -----
						thisGame.html_Button_Replay.style.display = "block";
					} else {
						// -----
						if( val_user < thisGame.numberToFind )
						{
							thisGame.Proba_Min = val_user;
							thisGame.append_Result( "Essai n°"+thisGame.nbre_Essais_Count+" : "+val_user+" est trop petit" );
							thisGame.show_Probabilite();
						} else if ( val_user > thisGame.numberToFind )
						{
							thisGame.Proba_Max = val_user;
							thisGame.append_Result( "Essai n°"+thisGame.nbre_Essais_Count+" : "+val_user+" est trop grand" );
							thisGame.show_Probabilite();
						} else {
							thisGame.You_Win = true;
							thisGame.append_Result( "Essai n°"+thisGame.nbre_Essais_Count+" : <b>"+val_user+"</b> est bien le nombre à trouver. <b>Vous avez gagné !</b>" );
							// -----
							thisGame.html_Button_Replay.style.display = "block";
						}
						// -----
					}
				} else {
						thisGame.html_Show_Result.textContent = "";
						// -----
						thisGame.html_Button_Replay.style.display = "block";
				}
			}
		});
		// ---------
		// REPLAY
		this.html_Button_Replay.addEventListener('click', function() {
			thisGame.game_Start();
		});
	},
	// -----------------
	// RESULTAT
	append_Result:function( msg )
	{
		var elt = document.createElement('li');
		elt.innerHTML = msg;
		this.html_Show_Result.append( elt );
	},
	// -----------------
	// PROBABILITE
	show_Probabilite:function()
	{
		this.html_Show_Proba.textContent = "Vous avez 1 chance sur "+(this.Proba_Max - this.Proba_Min + 1);
	}
};
	// -------------------
	// au chargement de page
	window.addEventListener('DOMContentLoaded', function(){
		GuessTheNumber.game_Init();
	});
	// -------------------

[javatwister]

Pense aussi à cette histoire de mini / maxi qui doit exclure les données et non les inclure;
Et si tu pouvais éliminer les décimaux de la saisie, ce serait parfait