endernon/wynnbuilder-forked-for-changes
1
0
Fork 0
forked from morphNon/wynnbuilder-idk
Code Pull requests Activity

added copy hash button, removed craft button, added automatic craft upon input, lightened user input fields

Browse source
This commit is contained in:
ferricles 2022-05-22 14:09:32 -07:00
parent df54d6beea
commit 0bed0dab91
2 changed files with 48 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
crafter/index.html
View file

@ -46,7 +46,7 @@
<p class = "text-right mb-0 scaled-font fw-bold">Type:</p> <p class = "text-right mb-0 scaled-font fw-bold">Type:</p>
</div> </div>
<div class = "col-7 px-0"> <div class = "col-7 px-0">
<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"/> <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 id="recipe-choices">
</datalist> </datalist>
</div> </div>
@ -56,7 +56,7 @@
<p class = "text-right mb-0 scaled-font fw-bold">Lv:</p> <p class = "text-right mb-0 scaled-font fw-bold">Lv:</p>
</div> </div>
<div class = "col-7 px-0"> <div class = "col-7 px-0">
<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" /> <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 id="level-choices">
</datalist> </datalist>
</div> </div>
@ -71,17 +71,17 @@
<p class = "text-right mb-0 scaled-font fw-bold">Attack Speed</p> <p class = "text-right mb-0 scaled-font fw-bold">Attack Speed</p>
</div> </div>
<div class = "row h-50"> <div class = "row h-50">
<div class = "col"> <div class = "col-4 pl-1">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "slow-atk-button" onclick = "toggleAtkSpd('slow-atk-button')"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "slow-atk-button" onclick = "toggleAtkSpd('slow-atk-button')">
Slow Slow
</button> </button>
</div> </div>
<div class = "col"> <div class = "col-4 px-0">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "normal-atk-button" onclick = "toggleAtkSpd('normal-atk-button')"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "normal-atk-button" onclick = "toggleAtkSpd('normal-atk-button')">
Normal Normal
</button> </button>
</div> </div>
<div class = "col"> <div class = "col-4 pr-1">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "fast-atk-button" onclick = "toggleAtkSpd('fast-atk-button')"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "fast-atk-button" onclick = "toggleAtkSpd('fast-atk-button')">
Fast Fast
</button> </button>
@ -132,7 +132,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 1:</p> <p class = "mb-0 scaled-font fw-bold">Ing 1:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-1">
</datalist> </datalist>
</div> </div>
@ -144,7 +144,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 2:</p> <p class = "mb-0 scaled-font fw-bold">Ing 2:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-2">
</datalist> </datalist>
</div> </div>
@ -158,7 +158,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 3:</p> <p class = "mb-0 scaled-font fw-bold">Ing 3:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-3">
</datalist> </datalist>
</div> </div>
@ -170,7 +170,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 4:</p> <p class = "mb-0 scaled-font fw-bold">Ing 4:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-4">
</datalist> </datalist>
</div> </div>
@ -184,7 +184,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 5:</p> <p class = "mb-0 scaled-font fw-bold">Ing 5:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-5">
</datalist> </datalist>
</div> </div>
@ -196,7 +196,7 @@
<p class = "mb-0 scaled-font fw-bold">Ing 6:</p> <p class = "mb-0 scaled-font fw-bold">Ing 6:</p>
</div> </div>
<div class = "col-9 px-0"> <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" /> <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 id="ing-choices-6">
</datalist> </datalist>
</div> </div>
@ -204,23 +204,23 @@
</div> </div>
</div> </div>
<div class = "row rounded dark-shadow dark-6 py-2"> <div class = "row rounded dark-shadow dark-6 py-2 gy-3">
<div class = "col"> <div class = "col-lg-2 col-sm-6">
<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()"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "reset-button" onclick = "resetFields()">
Reset Reset
</button> </button>
</div> </div>
<div class = "col"> <div class = "col-lg-3 col-sm-6">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "craft-button" onclick = "copyRecipeHash()">
Copy Hash
</button>
</div>
<div class = "col-lg-4 col-sm-6">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "copy-button" onclick = "copyRecipe()"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "copy-button" onclick = "copyRecipe()">
Copy Short Copy Short
</button> </button>
</div> </div>
<div class = "col"> <div class = "col-lg-3 col-sm-6">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "share-button" onclick = "shareRecipe()"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "share-button" onclick = "shareRecipe()">
Copy Long Copy Long
</button> </button>

33
js/crafter.js
View file

@ -44,12 +44,26 @@ function init_crafter() {
try { try {
document.getElementById("recipe-choice").addEventListener("change", (event) => { document.getElementById("recipe-choice").addEventListener("change", (event) => {
updateMaterials(); updateMaterials();
calculateCraft();
}); });
document.getElementById("level-choice").addEventListener("change", (event) => { document.getElementById("level-choice").addEventListener("change", (event) => {
updateMaterials(); updateMaterials();
calculateCraft();
}); });
document.getElementById("recipe-choice").setAttribute("oninput", "updateCraftedImage()"); document.getElementById("recipe-choice").setAttribute("oninput", "updateCraftedImage()");
for (let i = 1; i < 4; ++i) {
document.getElementById("mat-1-"+i).setAttribute("onclick", document.getElementById("mat-1-"+i).getAttribute("onclick") + "; calculateCraft();");
document.getElementById("mat-2-"+i).setAttribute("onclick", document.getElementById("mat-2-"+i).getAttribute("onclick") + "; calculateCraft();");
}
for (let i = 1; i < 7; ++i) {
document.getElementById("ing-choice-" + i ).setAttribute("oninput", "calculateCraft();");
}
for (const str of ["slow", "normal", "fast"]) {
document.getElementById(str + "-atk-button").setAttribute("onclick", document.getElementById(str + "-atk-button").getAttribute("onclick") + "; calculateCraft();");
}
populateFields(); populateFields();
decodeCraft(ing_url_tag); decodeCraft(ing_url_tag);
} catch (error) { } catch (error) {
@ -230,11 +244,20 @@ function populateFields() {
} }
/*
Copies the CR Hash (CR-blahblahblah)
/* Copy the link
*/ */
function copyRecipe(){ function copyRecipeHash() {
if (player_craft) {
copyTextToClipboard("CR-"+location.hash);
document.getElementById("copy-hash-button").textContent = "Copied!";
}
}
/*
Copies the link (hppeng-wynn.github.io/crafter/#blahblah)
*/
function copyRecipe() {
if (player_craft) { if (player_craft) {
copyTextToClipboard(ing_url_base+location.hash); copyTextToClipboard(ing_url_base+location.hash);
document.getElementById("copy-button").textContent = "Copied!"; document.getElementById("copy-button").textContent = "Copied!";
@ -243,7 +266,7 @@ function copyRecipe(){
/* Copy the link AND a display of all ingredients /* Copy the link AND a display of all ingredients
*/ */
function shareRecipe(){ function shareRecipe() {
if (player_craft) { if (player_craft) {
let copyString = ing_url_base+location.hash + "\n"; let copyString = ing_url_base+location.hash + "\n";
let name = player_craft.recipe.get("name").split("-"); let name = player_craft.recipe.get("name").split("-");