From 0d1e9b1202d024ffcc10742cc81ecdd222683161 Mon Sep 17 00:00:00 2001 From: Arkerthan <arkerthan@gmail.com> Date: Tue, 19 Jan 2021 19:50:40 +0100 Subject: [PATCH] Convert remaining organ pseudo SC code to DOM --- src/npc/surgery/organFarm.js | 97 ++++++++++++++++++++++-------------- src/pregmod/organFarm.tw | 2 +- 2 files changed, 61 insertions(+), 38 deletions(-) diff --git a/src/npc/surgery/organFarm.js b/src/npc/surgery/organFarm.js index 80536aa8b0d..7583c84553f 100644 --- a/src/npc/surgery/organFarm.js +++ b/src/npc/surgery/organFarm.js @@ -1,6 +1,6 @@ /** * @param {App.Entity.SlaveState} slave - * @returns {string} + * @returns {HTMLDivElement} */ App.Medicine.OrganFarm.growActions = function(slave) { const O = App.Medicine.OrganFarm.Organs; @@ -29,41 +29,48 @@ App.Medicine.OrganFarm.growActions = function(slave) { } } - const {His, him} = getPronouns(slave); + const div = document.createElement("div"); + div.classList.add("grid-2columns-auto"); // create entries for each organ - let grow = ""; - let wait = []; + let growing = []; + let any = false; O.forEach((organ, key) => { if (slaveOrgans[key] === 0) { if (organ.canGrow(slave)) { - grow += `<div>${App.UI.link(organ.name, App.Medicine.OrganFarm.growOrgan, [slave, key], "Remote Surgery")}</div>`; + App.UI.DOM.appendNewElement("div", div, App.UI.DOM.passageLink(organ.name, "Remote Surgery", () => { + App.Medicine.OrganFarm.growOrgan(slave, key); + })); + const tooltip = typeof organ.tooltip === "string" ? organ.tooltip : organ.tooltip(slave); - grow += `<div class="detail">Costs ${cashFormat(organ.cost)}${tooltip !== "" ? ` and ${tooltip}` : ""}.</div>`; + App.UI.DOM.appendNewElement("div", div, `Costs ${cashFormat(organ.cost)}${tooltip !== "" ? ` and ${tooltip}` : ""}.`, "detail"); } + any = true; } else if (slaveOrgans[key] > 0) { // in growth organs at the end of the list - wait.push({ + growing.push({ time: slaveOrgans[key], - text: `${His} ${organ.name.toLowerCase()} will be ready for implantation in ${weeksLeft(slaveOrgans[key])} weeks.` + organ: organ.name, + text: `Ready for implantation in ${weeksLeft(slaveOrgans[key])} weeks.` }); + any = true; } }); - // put everything in one string - let r = ""; - if (grow !== "") { - r += `The fabricator is ready to grow an organ for ${him}. Extract tissue to begin growing:<div class="grid-2columns-auto">${grow}</div>`; - } - if (wait !== []) { + if (growing !== []) { // nearer to completion => higher up - wait.sort((a, b) => a.time - b.time); - for (let i = 0; i < wait.length; i++) { - r += `<div>${wait[i].text}</div>`; + growing.sort((a, b) => a.time - b.time); + for (let i = 0; i < growing.length; i++) { + App.UI.DOM.appendNewElement("div", div, growing[i].organ); + App.UI.DOM.appendNewElement("div", div, growing[i].text); } } - return r; + if (any) { + return div; + } else { + return null; + } }; /** @@ -228,8 +235,11 @@ App.Medicine.OrganFarm.fullMenu = function(slave) { const growActions = App.Medicine.OrganFarm.growActions(slave); let anyAction = false; - if (growActions !== "") { - $(fragment).append(Wikifier.wikifyEval(`<h3>Grow new organs</h3><div class="indent">${growActions}</div>`)); + if (growActions != null) { + const {him} = getPronouns(slave); + App.UI.DOM.appendNewElement("h3", fragment, "Grow new organs"); + App.UI.DOM.appendNewElement("div", fragment, `The fabricator is ready to grow an organ for ${him}. Extract tissue to begin growing:`); + App.UI.DOM.appendNewElement("div", fragment, growActions, "choices"); anyAction = true; } @@ -248,6 +258,11 @@ App.Medicine.OrganFarm.fullMenu = function(slave) { return fragment; }; +/** + * Returns a list of currently growing and finished organs. + * + * @returns {DocumentFragment} + */ App.Medicine.OrganFarm.currentlyGrowing = function() { function weeksToCompletion(weeks) { if (V.organFarmUpgrade === 1) { @@ -259,18 +274,22 @@ App.Medicine.OrganFarm.currentlyGrowing = function() { } } - let r = ""; - + /** + * @type {Array<string|HTMLSpanElement>} + */ let growLines = []; + /** + * @type {Array<string|HTMLSpanElement>} + */ let finishLines = []; V.organs.forEach(o => { const slave = getSlave(o.ID); if (slave !== undefined) { - growLines.push(`${slave.slaveName}'s ${App.Medicine.OrganFarm.Organs.get(o.type).name}, ${ - weeksToCompletion(o.weeksToCompletion)} week(s) left.`); + const weeks = weeksToCompletion(o.weeksToCompletion); + growLines.push(`${slave.slaveName}'s ${App.Medicine.OrganFarm.Organs.get(o.type).name}, ${weeks} ${weeks > 1 ? "weeks" : "week"} left.`); } else { - growLines.push(`<span class="error">ERROR: No slave with ID ${o.ID} found.</span>`); + growLines.push(App.UI.DOM.makeElement("span", `ERROR: No slave with ID ${o.ID} found.`, "error")); } }); V.incubatorOrgans.forEach(o => { @@ -283,7 +302,7 @@ App.Medicine.OrganFarm.currentlyGrowing = function() { weeksToCompletion(o.weeksToCompletion)} week(s) left.`); } } else { - growLines.push(`<span class="error">ERROR: No tank with ID ${o.ID} found.</span>`); + growLines.push(App.UI.DOM.makeElement("span", `ERROR: No tank with ID ${o.ID} found.`, "error")); } }); @@ -292,27 +311,31 @@ App.Medicine.OrganFarm.currentlyGrowing = function() { if (slave !== undefined) { finishLines.push(`${slave.slaveName}'s ${App.Medicine.OrganFarm.Organs.get(o.type).name}.`); } else { - finishLines.push(`<span class="error">ERROR: No slave with ID ${o.ID} found.</span>`); + growLines.push(App.UI.DOM.makeElement("span", `ERROR: No slave with ID ${o.ID} found.`, "error")); } }); + const frag = document.createDocumentFragment(); + if (growLines.length > 0) { - r += "<h3>Growing Organs</h3>"; + App.UI.DOM.appendNewElement("h3", frag, "Growing Organs"); + + growLines.forEach(l => { + App.UI.DOM.appendNewElement("div", frag, l); + }); } - growLines.forEach(l => { - r += `<div>${l}</div>`; - }); if (finishLines.length > 0) { - r += "<h3>Finished Organs</h3>"; + App.UI.DOM.appendNewElement("h3", frag, "Finished Organs"); + + finishLines.forEach(l => { + App.UI.DOM.appendNewElement("div", frag, l); + }); } - finishLines.forEach(l => { - r += `<div>${l}</div>`; - }); if (growLines.length === 0 && finishLines.length === 0) { - r += `<div><span class="detail">Organs must be genetically matched to their host slave. To begin growing organs for a slave, take them to the Remote Surgery.</span></div>`; + App.UI.DOM.appendNewElement("div", frag, "Organs must be genetically matched to their host slave. To begin growing organs for a slave, take them to the Remote Surgery.", "detail"); } - return r; + return frag; }; diff --git a/src/pregmod/organFarm.tw b/src/pregmod/organFarm.tw index 5caf33806cf..f4ff696b937 100644 --- a/src/pregmod/organFarm.tw +++ b/src/pregmod/organFarm.tw @@ -115,7 +115,7 @@ <h2>Organ Production</h2> <p> - <<= App.Medicine.OrganFarm.currentlyGrowing()>> + <<includeDOM App.Medicine.OrganFarm.currentlyGrowing()>> </p> <h2>Future Societies Research</h2> -- GitLab