PokeTypes Calculator

pokeTypes JS object imported from my GitHub

by Taylor Lopez

HTML

<script src="https://rawgit.com/iAmMortos/PokeTypeJsObj/master/pokeTypes.js"></script>
<div id="damageChecker">
    <div id="damageControls"></div>
    <div id="damageEntries"></div>
</div>
<button id="showTypeChartBtn">Type Chart</button>

CSS

html
{
    opacity: 1;
}

/*
img.small
{
    width: 24px;
    height: 8px;
}
*/

JavaScript

var $damageChecker, $damageEntries, $damageControls;
var typeTableShown = false;
var types = pokeTypes;

function main()
{
    // showTypeTable();
    // alert(types.superEffectiveAgainst("steel"));
    $damageChecker = $("#damageChecker");
    $damageEntries = $("#damageEntries");
    $damageControls = $("#damageControls");
    
    showDamageChecker();
    $("#showTypeChartBtn").click(function(){ showTypeTable(); });
}

function showDamageChecker()
{
    var $sel = $("<select>");
    types.all.sort().forEach(function(elem){$sel.append($("<option>").text(types.long[elem]).attr("value",elem))});
    $damageControls.append($sel);
    var $sel2 = $sel.clone();
    $sel2.prepend($("<option>").text("-- None --").attr("value", "null")).val("null");
    $damageControls.append($sel2);
    var $btn = $("<button>").text("Get Weaknesses!");
    $damageControls.append($btn);
    var $resetBtn = $("<button>").text("Reset");
    $damageControls.append($resetBtn);
    
    $resetBtn.click(function(){$damageEntries.html("")});
    
    $sel.change(function(){
    	if ($sel.val() === $sel2.val())
            $sel2.val("null");
        
    });
    
    $btn.click(function()
	{
        var sortedTypes = types.all.sort();
        var $tab = $("<table>").css("border","solid 1px black");
        var $titleRow = $("<tr>");
        $tab.append($titleRow);
        var $typeTitle = $("<th>").attr("colspan", types.all.length);
        $typeTitle.text("Weaknesses for ").append(types.getImage($sel.val()));
        if ($sel2.val() !== "null")
            $typeTitle.append(types.getImage($sel2.val()));
        $titleRow.append($typeTitle);
        var $headerRow = $("<tr>");
        $tab.append($headerRow);
        sortedTypes.forEach(function(elem){$headerRow.append($("<th>").append($(types.getImage(elem)).addClass("small")))});
        var $dataRow = $("<tr>");
        $tab.append($dataRow);
        sortedTypes.forEach(function(elem){
        	var dmg = 1;
            dmg *=...