Version 2.9
* Custom input for answer * Option for no timer * Play again button * Rewrite About page * Modernize clipboard copy * Lots of misc. fixes
This commit is contained in:
93
poketest.js
93
poketest.js
@ -8,7 +8,6 @@ $(document).ready(function() {
|
||||
/********************************/
|
||||
|
||||
/****** General variables ******/
|
||||
var score = 0;
|
||||
var questions = 0;
|
||||
var good_answers = 0;
|
||||
var bad_answers = 0;
|
||||
@ -65,6 +64,11 @@ $(document).ready(function() {
|
||||
return false;
|
||||
}
|
||||
|
||||
function normalizeString(string)
|
||||
{
|
||||
return string.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, "");
|
||||
}
|
||||
|
||||
|
||||
/************ GAME *************/
|
||||
/*******************************/
|
||||
@ -80,7 +84,6 @@ $(document).ready(function() {
|
||||
{
|
||||
$('article #game').fadeToggle('quick', function()
|
||||
{
|
||||
document.removeEventListener('keydown', funcListener);
|
||||
$('article #container').append('<div id="score"><div id="top_game"><h1 class="whois"></h1><h1 class="chrono"></h1></div></div>');
|
||||
$('article #container #score').append('<p class="pokemon"></p><div id="answers"></div>');
|
||||
generations();
|
||||
@ -96,6 +99,7 @@ $(document).ready(function() {
|
||||
else // else, it's all the generation, from the first one to the regional forms
|
||||
max_questions = REG[1] + 1;
|
||||
}
|
||||
answertype = $('article input[name="answertype"]:checked').attr('id');
|
||||
game();
|
||||
});
|
||||
}
|
||||
@ -228,7 +232,9 @@ $(document).ready(function() {
|
||||
available_pokemon.splice(resultIndex, 1);
|
||||
|
||||
answer = pklist.mn[result][lang];
|
||||
chooseOptions(result, lang);
|
||||
|
||||
if (answertype == "choice")
|
||||
chooseOptions(result, lang);
|
||||
imageType(result);
|
||||
}
|
||||
|
||||
@ -238,16 +244,29 @@ $(document).ready(function() {
|
||||
questions++;
|
||||
chrono = max_chrono;
|
||||
$('article #container').addClass('game_active');
|
||||
$('article #container #share').empty();
|
||||
$('article #container #seed').empty();
|
||||
$('article #container #copyseed').empty();
|
||||
$('article #container .chrono').empty().append(chrono);
|
||||
$('article #container #share').remove();
|
||||
$('article #container #seed').remove();
|
||||
$('article #container #copyseed').remove();
|
||||
if (chrono != "notimer")
|
||||
$('article #container .chrono').empty().append(chrono);
|
||||
else
|
||||
$('article #container .chrono').hide();
|
||||
$('article #container .whois').empty().append("Who's that Pokémon? " + (!infinite? " ("+questions+"/"+max_questions+")" : ""));
|
||||
$('article #container .pokemon').empty().append('<img src="pokemon/'+image_name+'.png" class="'+(silhouette)+'" />');
|
||||
$('article #container #answers').empty().append('<span><input type="submit" class="option a1" name="a1" value="'+options[0]+'"></span>')
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a2" name="a2" value="'+options[1]+'"></span>')
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a3" name="a3" value="'+options[2]+'"></span>')
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a4" name="a4" value="'+options[3]+'"></span>')
|
||||
$('article #container .pokemon').empty().append('<img src="pokemon/'+image_name+'.png" class="'+(silhouette)+' '+ (answertype) +'" />');
|
||||
|
||||
if (answertype == "choice")
|
||||
{
|
||||
$('article #container #answers').empty().append('<span><input type="submit" class="option a1" name="a1" value="'+options[0]+'"></span>');
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a2" name="a2" value="'+options[1]+'"></span>');
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a3" name="a3" value="'+options[2]+'"></span>');
|
||||
$('article #container #answers').append('<span><input type="submit" class="option a4" name="a4" value="'+options[3]+'"></span>');
|
||||
}
|
||||
else
|
||||
{
|
||||
$('article #container #answers').empty().append('<form autocomplete="off"><input type="text" id="answer" name="answer" placeholder="Input the Pokémon name!"\
|
||||
class="choice"><p class="button"><input type="submit" value="Answer!"></p></form>');
|
||||
$('article #container #answers input').focus().select();
|
||||
}
|
||||
|
||||
// timer setting
|
||||
var clock = setInterval(function()
|
||||
@ -268,18 +287,34 @@ $(document).ready(function() {
|
||||
($(this).attr('value') == answer) ? showAnswer(true) : showAnswer(false);
|
||||
});
|
||||
|
||||
document.addEventListener('keydown', funcListener = function(event)
|
||||
if (answertype == "choice")
|
||||
{
|
||||
function checkAnswer(v)
|
||||
document.addEventListener('keydown', funcListener = function(event)
|
||||
{
|
||||
function checkAnswer(v)
|
||||
{
|
||||
clearInterval(clock);
|
||||
($('#answers input.a'+v).attr('value') == answer) ? showAnswer(true) : showAnswer(false);
|
||||
}
|
||||
if (event.keyCode == 49 || event.keyCode == 72) checkAnswer(1);
|
||||
else if (event.keyCode == 50 || event.keyCode == 74) checkAnswer(2);
|
||||
else if (event.keyCode == 51 || event.keyCode == 75) checkAnswer(3);
|
||||
else if (event.keyCode == 52 || event.keyCode == 76) checkAnswer(4);
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
$("form").submit(function(event)
|
||||
{
|
||||
clearInterval(clock);
|
||||
($('#answers input.a'+v).attr('value') == answer) ? showAnswer(true) : showAnswer(false);
|
||||
}
|
||||
if (event.keyCode == 49 || event.keyCode == 72) checkAnswer(1);
|
||||
else if (event.keyCode == 50 || event.keyCode == 74) checkAnswer(2);
|
||||
else if (event.keyCode == 51 || event.keyCode == 75) checkAnswer(3);
|
||||
else if (event.keyCode == 52 || event.keyCode == 76) checkAnswer(4);
|
||||
});
|
||||
pokemon_name = event.currentTarget[0].value;
|
||||
event.preventDefault(); // do not submit form
|
||||
if (normalizeString(answer) == normalizeString(pokemon_name))
|
||||
showAnswer(true);
|
||||
else
|
||||
showAnswer(false);
|
||||
});
|
||||
}
|
||||
|
||||
function showAnswer(ok)
|
||||
{
|
||||
@ -331,6 +366,7 @@ $(document).ready(function() {
|
||||
else gen += "all";
|
||||
s_gen = "?gen=" + gen;
|
||||
s_lang = "&lang=" + lang;
|
||||
s_answertype = "&answertype=" + answertype;
|
||||
s_silhouette = "&silhouette=" + (silhouette == "silhouette" ? "true" : "false");
|
||||
s_questions = "&questions=" + (!whole_set? max_questions : "set");
|
||||
s_time = "&time=" + max_chrono;
|
||||
@ -338,14 +374,15 @@ $(document).ready(function() {
|
||||
// save in the local storage for default use
|
||||
localStorage.setItem('generation', gen);
|
||||
localStorage.setItem('lang', lang);
|
||||
localStorage.setItem('answertype', answertype);
|
||||
localStorage.setItem('silhouette', silhouette);
|
||||
localStorage.setItem('questions', (!whole_set? max_questions : "set"));
|
||||
localStorage.setItem('time', max_chrono);
|
||||
|
||||
return domain + s_gen + s_lang + s_silhouette + s_questions + s_time;
|
||||
return domain + s_gen + s_lang + s_answertype + s_silhouette + s_questions + s_time;
|
||||
}
|
||||
|
||||
$('article #container #score .pokemon').after('<div id="seed"></div><div id="share"></div>');
|
||||
$('article #container #score .pokemon').empty().after('<div id="seed"></div><div id="share"></div>');
|
||||
$('article #container').addClass('diploma');
|
||||
$('article #container').removeClass('game_active');
|
||||
$('article #container .chrono').hide();
|
||||
@ -360,15 +397,14 @@ $(document).ready(function() {
|
||||
class="twitter-share-button" data-url="'+generateSeed()+'" data-text="'+generateTwitterText()+
|
||||
'" data-size="large" data-hashtags="Pokétest">Tweet</a>');
|
||||
$.getScript("//platform.twitter.com/widgets.js"); // for the twitter button to work
|
||||
$('article #container #answers').remove(); // until play again is fixed
|
||||
//$('article #container #answers').empty().append('<p class="button"><input type="submit" \
|
||||
// class="start_again" name="start_again" value="Play again!"></p>');
|
||||
|
||||
$('article #container #answers').empty().append('<p class="button"><input type="submit" \
|
||||
class="start_again" name="start_again" value="Play again!"></p>');
|
||||
|
||||
// copy seed in clipboard
|
||||
$("article #container #copyseed").click(function()
|
||||
{
|
||||
$('article #container #seed input').select();
|
||||
document.execCommand("copy");
|
||||
navigator.clipboard.writeText($('article #container #seed input').val());
|
||||
});
|
||||
|
||||
$('article #container .button input.start_again').click(function()
|
||||
@ -377,6 +413,7 @@ $(document).ready(function() {
|
||||
chrono = max_chrono;
|
||||
$('article #container .chrono').show();
|
||||
$('article #container').removeClass('diploma');
|
||||
$('article #container').addClass('game_active');
|
||||
game();
|
||||
});
|
||||
}
|
||||
|
Reference in New Issue
Block a user