diff --git a/src/interaction/siWardrobe.js b/src/interaction/siWardrobe.js index 21659cca0a9447db6e99c27e24f4cebfaf8c2b73..88ac8a7d09c26d99177516c570ea41daefe7f075 100644 --- a/src/interaction/siWardrobe.js +++ b/src/interaction/siWardrobe.js @@ -30,7 +30,9 @@ App.UI.SlaveInteract.wardrobe = function(slave) { function clothes() { const el = document.createElement('div'); let links; + let filters = {}; if (slave.fuckdoll === 0) { + // First Row let label = document.createElement('div'); label.append(`Clothes: `); @@ -45,49 +47,107 @@ App.UI.SlaveInteract.wardrobe = function(slave) { label.appendChild(generateRows(choiceOptionsArray, "clothes", false)); } el.appendChild(label); + const filtersDiv = App.UI.DOM.appendNewElement("div", el, filtersDOM()); + filtersDiv.id = "filters"; + links = App.UI.DOM.appendNewElement("div", el, clothingSelection()); + links.id = "clothing-selection"; + } + 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")); + } + } + return el; + function filtersDOM() { + const el = new DocumentFragment(); + el.append("Filter clothing: "); + const exposureFilters = new Map([ + [0, "Modest"], + [1, "Normal"], + [2, "Slutty"], + [3, "Humiliating"], + [4, "Practically nude"], + ]); + let linkArray = []; + for (const [num, string] of exposureFilters) { + linkArray.push( + App.UI.DOM.link( + string, + () => { + filters.exposure = num; + jQuery("#clothing-selection").empty().append(clothingSelection()); + } + ) + ); + } + App.UI.DOM.appendNewElement("div", el, App.UI.DOM.generateLinksStrip(linkArray)); + + const niceFilters = new Map([ + [false, "Nice"], + [true, "Harsh"], + ]); + linkArray = []; + for (const [bool, string] of niceFilters) { + linkArray.push( + App.UI.DOM.link( + string, + () => { + filters.harsh = bool; + jQuery("#clothing-selection").empty().append(clothingSelection()); + } + ) + ); + } + App.UI.DOM.appendNewElement("div", el, App.UI.DOM.generateLinksStrip(linkArray)); + + App.UI.DOM.appendNewElement("div", el, App.UI.DOM.link( + "Reset Filters", + () => { + filters = {}; + jQuery("#filters").empty().append(filtersDOM()); + jQuery("#clothing-selection").empty().append(clothingSelection()); + } + )); // clear filters + 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) { + el.append("Clothing options: "); + el.appendChild(generateRows(array, "clothes", true)); + } else { + el.append("Clothing options: "); + App.UI.DOM.appendNewElement("span", el, "No available clothing meets your criteria", "note"); } + return el; } - - return el; } function collar() {