@@ -39,38 +39,38 @@ $.widget( "ui.selectmenu", {
39
39
_create : function ( ) {
40
40
// set a default id value, generate a new random one if not set by developer
41
41
var selectmenuId = this . element . attr ( 'id' ) || 'ui-selectmenu-' + Math . random ( ) . toString ( 16 ) . slice ( 2 , 10 ) ;
42
-
42
+
43
43
// array of button and menu id's
44
44
this . ids = { id : selectmenuId , button : selectmenuId + '-button' , menu : selectmenuId + '-menu' } ;
45
-
45
+
46
46
// set current value
47
47
if ( this . options . value ) {
48
48
this . element [ 0 ] . value = this . options . value ;
49
49
} else {
50
50
this . options . value = this . element [ 0 ] . value ;
51
51
}
52
-
52
+
53
53
// catch click event of the label
54
54
this . _bind ( {
55
55
'click' : function ( event ) {
56
56
this . button . focus ( ) ;
57
57
event . preventDefault ( ) ;
58
58
}
59
59
} ) ;
60
-
60
+
61
61
this . _drawButton ( ) ;
62
62
this . _bind ( this . button , this . _buttonEvents ) ;
63
-
63
+
64
64
this . _drawMenu ( ) ;
65
- this . refresh ( ) ;
65
+ this . refresh ( ) ;
66
66
} ,
67
-
67
+
68
68
_drawButton : function ( ) {
69
- var tabindex = this . element . attr ( 'tabindex' ) ;
70
-
69
+ var tabindex = this . element . attr ( 'tabindex' ) ;
70
+
71
71
// hide original select tag
72
72
this . element . hide ( ) ;
73
-
73
+
74
74
// create button
75
75
this . button = $ ( '<a />' , {
76
76
href : '#' + this . ids . id ,
@@ -81,34 +81,34 @@ $.widget( "ui.selectmenu", {
81
81
} ,
82
82
'aria-disabled' : this . options . disabled ,
83
83
'aria-owns' : this . ids . menu ,
84
- 'aria-haspopup' : true
84
+ 'aria-haspopup' : true
85
85
} )
86
86
. button ( {
87
87
label : this . element . find ( "option:selected" ) . text ( ) ,
88
88
icons : {
89
89
primary : ( this . options . dropdown ? 'ui-icon-triangle-1-s' : 'ui-icon-triangle-2-n-s' )
90
90
}
91
91
} ) ;
92
-
92
+
93
93
// wrap and insert new button
94
94
this . buttonWrap = $ ( '<span />' )
95
95
. addClass ( 'ui-selectmenu-button' )
96
96
. append ( this . button )
97
- . insertAfter ( this . element ) ;
97
+ . insertAfter ( this . element ) ;
98
98
} ,
99
-
99
+
100
100
_drawMenu : function ( ) {
101
101
var that = this ;
102
-
103
- // create menu portion, append to body
102
+
103
+ // create menu portion, append to body
104
104
this . menu = $ ( '<ul />' , {
105
105
'class' : 'ui-widget ui-widget-content' ,
106
106
'aria-hidden' : true ,
107
107
'aria-labelledby' : this . ids . button ,
108
108
role : 'menubox' ,
109
109
id : this . ids . menu
110
110
} ) ;
111
-
111
+
112
112
// set width
113
113
if ( this . options . dropdown ) {
114
114
var setWidth = this . button . outerWidth ( ) ;
@@ -123,142 +123,142 @@ $.widget( "ui.selectmenu", {
123
123
. width ( setWidth )
124
124
. append ( this . menu )
125
125
. appendTo ( this . options . appendTo ) ;
126
-
126
+
127
127
// init menu widget
128
128
this . menu . menu ( {
129
129
select : function ( event , ui ) {
130
130
var flag = false ,
131
131
item = ui . item . data ( "item.selectmenu" ) ,
132
132
oldIndex = that . element [ 0 ] . selectedIndex ;
133
-
133
+
134
134
that . _setOption ( "value" , item . value ) ;
135
135
that . _trigger ( "select" , event , { item : item } ) ;
136
-
136
+
137
137
if ( item . index != oldIndex ) {
138
138
that . _trigger ( "change" , event , { item : item } ) ;
139
139
}
140
-
140
+
141
141
if ( that . isOpen ) {
142
142
event . preventDefault ( ) ;
143
143
that . close ( event , true ) ;
144
144
}
145
145
} ,
146
146
focus : function ( event , ui ) {
147
147
var item = ui . item . data ( "item.selectmenu" ) ;
148
-
148
+
149
149
if ( that . focus !== undefined && item . index != that . focus ) {
150
150
that . _trigger ( "focus" , event , { item : item } ) ;
151
151
}
152
-
152
+
153
153
that . focus = item . index ;
154
154
}
155
155
} ) ;
156
-
156
+
157
157
// document click closes menu
158
158
this . _bind ( document , {
159
159
'click' : function ( event ) {
160
160
if ( this . isOpen && ! $ ( event . target ) . closest ( "#" + this . ids . button ) . length ) {
161
161
this . close ( event ) ;
162
162
}
163
163
}
164
- } ) ;
164
+ } ) ;
165
165
} ,
166
-
166
+
167
167
refresh : function ( ) {
168
168
this . menu . empty ( ) ;
169
-
169
+
170
170
this . _readOptions ( ) ;
171
171
this . _renderMenu ( this . menu , this . items ) ;
172
-
172
+
173
173
this . menu . menu ( "refresh" ) ;
174
-
175
- // adjust ARIA
174
+
175
+ // adjust ARIA
176
176
this . menu . find ( "li" ) . not ( '.ui-selectmenu-optgroup' ) . find ( 'a' ) . attr ( 'role' , 'option' ) ;
177
-
177
+
178
178
if ( this . options . dropdown ) {
179
179
this . menu
180
180
. addClass ( 'ui-corner-bottom' )
181
181
. removeClass ( 'ui-corner-all' ) ;
182
182
}
183
-
183
+
184
184
// transfer disabled state
185
185
if ( this . element . attr ( 'disabled' ) ) {
186
186
this . disable ( ) ;
187
187
} else {
188
188
this . enable ( )
189
189
}
190
- } ,
191
-
192
- open : function ( event ) {
190
+ } ,
191
+
192
+ open : function ( event ) {
193
193
var currentItem = this . _getSelectedItem ( ) ;
194
-
195
- if ( ! this . options . disabled ) {
194
+
195
+ if ( ! this . options . disabled ) {
196
196
if ( this . options . dropdown ) {
197
197
this . button
198
198
. addClass ( 'ui-corner-top' )
199
199
. removeClass ( 'ui-corner-all' ) ;
200
- }
201
-
200
+ }
201
+
202
202
this . menuWrap . addClass ( 'ui-selectmenu-open' ) ;
203
203
// needs to be fired after the document click event has closed all other Selectmenus
204
204
// otherwise the current item is not indicated
205
205
// TODO check if this should be handled by Menu
206
206
this . _delay ( function ( ) {
207
207
this . menu . menu ( "focus" , event , currentItem ) ;
208
208
} , 1 ) ;
209
-
209
+
210
210
if ( ! this . options . dropdown ) {
211
211
// center current item
212
212
if ( this . menu . css ( "overflow" ) == "auto" ) {
213
213
this . menu . scrollTop ( this . menu . scrollTop ( ) + currentItem . position ( ) . top - this . menu . outerHeight ( ) / 2 + currentItem . outerHeight ( ) / 2 ) ;
214
- }
214
+ }
215
215
// calculate offset
216
- var _offset = ( this . menu . offset ( ) . top - currentItem . offset ( ) . top + ( this . button . outerHeight ( ) - currentItem . outerHeight ( ) ) / 2 ) ;
216
+ var _offset = ( this . menu . offset ( ) . top - currentItem . offset ( ) . top + ( this . button . outerHeight ( ) - currentItem . outerHeight ( ) ) / 2 ) ;
217
217
$ . extend ( this . options . position , {
218
218
my : "left top" ,
219
219
at : "left top" ,
220
220
offset : "0 " + _offset
221
221
} ) ;
222
222
}
223
-
224
- this . menuWrap
223
+
224
+ this . menuWrap
225
225
. zIndex ( this . element . zIndex ( ) + 1 )
226
226
. position ( $ . extend ( {
227
227
of : this . button
228
228
} , this . options . position ) ) ;
229
-
229
+
230
230
this . isOpen = true ;
231
231
this . _trigger ( "open" , event ) ;
232
232
}
233
- } ,
234
-
233
+ } ,
234
+
235
235
close : function ( event , focus ) {
236
236
if ( this . isOpen ) {
237
237
if ( this . options . dropdown ) {
238
238
this . button
239
239
. addClass ( 'ui-corner-all' )
240
240
. removeClass ( 'ui-corner-top' ) ;
241
241
}
242
-
242
+
243
243
this . menuWrap . removeClass ( 'ui-selectmenu-open' ) ;
244
244
this . isOpen = false ;
245
-
245
+
246
246
if ( focus ) {
247
247
this . button . focus ( ) ;
248
248
}
249
-
249
+
250
250
this . _trigger ( "close" , event ) ;
251
251
}
252
252
} ,
253
-
253
+
254
254
widget : function ( ) {
255
255
return this . buttonWrap . add ( this . menuWrap ) ;
256
256
} ,
257
-
257
+
258
258
_renderMenu : function ( ul , items ) {
259
259
var that = this ,
260
260
currentOptgroup = "" ;
261
-
261
+
262
262
$ . each ( items , function ( index , item ) {
263
263
if ( item . optgroup != currentOptgroup ) {
264
264
var optgroup = $ ( '<li class="ui-selectmenu-optgroup">' + item . optgroup + '</li>' ) ;
@@ -269,7 +269,7 @@ $.widget( "ui.selectmenu", {
269
269
that . _renderItem ( ul , item ) ;
270
270
} ) ;
271
271
} ,
272
-
272
+
273
273
_renderItem : function ( ul , item ) {
274
274
var li = $ ( "<li />" ) . data ( "item.selectmenu" , item ) ;
275
275
if ( item . disabled ) {
@@ -280,35 +280,35 @@ $.widget( "ui.selectmenu", {
280
280
href : '#'
281
281
} )
282
282
) ;
283
- }
284
-
283
+ }
284
+
285
285
return li . appendTo ( ul ) ;
286
286
} ,
287
-
287
+
288
288
_move : function ( key , event ) {
289
289
if ( ! this . isOpen ) {
290
290
this . menu . menu ( "focus" , event , this . _getSelectedItem ( ) ) ;
291
291
}
292
-
293
- this . menu . menu ( key , event ) ;
294
-
292
+
293
+ this . menu . menu ( key , event ) ;
294
+
295
295
if ( ! this . isOpen ) {
296
296
this . menu . menu ( "select" , event ) ;
297
297
}
298
298
} ,
299
-
299
+
300
300
_getSelectedItem : function ( ) {
301
- return this . menu . find ( "li" ) . not ( '.ui-selectmenu-optgroup' ) . eq ( this . element [ 0 ] . selectedIndex ) ;
301
+ return this . menu . find ( "li" ) . not ( '.ui-selectmenu-optgroup' ) . eq ( this . element [ 0 ] . selectedIndex ) ;
302
302
} ,
303
-
303
+
304
304
_toggle : function ( event ) {
305
- if ( this . isOpen ) {
305
+ if ( this . isOpen ) {
306
306
this . close ( event ) ;
307
- } else {
307
+ } else {
308
308
this . open ( event ) ;
309
309
}
310
310
} ,
311
-
311
+
312
312
_buttonEvents : {
313
313
click : function ( event ) {
314
314
this . _toggle ( event ) ;
@@ -324,7 +324,7 @@ $.widget( "ui.selectmenu", {
324
324
case $ . ui . keyCode . ENTER :
325
325
if ( this . isOpen ) {
326
326
this . menu . menu ( "select" , this . _getSelectedItem ( ) ) ;
327
- }
327
+ }
328
328
event . preventDefault ( ) ;
329
329
break ;
330
330
case $ . ui . keyCode . SPACE :
@@ -358,11 +358,11 @@ $.widget( "ui.selectmenu", {
358
358
this . menu . trigger ( event ) ;
359
359
}
360
360
}
361
- } ,
362
-
361
+ } ,
362
+
363
363
_setOption : function ( key , value ) {
364
364
this . _super ( "_setOption" , key , value ) ;
365
-
365
+
366
366
if ( key === "appendTo" ) {
367
367
this . menuWrap . appendTo ( $ ( value || "body" , this . element [ 0 ] . ownerDocument ) [ 0 ] ) ;
368
368
}
@@ -385,7 +385,7 @@ $.widget( "ui.selectmenu", {
385
385
} ,
386
386
387
387
_readOptions : function ( ) {
388
- var data = [ ] ;
388
+ var data = [ ] ;
389
389
$ . each ( this . element . find ( 'option' ) , function ( index , item ) {
390
390
var option = $ ( item ) ,
391
391
optgroup = option . parent ( "optgroup" ) ;
@@ -400,7 +400,7 @@ $.widget( "ui.selectmenu", {
400
400
} ) ;
401
401
this . items = data ;
402
402
} ,
403
-
403
+
404
404
_destroy : function ( ) {
405
405
this . menuWrap . remove ( ) ;
406
406
this . buttonWrap . remove ( ) ;
0 commit comments