honkalculate.template.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>A Pok&eacute;mon Calculator</title>
    <link type="text/css" rel="stylesheet" href="./bootstrap.css" />
    <link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.4/css/jquery.dataTables.min.css" />
    <link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/colvis/1.1.1/css/dataTables.colVis.css" />
    <link type="text/css" rel="stylesheet" href="./select2/select2.css" />
    <link type="text/css" rel="stylesheet" href="./shared_controls.css?" />
</head>

<body>

<div class="header"><div class="header-inner">
    <ul class="nav">
        <li><a class="button nav-first" href="/"><img src="./pokemonshowdownbeta.png" alt="Pok&eacute;mon Showdown! (beta)" /> Home</a></li>
        <li><a class="button" href="/dex/">Pok&eacute;dex</a></li>
        <li><a class="button" href="//replay.pokemonshowdown.com/">Replays</a></li>
        <li><a class="button" href="/ladder/">Ladder</a></li>
        <li><a class="button nav-last" href="/forums/">Forum</a></li>
    </ul>
    <ul class="nav nav-play">
        <li><a class="button greenbutton nav-first nav-last" href="//play.pokemonshowdown.com/">Play</a></li>
    </ul>
    <div style="clear:both"></div>
</div></div>
<div class="wrapper">

    <div>
        <span class="title-text">Pok&eacute;mon Damage Calculator</span>
        <span title="Select the generation.">
            <input class="gen visually-hidden" type="radio" name="gen" value="1" id="gen1" /><label class="btn btn-small btn-left" for="gen1">RBY</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="2" id="gen2" /><label class="btn btn-small btn-mid" for="gen2">GSC</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="3" id="gen3" /><label class="btn btn-small btn-mid" for="gen3">ADV</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="4" id="gen4" /><label class="btn btn-small btn-mid" for="gen4">DPP</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="5" id="gen5" /><label class="btn btn-small btn-mid" for="gen5">B/W</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="6" id="gen6" /><label class="btn btn-small btn-mid" for="gen6">X/Y</label>
            <input class="gen visually-hidden" type="radio" name="gen" value="7" id="gen7" checked="checked" /><label class="btn btn-small btn-right" for="gen7">S/M</label>
        </span>
        <span title="Select the calculator's mode of function.">
            <input class="mode visually-hidden" type="radio" name="mode" id="all-vs-one" /><label class="btn btn-wide btn-right right" for="all-vs-one">All vs One</label>
            <input class="mode visually-hidden" type="radio" name="mode" id="one-vs-all" /><label class="btn btn-wide btn-mid right" for="one-vs-all">One vs All</label>
            <input class="mode visually-hidden" type="radio" name="mode" id="one-vs-one" /><label class="btn btn-wide btn-left right" for="one-vs-one">One vs One</label>
        </span>
    </div>
    <hr />
    <div>
        <span class="title-text">Tier(s)/Format: </span>
        <span class="tiers" title="Select the tier(s)/format.">
            <input class="visually-hidden" type="radio" name="tier" id="VGC17" /><label class="btn btn-left gen-specific g7" for="VGC17">VGC 17</label>
            <input class="visually-hidden" type="radio" name="tier" id="Doubles" /><label class="btn btn-mid gen-specific g5 g6 g7" for="Doubles">Doubles</label>
            <input class="visually-hidden" type="radio" name="tier" id="LC" /><label class="btn btn-mid gen-specific g4 g5 g6 g7" for="LC">LC</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="PU" /><label class="btn btn-mid gen-specific g6 g7" for="PU">PU</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="NU" /><label class="btn btn-mid gen-specific g3 g4 g5 g6 g7" for="NU">NU</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="RU" /><label class="btn btn-mid gen-specific g5 g6 g7" for="RU">RU</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="UU" /><label class="btn btn-mid" for="UU">UU</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="OU" /><label class="btn btn-mid" for="OU">OU</label>
            <input class="visually-hidden" type="checkbox" name="tier" id="Uber" /><label class="btn btn-right" for="Uber">Uber</label>
    </span>
    </div>

