Flashdex: added parameters in URL for sharing
This commit is contained in:
parent
670b33850f
commit
cba1c7c3ef
@ -8,7 +8,6 @@ Now that there are now more than a thousand of them, and it's as useful as ever!
|
||||
|
||||
### Planned updates
|
||||
|
||||
- Modify URL in the Flashdex for sharing options
|
||||
- Make answer choices closer by type
|
||||
- Type weakness calculator
|
||||
|
||||
@ -26,7 +25,7 @@ And this one allows to resize to 700x700px, but putting the image at the center
|
||||
|
||||
This website has been developed in <strong>JavaScript</strong> using the <strong>jQuery</strong> library. It uses the <a href="https://github.com/alexanderdickson/waitForImages">waitForImages plugin</a>. All of those components are licensed under the MIT license, as is this website's source code. This website is <strong>HTML5</strong> and <strong>CSS3</strong> compliant.
|
||||
|
||||
The Pokémon names, the associated artworks and the Pokémon licence is trademarked by <strong>Nintendo</strong> and <strong>The Pokémon Company</strong>, 1996 - 2023.
|
||||
The Pokémon names, the associated artworks and the Pokémon licence is trademarked by <strong>Nintendo</strong> and <strong>The Pokémon Company</strong>, 1996 - 2024.
|
||||
|
||||
All the Pokémon artworks were taken from <a href="https://bulbapedia.bulbagarden.net/wiki/Main_Page">Bulbapedia</a>, that I'd like to thank for their huge work for the Pokémon community.
|
||||
|
||||
|
||||
@ -52,6 +52,7 @@
|
||||
|
||||
<h3 id="2">How to use: Flashdex</h3>
|
||||
<p>The Flashdex is a very simple Pokédex, useful to see the Pokémons in a good resolution. It is filtered by generation and alternate forms. You can chose the language in which it is displayed.</p>
|
||||
<p>When a deck is generated, the URL is changed with the parameters that were selected. This way, you can easily share it to whoever you want.</p>
|
||||
<p>Types are displayed in the top-left corner, and generations on the top-right corner. If there are different artworks available for the Pokémon, arrows are displayed on the bottom-left corner. You can use them to switch between artworks. Please note that those are not always alternate forms, they are alternate artworks. For example:</p>
|
||||
<ul>
|
||||
<li>The first generation has at least three artworks available by Pokémon.</li>
|
||||
@ -82,7 +83,7 @@
|
||||
</article>
|
||||
</div>
|
||||
<footer>
|
||||
<p>© 2012 - 2024 Pokétest 2.9</p>
|
||||
<p>© 2012 - 2024 Pokétest 2.10</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@ -87,7 +87,7 @@
|
||||
</div>
|
||||
</article>
|
||||
<footer>
|
||||
<p>© 2012 - 2024 Pokétest 2.9</p>
|
||||
<p>© 2012 - 2024 Pokétest 2.10</p>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
20
flashdex.js
20
flashdex.js
@ -13,6 +13,8 @@ $(document).ready(function()
|
||||
var MEGA = [1011, 1060];
|
||||
var GIGA = [1061, 1092];
|
||||
var REG = [1093, 1147];
|
||||
var gen_number = 9;
|
||||
var extra_number = 3; // mega, giga, reg
|
||||
|
||||
/************ GAME *************/
|
||||
/*******************************/
|
||||
@ -57,10 +59,26 @@ $(document).ready(function()
|
||||
|
||||
if (gen_list.length == 0)
|
||||
return;
|
||||
|
||||
|
||||
setUrlSearch();
|
||||
|
||||
$('article #container #game #loading').show();
|
||||
$('article #container #game #flashdex').empty().hide();
|
||||
|
||||
function setUrlSearch()
|
||||
{
|
||||
gen = '';
|
||||
if (gen_list.length < (gen_number + extra_number))
|
||||
{
|
||||
for (i in gen_list)
|
||||
gen += gen_list[i].substring(0,1);
|
||||
}
|
||||
else gen += "all";
|
||||
|
||||
window.history.replaceState(null, null, "?gen=" + gen + "&lang=" + lang);
|
||||
localStorage.setItem('lang', lang);
|
||||
}
|
||||
|
||||
function getFormText(pkmn)
|
||||
{
|
||||
if (pkmn["origin"] == "Kanto")
|
||||
|
||||
@ -150,7 +150,7 @@
|
||||
</div>
|
||||
</article>
|
||||
<footer>
|
||||
<p>© 2012 - 2024 Pokétest 2.9</p>
|
||||
<p>© 2012 - 2024 Pokétest 2.10</p>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
247
interface.js
247
interface.js
@ -8,107 +8,6 @@ $(document).ready(function()
|
||||
// have a nice little background
|
||||
//$.backstretch("artwork/artwork"+random(1, 10)+".jpg");
|
||||
|
||||
// splice url arguments
|
||||
function gup(name, url)
|
||||
{
|
||||
if (!url) url = location.href;
|
||||
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
|
||||
var regexS = "[\\?&]"+name+"=([^&#]*)";
|
||||
var regex = new RegExp(regexS);
|
||||
var results = regex.exec(url);
|
||||
return results == null ? null : results[1];
|
||||
}
|
||||
|
||||
// read url
|
||||
local_gen = gup('gen', window.location.href);
|
||||
if (local_gen != null)
|
||||
{
|
||||
if (local_gen == "all")
|
||||
$('article #container #game #configuration input#all').attr('checked', true);
|
||||
else
|
||||
{
|
||||
$('article #container #game #configuration input#select').attr('checked', true);
|
||||
for (i = 0; i < local_gen.length; i++)
|
||||
{
|
||||
if (local_gen.charAt(i)) {
|
||||
if (local_gen.charAt(i) == "m")
|
||||
$('article #container #game #configuration #selected_options input#mega').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "r")
|
||||
$('article #container #game #configuration #selected_options input#regional').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "g")
|
||||
$('article #container #game #configuration #selected_options input#gigantamax').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration #selected_options input#' + local_gen.charAt(i) + 'g').attr('checked', true);
|
||||
}
|
||||
}
|
||||
$('#selected_options').slideDown();
|
||||
}
|
||||
$('article #container #game #configuration select.lang').val(gup('lang', window.location.href));
|
||||
|
||||
if (gup('silhouette', window.location.href) == "true")
|
||||
$('article #container #game #configuration input#silhouette').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration input#full').attr('checked', true);
|
||||
|
||||
if (gup('answertype', window.location.href) == "choice")
|
||||
$('article #container #game #configuration input#choice').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration input#input').attr('checked', true);
|
||||
|
||||
$('article #container #game #configuration select.questions').val(gup('questions', window.location.href));
|
||||
$('article #container #game #configuration select.time').val(gup('time', window.location.href));
|
||||
}
|
||||
else // if we did not come from a personalized URL, we read localstorage
|
||||
{
|
||||
if (localStorage.getItem('generation') != null)
|
||||
{
|
||||
if (localStorage.getItem('generation') != 'all')
|
||||
{
|
||||
gen_list = localStorage.getItem('generation');
|
||||
|
||||
$('article #container #game #configuration input#select').attr('checked', true);
|
||||
for (i = 0; i < gen_list.length; i++)
|
||||
{
|
||||
if (gen_list.charAt(i))
|
||||
{
|
||||
if (gen_list.charAt(i) == "m")
|
||||
$('article #container #game #configuration #selected_options input#mega').attr('checked', true);
|
||||
else if (gen_list.charAt(i) == "r")
|
||||
$('article #container #game #configuration #selected_options input#regional').attr('checked', true);
|
||||
else if (gen_list.charAt(i) == "g")
|
||||
$('article #container #game #configuration #selected_options input#gigantamax').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration #selected_options input#' + gen_list.charAt(i) + 'g').attr('checked', true);
|
||||
}
|
||||
}
|
||||
$('#selected_options').slideDown();
|
||||
}
|
||||
else
|
||||
$('article #container #game #configuration input#all').attr('checked', true);
|
||||
}
|
||||
if (localStorage.getItem('lang') != null)
|
||||
$('article #game #configuration select.lang').val(localStorage.getItem('lang'));
|
||||
if (localStorage.getItem('silhouette') != null)
|
||||
$('article #game #configuration input:radio[name=silhouette]#'+localStorage.getItem('silhouette')).attr('checked', true);
|
||||
if (localStorage.getItem('answertype') != null)
|
||||
$('article #game #configuration input:radio[name=answertype]#'+localStorage.getItem('answertype')).attr('checked', true);
|
||||
if (localStorage.getItem('questions') != null)
|
||||
$('article #game #configuration select.questions').val(localStorage.getItem('questions'));
|
||||
if (localStorage.getItem('time') != null)
|
||||
$('article #game #configuration select.time').val(localStorage.getItem('time'));
|
||||
}
|
||||
|
||||
// select generation toggle
|
||||
$('#configuration input#all').click(function()
|
||||
{
|
||||
$('#selected_options').slideUp();
|
||||
});
|
||||
|
||||
$('#configuration input#select').click(function()
|
||||
{
|
||||
$('#selected_options').slideDown();
|
||||
});
|
||||
|
||||
// hamburger mobile
|
||||
$("#hamburger .container").click(function()
|
||||
{
|
||||
@ -125,4 +24,150 @@ $(document).ready(function()
|
||||
$("nav ul").slideDown(200);
|
||||
}
|
||||
});
|
||||
|
||||
// splice url arguments
|
||||
function gup(name, url)
|
||||
{
|
||||
if (!url) url = location.href;
|
||||
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
|
||||
var regexS = "[\\?&]"+name+"=([^&#]*)";
|
||||
var regex = new RegExp(regexS);
|
||||
var results = regex.exec(url);
|
||||
return results == null ? null : results[1];
|
||||
}
|
||||
|
||||
// index.html
|
||||
if (location.pathname.includes("index.html"))
|
||||
{
|
||||
// read url
|
||||
local_gen = gup('gen', location.href);
|
||||
if (local_gen != null)
|
||||
{
|
||||
if (local_gen == "all")
|
||||
$('article #container #game #configuration input#all').attr('checked', true);
|
||||
else
|
||||
{
|
||||
$('article #container #game #configuration input#select').attr('checked', true);
|
||||
for (i = 0; i < local_gen.length; i++)
|
||||
{
|
||||
if (local_gen.charAt(i)) {
|
||||
if (local_gen.charAt(i) == "m")
|
||||
$('article #container #game #configuration #selected_options input#mega').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "r")
|
||||
$('article #container #game #configuration #selected_options input#regional').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "g")
|
||||
$('article #container #game #configuration #selected_options input#gigantamax').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration #selected_options input#' + local_gen.charAt(i) + 'g').attr('checked', true);
|
||||
}
|
||||
}
|
||||
$('#selected_options').slideDown();
|
||||
}
|
||||
$('article #container #game #configuration select.lang').val(gup('lang', window.location.href));
|
||||
|
||||
if (gup('silhouette', window.location.href) == "true")
|
||||
$('article #container #game #configuration input#silhouette').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration input#full').attr('checked', true);
|
||||
|
||||
if (gup('answertype', window.location.href) == "choice")
|
||||
$('article #container #game #configuration input#choice').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration input#input').attr('checked', true);
|
||||
|
||||
$('article #container #game #configuration select.questions').val(gup('questions', window.location.href));
|
||||
$('article #container #game #configuration select.time').val(gup('time', window.location.href));
|
||||
}
|
||||
else // if we did not come from a personalized URL, we read localstorage
|
||||
{
|
||||
if (localStorage.getItem('generation') != null)
|
||||
{
|
||||
if (localStorage.getItem('generation') != 'all')
|
||||
{
|
||||
gen_list = localStorage.getItem('generation');
|
||||
|
||||
$('article #container #game #configuration input#select').attr('checked', true);
|
||||
for (i = 0; i < gen_list.length; i++)
|
||||
{
|
||||
if (gen_list.charAt(i))
|
||||
{
|
||||
if (gen_list.charAt(i) == "m")
|
||||
$('article #container #game #configuration #selected_options input#mega').attr('checked', true);
|
||||
else if (gen_list.charAt(i) == "r")
|
||||
$('article #container #game #configuration #selected_options input#regional').attr('checked', true);
|
||||
else if (gen_list.charAt(i) == "g")
|
||||
$('article #container #game #configuration #selected_options input#gigantamax').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #configuration #selected_options input#' + gen_list.charAt(i) + 'g').attr('checked', true);
|
||||
}
|
||||
}
|
||||
$('#selected_options').slideDown();
|
||||
}
|
||||
else
|
||||
$('article #container #game #configuration input#all').attr('checked', true);
|
||||
}
|
||||
if (localStorage.getItem('lang') != null)
|
||||
$('article #game #configuration select.lang').val(localStorage.getItem('lang'));
|
||||
if (localStorage.getItem('silhouette') != null)
|
||||
$('article #game #configuration input:radio[name=silhouette]#'+localStorage.getItem('silhouette')).attr('checked', true);
|
||||
if (localStorage.getItem('answertype') != null)
|
||||
$('article #game #configuration input:radio[name=answertype]#'+localStorage.getItem('answertype')).attr('checked', true);
|
||||
if (localStorage.getItem('questions') != null)
|
||||
$('article #game #configuration select.questions').val(localStorage.getItem('questions'));
|
||||
if (localStorage.getItem('time') != null)
|
||||
$('article #game #configuration select.time').val(localStorage.getItem('time'));
|
||||
}
|
||||
|
||||
// select generation toggle
|
||||
$('#configuration input#all').click(function()
|
||||
{
|
||||
$('#selected_options').slideUp();
|
||||
});
|
||||
|
||||
$('#configuration input#select').click(function()
|
||||
{
|
||||
$('#selected_options').slideDown();
|
||||
});
|
||||
}
|
||||
|
||||
// flashdex.html
|
||||
if (location.pathname.includes("flashdex.html"))
|
||||
{
|
||||
// read url
|
||||
local_gen = gup('gen', location.href);
|
||||
if (local_gen != null)
|
||||
{
|
||||
if (local_gen == "all")
|
||||
{
|
||||
for (i = 0; i < 10; i++)
|
||||
$('article #container #game #flashdex_config input#' + i + 'g').attr('checked', true);
|
||||
$('article #container #game #flashdex_config input#mega').attr('checked', true);
|
||||
$('article #container #game #flashdex_config input#regional').attr('checked', true);
|
||||
$('article #container #game #flashdex_config input#gigantamax').attr('checked', true);
|
||||
}
|
||||
else
|
||||
{
|
||||
for (i = 0; i < local_gen.length; i++)
|
||||
{
|
||||
if (local_gen.charAt(i)) {
|
||||
if (local_gen.charAt(i) == "m")
|
||||
$('article #container #game #flashdex_config input#mega').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "r")
|
||||
$('article #container #game #flashdex_config input#regional').attr('checked', true);
|
||||
else if (local_gen.charAt(i) == "g")
|
||||
$('article #container #game #flashdex_config input#gigantamax').attr('checked', true);
|
||||
else
|
||||
$('article #container #game #flashdex_config input#' + local_gen.charAt(i) + 'g').attr('checked', true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$('article #container #game #flashdex_config select.lang').val(gup('lang', window.location.href));
|
||||
}
|
||||
else
|
||||
{
|
||||
if (localStorage.getItem('lang') != null)
|
||||
$('article #container #game #flashdex_config select.lang').val(localStorage.getItem('lang'));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user