2022-05-12 08:48:59 +00:00
<!DOCTYPE html>
2022-05-12 09:07:12 +00:00
< html >
2022-05-12 08:48:59 +00:00
< head >
< title > WynnCrafter< / title >
< link rel = "icon" href = "../media/icons/new/crafter.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 id = "body" class = "text-light d-flex justify-content-center" >
< div id = "main-sidebar" class = "sidebar dark-7 dark-shadow" >
< a href = "../builder/" > < img src = "../media/icons/new/builder.png" alt = "WynnBuilder" title = "WynnBuilder" > < b > WynnBuilder< / b > < / a >
< a href = "" > < img src = "../media/icons/new/crafter.png" alt = "WynnCrafter" title = "WynnCrafter" > < b > WynnCrafter< / b > < / a >
2022-05-12 23:41:45 +00:00
< a href = "../items/" > < img src = "../media/icons/new/searcher.png" alt = "WynnAtlas" title = "WynnAtlas" > < b > WynnAtlas< / b > < / a >
2022-05-13 23:39:00 +00:00
< 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 >
2022-05-12 08:48:59 +00:00
< a onclick = "toggleIcons()" > < img src = "../media/icons/new/reload.png" alt = "" title = "Swap items on page" > < b > Swap Icon Style< / b > < / a >
< hr / >
< / div >
< div class = "container py-5 vh-100 mx-0 mx-lg-auto" >
< div class = "col" >
< div class = "row g-3" >
< div class = "col-lg-5 col-sm-12 text-center" >
2022-05-13 00:35:26 +00:00
< div class = "row gx-5 mb-2" >
< div class = "col-lg-6 col-sm-12" >
2022-05-12 08:48:59 +00:00
< div id = "recipe-dropdown" class = "row h-100 dark-shadow dark-6 rounded" >
< div id = "recipe-img-loc" class = "col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" >
< img id = "recipe-img" class = "img-fluid rounded Crafted-shadow" src = "../media/items/new/generic-potion.png" >
< / div >
2022-05-12 19:44:28 +00:00
< div class = "col px-0" >
2022-05-12 08:48:59 +00:00
< div class = "row align-items-center" >
2022-05-13 00:35:26 +00:00
< div class = "col-4 px-0" >
2022-05-12 08:48:59 +00:00
< p class = "text-right mb-0 scaled-font fw-bold" > Type:< / p >
< / div >
2022-05-13 00:35:26 +00:00
< div class = "col-7 px-0" >
2022-05-12 08:48:59 +00:00
< input class = "recipeinput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "recipe-choices" id = "recipe-choice" name = "recipe-choice" placeholder = "Potion" / >
< datalist id = "recipe-choices" >
< / datalist >
< / div >
< / div >
< div class = "row align-items-center" >
2022-05-13 00:35:26 +00:00
< div class = "col-4 px-0" >
2022-05-12 08:48:59 +00:00
< p class = "text-right mb-0 scaled-font fw-bold" > Lv:< / p >
< / div >
2022-05-13 00:35:26 +00:00
< div class = "col-7 px-0" >
2022-05-12 08:48:59 +00:00
< input class = "levelinput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "level-choices" id = "level-choice" name = "level-choice" placeholder = "103-105" / >
< datalist id = "level-choices" >
< / datalist >
< / div >
< / div >
< / div >
< / div >
< / div >
2022-05-13 00:35:26 +00:00
< div class = "col-lg-6 col-sm-12" >
2022-05-12 08:48:59 +00:00
< div id = "atkSpdChoices" class = "row h-100 dark-shadow dark-6 rounded" >
2022-05-13 00:35:26 +00:00
< div class = "col py-2" >
2022-05-12 08:48:59 +00:00
< div class = "row h-50 align-items-center" >
2022-05-12 19:27:17 +00:00
< p class = "text-right mb-0 scaled-font fw-bold" > Attack Speed< / p >
2022-05-12 08:48:59 +00:00
< / div >
< div class = "row h-50" >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "slow-atk-button" onclick = "toggleAtkSpd('slow-atk-button')" >
Slow
< / button >
< / div >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "normal-atk-button" onclick = "toggleAtkSpd('normal-atk-button')" >
Normal
< / button >
< / div >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "fast-atk-button" onclick = "toggleAtkSpd('fast-atk-button')" >
Fast
< / button >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
2022-05-13 00:35:26 +00:00
< div class = "row gx-5 mb-2" >
< div class = "col-lg-6 col-sm-12 justify-content-center" >
2022-05-12 08:48:59 +00:00
< div class = "row dark-shadow dark-6 rounded py-1 align-items-center" >
< div class = "col-6 px-0" >
< p class = "mb-0 scaled-font fw-bold" id = "mat-1" > Mat 1 Tier:< / p >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-1-1" onclick = "toggleMaterial('mat-1-1')" > 1< / button >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-1-2" onclick = "toggleMaterial('mat-1-2')" > 2< / button >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-1-3" onclick = "toggleMaterial('mat-1-3')" > 3< / button >
< / div >
< / div >
< / div >
2022-05-13 00:35:26 +00:00
< div class = "col-lg-6 col-sm-12 justify-content-center" >
2022-05-12 08:48:59 +00:00
< div class = "row dark-shadow dark-6 rounded py-1 align-items-center" >
< div class = "col-6 px-0" >
< p class = "mb-0 scaled-font fw-bold" id = "mat-2" > Mat 2 Tier:< / p >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-2-1" onclick = "toggleMaterial('mat-2-1')" > 1< / button >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-2-2" onclick = "toggleMaterial('mat-2-2')" > 2< / button >
< / div >
< div class = "col px-0" >
< button class = "button Star rounded scaled-font fw-bold text-light dark-5" id = "mat-2-3" onclick = "toggleMaterial('mat-2-3')" > 3< / button >
< / div >
< / div >
< / div >
< / div >
< div class = "row gx-5 mb-1" >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 1:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-1" id = "ing-choice-1" name = "ing-choice-1" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-1" >
< / datalist >
< / div >
< / div >
< / div >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 2:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-2" id = "ing-choice-2" name = "ing-choice-2" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-2" >
< / datalist >
< / div >
< / div >
< / div >
< / div >
< div class = "row gx-5 mb-1" >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 3:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-3" id = "ing-choice-3" name = "ing-choice-3" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-3" >
< / datalist >
< / div >
< / div >
< / div >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 4:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-4" id = "ing-choice-4" name = "ing-choice-4" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-4" >
< / datalist >
< / div >
< / div >
< / div >
< / div >
< div class = "row gx-5 mb-1" >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 5:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-5" id = "ing-choice-5" name = "ing-choice-5" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-5" >
< / datalist >
< / div >
< / div >
< / div >
< div class = "col" >
< div class = "row h-100 dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Ing 6:< / p >
< / div >
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" list = "ing-choices-6" id = "ing-choice-6" name = "ing-choice-6" placeholder = "No Ingredient" / >
< datalist id = "ing-choices-6" >
< / datalist >
< / div >
< / div >
< / div >
< / div >
< div class = "row rounded dark-shadow dark-6 py-2" >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "craft-button" onclick = "calculateCraft()" >
Craft Item
< / button >
< / div >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "reset-button" onclick = "resetFields()" >
Reset
< / button >
< / div >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "copy-button" onclick = "copyRecipe()" >
Copy Short
< / button >
< / div >
< div class = "col" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "share-button" onclick = "shareRecipe()" >
Copy Long
< / button >
< / div >
< / div >
< / div >
< div class = "col-lg-4" >
< div class = "recipe hide-container-block px-3 col rounded dark-6 text-light scaled-font p-3 border-dark dark-shadow g-0" style = "display:none" >
< div class = "row recipe-stats" >
< div class = "col" id = "recipe-stats" > < / div >
< / div >
< div class = "row craft-warnings" >
< div class = "" id = "craft-warnings" > < / div >
< / div >
< / div >
< / div >
< div class = "col-lg-3" >
< div class = "crafted row hide-container-block" style = "display:none" >
< div class = "craft-stats" >
< div class = "col rounded dark-6 text-light scaled-font p-3 border-dark dark-shadow g-0" id = "craft-stats" > < / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "col ingredients-container hide-container-grid" id = "ingreds" style = "display:none" >
2022-05-12 19:44:28 +00:00
< div class = "col-lg-6 col-sm-12 hide-container-grid" id = "ingreds" >
2022-05-12 08:48:59 +00:00
< div class = "row mb-3" >
< p class = "box-title hide-container-block" >
Ingredients
< / p >
< / div >
< div class = "row mb-3" >
2022-05-12 19:44:28 +00:00
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-1" >
2022-05-12 08:48:59 +00:00
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-1-stats" > < / div >
< / div >
2022-05-12 19:44:28 +00:00
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-2" >
2022-05-12 08:48:59 +00:00
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-2-stats" > < / div >
< / div >
< / div >
< div class = "row mb-3" >
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-3" >
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-3-stats" > < / div >
< / div >
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-4" >
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-4-stats" > < / div >
< / div >
< / div >
< div class = "row mb-3" >
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-5" >
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-5-stats" > < / div >
< / div >
< div class = "ing-stats col-lg-6 col-sm scaled-font" id = "ing-6" >
< div class = "rounded col g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-6-stats" > < / div >
< / div >
< / div >
< / div >
< / div >
< div class = "col dark-5 scaled-font" >
< footer class = "text-center" >
< div id = "header2" >
2022-05-13 00:51:21 +00:00
< p > Made by < b class = "hppeng" > hppeng< / b > and < b class = "ferricles" > ferricles< / b > with < a href = "../atlas" target = "_blank" class = "atlas link" > Atlas Inc< / a > (JavaScript required to function, nothing works without js)< / p >
2022-05-12 08:48:59 +00:00
< 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 >
2022-05-13 01:48:38 +00:00
< script type = "text/javascript" src = "../js/query.js" > < / script >
< script type = "text/javascript" src = "../js/query_2.js" > < / script >
2022-05-12 08:48:59 +00:00
< 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/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/display_constants.js" > < / script >
< script type = "text/javascript" src = "../js/display.js" > < / script >
< script type = "text/javascript" src = "../js/sq2display_constants.js" > < / script >
< script type = "text/javascript" src = "../js/sq2display.js" > < / script >
< script type = "text/javascript" src = "../js/load_ing.js" > < / script >
2022-05-13 23:39:00 +00:00
< script type = "text/javascript" src = "../js/load.js" > < / script >
2022-05-12 08:48:59 +00:00
< script type = "text/javascript" src = "../js/craft.js" > < / script >
< script type = "text/javascript" src = "../js/crafter.js" > < / script >
2022-05-13 01:48:38 +00:00
< script type = "text/javascript" src = "../js/expr_parser.js" > < / script >
< script type = "text/javascript" src = "../js/items.js" > < / script >
2022-05-16 06:50:47 +00:00
<!-- <script type="text/javascript" src="../js/sq2items.js"></script> -->
2022-05-12 08:48:59 +00:00
< / body >
< / html >