diff --git a/src/interaction/siWardrobe.js b/src/interaction/siWardrobe.js
index 21659cca0a9447db6e99c27e24f4cebfaf8c2b73..6cccc2fa78b5132a69ca736edbc739b0c3682d55 100644
--- a/src/interaction/siWardrobe.js
+++ b/src/interaction/siWardrobe.js
@@ -4,40 +4,133 @@ App.UI.SlaveInteract.wardrobe = function(slave) {
him,
his,
} = getPronouns(slave);
- const frag = new DocumentFragment();
- frag.append(clothes());
- if (slave.fuckdoll === 0) {
- frag.append(collar());
- frag.append(mask());
- frag.append(mouth());
- frag.append(armAccessory());
- frag.append(shoes());
- frag.append(legAccessory());
- frag.append(bellyAccessory());
- frag.append(buttplug());
- frag.append(buttplugAttachment());
- frag.append(vaginalAccessory());
- frag.append(vaginalAttachment());
- frag.append(dickAccessory());
- frag.append(chastity());
+ let filters = {};
+ const el = document.createElement("span");
+ el.id = "content";
+ el.append(contents())
+ return el;
+
+
+ function contents() {
+ const frag = new DocumentFragment();
+ if (slave.fuckdoll === 0) {
+ frag.append(filtersDOM());
+ frag.append(clothes());
+ frag.append(mask());
+ frag.append(mouth());
+ frag.append(armAccessory());
+ frag.append(shoes());
+ frag.append(legAccessory());
+ frag.append(bellyAccessory());
+ frag.append(buttplug());
+ frag.append(buttplugAttachment());
+ frag.append(vaginalAccessory());
+ frag.append(vaginalAttachment());
+ frag.append(dickAccessory());
+ frag.append(chastity());
+ } else {
+ frag.append(clothes());
+ }
+
+ App.UI.DOM.appendNewElement("h3", frag, `Shopping`);
+ frag.append(shopping());
+
+ return frag;
}
- App.UI.DOM.appendNewElement("h3", frag, `Shopping`);
- frag.append(shopping());
+ function filtersDOM() {
+ const el = document.createElement("p");
+ el.append("Filters: ");
+
+ const niceFilters = new Map([
+ [false, "Nice"],
+ [true, "Harsh"],
+ ]);
+ let linkArray = [];
+ for (const [bool, string] of niceFilters) {
+ if (filters.harsh === bool) {
+ linkArray.push(
+ App.UI.DOM.disabledLink(
+ string,
+ ["Currently selected"]
+ )
+ );
+ } else {
+ linkArray.push(
+ App.UI.DOM.link(
+ string,
+ () => {
+ filters.harsh = bool;
+ refresh();
+ }
+ )
+ );
+ }
+ }
+ App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray));
+
+ el.append(" / ");
+ const exposureFilters = new Map([
+ [0, "Modest"],
+ [1, "Normal"],
+ [2, "Slutty"],
+ [3, "Humiliating"],
+ [4, "Practically nude"],
+ ]);
+ linkArray = [];
+ for (const [num, string] of exposureFilters) {
+ if (filters.exposure === num) {
+ linkArray.push(
+ App.UI.DOM.disabledLink(
+ string,
+ ["Currently selected"]
+ )
+ );
+ } else {
+ linkArray.push(
+ App.UI.DOM.link(
+ string,
+ () => {
+ filters.exposure = num;
+ refresh();
+ }
+ )
+ );
+ }
+ }
+ App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray));
+ el.append(" / ");
- return frag;
+ App.UI.DOM.appendNewElement("span", el, App.UI.DOM.link(
+ "Reset Filters",
+ () => {
+ filters = {};
+ refresh();
+ }
+ )); // clear filters
+ App.UI.DOM.appendNewElement("hr", el);
+ return el;
+ }
function clothes() {
const el = document.createElement('div');
let links;
if (slave.fuckdoll === 0) {
+ // First Row
let label = document.createElement('div');
label.append(`Clothes: `);
- let choice = App.UI.DOM.disabledLink(`${slave.clothes}`, [clothTooltip(`${slave.clothes}`)]);
+ let choice = App.UI.DOM.disabledLink(`${slave.clothes} `, [clothTooltip(`${slave.clothes}`)]);
choice.style.fontWeight = "bold";
label.appendChild(choice);
+ if (slave.fuckdoll !== 0 || slave.clothes === "restrictive latex" || slave.clothes === "a latex catsuit" || slave.clothes === "a cybersuit" || slave.clothes === "a comfortable bodysuit") {
+ if (V.seeImages === 1 && V.imageChoice === 1) {
+ // Color options
+ label.appendChild(colorOptions("clothingBaseColor"));
+ }
+ }
+
// Choose her own
if (slave.clothes !== `choosing her own clothes`) {
let choiceOptionsArray = [];
@@ -45,105 +138,89 @@ App.UI.SlaveInteract.wardrobe = function(slave) {
label.appendChild(generateRows(choiceOptionsArray, "clothes", false));
}
el.appendChild(label);
+ links = App.UI.DOM.appendNewElement("div", el, clothingSelection());
+ links.id = "clothing-selection";
+ }
+
+ const label = document.createElement('div');
+ label.append(`Collar: `);
+ let choice = App.UI.DOM.disabledLink(`${slave.collar}`, [clothTooltip(`${slave.collar}`)]);
+ choice.style.fontWeight = "bold";
+ label.appendChild(choice);
+ // Choose her own
+ if (slave.collar !== `none`) {
+ let choiceOptionsArray = [];
+ choiceOptionsArray.push({text: ` None`, updateSlave: {collar: `none`}});
+ label.appendChild(generateRows(choiceOptionsArray, "collar", false));
+ }
+ el.appendChild(label);
+
+ links = App.UI.DOM.appendNewElement("div", el, collar());
+ links.id = "collar-selection";
+ return el;
- let niceOptionsArray = [];
- let harshOptionsArray = [];
+ function clothingSelection() {
+ const el = new DocumentFragment();
+ let array = [];
for (const [key, object] of App.Data.clothes) {
if (key === "choosing her own clothes") {
continue;
}
+ if (filters.hasOwnProperty("exposure") && filters.exposure !== object.exposure) {
+ continue;
+ }
+ if (filters.hasOwnProperty("harsh") && ((filters.harsh === false && object.harsh) || (filters.harsh === true && !object.harsh))) {
+ continue;
+ }
const reshapedItem = {
text: object.name,
updateSlave: {clothes: key, choosesOwnClothes: 0},
FS: object.fs,
exposure: object.exposure,
};
- if (object.harsh) {
- harshOptionsArray.push(reshapedItem);
- } else {
- niceOptionsArray.push(reshapedItem);
- }
+ array.push(reshapedItem);
}
// Sort
- niceOptionsArray = niceOptionsArray.sort((a, b) => (a.text > b.text) ? 1 : -1);
- harshOptionsArray = harshOptionsArray.sort((a, b) => (a.text > b.text) ? 1 : -1);
-
- // Nice options
- links = App.UI.DOM.appendNewElement("div", el, "Nice: ", "choices");
- links.appendChild(generateRows(niceOptionsArray, "clothes", true));
-
- // Harsh options
- links = App.UI.DOM.appendNewElement("div", el, "Harsh: ", "choices");
- links.appendChild(generateRows(harshOptionsArray, "clothes", true));
- }
- if (slave.fuckdoll !== 0 || slave.clothes === "restrictive latex" || slave.clothes === "a latex catsuit" || slave.clothes === "a cybersuit" || slave.clothes === "a comfortable bodysuit") {
- if (V.seeImages === 1 && V.imageChoice === 1) {
- // Color options
- links = App.UI.DOM.appendNewElement("div", el, "Color: ", "choices");
- links.appendChild(colorOptions("clothingBaseColor"));
+ array = array.sort((a, b) => (a.text > b.text) ? 1 : -1);
+ if (array.length > 0) {
+ App.UI.DOM.appendNewElement("div", el, generateRows(array, "clothes", true), "choices");
+ } else {
+ App.UI.DOM.appendNewElement("div", el, "No available clothing meets your criteria", ["note", "choices"]);
}
+ return el;
}
- return el;
- }
-
- function collar() {
- const el = document.createElement('div');
-
- const label = document.createElement('div');
- label.append(`Collar: `);
-
- let choice = App.UI.DOM.disabledLink(`${slave.collar}`, [clothTooltip(`${slave.collar}`)]);
- choice.style.fontWeight = "bold";
- label.appendChild(choice);
-
- // Choose her own
- if (slave.collar !== `none`) {
- let choiceOptionsArray = [];
- choiceOptionsArray.push({text: ` None`, updateSlave: {collar: `none`}});
- label.appendChild(generateRows(choiceOptionsArray, "collar", false));
- }
-
- el.appendChild(label);
+ function collar() {
+ const el = new DocumentFragment();
+ let array = [];
- let niceOptionsArray = [];
- let harshOptionsArray = [];
+ for (const [key, object] of App.Data.slaveWear.collars) {
+ if (key === "choosing her own clothes") {
+ continue;
+ }
+ if (filters.hasOwnProperty("harsh") && ((filters.harsh === false && object.harsh) || (filters.harsh === true && !object.harsh))) {
+ continue;
+ }
+ const reshapedItem = {
+ text: object.name,
+ updateSlave: {collar: key},
+ FS: object.fs,
+ };
+ array.push(reshapedItem);
+ }
- for (const [key, object] of App.Data.slaveWear.collars) {
- const reshapedItem = {
- text: object.name,
- updateSlave: {collar: key},
- FS: object.fs,
- };
- if (object.harsh) {
- harshOptionsArray.push(reshapedItem);
+ // Sort
+ array = array.sort((a, b) => (a.text > b.text) ? 1 : -1);
+ if (array.length > 0) {
+ App.UI.DOM.appendNewElement("div", el, generateRows(array, "collar", true), "choices");
} else {
- niceOptionsArray.push(reshapedItem);
+ App.UI.DOM.appendNewElement("div", el, "No available collar meets your criteria", ["note", "choices"]);
}
+ return el;
}
-
- // Sort
- niceOptionsArray = niceOptionsArray.sort((a, b) => (a.text > b.text) ? 1 : -1);
- harshOptionsArray = harshOptionsArray.sort((a, b) => (a.text > b.text) ? 1 : -1);
-
- // Nice options
- let links = document.createElement('div');
- links.className = "choices";
- links.append(`Nice: `);
- links.appendChild(generateRows(niceOptionsArray, "collar", true));
- el.appendChild(links);
-
- // Harsh options
- links = document.createElement('div');
- links.className = "choices";
- links.append(`Harsh: `);
- links.appendChild(generateRows(harshOptionsArray, "collar", true));
- el.appendChild(links);
-
- return el;
}
function mask() {
@@ -754,8 +831,7 @@ App.UI.SlaveInteract.wardrobe = function(slave) {
}
function refresh() {
- App.Art.refreshSlaveArt(slave, 3, "art-frame");
- jQuery("#content-appearance").empty().append(App.UI.SlaveInteract.wardrobe(slave));
+ jQuery("#content").empty().append(contents());
}
/**