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 / >
2022-07-04 08:24:49 +00:00
< 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "container mt-5" >
2022-07-12 05:10:55 +00:00
< div class = "row row-cols-1 row-cols-lg-3 gy-5" >
< div class = "col col-lg-5" >
2022-07-11 03:16:15 +00:00
<!-- crafter ui -->
2022-07-12 05:10:55 +00:00
< div class = "row row-cols-1 row-cols-lg-2 gx-5 gy-4 gy-lg-2" >
2022-07-11 03:16:15 +00:00
< div class = "col" id = "recipe-dropdown" >
< div class = "row dark-shadow dark-5 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" >
2022-07-24 21:31:23 +00:00
< div id = "recipe-img" class = "img-fluid rounded Crafted-shadow" style = "background-image: url('../media/items/common.png'); image-rendering: pixelated; background-position: 25% 0; aspect-ratio: 1/1;" > < / div >
2022-07-11 03:16:15 +00:00
< / div >
< div class = "col ps-3" >
< div class = "row row-cols-2 align-items-center" >
< div class = "col-4 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Type:< / p >
< / div >
< div class = "col-8 px-0" >
< input class = "recipeinput border-dark text-light dark-10 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 class = "col-4 px-0" >
< p class = "mb-0 scaled-font fw-bold" > Lv:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-8 px-0" >
< input class = "levelinput border-dark text-light dark-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< / div >
< div class = "col" >
< div id = "atkSpdChoices" class = "row row-cols-1 dark-shadow dark-5 rounded" >
< div class = "col pt-1" >
< p class = "text-center scaled-font fw-bold mb-1" > Attack Speed< / p >
< / div >
< div class = "col mb-2" >
< div class = "row justify-content-center" >
2022-07-12 05:29:12 +00:00
< div class = "col-auto px-2" >
2022-07-11 03:16:15 +00:00
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "slow-atk-button" onclick = "toggleAtkSpd('slow-atk-button')" >
Slow
< / button >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-12 05:29:12 +00:00
< div class = "col-auto px-2" >
2022-07-11 03:16:15 +00:00
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "normal-atk-button" onclick = "toggleAtkSpd('normal-atk-button')" >
Normal
< / button >
< / div >
2022-07-12 05:29:12 +00:00
< div class = "col-auto px-2" >
2022-07-11 03:16:15 +00:00
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "fast-atk-button" onclick = "toggleAtkSpd('fast-atk-button')" >
Fast
< / button >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
< / div >
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< 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 text-center" 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< 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 text-center" id = "mat-2" > Mat 2 Tier:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center just" >
< div class = "col-3 px-0 ps-2" >
< p class = "mb-0 scaled-font fw-bold" > Ing 1:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< / div >
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0 ps-2" >
< p class = "mb-0 scaled-font fw-bold" > Ing 2:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0 ps-2" >
< p class = "mb-0 scaled-font fw-bold" > Ing 3:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< / div >
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0 ps-2" >
< p class = "mb-0 scaled-font fw-bold" > Ing 4:< / p >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-9 px-0" >
< input class = "inginput border-dark text-light dark-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0 ps-2" >
< 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-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col" >
< div class = "row dark-shadow dark-6 rounded align-items-center" >
< div class = "col-3 px-0 ps-2" >
< 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-10 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 >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< div class = "row rounded dark-shadow dark-6 mt-3 p-2 align-items-center justify-content-center" >
< div class = "col-auto mx-auto" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "reset-button" onclick = "resetFields()" >
Reset
< / button >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-auto mx-auto" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "copy-hash-button" onclick = "copyRecipeHash()" >
Copy Hash
< / button >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "col-auto mx-auto" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "copy-button" onclick = "copyRecipe()" >
Copy Short
< / button >
< / div >
< div class = "col-auto mx-auto" >
< button class = "button rounded scaled-font fw-bold text-light dark-5" id = "share-button" onclick = "shareRecipe()" >
Copy Long
< / button >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< / div >
2022-07-12 05:10:55 +00:00
< div class = "col col-lg-4" >
2022-07-11 03:16:15 +00:00
< 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" >
2022-07-12 05:10:55 +00:00
< div class = "row row-cols-1 recipe-stats " id = "recipe-stats" >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< div class = "row craft-warnings" >
< div class = "" id = "craft-warnings" > < / div >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-11 03:16:15 +00:00
< / div >
2022-07-12 05:10:55 +00:00
< div class = "col col-lg-3" >
2022-07-11 03:16:15 +00:00
< 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 >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< / div >
2022-05-12 08:48:59 +00:00
< / div >
< / div >
2022-07-12 05:10:55 +00:00
< div class = "row my-3" >
< div class = "col col-lg-6 ingredients-container hide-container-grid" id = "ingreds" style = "display:none" >
< div class = "row mb-3" >
< div class = "col" >
2022-07-11 03:16:15 +00:00
< p class = "box-title hide-container-block" >
Ingredients
< / p >
< / div >
2022-07-12 05:10:55 +00:00
< / div >
< div class = "row row-cols-1 row-cols-lg-2 g-3" >
< div class = "ing-stats col-lg-6 col scaled-font" id = "ing-1" >
< div class = "rounded g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-1-stats" > < / div >
2022-07-11 03:16:15 +00:00
< / div >
2022-07-12 05:10:55 +00:00
< div class = "ing-stats col-lg-6 col scaled-font" id = "ing-2" >
< div class = "rounded g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-2-stats" > < / div >
< / div >
< div class = "ing-stats col-lg-6 col scaled-font" id = "ing-3" >
< div class = "rounded 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 scaled-font" id = "ing-4" >
< div class = "rounded g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-4-stats" > < / div >
< / div >
< div class = "ing-stats col-lg-6 col scaled-font" id = "ing-5" >
< div class = "rounded 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 scaled-font" id = "ing-6" >
< div class = "rounded g-0 dark-6 border border-3 border-dark dark-shadow p-3" id = "ing-6-stats" > < / div >
2022-07-11 03:16:15 +00:00
< / div >
2022-05-12 08:48:59 +00:00
< / div >
2022-07-11 03:16:15 +00:00
< / div >
< / div >
< div class = "row my-2" >
< div class = "col 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 >
2022-05-12 08:48:59 +00:00
< / 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 >
2022-07-24 21:31:23 +00:00
< script type = "text/javascript" src = "../js/icons.js" > < / script >
2022-05-12 08:48:59 +00:00
< 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/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 >
2022-05-12 08:48:59 +00:00
< / body >
< / html >
