mirror of
https://github.com/richi3f/candy-calc.git
synced 2026-03-21 17:34:13 -05:00
Enhance UX
Auto-complete turned off Form is disabled if current Lv equals target Lv Pokémon input is cleared when re-selected Pokémon input may now be in lowercase Candy names are hidden on overflow
This commit is contained in:
parent
ce0ba5be3d
commit
4f43fd0ee6
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
<p>A calculator for <abbr title="Experience">Exp.</abbr> Candy optimization in Pokémon Sword & Shield. Read the <a href="#faq">FAQ</a> for more information.</p>
|
||||
|
||||
<form>
|
||||
<form autocomplete="off">
|
||||
<dl class="input">
|
||||
<dt><label for="pokemon">Pokémon</label></dt>
|
||||
<dd>
|
||||
|
|
|
|||
|
|
@ -52,14 +52,20 @@ function log( mssg = false ) {
|
|||
}
|
||||
|
||||
function validate() {
|
||||
var disable = false;
|
||||
var currentLv, targetLv, disable = false;
|
||||
$( 'form [id^=result]' ).each(function() {
|
||||
$(this).val('-');
|
||||
});
|
||||
if ( !( $( 'input[name=curve]' ).val().length ) ) {
|
||||
disable = 'Fill out the Pokémon species field.';
|
||||
} else if ( parseInt( $( 'input[name=target]' ).val() ) < parseInt( $( 'input[name=current]' ).val() ) ) {
|
||||
disable = 'Current Level cannot exceed Target Level.';
|
||||
} else {
|
||||
currentLv = parseInt( $( 'input[name=current]' ).val() ),
|
||||
targetLv = parseInt( $( 'input[name=target]' ).val() );
|
||||
if ( currentLv == targetLv ) {
|
||||
disable = 'Current Level cannot be equal to Target Level.';
|
||||
} else if ( currentLv > targetLv ) {
|
||||
disable = 'Current Level cannot exceed Target Level.';
|
||||
}
|
||||
}
|
||||
log( disable );
|
||||
$( '[type=submit]' ).prop( 'disabled', disable.length > 0 );
|
||||
|
|
@ -105,7 +111,7 @@ $( document ).ready(function() {
|
|||
var i, len, target, template, $template;
|
||||
|
||||
// read candy MILP problem
|
||||
$.get('problem.txt', function( problemTemplate ) {
|
||||
$.get('https://richi3f.github.io/candy-calc/problem.txt', function( problemTemplate ) {
|
||||
|
||||
// read Pokémon names and experience curves
|
||||
$.getJSON( 'https://plan.pokemonteams.io/static/pokemon.json', function( pokemonData ) {
|
||||
|
|
@ -127,18 +133,29 @@ $( document ).ready(function() {
|
|||
|
||||
// show the experience curve when a Pokémon name is typed
|
||||
$( '#pokemon' ).on( 'input', function() {
|
||||
var value;
|
||||
var value, $match;
|
||||
value = this.value;
|
||||
if ( $( 'datalist option' ).filter(function() {
|
||||
$match = $( 'datalist option' ).filter(function() {
|
||||
return this.value.toUpperCase() == value.toUpperCase();
|
||||
}).length ) {
|
||||
value = $( 'datalist option[value="' + value + '"]' ).attr( 'data-exp-curve' );
|
||||
});
|
||||
if ( $match.length ) {
|
||||
value = $( 'datalist option[value="' + $match.val() + '"]' ).attr( 'data-exp-curve' );
|
||||
$( 'input[name=curve]' ).val( value );
|
||||
} else {
|
||||
$( 'input[name=curve]' ).val( '' );
|
||||
}
|
||||
validate();
|
||||
});
|
||||
|
||||
// clear input on select
|
||||
$('#pokemon').click(function() {
|
||||
var $curve = $( 'input[name=curve]' );
|
||||
if ( $curve.val() ) {
|
||||
$(this).val('');
|
||||
$curve.val('');
|
||||
validate();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// create rows for candy in bag
|
||||
|
|
@ -198,7 +215,7 @@ $( document ).ready(function() {
|
|||
expDiff = expCurrent - expDiff;
|
||||
|
||||
if ( expDiff > 0 ) {
|
||||
log( 'Solution found with a surplus of ' + fmtNum( expDiff ) + ' Exp Points.' );
|
||||
log( 'Solution found with a surplus of ' + fmtNum( expDiff ) + ' Exp. Points.' );
|
||||
} else if ( expDiff == 0 ) {
|
||||
log( 'Optimal solution found! ' )
|
||||
.append( $( '<a href="#">Click here to reset.</a>' ).click(function(evt) {
|
||||
|
|
|
|||
|
|
@ -181,8 +181,7 @@ input {
|
|||
|
||||
.input dt, .input dd,
|
||||
.math dt, .math dd {
|
||||
float: left;
|
||||
display: inline-block
|
||||
float: left
|
||||
}
|
||||
|
||||
.input dt {
|
||||
|
|
@ -267,9 +266,11 @@ tr th[rowspan] {
|
|||
}
|
||||
|
||||
#calc table label {
|
||||
text-indent: 2.5em;
|
||||
text-indent: 2.25em;
|
||||
display: inline-block;
|
||||
background: url(candy.png) no-repeat
|
||||
background: url(candy.png) no-repeat;
|
||||
height: 2em;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
#calc table label[for$=-s] {
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user