+ className={`selector-modal-tab-pane tab-pane fade ${
+ selected ? 'active show' : ''
+ }`}>
-
- {label == 'Items' &&
}
+
+ {label == 'Items' && (
+
+ )}
-
-
+
+
-
-
+
+
@@ -845,85 +904,148 @@ export class ItemList
{
parent.appendChild(this.tabContent);
new Tooltip(epButton.value!, {
- title: EP_TOOLTIP
+ title: EP_TOOLTIP,
});
- const show1hWeaponsSelector = makeShow1hWeaponsSelector(this.tabContent.getElementsByClassName('selector-modal-show-1h-weapons')[0] as HTMLElement, player.sim);
- const show2hWeaponsSelector = makeShow2hWeaponsSelector(this.tabContent.getElementsByClassName('selector-modal-show-2h-weapons')[0] as HTMLElement, player.sim);
- if (!(label == 'Items' && (slot == ItemSlot.ItemSlotMainHand || (slot == ItemSlot.ItemSlotOffHand && player.getClass() == Class.ClassWarrior)))) {
- (this.tabContent.getElementsByClassName('selector-modal-show-1h-weapons')[0] as HTMLElement).style.display = 'none';
- (this.tabContent.getElementsByClassName('selector-modal-show-2h-weapons')[0] as HTMLElement).style.display = 'none';
+ const show1hWeaponsSelector = makeShow1hWeaponsSelector(
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-1h-weapons',
+ )[0] as HTMLElement,
+ player.sim,
+ );
+ const show2hWeaponsSelector = makeShow2hWeaponsSelector(
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-2h-weapons',
+ )[0] as HTMLElement,
+ player.sim,
+ );
+ if (
+ !(
+ label == 'Items' &&
+ (slot == ItemSlot.ItemSlotMainHand ||
+ (slot == ItemSlot.ItemSlotOffHand && player.getClass() == Class.ClassWarrior))
+ )
+ ) {
+ (
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-1h-weapons',
+ )[0] as HTMLElement
+ ).style.display = 'none';
+ (
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-2h-weapons',
+ )[0] as HTMLElement
+ ).style.display = 'none';
}
- makeShowEPValuesSelector(this.tabContent.getElementsByClassName('selector-modal-show-ep-values')[0] as HTMLElement, player.sim);
+ makeShowEPValuesSelector(
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-ep-values',
+ )[0] as HTMLElement,
+ player.sim,
+ );
- const showMatchingGemsSelector = makeShowMatchingGemsSelector(this.tabContent.getElementsByClassName('selector-modal-show-matching-gems')[0] as HTMLElement, player.sim);
+ const showMatchingGemsSelector = makeShowMatchingGemsSelector(
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-matching-gems',
+ )[0] as HTMLElement,
+ player.sim,
+ );
if (!label.startsWith('Gem')) {
- (this.tabContent.getElementsByClassName('selector-modal-show-matching-gems')[0] as HTMLElement).style.display = 'none';
+ (
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-show-matching-gems',
+ )[0] as HTMLElement
+ ).style.display = 'none';
}
- const phaseSelector = makePhaseSelector(this.tabContent.getElementsByClassName('selector-modal-phase-selector')[0] as HTMLElement, player.sim);
+ const phaseSelector = makePhaseSelector(
+ this.tabContent.getElementsByClassName(
+ 'selector-modal-phase-selector',
+ )[0] as HTMLElement,
+ player.sim,
+ );
if (label == 'Items') {
- const filtersButton = this.tabContent.getElementsByClassName('selector-modal-filters-button')[0] as HTMLElement;
+ const filtersButton = this.tabContent.getElementsByClassName(
+ 'selector-modal-filters-button',
+ )[0] as HTMLElement;
filtersButton.addEventListener('click', () => new FiltersMenu(parent, player, slot));
}
- this.listElem = this.tabContent.getElementsByClassName('selector-modal-list')[0] as HTMLElement;
+ this.listElem = this.tabContent.getElementsByClassName(
+ 'selector-modal-list',
+ )[0] as HTMLElement;
this.itemsToDisplay = [];
- this.scroller = new Clusterize({
- getNumberOfRows: () => { return this.itemsToDisplay.length },
- generateRows: (startIdx, endIdx) => {
- let items = [];
- for (let i = startIdx; i < endIdx; ++i) {
- if (i >= this.itemsToDisplay.length)
- break;
- items.push(this.createItemElem({idx:this.itemsToDisplay[i], data:this.itemData[this.itemsToDisplay[i]]}));
- }
- return items;
- }
- }, {
- rows: [],
- scroll_elem: this.listElem,
- content_elem: this.listElem,
- item_height: 56,
- show_no_data_row: false,
- no_data_text: '',
- tag: 'li',
- rows_in_block: 16,
- blocks_in_cluster: 2,
- });
+ this.scroller = new Clusterize(
+ {
+ getNumberOfRows: () => {
+ return this.itemsToDisplay.length;
+ },
+ generateRows: (startIdx, endIdx) => {
+ const items = [];
+ for (let i = startIdx; i < endIdx; ++i) {
+ if (i >= this.itemsToDisplay.length) break;
+ items.push(
+ this.createItemElem({
+ idx: this.itemsToDisplay[i],
+ data: this.itemData[this.itemsToDisplay[i]],
+ }),
+ );
+ }
+ return items;
+ },
+ },
+ {
+ rows: [],
+ scroll_elem: this.listElem,
+ content_elem: this.listElem,
+ item_height: 56,
+ show_no_data_row: false,
+ no_data_text: '',
+ tag: 'li',
+ rows_in_block: 16,
+ blocks_in_cluster: 2,
+ },
+ );
- const removeButton = this.tabContent.getElementsByClassName('selector-modal-remove-button')[0] as HTMLButtonElement;
+ const removeButton = this.tabContent.getElementsByClassName(
+ 'selector-modal-remove-button',
+ )[0] as HTMLButtonElement;
removeButton.addEventListener('click', event => {
onRemove(TypedEvent.nextEventID());
});
- if (label.startsWith("Enchants")) {
+ if (label.startsWith('Enchants')) {
removeButton.textContent = 'Remove Enchant';
- } else if (label.startsWith("Gem")) {
+ } else if (label.startsWith('Gem')) {
removeButton.textContent = 'Remove Gem';
}
this.updateSelected();
- this.searchInput = this.tabContent.getElementsByClassName('selector-modal-search')[0] as HTMLInputElement;
+ this.searchInput = this.tabContent.getElementsByClassName(
+ 'selector-modal-search',
+ )[0] as HTMLInputElement;
this.searchInput.addEventListener('input', () => this.applyFilters());
- const simAllButton = this.tabContent.getElementsByClassName('selector-modal-simall-button')[0] as HTMLButtonElement;
- if (label == "Items") {
- simAllButton.hidden = !player.sim.getShowExperimental()
+ const simAllButton = this.tabContent.getElementsByClassName(
+ 'selector-modal-simall-button',
+ )[0] as HTMLButtonElement;
+ if (label == 'Items') {
+ simAllButton.hidden = !player.sim.getShowExperimental();
player.sim.showExperimentalChangeEmitter.on(() => {
simAllButton.hidden = !player.sim.getShowExperimental();
});
- simAllButton.addEventListener('click', (event) => {
+ simAllButton.addEventListener('click', event => {
if (simUI instanceof IndividualSimUI) {
- let itemSpecs = Array();
- const isRangedOrTrinket = this.slot == ItemSlot.ItemSlotRanged ||
+ const itemSpecs = Array();
+ const isRangedOrTrinket =
+ this.slot == ItemSlot.ItemSlotRanged ||
this.slot == ItemSlot.ItemSlotTrinket1 ||
- this.slot == ItemSlot.ItemSlotTrinket2
+ this.slot == ItemSlot.ItemSlotTrinket2;
const curItem = this.equippedToItemFn(this.player.getEquippedItem(this.slot));
let curEP = 0;
@@ -931,9 +1053,9 @@ export class ItemList {
curEP = this.computeEP(curItem);
}
- for(let i of this.itemsToDisplay) {
+ for (const i of this.itemsToDisplay) {
const idata = this.itemData[i];
- if (!isRangedOrTrinket && curEP > 0 && idata.baseEP < (curEP / 2)) {
+ if (!isRangedOrTrinket && curEP > 0 && idata.baseEP < curEP / 2) {
continue; // If we have EPs on current item, dont sim items with less than half the EP.
}
@@ -941,7 +1063,6 @@ export class ItemList {
if (idata.baseEP > 0 || isRangedOrTrinket) {
itemSpecs.push(ItemSpec.create({ id: idata.id }));
}
-
}
simUI.bt.addItems(itemSpecs);
// TODO: should we open the bulk sim UI or should we run in the background showing progress, and then sort the items in the picker?
@@ -966,18 +1087,22 @@ export class ItemList {
const newEquippedItem = this.gearData.getEquippedItem();
const newItem = this.equippedToItemFn(newEquippedItem);
- const newItemId = newItem ? (this.label == 'Enchants' ? (newItem as unknown as Enchant).effectId : (newItem as unknown as Item | Gem).id) : 0;
+ const newItemId = newItem
+ ? this.label == 'Enchants'
+ ? (newItem as unknown as Enchant).effectId
+ : (newItem as unknown as Item | Gem).id
+ : 0;
const newEP = newItem ? this.computeEP(newItem) : 0;
- this.scroller.elementUpdate((item) => {
- let idx = (item as HTMLElement).dataset.idx!;
+ this.scroller.elementUpdate(item => {
+ const idx = (item as HTMLElement).dataset.idx!;
const itemData = this.itemData[parseFloat(idx)];
- if (itemData.id == newItemId)
- item.classList.add('active');
- else
- item.classList.remove('active');
+ if (itemData.id == newItemId) item.classList.add('active');
+ else item.classList.remove('active');
- const epDeltaElem = item.getElementsByClassName('selector-modal-list-item-ep-delta')[0] as HTMLSpanElement;
+ const epDeltaElem = item.getElementsByClassName(
+ 'selector-modal-list-item-ep-delta',
+ )[0] as HTMLSpanElement;
if (epDeltaElem) {
epDeltaElem.textContent = '';
if (itemData.item) {
@@ -993,7 +1118,7 @@ export class ItemList {
public applyFilters() {
this.currentFilters = this.player.sim.getFilters();
let itemIdxs = new Array(this.itemData.length);
- for (let i = 0; i < this.itemData.length; ++i) {
+ for (let i = 0; i < this.itemData.length; ++i) {
itemIdxs[i] = i;
}
@@ -1003,19 +1128,22 @@ export class ItemList {
itemIdxs = this.player.filterItemData(
itemIdxs,
i => this.itemData[i].item as unknown as Item,
- this.slot);
+ this.slot,
+ );
} else if (this.label == 'Enchants') {
itemIdxs = this.player.filterEnchantData(
itemIdxs,
i => this.itemData[i].item as unknown as Enchant,
this.slot,
- currentEquippedItem);
+ currentEquippedItem,
+ );
} else if (this.label.startsWith('Gem')) {
itemIdxs = this.player.filterGemData(
itemIdxs,
i => this.itemData[i].item as unknown as Gem,
this.slot,
- this.socketColor);
+ this.socketColor,
+ );
}
itemIdxs = itemIdxs.filter(i => {
@@ -1026,13 +1154,15 @@ export class ItemList {
}
if (this.searchInput.value.length > 0) {
- const searchQuery = this.searchInput.value.toLowerCase().replaceAll(/[^a-zA-Z0-9\s]/g, '').split(" ");
+ const searchQuery = this.searchInput.value
+ .toLowerCase()
+ .replaceAll(/[^a-zA-Z0-9\s]/g, '')
+ .split(' ');
const name = listItemData.name.toLowerCase().replaceAll(/[^a-zA-Z0-9\s]/g, '');
- var include = true;
+ let include = true;
searchQuery.forEach(v => {
- if (!name.includes(v))
- include = false;
+ if (!name.includes(v)) include = false;
});
if (!include) {
return false;
@@ -1045,14 +1175,16 @@ export class ItemList {
let sortFn: (itemA: T, itemB: T) => number;
if (this.slot == ItemSlot.ItemSlotTrinket1 || this.slot == ItemSlot.ItemSlotTrinket2) {
// Trinket EP is weird so just sort by ilvl instead.
- sortFn = (itemA, itemB) => (itemB as unknown as Item).ilvl - (itemA as unknown as Item).ilvl;
+ sortFn = (itemA, itemB) =>
+ (itemB as unknown as Item).ilvl - (itemA as unknown as Item).ilvl;
} else {
sortFn = (itemA, itemB) => {
const diff = this.computeEP(itemB) - this.computeEP(itemA);
// if EP is same, sort by ilvl
- if (Math.abs(diff) < 0.01) return (itemB as unknown as Item).ilvl - (itemA as unknown as Item).ilvl;
+ if (Math.abs(diff) < 0.01)
+ return (itemB as unknown as Item).ilvl - (itemA as unknown as Item).ilvl;
return diff;
- }
+ };
}
itemIdxs = itemIdxs.sort((dataA, dataB) => {
@@ -1071,20 +1203,18 @@ export class ItemList {
}
public hideOrShowEPValues() {
- const labels = this.tabContent.getElementsByClassName("ep-label")
- const container = this.tabContent.getElementsByClassName("selector-modal-list")
+ const labels = this.tabContent.getElementsByClassName('ep-label');
+ const container = this.tabContent.getElementsByClassName('selector-modal-list');
const show = this.player.sim.getShowEPValues();
- const display = show ? "" : "none"
+ const display = show ? '' : 'none';
- for (let label of labels) {
+ for (const label of labels) {
(label as HTMLElement).style.display = display;
}
- for (let c of container) {
- if (show)
- c.classList.remove("hide-ep");
- else
- c.classList.add("hide-ep");
+ for (const c of container) {
+ if (show) c.classList.remove('hide-ep');
+ else c.classList.add('hide-ep');
}
}
@@ -1093,18 +1223,29 @@ export class ItemList {
const itemEP = this.computeEP(itemData.item);
const equippedItem = this.equippedToItemFn(this.gearData.getEquippedItem());
- const equippedItemID = equippedItem ? (this.label == 'Enchants' ? (equippedItem as unknown as Enchant).effectId : (equippedItem as unknown as Item).id) : 0;
- const equippedItemEP = equippedItem ? this.computeEP(equippedItem) : 0
+ const equippedItemID = equippedItem
+ ? this.label == 'Enchants'
+ ? (equippedItem as unknown as Enchant).effectId
+ : (equippedItem as unknown as Item).id
+ : 0;
+ const equippedItemEP = equippedItem ? this.computeEP(equippedItem) : 0;
const nameElem = ref();
const anchorElem = ref();
const iconElem = ref();
const listItemElem = (
-
-
-
-
-