538202e7ac
remove poison stats box for now now melee stats box is correct with melee modifiers, and also neater in code
1277 lines
99 KiB
HTML
1277 lines
99 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="HandheldFriendly" content="true" />
|
|
<meta name="MobileOptimized" content="320" />
|
|
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, width=device-width, user-scalable=no" />
|
|
|
|
<title>WynnBuilder</title>
|
|
<link rel="icon" href="../media/icons/new/builder.png" type="image/icon type">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=.45, user-scalable=no">
|
|
|
|
<!-- nunito font, copying wynnbuilder, which is copying wynndata -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.6/dist/css/autoComplete.min.css">
|
|
|
|
<link rel="stylesheet" href="../css/sq2bs.css">
|
|
<link rel="stylesheet" href="../css/sidebar.css">
|
|
<link rel="stylesheet" href="../css/wynnstyles.css">
|
|
</head>
|
|
<body class="text-light" id = "body">
|
|
<!-- main -->
|
|
<div id="main-sidebar" class="sidebar dark-7 dark-shadow">
|
|
<a href = ""><img src="../media/icons/new/builder.png" alt = "WynnBuilder" title = "WynnBuilder"><b>WynnBuilder</b></a>
|
|
<a href = "../crafter/"><img src = "../media/icons/new/crafter.png" alt = "WynnCrafter" title = "WynnCrafter"><b>WynnCrafter</b></a>
|
|
<a href = "../items/"><img src = "../media/icons/new/searcher.png" alt = "WynnAtlas" title = "WynnAtlas"><b>WynnAtlas</b></a>
|
|
<a href = "../custom/"><img src = "../media/icons/new/custom.png" alt = "WynnCustom" title = "WynnCustom"><b>WynnCustom</b></a>
|
|
<a href = "../map/"><img src = "../media/icons/new/compass.png" alt = "WynnGPS" title = "WynnGPS"><b>WynnGPS</b></a>
|
|
<a href = "../wynnfo/"><img src = "../media/icons/new/book.png" alt = "Wynnfo" title = "Wynnfo"><b>Wynnfo</b></a>
|
|
<a onclick = "toggleIcons()"><img src = "../media/icons/new/reload.png" alt = "" title = "Swap items on page"><b>Swap Icon Style</b></a>
|
|
<hr/>
|
|
<a href = "https://discord.gg/CGavnAnerv" target = "_blank"><img src = "../media/icons/discord.png" alt = "WB Discord" title = "WB Discord"><b>WB Discord</b></a>
|
|
</div>
|
|
<div class="container-fluid me-4" style="max-width: 95%;">
|
|
<!-- REMOVE THIS DIV AT SOME POINT. -->
|
|
<div class = "row scaled-font mx-auto" id = "discord-banner-dev">
|
|
<div class = "col text-center item-title">Join the <a class = "link" href = "https://discord.gg/CGavnAnerv" target = "_blank">discord</a> today to suggest new features, submit bug reports, and hangout/talk to devs!</div>
|
|
</div>
|
|
<div class="row h-100 gx-lg-5 gy-3 mx-2 mx-lg-3 py-3">
|
|
<div class="col-xl-6">
|
|
<div class="row row-cols-1 mb-3 gy-4">
|
|
<div class="col">
|
|
<div class="row row-cols-1 row-cols-xl-2 rounded gy-4 gx-5 justify-content-center">
|
|
<div class="col-auto rounded order-xl-0 order-0">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="helmet-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="helmet-img-loc">
|
|
<img id="helmet-img" class="img-fluid rounded" src="../media/items/new/generic-helmet.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="helmet-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="helmet-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="helmet-choice" name="helmet-choice" placeholder="No Helmet" value="" tabindex="1"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" type="text" id="helmet-powder" name="helmet-powder" placeholder="powders" tabindex="1"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="ring1-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="ring1-img-loc">
|
|
<img id="ring1-img" class="img-fluid rounded" src="../media/items/new/generic-ring.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="ring1-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="ring1-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="ring1-choice" name="ring1-choice" placeholder="No ring" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end" style="height: 100%;">
|
|
<!-- <input class="equipment-input text-light form-control" type="text" id="ring1-powder" name="ring1-powder" placeholder="no powders" tabindex="2"/> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-0">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="chestplate-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="chestplate-img-loc">
|
|
<img id="chestplate-img" class="img-fluid rounded" src="../media/items/new/generic-chestplate.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="chestplate-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="chestplate-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="chestplate-choice" name="chestplate-choice" placeholder="No chestplate" value="" tabindex="1"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" type="text" id="chestplate-powder" name="chestplate-powder" placeholder="powders" tabindex="1"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="ring2-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="ring2-img-loc">
|
|
<img id="ring2-img" class="img-fluid rounded" src="../media/items/new/generic-ring.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="ring2-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="ring2-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="ring2-choice" name="ring2-choice" placeholder="No ring" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end" style="height: 100%;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-0">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="leggings-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="leggings-img-loc">
|
|
<img id="leggings-img" class="img-fluid rounded" src="../media/items/new/generic-leggings.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="leggings-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="leggings-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="leggings-choice" name="leggings-choice" placeholder="No leggings" value="" tabindex="1"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" type="text" id="leggings-powder" name="leggings-powder" placeholder="powders" tabindex="1"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="bracelet-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="bracelet-img-loc">
|
|
<img id="bracelet-img" class="img-fluid rounded" src="../media/items/new/generic-bracelet.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="bracelet-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="bracelet-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="bracelet-choice" name="bracelet-choice" placeholder="No bracelet" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end" style="height: 100%;">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-0">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="boots-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="boots-img-loc">
|
|
<img id="boots-img" class="img-fluid rounded" src="../media/items/new/generic-boots.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="boots-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="boots-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="boots-choice" name="boots-choice" placeholder="No boots" value="" tabindex="1"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" type="text" id="boots-powder" name="boots-powder" placeholder="powders" tabindex="1"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id="necklace-dropdown">
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="necklace-img-loc">
|
|
<img id="necklace-img" class="img-fluid rounded" src="../media/items/new/generic-necklace.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font Health fw-bold gx-3" id="necklace-health">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="necklace-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="necklace-choice" name="necklace-choice" placeholder="No necklace" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end" style="height: 100%;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded" id='weapon-dropdown'>
|
|
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="weapon-img-loc">
|
|
<img id="weapon-img" class="img-fluid rounded" src="../media/items/new/generic-dagger.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col text-nowrap scaled-font fw-bold gx-3 Damage base_dps" id="weapon-dps">
|
|
0
|
|
</div>
|
|
<div class="col text-nowrap scaled-font lvl fw-bold gx-3" id="weapon-lv">
|
|
0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" id="weapon-choice" name="weapon-choice" placeholder="No Weapon" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control" type="text" id="weapon-powder" name="weapon-powder" placeholder="powders" tabindex="2"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto order-xl-0 order-1">
|
|
<div class="row h-100 dark-shadow dark-6 rounded">
|
|
<div class="col">
|
|
<div class="row align-items-center">
|
|
<div class="col-3 text-nowrap fw-bold scaled-font">
|
|
Level:
|
|
</div>
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input text-light form-control form-control-sm" id="level-choice" name="level-choice" value="106" placeholder="Build level" value="" tabindex="2"/>
|
|
</div>
|
|
<div class="col-auto px-1 text-nowrap scaled-font">
|
|
<button class="button fw-bold text-light dark-5 scaled-font rounded" id="reset-button" onclick="resetFields()">Reset</button>
|
|
</div>
|
|
</div>
|
|
<div class="row align-items-center justify-content-center my-1">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto px-1 text-nowrap scaled-font">
|
|
<button class="border-dark text-light dark-5 scaled-font rounded" id=copy-button onclick="copyBuild()">Copy short</button>
|
|
</div>
|
|
<div class="col-auto px-1 text-nowrap scaled-font">
|
|
<button class="border-dark text-light dark-5 scaled-font rounded" id=share-button onclick="shareBuild(player_build)">Copy for sharing</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="row row-cols-1 gy-2 rounded dark-5 dark-shadow">
|
|
<div class="col">
|
|
<div class="row row-cols-2 row-cols-xl-5 gy-2 justify-content-center">
|
|
<div class="col text-center gx-2">
|
|
<div class="rounded dark-6 dark-shadow-sm px-2">
|
|
<label for="str-skp" class="eDam skp-tooltip">Strength</label>
|
|
<input type="string" id="str-skp" name="str-skp" value="0" class="skp-update skp-tooltip border-dark dark-7 text-light text-center rounded" tabindex="2"/>
|
|
<div id="str-skp-assign" class="skp-tooltip">
|
|
Assign: 0
|
|
</div>
|
|
<div id="str-skp-base" class="skp-tooltip">
|
|
Original: 0
|
|
</div>
|
|
<div id="str-skp-pct" class="skp-tooltip">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col text-center gx-2">
|
|
<div class="rounded dark-6 dark-shadow-sm px-2">
|
|
<label for="dex-skp" class="tDam skp-tooltip">Dexterity</label>
|
|
<input type="string" id="dex-skp" name="dex-skp" value="0" class="skp-update skp-tooltip border-dark dark-7 text-light text-center rounded" tabindex="2"/>
|
|
<div id="dex-skp-assign" class="skp-tooltip">
|
|
Assign: 0
|
|
</div>
|
|
<div id="dex-skp-base" class="skp-tooltip">
|
|
Original: 0
|
|
</div>
|
|
<div id ="dex-skp-pct" class="skp-tooltip">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col text-center gx-2">
|
|
<div class="rounded dark-6 dark-shadow-sm px-2">
|
|
<label for="int-skp" class="wDam skp-tooltip text-nowrap">Intelligence</label>
|
|
<input type="string" id="int-skp" name="int-skp" value="0" class="skp-update skp-tooltip border-dark dark-7 text-light text-center rounded" tabindex="2"/>
|
|
<div id="int-skp-assign" class="skp-tooltip">
|
|
Assign: 0
|
|
</div>
|
|
<div id="int-skp-base" class="skp-tooltip">
|
|
Original: 0
|
|
</div>
|
|
<div id ="int-skp-pct" class="skp-tooltip">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col text-center gx-2">
|
|
<div class="rounded dark-6 dark-shadow-sm px-2">
|
|
<label for="def-skp" class="fDam skp-tooltip">Defense</label>
|
|
<input type="string" id="def-skp" name="def-skp" value="0" class="skp-update skp-tooltip border-dark dark-7 text-light text-center rounded" tabindex="2"/>
|
|
<div id="def-skp-assign" class="skp-tooltip">
|
|
Assign: 0
|
|
</div>
|
|
<div id="def-skp-base" class="skp-tooltip">
|
|
Original: 0
|
|
</div>
|
|
<div id ="def-skp-pct" class="skp-tooltip">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col text-center gx-2">
|
|
<div class="rounded dark-6 dark-shadow-sm px-2">
|
|
<label for="agi-skp" class="aDam skp-tooltip">Agility</label>
|
|
<input type="string" id="agi-skp" name="agi-skp" value="0" class="skp-update skp-tooltip border-dark dark-7 text-light text-center rounded" tabindex="2"/>
|
|
<div id="agi-skp-assign" class="skp-tooltip">
|
|
Assign: 0
|
|
</div>
|
|
<div id="agi-skp-base" class="skp-tooltip">
|
|
Original: 0
|
|
</div>
|
|
<div id ="agi-skp-pct" class="skp-tooltip">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 text-center gx-2">
|
|
<button class = "button fw-bold text-light dark-5 rounded scaled-font" id = "optimize-strdex" onclick = "optimizeStrDex()">Optimize Str/Dex</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col text-center">
|
|
<div id="summary-box"></div>
|
|
<div id="err-box"></div>
|
|
<div id="stack-box"></div>
|
|
<div id="str-warnings"></div>
|
|
<div id="dex-warnings"></div>
|
|
<div id="int-warnings"></div>
|
|
<div id="def-warnings"></div>
|
|
<div id="agi-warnings"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="row row-cols-1 gy-4">
|
|
<div class="col mb-1">
|
|
<div class="row row-cols-1 row-cols-1 text-center scaled-font dark-5 rounded dark-shadow">
|
|
<div class="col fw-bold dark-4 rounded-top">
|
|
<div class = "row">
|
|
<div class = "col-3 py-2">
|
|
<button class = "col-auto button rounded scaled-font fw-bold text-light dark-5" id = "toggle-tomes" onclick = "toggle_tab('tomes-dropdown'); toggleButton('toggle-tomes')">
|
|
Show Tomes
|
|
</button>
|
|
</div>
|
|
<div class = "col-3 py-2">
|
|
<button class = "col-auto button rounded scaled-font fw-bold text-light dark-5" id = "toggle-atree" onclick = "toggle_tab('atree-dropdown'); toggleButton('toggle-atree')">
|
|
Edit Abilities
|
|
</button>
|
|
</div>
|
|
<div class = "col-3 py-2">
|
|
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "edit-ID-button" onclick = "toggle_tab('edit_id_tab'); toggleButton('edit-ID-button')">
|
|
Edit IDs
|
|
</button>
|
|
</div>
|
|
<div class = "col-3 py-2">
|
|
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "edit-ID-button" onclick = "resetEditableIDs();">
|
|
Reset Edited IDs
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "col dark-6 rounded-bottom my-3 my-xl-1" id = "tomes-dropdown" style = "display: none;">
|
|
<div class="row h-100 row-cols-1 row-cols-xl-2 gy-2 rounded">
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='weaponTome1-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="weaponTome1-img-loc">
|
|
<img id="weaponTome1-img" class="img-fluid rounded" src="../media/items/new/generic-weaponTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Weapon
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="weaponTome1-choice" name="weaponTome1-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='weaponTome2-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="weaponTome2-img-loc">
|
|
<img id="weaponTome2-img" class="img-fluid rounded" src="../media/items/new/generic-weaponTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Weapon
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="weaponTome2-choice" name="weaponTome2-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='armorTome1-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="armorTome1-img-loc">
|
|
<img id="armorTome1-img" class="img-fluid rounded" src="../media/items/new/generic-armorTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Armor
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="armorTome1-choice" name="armorTome1-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='armorTome2-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="armorTome2-img-loc">
|
|
<img id="armorTome2-img" class="img-fluid rounded" src="../media/items/new/generic-armorTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Armor
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="armorTome2-choice" name="armorTome2-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='armorTome3-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="armorTome3-img-loc">
|
|
<img id="armorTome3-img" class="img-fluid rounded" src="../media/items/new/generic-armorTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Armor
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="armorTome3-choice" name="armorTome3-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='armorTome4-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="armorTome4-img-loc">
|
|
<img id="armorTome4-img" class="img-fluid rounded" src="../media/items/new/generic-armorTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Armor
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="armorTome4-choice" name="armorTome4-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto rounded">
|
|
<div class="row h-100 dark-shadow rounded" id='guildTome1-dropdown'>
|
|
<div class="col-auto g-0 rounded-end my-auto text-center scaled-item-icon" id="guildTome1-img-loc">
|
|
<img id="guildTome1-img" class="img-fluid rounded" src="../media/items/new/generic-guildTome.png">
|
|
</div>
|
|
<div class="col-3">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Guild
|
|
</div>
|
|
<div class="col scaled-font fw-bold gx-3">
|
|
Tome
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col g-0 rounded">
|
|
<div class="row row-cols-1 h-100 align-items-center">
|
|
<div class="col d-flex justify-content-end">
|
|
<input class="equipment-input border-dark text-light dark-10 rounded scaled-font form-control form-control-sm" id="guildTome1-choice" name="guildTome1-choice" placeholder="No Tome" value=""/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "col dark-6 rounded-bottom my-3 my-xl-1" id = "atree-dropdown" style = "display:none;">
|
|
<div class="row row-cols-1 row-cols-xl-2">
|
|
<div class="col border border-semi-light rounded dark-9 hide-scroll" id="atree-ui" style="height: 90vh; overflow-y: auto; overflow-x: hidden;">
|
|
|
|
</div>
|
|
<div class="col mx-auto" style="height: 90vh; overflow-y: auto;" id="atree-rhs">
|
|
<div class="col mx-auto" style="height: 2em; overflow-y: auto;" id="atree-header">
|
|
</div>
|
|
<div class="col mx-auto" style="overflow-y: auto;" id="atree-active">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col dark-6 rounded-bottom my-3 my-xl-1" id = "edit_id_tab" style = "display:none;">
|
|
<div class = "row big-title justify-content-center">
|
|
Damage Stats
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Spell Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="sdPct" name="sdPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "sdPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Spell Damage Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="sdRaw" name="sdRaw" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "sdRaw-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Melee Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="mdPct" name="mdPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "mdPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Melee Damage Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="mdRaw" name="mdRaw" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "mdRaw-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Poison:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="poison" name="poison" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "poison-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row eDam">
|
|
Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="eDamPct" name="eDamPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "eDamPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row tDam">
|
|
Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="tDamPct" name="tDamPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "tDamPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row wDam">
|
|
Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="wDamPct" name="wDamPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "wDamPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row fDam">
|
|
Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="fDamPct" name="fDamPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "fDamPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row aDam">
|
|
Damage %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="aDamPct" name="aDamPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "aDamPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
+ Tier:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="atkTier" name="atkTier" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "atkTier-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
|
|
</div>
|
|
</div>
|
|
<div class = "row big-title justify-content-center">
|
|
Defense Stats
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row Earth">
|
|
Defense %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="eDefPct" name="eDefPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "eDefPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row Thunder">
|
|
Defense %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="tDefPct" name="tDefPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "tDefPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row Water">
|
|
Defense %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="wDefPct" name="wDefPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "wDefPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row Fire">
|
|
Defense %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="fDefPct" name="fDefPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "fDefPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row Air">
|
|
Defense %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="aDefPct" name="aDefPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "aDefPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Health Regen Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="hprRaw" name="hprRaw" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "hprRaw-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Health Regen %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="hprPct" name="hprPct" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "hprPct-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
Health Bonus:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="hpBonus" name="hpBonus" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "hpBonus-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "row big-title justify-content-center">
|
|
Utility Stats
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
1st Spell Cost %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spPct1" name="spPct1" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spPct1-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
2nd Spell Cost %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spPct2" name="spPct2" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spPct2-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
3rd Spell Cost %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spPct3" name="spPct3" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spPct3-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
4th Spell Cost %:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spPct4" name="spPct4" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spPct4-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class = "row px-1">
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
1st Spell Cost Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spRaw1" name="spRaw1" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spRaw1-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
2nd Spell Cost Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spRaw2" name="spRaw2" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spRaw2-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
3rd Spell Cost Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spRaw3" name="spRaw3" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spRaw3-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
<div class = "col-lg-3 col-sm-6">
|
|
<div class = "row">
|
|
4th Spell Cost Raw:
|
|
</div>
|
|
<div class = "row">
|
|
<input type = "number" placeholder = "0" id="spRaw4" name="spRaw4" value="0" class="border-dark text-light dark-10 rounded scaled-font form-control form-control-sm"/>
|
|
</div>
|
|
<div class = "row" id = "spRaw4-base">
|
|
Original Value: 0
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-1">
|
|
<div class="row row-cols-1 text-center scaled-font dark-5 rounded dark-shadow justify-content-center">
|
|
<div class="col fw-bold dark-4 rounded-top">
|
|
Active boosts
|
|
</div>
|
|
<div class="col">
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="vanish-boost" onclick="update_boosts('vanish-boost')">
|
|
Vanish (+80%)
|
|
</button>
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="warscream-boost" onclick="update_boosts('warscream-boost')">
|
|
War Scream
|
|
</button>
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="ragnarokkr-boost" onclick="update_boosts('ragnarokkr-boost')">
|
|
Ragnarokkr (+30%)
|
|
</button>
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="yourtotem-boost" onclick="update_boosts('yourtotem-boost')">
|
|
Your Totem (+35%)
|
|
</button>
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="allytotem-boost" onclick="update_boosts('allytotem-boost')">
|
|
Ally Totem (+15%)
|
|
</button>
|
|
<button class="button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id="fortitude-boost" onclick="update_boosts('fortitude-boost')">
|
|
Fortitude (+60%)
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-1">
|
|
<div class="row row-cols-1 rounded text-center dark-5 scaled-font">
|
|
<div class="row p-0 m-0 text-nowrap">
|
|
<div id = "str-boost-tab" class="col eDam dark-4u fake-button elem-boost" onclick="toggle_boost_tab('str')">
|
|
Earth
|
|
</div>
|
|
<div id = "dex-boost-tab" class="col tDam dark-4u fake-button elem-boost" onclick="toggle_boost_tab('dex')">
|
|
Thunder
|
|
</div>
|
|
<div id = "int-boost-tab" class="col wDam dark-4u fake-button elem-boost" onclick="toggle_boost_tab('int')">
|
|
Water
|
|
</div>
|
|
<div id = "def-boost-tab" class="col fDam dark-4u fake-button elem-boost" onclick="toggle_boost_tab('def')">
|
|
Fire
|
|
</div>
|
|
<div id = "agi-boost-tab" class="col aDam dark-4u fake-button elem-boost" onclick="toggle_boost_tab('agi')">
|
|
Air
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 p-0 m-0" id="str-boost" style="display: none;">
|
|
<div class="col eDam dark-5">
|
|
Quake (Active)
|
|
</div>
|
|
<div class="col skp-tooltip dark-6 rounded-bottom my-3 my-xl-1" >
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Quake-1" onclick = "updatePowderSpecials('Quake-1')">
|
|
Lv.4 [e4e4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Quake-2" onclick = "updatePowderSpecials('Quake-2')">
|
|
Lv.4.5 [e5e4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Quake-3" onclick = "updatePowderSpecials('Quake-3')">
|
|
Lv.5 [e5e5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Quake-4" onclick = "updatePowderSpecials('Quake-4')">
|
|
Lv.5.5 [e6e5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Quake-5" onclick = "updatePowderSpecials('Quake-5')">
|
|
Lv.6 [e6e6]
|
|
</button>
|
|
</div>
|
|
<div class="col eDam">
|
|
Rage (Passive)
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 p-0 m-0" id="dex-boost" style="display: none;">
|
|
<div class="col tDam dark-5">
|
|
Chain Lightning (Active)
|
|
</div>
|
|
<div class="col skp-tooltip dark-6 rounded-bottom my-3 my-xl-1">
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Chain_Lightning-1" onclick = "updatePowderSpecials('Chain_Lightning-1')">
|
|
Lv.4 [t4t4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Chain_Lightning-2" onclick = "updatePowderSpecials('Chain_Lightning-2')">
|
|
Lv.4.5 [t5t4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Chain_Lightning-3" onclick = "updatePowderSpecials('Chain_Lightning-3')">
|
|
Lv.5 [t5t5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Chain_Lightning-4" onclick = "updatePowderSpecials('Chain_Lightning-4')">
|
|
Lv.5.5 [t6t5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Chain_Lightning-5" onclick = "updatePowderSpecials('Chain_Lightning-5')">
|
|
Lv.6 [t6t6]
|
|
</button>
|
|
</div>
|
|
<div class="col tDam">
|
|
Kill Streak (Passive)
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 p-0 m-0" id="int-boost">
|
|
<div class="col wDam dark-5">
|
|
Curse (Active)
|
|
</div>
|
|
<div class="col skp-tooltip dark-6 rounded-bottom my-3 my-xl-1">
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Curse-1" onclick = "updatePowderSpecials('Curse-1')">
|
|
Lv.4 [w4w4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Curse-2" onclick = "updatePowderSpecials('Curse-2')">
|
|
Lv.4.5 [w5w4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Curse-3" onclick = "updatePowderSpecials('Curse-3')">
|
|
Lv.5 [w5w5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Curse-4" onclick = "updatePowderSpecials('Curse-4')">
|
|
Lv.5.5 [w6w5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Curse-5" onclick = "updatePowderSpecials('Curse-5')">
|
|
Lv.6 [w6w6]
|
|
</button>
|
|
</div>
|
|
<div class="col wDam">
|
|
Concentration (Passive)
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 p-0 m-0" id="def-boost" style="display: none;">
|
|
<div class="col fDam dark-5">
|
|
Courage (Active)
|
|
</div>
|
|
<div class="col skp-tooltip dark-6 rounded-bottom my-3 my-xl-1">
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Courage-1" onclick = "updatePowderSpecials('Courage-1')">
|
|
Lv.4 [f4f4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Courage-2" onclick = "updatePowderSpecials('Courage-2')">
|
|
Lv.4.5 [f5f4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Courage-3" onclick = "updatePowderSpecials('Courage-3')">
|
|
Lv.5 [f5f5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Courage-4" onclick = "updatePowderSpecials('Courage-4')">
|
|
Lv.5.5 [f6f5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Courage-5" onclick = "updatePowderSpecials('Courage-5')">
|
|
Lv.6 [f6f6]
|
|
</button>
|
|
</div>
|
|
<div class="col fDam">
|
|
Endurance (Passive)
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 p-0 m-0" id="agi-boost" style="display: none;">
|
|
<div class="col aDam dark-5">
|
|
Wind Prison (Active)
|
|
</div>
|
|
<div class="col skp-tooltip dark-6 rounded-bottom my-3 my-xl-1">
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Wind_Prison-1" onclick = "updatePowderSpecials('Wind_Prison-1')">
|
|
Lv.4 [a4a4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Wind_Prison-2" onclick = "updatePowderSpecials('Wind_Prison-2')">
|
|
Lv.4.5 [a5a4]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Wind_Prison-3" onclick = "updatePowderSpecials('Wind_Prison-3')">
|
|
Lv.5 [a5a5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Wind_Prison-4" onclick = "updatePowderSpecials('Wind_Prison-4')">
|
|
Lv.5.5 [a6a5]
|
|
</button>
|
|
<button class = "button-boost m-1 border-0 text-white dark-8u dark-shadow-sm" id = "Wind_Prison-5" onclick = "updatePowderSpecials('Wind_Prison-5')">
|
|
Lv.6 [a6a6]
|
|
</button>
|
|
</div>
|
|
<div class="col aDam">
|
|
Dodge (Passive)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 mb-3">
|
|
<div class="row row-cols-1 rounded dark-shadow dark-6 scaled-font">
|
|
<div class="col rounded-top">
|
|
<div class="row">
|
|
<div id="tab-offensive-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7" onclick="show_tab('offensive-stats')">
|
|
Offense
|
|
</div>
|
|
<div id="tab-defensive-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7" onclick="show_tab('defensive-stats')">
|
|
Defense
|
|
</div>
|
|
<div id="tab-overall-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7 selected-btn" onclick="show_tab('overall-stats')">
|
|
Overall
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="display: none;" id="offensive-stats" class="col text-nowrap"></div>
|
|
<div style="display: none;" id="defensive-stats" class="col text-nowrap"></div>
|
|
<div id="overall-stats" class="col text-nowrap"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 mb-3 px-0">
|
|
<div id="all-spells-display" class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
|
<div class = "col pe-0">
|
|
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell0-infoAvg">Input a weapon to see abilities!</div>
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
|
<div class = "col pe-0">
|
|
<div class = "spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mx-2 mx-lg-3">
|
|
<div class="col" id="masonry-container">
|
|
<div id="helmet-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="chestplate-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="leggings-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="boots-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="ring1-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="ring2-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="bracelet-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="necklace-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div id="weapon-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
|
</div>
|
|
<div class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3" id = "build-order">
|
|
</div>
|
|
<div class = "rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark p-3" id = "set-info"></div>
|
|
</div>
|
|
</div>
|
|
<div class="row mx-2 mx-lg-3">
|
|
<div class="col-12 dark-5 scaled-font">
|
|
<footer class="text-center">
|
|
<div id="header2">
|
|
<p>Made by <b class = "hppeng">hppeng</b>, <b class = "ferricles">ferricles</b>, and <b>reschan</b> with <a href = "../atlas" target = "_blank" class = "atlas link">Atlas Inc</a> (JavaScript required to function, nothing works without js)</p>
|
|
<p>Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.</p>
|
|
</div>
|
|
<div id="credits">
|
|
<a href="../credits.txt" class="link">Additional credits</a>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container h-75 mx-0 mx-lg-auto dark-2 border border-4 scaled-font align-self-center" style="position: fixed; z-index: 2000; overflow: auto; display: none;" id="search-container">
|
|
<div class="row justify-content-end">
|
|
<div class="col-auto">
|
|
<button type="button" class="btn-close btn-close-white" aria-label="Close" onclick="document.querySelector('#search-container').style.display = 'none';"></button>
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 justify-content-center">
|
|
<div class="col-10 dark-5 p-2 dark-shadow rounded-top">
|
|
<div class="row row-cols-1 row-cols-xl-4 justify-content-center mb-1">
|
|
<div class="col-auto">
|
|
<label for="item-name-choice">Name:</label>
|
|
<input class="search-field" type="text" id="item-name-choice" name="item-name-choice" placeholder="Name" oninput="doSearchSchedule();"/>
|
|
</div>
|
|
<div class="col-auto">
|
|
<label for="item-category-choice">Category:</label>
|
|
<input class="search-field" id="item-category-choice" name="item-category-choice" placeholder="Category"/>
|
|
</div>
|
|
<div class="col-auto">
|
|
<label for="item-rarity-choice">Rarity:</label>
|
|
<input class="search-field" id="item-rarity-choice" name="item-rarity-choice" placeholder="Rarity"/>
|
|
</div>
|
|
<div class="col-auto">
|
|
<label for="item-level-choice">Level:</label>
|
|
<input class="search-field" type="text" id="item-level-choice" name="item-level-choice" placeholder="1-106"/>
|
|
</div>
|
|
</div>
|
|
<div class="row row-cols-1 row-cols-xl-4 justify-content-center my-1">
|
|
<div class="col-auto" id="filter1-dropdown">
|
|
<label for="filter1-choice">Filter 1:</label>
|
|
<input class="search-field" list="filter-items" id="filter1-choice" name="filter1-choice" placeholder=""/>
|
|
</div>
|
|
<div class="col-auto" id="filter2-dropdown">
|
|
<label for="filter2-choice">Filter 2:</label>
|
|
<input class="search-field" list="filter-items" id="filter2-choice" name="filter2-choice" placeholder=""/>
|
|
</div>
|
|
<div class="col-auto" id="filter3-dropdown">
|
|
<label for="filter3-choice">Filter 3:</label>
|
|
<input class="search-field" list="filter-items" id="filter3-choice" name="filter3-choice" placeholder=""/>
|
|
</div>
|
|
<div class="col-auto" id="filter4-dropdown">
|
|
<label for="filter4-choice">Filter 4:</label>
|
|
<input class="search-field" list="filter-items" id="filter4-choice" name="filter4-choice" placeholder=""/>
|
|
</div>
|
|
</div>
|
|
<div class = "row box-title justify-content-center my-1" id = "summary">
|
|
</div>
|
|
<div class = "row" id = "search-results">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.6/dist/autoComplete.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/macy@2"></script>
|
|
<script type="text/javascript" src="../js/utils.js"></script>
|
|
<script type="text/javascript" src="../js/build_utils.js"></script>
|
|
<script type="text/javascript" src="../js/computation_graph.js"></script>
|
|
<script type="text/javascript" src="../js/sq2icons.js"></script>
|
|
<script type="text/javascript" src="../js/powders.js"></script>
|
|
<script type="text/javascript" src="../js/skillpoints.js"></script>
|
|
<script type="text/javascript" src="../js/damage_calc.js"></script>
|
|
<script type="text/javascript" src="../js/atree_constants_min.js"></script>
|
|
<script type="text/javascript" src="../js/display_constants.js"></script>
|
|
<script type="text/javascript" src="../js/display.js"></script>
|
|
<script type="text/javascript" src="../js/load.js"></script>
|
|
<script type="text/javascript" src="../js/load_ing.js"></script>
|
|
<script type="text/javascript" src="../js/load_tome.js"></script>
|
|
<script type="text/javascript" src="../js/custom.js"></script>
|
|
<script type="text/javascript" src="../js/craft.js"></script>
|
|
<script type="text/javascript" src="../js/build.js"></script>
|
|
<script type="text/javascript" src="../js/build_constants.js"></script>
|
|
<script type="text/javascript" src="../js/build_encode_decode.js"></script>
|
|
<script type="text/javascript" src="../js/atree.js"></script>
|
|
<script type="text/javascript" src="../js/builder.js"></script>
|
|
<script type="text/javascript" src="../js/builder_graph.js"></script>
|
|
<script type="text/javascript" src="../js/optimize.js"></script>
|
|
|
|
</body>
|
|
</html>
|