@@ -4,7 +4,6 @@ import { element, ref } from 'tsx-vanilla';
4
4
import { ActionId } from '../proto_utils/action_id.js' ;
5
5
import { TypedEvent } from '../typed_event.js' ;
6
6
import { isRightClick } from '../utils.js' ;
7
-
8
7
import { Input , InputConfig } from './input.js' ;
9
8
10
9
// Data for creating an icon-based input component.
@@ -24,12 +23,12 @@ export interface IconPickerConfig<ModObject, ValueType> extends InputConfig<ModO
24
23
25
24
// Only used if states >= 4.
26
25
improvedId2 ?: ActionId ;
27
- } ;
26
+ }
28
27
29
28
// Icon-based UI for picking buffs / consumes / etc
30
29
// ModObject is the object being modified (Sim, Player, or Target).
31
30
export class IconPicker < ModObject , ValueType > extends Input < ModObject , ValueType > {
32
- active : Boolean ;
31
+ active : boolean ;
33
32
34
33
private readonly config : IconPickerConfig < ModObject , ValueType > ;
35
34
@@ -65,15 +64,21 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
65
64
this . rootAnchor . classList . add ( 'use-counter' ) ;
66
65
}
67
66
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 > ( ) ;
71
70
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 >
75
80
< span ref = { ce } className = { `icon-picker-label ${ this . config . states > 2 ? '' : 'hide' } ` } > </ span >
76
- </ div >
81
+ </ div > ,
77
82
) ;
78
83
79
84
this . improvedAnchor = ia . value ! ;
@@ -93,7 +98,7 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
93
98
94
99
this . rootAnchor . addEventListener ( 'click' , event => {
95
100
this . handleLeftClick ( event ) ;
96
- } )
101
+ } ) ;
97
102
98
103
this . rootAnchor . addEventListener ( 'contextmenu' , event => {
99
104
event . preventDefault ( ) ;
@@ -102,35 +107,37 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
102
107
const rightClick = isRightClick ( event ) ;
103
108
104
109
if ( rightClick ) {
105
- this . handleRightClick ( event )
110
+ this . handleRightClick ( event ) ;
106
111
event . preventDefault ( ) ;
107
112
}
108
113
} ) ;
109
114
}
110
115
111
116
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 ) {
113
118
this . currentValue ++ ;
114
119
this . inputChanged ( TypedEvent . nextEventID ( ) ) ;
115
- } else if ( this . currentValue > 0 ) { // roll over
120
+ } else if ( this . currentValue > 0 ) {
121
+ // roll over
116
122
this . currentValue = 0 ;
117
123
this . inputChanged ( TypedEvent . nextEventID ( ) ) ;
118
124
}
119
125
event . preventDefault ( ) ;
120
- }
126
+ } ;
121
127
122
128
handleRightClick = ( _event : UIEvent ) => {
123
129
if ( this . currentValue > 0 ) {
124
130
this . currentValue -- ;
125
- } else { // roll over
131
+ } else {
132
+ // roll over
126
133
if ( this . config . states === 0 ) {
127
- this . currentValue = 1
134
+ this . currentValue = 1 ;
128
135
} else {
129
- this . currentValue = this . config . states - 1
136
+ this . currentValue = this . config . states - 1 ;
130
137
}
131
138
}
132
139
this . inputChanged ( TypedEvent . nextEventID ( ) ) ;
133
- }
140
+ } ;
134
141
135
142
getInputElem ( ) : HTMLElement {
136
143
return this . rootAnchor ;
@@ -146,7 +153,6 @@ export class IconPicker<ModObject, ValueType> extends Input<ModObject, ValueType
146
153
147
154
// Returns the ActionId of the currently selected value, or null if none selected.
148
155
getActionId ( ) : ActionId | null {
149
-
150
156
// Go directly to source because during event propogation
151
157
// the internal `this.currentValue` may not yet have been updated.
152
158
const v = Number ( this . config . getValue ( this . modObject ) ) ;
0 commit comments