Skip to content

Commit 1f33326

Browse files
authored
Fix improved icon tooltips (#4245)
* port two SoD updates * fix icon enum tooltips * gear picker style tweaks from sod * fix gem summary tooltips * fix apl tooltips * fix improved icon tooltips
1 parent 2876b91 commit 1f33326

File tree

1 file changed

+26
-20
lines changed

1 file changed

+26
-20
lines changed

ui/core/components/icon_picker.tsx

Lines changed: 26 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { element, ref } from 'tsx-vanilla';
44
import { ActionId } from '../proto_utils/action_id.js';
55
import { TypedEvent } from '../typed_event.js';
66
import { isRightClick } from '../utils.js';
7-
87
import { Input, InputConfig } from './input.js';
98

109
// Data for creating an icon-based input component.
@@ -24,12 +23,12 @@ export interface IconPickerConfig<ModObject, ValueType> extends InputConfig<ModO
2423

2524
// Only used if states >= 4.
2625
improvedId2?: ActionId;
27-
};
26+
}
2827

2928
// Icon-based UI for picking buffs / consumes / etc
3029
// ModObject is the object being modified (Sim, Player, or Target).
3130
export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType> {
32-
active: Boolean;
31+
active: boolean;
3332

3433
private readonly config: IconPickerConfig<ModObject, ValueType>;
3534

@@ -65,15 +64,21 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
6564
this.rootAnchor.classList.add('use-counter');
6665
}
6766

68-
let ia = ref<HTMLAnchorElement>();
69-
let ia2 = ref<HTMLAnchorElement>();
70-
let ce = ref<HTMLSpanElement>();
67+
const ia = ref<HTMLAnchorElement>();
68+
const ia2 = ref<HTMLAnchorElement>();
69+
const ce = ref<HTMLSpanElement>();
7170
this.rootAnchor.appendChild(
72-
<div className='icon-input-level-container'>
73-
<a ref={ia} className="icon-picker-button icon-input-improved icon-input-improved1" dataset={{disableWowheadTouchTooltip:'true'}}></a>
74-
<a ref={ia2} className="icon-picker-button icon-input-improved icon-input-improved2" dataset={{disableWowheadTouchTooltip:'true'}}></a>
71+
<div className="icon-input-level-container">
72+
<a
73+
ref={ia}
74+
className="icon-picker-button icon-input-improved icon-input-improved1"
75+
dataset={{ whtticon: 'false', disableWowheadTouchTooltip: 'true' }}></a>
76+
<a
77+
ref={ia2}
78+
className="icon-picker-button icon-input-improved icon-input-improved2"
79+
dataset={{ whtticon: 'false', disableWowheadTouchTooltip: 'true' }}></a>
7580
<span ref={ce} className={`icon-picker-label ${this.config.states > 2 ? '' : 'hide'}`}></span>
76-
</div>
81+
</div>,
7782
);
7883

7984
this.improvedAnchor = ia.value!;
@@ -93,7 +98,7 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
9398

9499
this.rootAnchor.addEventListener('click', event => {
95100
this.handleLeftClick(event);
96-
})
101+
});
97102

98103
this.rootAnchor.addEventListener('contextmenu', event => {
99104
event.preventDefault();
@@ -102,35 +107,37 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
102107
const rightClick = isRightClick(event);
103108

104109
if (rightClick) {
105-
this.handleRightClick(event)
110+
this.handleRightClick(event);
106111
event.preventDefault();
107112
}
108113
});
109114
}
110115

111116
handleLeftClick = (event: UIEvent) => {
112-
if (this.config.states == 0 || (this.currentValue + 1) < this.config.states) {
117+
if (this.config.states == 0 || this.currentValue + 1 < this.config.states) {
113118
this.currentValue++;
114119
this.inputChanged(TypedEvent.nextEventID());
115-
} else if (this.currentValue > 0) { // roll over
120+
} else if (this.currentValue > 0) {
121+
// roll over
116122
this.currentValue = 0;
117123
this.inputChanged(TypedEvent.nextEventID());
118124
}
119125
event.preventDefault();
120-
}
126+
};
121127

122128
handleRightClick = (_event: UIEvent) => {
123129
if (this.currentValue > 0) {
124130
this.currentValue--;
125-
} else { // roll over
131+
} else {
132+
// roll over
126133
if (this.config.states === 0) {
127-
this.currentValue = 1
134+
this.currentValue = 1;
128135
} else {
129-
this.currentValue = this.config.states - 1
136+
this.currentValue = this.config.states - 1;
130137
}
131138
}
132139
this.inputChanged(TypedEvent.nextEventID());
133-
}
140+
};
134141

135142
getInputElem(): HTMLElement {
136143
return this.rootAnchor;
@@ -146,7 +153,6 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
146153

147154
// Returns the ActionId of the currently selected value, or null if none selected.
148155
getActionId(): ActionId | null {
149-
150156
// Go directly to source because during event propogation
151157
// the internal `this.currentValue` may not yet have been updated.
152158
const v = Number(this.config.getValue(this.modObject));

0 commit comments

Comments
 (0)