</div>

    <div class="panel-group" id="accordion">
        <fieldset class="panel panel-default poke-info" id="p1">
            <legend class="panel-heading panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">>  Pokemon</a>
            </legend>
            <div id="collapseOne" class="panel-collapse collapse in">
                <div class="panel-body">
                    <input type="text" class="set-selector" />
                    <div class="info-group">
                        <div>
                            <label>Type</label>
                            <select class="type1 terrain-trigger"></select>
                            <select class="type2 terrain-trigger"></select>
                        </div>
                        <div class="hide">
                            <label>Forme</label>
                            <select class="forme calc-trigger"></select>
                        </div>
                        <div>
                            <label>Level</label>
                            <input class="level" value="100" />
                        </div>
                        <div class="hide">
                            <label>Weight (kg)</label>
                            <input class="weight" value="10.0" />
                        </div>
                    </div>
                    <div class="info-group">
                        <table>
                            <tr>
                                <th></th>
                                <th>Base</th>
                                <th class="gen-specific g3 g4 g5 g6 g7">IVs</th>
                                <th class="gen-specific g3 g4 g5 g6 g7">EVs</th>
                                <th class="gen-specific g1 g2 hide">DVs</th>
                                <th></th>
                                <th></th>
                            </tr>
                            <tr class="hp">
                                <td>
                                    <label>HP</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" disabled="disabled" />
                                </td>
                                <td><span class="total">341</span>
                                </td>
                                <td></td>
                            </tr>
                            <tr class="at">
                                <td>
                                    <label>Attack</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                            <tr class="df">
                                <td>
                                    <label>Defense</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                            <tr class="sa gen-specific g2 g3 g4 g5 g6 g7">
                                <td>
                                    <label>Sp. Atk</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                            <tr class="sd gen-specific g2 g3 g4 g5 g6 g7">
                                <td>
                                    <label>Sp. Def</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" disabled="disabled" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                            <tr class="sl gen-specific g1 hide">
                                <td>
                                    <label>Special</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td>
                                    <input class="dvs" value="15" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                            <tr class="sp">
                                <td>
                                    <label>Speed</label>
                                </td>
                                <td>
                                    <input class="base" value="100" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="ivs" value="31" />
                                </td>
                                <td class="gen-specific g3 g4 g5 g6 g7">
                                    <input class="evs" type="number" min="0" max="252" step="4" value="0" />
                                </td>
                                <td class="gen-specific g1 g2 hide">
                                    <input class="dvs" value="15" />
                                </td>
                                <td><span class="total">236</span>
                                </td>
                                <td>
                                    <select class="boost">
                                        <option value="6">+6</option>
                                        <option value="5">+5</option>
                                        <option value="4">+4</option>
                                        <option value="3">+3</option>
                                        <option value="2">+2</option>
                                        <option value="1">+1</option>
                                        <option value="0" selected="selected">--</option>
                                        <option value="-1">-1</option>
                                        <option value="-2">-2</option>
                                        <option value="-3">-3</option>
                                        <option value="-4">-4</option>
                                        <option value="-5">-5</option>
                                        <option value="-6">-6</option>
                                    </select>
                                </td>
                            </tr>
                        </table>
                    </div>
                    <div class="info-group info-selectors">
                        <div class="gen-specific g3 g4 g5 g6 g7">
                            <label>Nature</label>
                            <select class="nature">
                                <option value="Adamant">Adamant (+Atk, -SpA)</option>
                                <option value="Bashful">Bashful</option>
                                <option value="Bold">Bold (+Def, -Atk)</option>
                                <option value="Brave">Brave (+Atk, -Spe)</option>
                                <option value="Calm">Calm (+SpD, -Atk)</option>
                                <option value="Careful">Careful (+SpD, -SpA)</option>
                                <option value="Docile">Docile</option>
                                <option value="Gentle">Gentle (+SpD, -Def)</option>
                                <option value="Hardy" selected="selected">Hardy</option>
                                <option value="Hasty">Hasty (+Spe, -Def)</option>
                                <option value="Impish">Impish (+Def, -SpA)</option>
                                <option value="Jolly">Jolly (+Spe, -SpA)</option>
                                <option value="Lax">Lax (+Def, -SpD)</option>
                                <option value="Lonely">Lonely (+Atk, -Def)</option>
                                <option value="Mild">Mild (+SpA, -Def)</option>
                                <option value="Modest">Modest (+SpA, -Atk)</option>
                                <option value="Naive">Naive (+Spe, -SpD)</option>
                                <option value="Naughty">Naughty (+Atk, -SpD)</option>
                                <option value="Quiet">Quiet (+SpA, -Spe)</option>
                                <option value="Quirky">Quirky</option>
                                <option value="Rash">Rash (+SpA, -SpD)</option>
                                <option value="Relaxed">Relaxed (+Def, -Spe)</option>
                                <option value="Sassy">Sassy (+SpD, -Spe)</option>
                                <option value="Serious">Serious</option>
                                <option value="Timid">Timid (+Spe, -Atk)</option>
                            </select>
                        </div>
                        <div class="gen-specific g3 g4 g5 g6 g7">
                            <label>Ability</label>
                            <select class="ability terrain-trigger"></select>
                        </div>
                        <div class="gen-specific g2 g3 g4 g5 g6 g7">
                            <label>Item</label>
                            <select class="item terrain-trigger"></select>
                        </div>
                        <div>
                            <label>Status</label>
                            <select class="status">
                                <option value="Healthy">Healthy</option>
                                <option value="Poisoned">Poisoned</option>
                                <option value="Badly Poisoned">Badly Poisoned</option>
                                <option value="Burned">Burned</option>
                                <option value="Paralyzed">Paralyzed</option>
                                <option value="Asleep">Asleep</option>
                                <option value="Frozen">Frozen</option>
                            </select>
                            <select class="toxic-counter hide">
                                <option value="1">1/16</option>
                                <option value="2">2/16</option>
                                <option value="3">3/16</option>
                                <option value="4">4/16</option>
                                <option value="5">5/16</option>
                                <option value="6">6/16</option>
                                <option value="7">7/16</option>
                                <option value="8">8/16</option>
                                <option value="9">9/16</option>
                                <option value="10">10/16</option>
                                <option value="11">11/16</option>
                                <option value="12">12/16</option>
                                <option value="13">13/16</option>
                                <option value="14">14/16</option>
                                <option value="15">15/16</option>
                            </select>
                        </div>
                    </div>
                    <div class="info-group">
                        <label>Current HP</label>
                        <input class="current-hp" value="341" />/<span class="max-hp">341</span> (
                        <input class="percent-hp" value="100" />%)
                    </div>
                    <div class="move1">
                        <select class="move-selector small-select"></select>
                        <input class="move-bp" value="50" />
                        <select class="move-type"></select>
                        <select class="move-cat gen-specific g4 g5 g6 g7">
                            <option value="Physical">Physical</option>
                            <option value="Special">Special</option>
                        </select>
                        <input class="move-crit visually-hidden" type="checkbox" id="critL1" />
                        <label class="btn crit-btn" for="critL1" title="Force this attack to be a critical hit?">Crit</label>
                        <input class="move-z visually-hidden" type="checkbox" id="zL1"/>
                        <label class="btn z-btn gen-specific g7" for="zL1" title="Make this attack a Z-move?">Z</label>
                        <select class="move-hits hide">
                            <option value="2">2 hits</option>
                            <option value="3">3 hits</option>
                            <option value="4">4 hits</option>
                            <option value="5">5 hits</option>
                        </select>
                    </div>
                    <div class="move2">
                        <select class="move-selector small-select"></select>
                        <input class="move-bp" value="0" />
                        <select class="move-type"></select>
                        <select class="move-cat gen-specific g4 g5 g6 g7">
                            <option value="Physical">Physical</option>
                            <option value="Special">Special</option>
                        </select>
                        <input class="move-crit visually-hidden" type="checkbox" id="critL2" />
                        <label class="btn crit-btn" for="critL2" title="Force this attack to be a critical hit?">Crit</label>
                        <input class="move-z visually-hidden" type="checkbox" id="zL2"/>
                        <label class="btn z-btn gen-specific g7" for="zL2" title="Make this attack a Z-move?">Z</label>
                        <select class="move-hits hide">
                            <option value="2">2 hits</option>
                            <option value="3">3 hits</option>
                            <option value="4">4 hits</option>
                            <option value="5">5 hits</option>
                        </select>
                    </div>
                    <div class="move3">
                        <select class="move-selector small-select"></select>
                        <input class="move-bp" value="0" />
                        <select class="move-type"></select>
                        <select class="move-cat gen-specific g4 g5 g6 g7">
                            <option value="Physical">Physical</option>
                            <option value="Special">Special</option>
                        </select>
                        <input class="move-crit visually-hidden" type="checkbox" id="critL3" />
                        <label class="btn crit-btn" for="critL3" title="Force this attack to be a critical hit?">Crit</label>
                        <input class="move-z visually-hidden" type="checkbox" id="zL3"/>
                        <label class="btn z-btn gen-specific g7" for="zL3" title="Make this attack a Z-move?">Z</label>
                        <select class="move-hits hide">
                            <option value="2">2 hits</option>
                            <option value="3">3 hits</option>
                            <option value="4">4 hits</option>
                            <option value="5">5 hits</option>
                        </select>
                    </div>
                    <div class="move4">
                        <select class="move-selector small-select"></select>
                        <input class="move-bp" value="0" />
                        <select class="move-type"></select>
                        <select class="move-cat gen-specific g4 g5 g6 g7">
                            <option value="Physical">Physical</option>
                            <option value="Special">Special</option>
                        </select>
                        <input class="move-crit visually-hidden" type="checkbox" id="critL4" />
                        <label class="btn crit-btn" for="critL4" title="Force this attack to be a critical hit?">Crit</label>
                        <input class="move-z visually-hidden" type="checkbox" id="zL4"/>
                        <label class="btn z-btn gen-specific g7" for="zL4" title="Make this attack a Z-move?">Z</label>
                        <select class="move-hits hide">
                            <option value="2">2 hits</option>
                            <option value="3">3 hits</option>
                            <option value="4">4 hits</option>
                            <option value="5">5 hits</option>
                        </select>
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="panel panel-default field-info">
            <legend class="panel-heading panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">>  Field</a>
            </legend>
            <div id="collapseTwo" class="panel-collapse collapse">
                <div class="panel-body">
                    <div class="gen-specific g3 g4 g5 g6 g7" style="width: 10.6em; margin: 0 auto 5px;" title="Select the battle format.">
                        <input class="visually-hidden" type="radio" name="format" value="Singles" id="singles-format" checked="checked" />
                        <label class="btn btn-left" for="singles-format">Singles</label>
                        <input class="visually-hidden" type="radio" name="format" value="Doubles" id="doubles-format" />
                        <label class="btn btn-right" for="doubles-format">Doubles</label>
                    </div>
                    <div class="gen-specific g6 g7" title="Select the current terrain.">
                        <input class="visually-hidden terrain-trigger calc-trigger" type="checkbox" name="terrain" value="Electric" id="electric" /><label class="btn btn-xxxwide btn-left" for="electric">Electric Terrain</label>
                        <input class="visually-hidden terrain-trigger calc-trigger" type="checkbox" name="terrain" value="Grassy" id="grassy" /><label class="btn btn-xxxwide btn-mid" for="grassy">Grassy Terrain</label>
                        <input class="visually-hidden terrain-trigger calc-trigger" type="checkbox" name="terrain" value="Misty" id="misty" /><label class="btn btn-xxxwide btn-right" for="misty">Misty Terrain</label>
                    </div>
                    <div class="gen-specific g7" title="Select the current terrain.">
                        <input class="visually-hidden terrain-trigger calc-trigger" type="checkbox" name="terrain" value="Psychic" id="psychic" /><label class="btn btn-xxxwide btn-mid" for="psychic">Psychic Terrain</label>
                    </div>
                    <hr class="gen-specific g6 g7" />
                    <div class="gen-specific g3 g4 g5 g6 g7" style="width: 22.2em; margin: 5px auto;" title="Select the current weather condition.">
                        <input class="visually-hidden" type="radio" name="weather" value="" id="clear" checked="checked" />
                        <label class="btn btn-small btn-left" for="clear">None</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Sun" id="sun" />
                        <label class="btn btn-small btn-mid" for="sun">Sun</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Rain" id="rain" />
                        <label class="btn btn-small btn-mid" for="rain">Rain</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Sand" id="sand" />
                        <label class="btn btn-small btn-mid" for="sand">Sand</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Hail" id="hail" />
                        <label class="btn btn-small btn-right" for="hail">Hail</label>
                    </div>
                    <div class="gen-specific g6 g7" title="Select the current weather condition.">
                        <input class="visually-hidden" type="radio" name="weather" value="Harsh Sunshine" id="harsh-sunshine" />
                        <label class="btn btn-xxxwide btn-left" for="harsh-sunshine">Harsh Sunshine</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Heavy Rain" id="heavy-rain" />
                        <label class="btn btn-xxxwide btn-mid" for="heavy-rain">Heavy Rain</label>
                        <input class="visually-hidden" type="radio" name="weather" value="Strong Winds" id="strong-winds" />
                        <label class="btn btn-xxxwide btn-right" for="strong-winds">Strong Winds</label>
                    </div>
                    <div class="gen-specific g2 hide" style="width: 17.8em; margin: 0 auto 5px;" title="Select the current weather condition.">
                        <input class="visually-hidden" type="radio" name="gscWeather" value="" id="gscClear" checked="checked" />
                        <label class="btn btn-small btn-left" for="gscClear">None</label>
                        <input class="visually-hidden" type="radio" name="gscWeather" value="Sun" id="gscSun" />
                        <label class="btn btn-small btn-mid" for="gscSun">Sun</label>
                        <input class="visually-hidden" type="radio" name="gscWeather" value="Rain" id="gscRain" />
                        <label class="btn btn-small btn-mid" for="gscRain">Rain</label>
                        <input class="visually-hidden" type="radio" name="gscWeather" value="Sand" id="gscSand" />
                        <label class="btn btn-small btn-right" for="gscSand">Sand</label>
                    </div>
                    <div class="gen-specific g4 g5 g6 g7" style="width: 5.3em; margin: 5px auto;" title="Is gravity in effect?">
                        <input class="visually-hidden" type="checkbox" id="gravity" />
                        <label class="btn" for="gravity">Gravity</label>
                    </div>
                    <hr class="gen-specific g2 g3 g4 g5 g6 g7" />
                    <div class="btn-group gen-specific g4 g5 g6 g7">
                        <div class="left" title="Is Stealth Rock affecting this side of the field?">
                            <input class="visually-hidden" type="checkbox" id="srL" />
                            <label class="btn btn-xwide" for="srL">Stealth Rock</label>
                        </div>
                        <div class="right" title="Is Stealth Rock affecting this side of the field?">
                            <input class="visually-hidden" type="checkbox" id="srR" />
                            <label class="btn btn-xwide" for="srR">Stealth Rock</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g3 g4 g5 g6 g7">
                        <div class="left" title="Are there Spikes on this side of the field?">
                            <input class="visually-hidden" type="radio" name="spikesL" value="0" id="spikesL0" checked="checked" />
                            <label class="btn btn-xsmall btn-left" for="spikesL0">0</label>
                            <input class="visually-hidden" type="radio" name="spikesL" value="1" id="spikesL1" />
                            <label class="btn btn-xsmall btn-mid" for="spikesL1">1</label>
                            <input class="visually-hidden" type="radio" name="spikesL" value="2" id="spikesL2" />
                            <label class="btn btn-xsmall btn-mid" for="spikesL2">2</label>
                            <input class="visually-hidden" type="radio" name="spikesL" value="3" id="spikesL3" />
                            <label class="btn btn-wide btn-right" for="spikesL3">3 Spikes</label>
                        </div>
                        <div class="right" title="Are there Spikes on this side of the field?">
                            <input class="visually-hidden" type="radio" name="spikesR" value="0" id="spikesR0" checked="checked" />
                            <label class="btn btn-xsmall btn-left" for="spikesR0">0</label>
                            <input class="visually-hidden" type="radio" name="spikesR" value="1" id="spikesR1" />
                            <label class="btn btn-xsmall btn-mid" for="spikesR1">1</label>
                            <input class="visually-hidden" type="radio" name="spikesR" value="2" id="spikesR2" />
                            <label class="btn btn-xsmall btn-mid" for="spikesR2">2</label>
                            <input class="visually-hidden" type="radio" name="spikesR" value="3" id="spikesR3" />
                            <label class="btn btn-wide btn-right" for="spikesR3">3 Spikes</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g2">
                        <div class="left" title="Are there Spikes on this side of the field?">
                            <input class="visually-hidden" type="checkbox" id="gscSpikesL" />
                            <label class="btn" for="gscSpikesL">Spikes</label>
                        </div>
                        <div class="right" title="Are there Spikes on this side of the field?">
                            <input class="visually-hidden" type="checkbox" id="gscSpikesR" />
                            <label class="btn" for="gscSpikesR">Spikes</label>
                        </div>
                    </div>
                    <div class="btn-group">
                        <div class="left" title="Is this Pok&eacute;mon protected by Reflect and/or Light Screen?">
                            <input class="visually-hidden" type="checkbox" id="reflectL" />
                            <label class="btn btn-left" for="reflectL">Reflect</label>
                            <input class="visually-hidden" type="checkbox" id="lightScreenL" />
                            <label class="btn btn-xwide btn-right" for="lightScreenL">Light Screen</label>
                        </div>
                        <div class="right" title="Is this Pok&eacute;mon protected by Reflect and/or Light Screen?">
                            <input class="visually-hidden" type="checkbox" id="reflectR" />
                            <label class="btn btn-left" for="reflectR">Reflect</label>
                            <input class="visually-hidden" type="checkbox" id="lightScreenR" />
                            <label class="btn btn-xwide btn-right" for="lightScreenR">Light Screen</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g2 g3 g4 g5 g6 g7">
                        <div class="left" title="Is this Pok&eacute;mon protected?">
                            <input class="visually-hidden" type="checkbox" id="protectL" />
                            <label class="btn btn-wide" for="protectL">Protect</label>
                        </div>
                        <div class="right" title="Is this Pok&eacute;mon protected?">
                            <input class="visually-hidden" type="checkbox" id="protectR" />
                            <label class="btn btn-wide" for="protectR">Protect</label>
                        </div>
                    </div>
                    <div class="btn-group">
                        <div class="left" title="Has this Pok&eacute;mon been affected by Leech Seed?">
                            <input class="visually-hidden" type="checkbox" id="leechSeedL" />
                            <label class="btn btn-wide" for="leechSeedL">Leech Seed</label>
                        </div>
                        <div class="right" title="Has this Pok&eacute;mon been affected by Leech Seed?">
                            <input class="visually-hidden" type="checkbox" id="leechSeedR" />
                            <label class="btn btn-wide" for="leechSeedR">Leech Seed</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g2 g3 g4 g5 g6 g7">
                        <div class="left" title="Has this Pok&eacute;mon been revealed with Foresight or Odor Sleuth?">
                            <input class="visually-hidden" type="checkbox" id="foresightL" />
                            <label class="btn btn-wide" for="foresightL">Foresight</label>
                        </div>
                        <div class="right" title="Has this Pok&eacute;mon been revealed with Foresight or Odor Sleuth?">
                            <input class="visually-hidden" type="checkbox" id="foresightR" />
                            <label class="btn btn-wide" for="foresightR">Foresight</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g3 g4 g5 g6 g7">
                        <div class="left" title="Has this Pok&eacute;mon's power been boosted by an ally's Helping Hand?">
                            <input class="visually-hidden" type="checkbox" id="helpingHandL" />
                            <label class="btn btn-xxwide" for="helpingHandL">Helping Hand</label>
                        </div>
                        <div class="right" title="Has this Pok&eacute;mon's power been boosted by an ally's Helping Hand?">
                            <input class="visually-hidden" type="checkbox" id="helpingHandR" />
                            <label class="btn btn-xxwide" for="helpingHandR">Helping Hand</label>
                        </div>
                    </div>    
                    <div class="btn-group gen-specific g5 g6 g7">
                        <div class="left" title="Is the Pok&eacute;mon protected by an ally's Friend Guard?">
                            <input class="visually-hidden" type="checkbox" id="friendGuardL" />
                            <label class="btn btn-xxwide" for="friendGuardL">Friend Guard</label>
                        </div>
                        <div class="right" title="Is the Pok&eacute;mon protected by an ally's Friend Guard?">
                            <input class="visually-hidden" type="checkbox" id="friendGuardR" />
                            <label class="btn btn-xxwide" for="friendGuardR">Friend Guard</label>
                        </div>
                    </div>
                    <div class="btn-group gen-specific g7">
                        <div class="left" title="Is the Pok&eacute;mon protected by an ally's Aurora Veil?">
                            <input class="visually-hidden" type="checkbox" id="auroraVeilL" />
                            <label class="btn btn-xxwide" for="auroraVeilL">Aurora Veil</label>
                        </div>
                        <div class="right" title="Is the Pok&eacute;mon protected by an ally's Aurora Veil?">
                            <input class="visually-hidden" type="checkbox" id="auroraVeilR" />
                            <label class="btn btn-xxwide" for="auroraVeilR">Aurora Veil</label>
                        </div>
                    </div>
                </div>
            </div>
        </fieldset>
    </div>
    <div>
        <fieldset class="panel holder-0">
            <legend class="panel-heading panel-title">Damage Results</legend>
            <table class="hide display" id="holder-2">
                <thead>
                    <tr>
                        <th></th>
                        <th>Best Move</th>
                        <th>Damage (%)</th>
                        <th>Damage (px)</th>
                        <th>KO Chance</th>
                        <th>Type 1</th>
                        <th>Type 2</th>
                        <th>Ability</th>
                        <th>Item</th>
                    </tr>
                </thead>
            </table>
        </fieldset>
    </div>
    <!-- jquery.dataTables is incompatible with newer versions of jQuery -->
    <script type="text/javascript" src="./js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> <!-- to be replaced (probably) -->
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/colvis/1.1.1/js/dataTables.colVis.min.js"></script>
    <script type="text/javascript" src="./js/lodash.min.js?"></script>
    <script type="text/javascript" src="./select2/select2.min.js?"></script>
    <script type="text/javascript" src="./js/data/pokedex.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_sm.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_xy.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_bw.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_dpp.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_rse.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_gsc.js?"></script>
    <script type="text/javascript" src="./js/data/setdex_rby.js?"></script>
    <script type="text/javascript" src="./js/data/stat_data.js?"></script>
    <script type="text/javascript" src="./js/data/type_data.js?"></script>
    <script type="text/javascript" src="./js/data/nature_data.js?"></script>
    <script type="text/javascript" src="./js/data/ability_data.js?"></script>
    <script type="text/javascript" src="./js/data/item_data.js?"></script>
    <script type="text/javascript" src="./js/data/move_data.js?"></script>
    <script type="text/javascript" src="./js/shared_controls.js?"></script>
    <script type="text/javascript" src="./js/honkalculate_controls.js?"></script>
    <script type="text/javascript" src="./js/damage.js?"></script>
    <script type="text/javascript" src="./js/damage_dpp.js?"></script>
    <script type="text/javascript" src="./js/damage_rse.js?"></script>
    <script type="text/javascript" src="./js/damage_gsc.js?"></script>
    <script type="text/javascript" src="./js/damage_rby.js?"></script>
    <script type="text/javascript" src="./js/ko_chance.js?"></script>

    <div style="clear:both;padding:20px;text-align:right"><p><a href="https://github.com/Zarel/honko-damagecalc" target="_blank">GitHub repository for the damage calculator</a></p></div>

</body>

</html>