|
|
@@ -3,7 +3,8 @@ var id_cat = 0, id_theme = 0, id_quest = 0;
|
|
3
|
3
|
// Shortcuts
|
|
4
|
4
|
var json, category, theme;
|
|
5
|
5
|
// Timer
|
|
6
|
|
-var timing = 5, secRestantes;
|
|
|
6
|
+var timing = 5, secRestantes, timer;
|
|
|
7
|
+var baseWidth;
|
|
7
|
8
|
|
|
8
|
9
|
var score = 0;
|
|
9
|
10
|
var reponseUser = -1, bonneReponse;
|
|
|
@@ -25,6 +26,8 @@ function loadCat(id) {
|
|
25
|
26
|
console.log(category);
|
|
26
|
27
|
$("#game").html("<p id=\"category\">Catégorie : "+category.nom_cat+"</p>");
|
|
27
|
28
|
$("#game").append("<div id=\"theme\"></div>");
|
|
|
29
|
+ $("#game").append("<div id=\"timer\" style=\"width:100%;height:20px;background:green\"></div>");
|
|
|
30
|
+ $("#game").append("<div id=\"score\"></div>");
|
|
28
|
31
|
loadTheme(id_theme);
|
|
29
|
32
|
}
|
|
30
|
33
|
|
|
|
@@ -33,7 +36,6 @@ function loadTheme(id) {
|
|
33
|
36
|
$("#theme").html("<p id=\"question\"></p>");
|
|
34
|
37
|
$("#theme").append("<ul id=\"answers\"><li id=\"rep1\">"+theme.reponse1+"</li>"
|
|
35
|
38
|
+"<li id=\"rep2\">"+theme.reponse2+"</li><li id=\"both\">Les deux</li></ul>");
|
|
36
|
|
- $("#theme").append("<div id=\"timer\" style=\"width:100%\"></p>");
|
|
37
|
39
|
quest(id_quest);
|
|
38
|
40
|
}
|
|
39
|
41
|
|
|
|
@@ -56,6 +58,7 @@ function checkAnswer() {
|
|
56
|
58
|
if(reponseUser == bonneReponse) {
|
|
57
|
59
|
score += secRestantes+1;
|
|
58
|
60
|
}
|
|
|
61
|
+ $("#score").html("Score : "+score);
|
|
59
|
62
|
switch(bonneReponse) {
|
|
60
|
63
|
case 0: $("#rep1").addClass("wrong-answer");
|
|
61
|
64
|
$("#rep2").addClass("wrong-answer");
|
|
|
@@ -108,15 +111,65 @@ function play() {
|
|
108
|
111
|
}
|
|
109
|
112
|
|
|
110
|
113
|
function startTimer() {
|
|
111
|
|
- $("#timer").animate('{width : 0%}', timing*1000);
|
|
112
|
|
- window.setTimeout(checkAnswer, timing*1000);
|
|
|
114
|
+ $("#timer").css("width", "100%");
|
|
|
115
|
+ baseWidth = $("#timer").width();
|
|
|
116
|
+ $("#timer").animate({'width' : '0%'}, timing*1000);
|
|
|
117
|
+ timer = window.setTimeout(checkAnswer, timing*1000);
|
|
113
|
118
|
}
|
|
114
|
119
|
|
|
115
|
120
|
function stopTimer() {
|
|
116
|
|
- secRestantes = Math.round($("#timer").width/100*timing);
|
|
117
|
|
- console.log(secRestantes);
|
|
|
121
|
+ window.clearTimeout(timer);
|
|
|
122
|
+ $("#timer").stop();
|
|
|
123
|
+ secRestantes = Math.round($("#timer").width()/baseWidth*timing);
|
|
118
|
124
|
}
|
|
119
|
125
|
|
|
120
|
126
|
function endGame() {
|
|
121
|
|
- $("#game").html("End of line. Score : "+score);
|
|
|
127
|
+ $("#game").html("<h2 id=\"score\">Vous avez marqué "+score+" miams</h2>"
|
|
|
128
|
+ +"<p id=\"registerScore\">Enregistrez votre score : <input type=\"text\" id=\"login\" placeholder=\"Nom ou pseudonyme\" />"
|
|
|
129
|
+ +"<input type=\"submit\" id=\"sendScore\" value=\"Valider\" /></p>");
|
|
|
130
|
+ $("#sendScore").click(function() {
|
|
|
131
|
+ addScore($("#login").val(), score);
|
|
|
132
|
+ var message = json.message;
|
|
|
133
|
+ $("#registerScore").fadeOut();
|
|
|
134
|
+ console.log(message);
|
|
|
135
|
+ if(message == "score_add_success") {
|
|
|
136
|
+ $("#registerScore").addClass("success");
|
|
|
137
|
+ $("#registerScore").html("Votre score a bien été enregistré<br />"+
|
|
|
138
|
+ "<a href=\"palmares.htm\">Voir les meilleurs scores</a>");
|
|
|
139
|
+ } else {
|
|
|
140
|
+ $("#registerScore").addClass("error");
|
|
|
141
|
+ if(message === "higher_score_present") {
|
|
|
142
|
+ $("#registerScore").html("Un score supérieur ou égal existe déjà avec ce pseudonyme<br />"+
|
|
|
143
|
+ "<a href=\"palmares.htm\">Voir les meilleurs scores</a>");
|
|
|
144
|
+ } else {
|
|
|
145
|
+ $("#registerScore").html("Une erreur est survenue ("+status.message+")<br />"+
|
|
|
146
|
+ "<a href=\"palmares.htm\">Voir les meilleurs scores</a>");
|
|
|
147
|
+ }
|
|
|
148
|
+ }
|
|
|
149
|
+ $("#registerScore").fadeIn();
|
|
|
150
|
+ });
|
|
|
151
|
+}
|
|
|
152
|
+
|
|
|
153
|
+function addScore(userLogin, userScore) {
|
|
|
154
|
+ $.ajax({
|
|
|
155
|
+ async: false,
|
|
|
156
|
+ url: "./api/?page=palmares",
|
|
|
157
|
+ type: "POST",
|
|
|
158
|
+ dataType: 'json',
|
|
|
159
|
+ data: {login: userLogin, score: userScore},
|
|
|
160
|
+ success: function(data) {
|
|
|
161
|
+ json = data;
|
|
|
162
|
+ }
|
|
|
163
|
+ });
|
|
|
164
|
+}
|
|
|
165
|
+
|
|
|
166
|
+function displayScores() {
|
|
|
167
|
+ $.get("./api/?page=palmares", function(data) {
|
|
|
168
|
+ var list = "<ol>";
|
|
|
169
|
+ for(var i = 0; i < 10; i++) {
|
|
|
170
|
+ list += "<li>"+data[i].login+" - "+data[i].score+"</li>";
|
|
|
171
|
+ }
|
|
|
172
|
+ list += "</ol>";
|
|
|
173
|
+ $("#palmares").html(list);
|
|
|
174
|
+ });
|
|
122
|
175
|
}
|
