1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
|
/**
* SRF JavaScript srf.optionslist widget
*
* @since 1.9
* @release 0.1
*
* @file
* @ingroup SRF
*
* @licence GNU GPL v2 or later
* @author mwjames
*/
( function( $, mw, srf ) {
'use strict';
/**
* Helper method
*
* @type object
*/
var html = mw.html;
/**
* $.widget factory method
*
* @since 1.9
*
* @class
* @constructor
*/
$.widget( 'srf.optionslist', {
/**
* Internal method that runs once during initialization
*
* @private
* @return {object}
*/
_init: function() {
var self = this,
el = self.element;
return el;
},
/**
* Create checkbox elements from an array
*
* @return object
*/
checklist: function( options ) {
var self = this,
el = self.element;
// Returns a list of elements
function checkList( list, checkListClass ) {
if ( list !== undefined ) {
var elements = [];
$.each( list, function( key, item ) {
if ( key !== '' ) {
key = $.type( item ) === 'object' ? item.key : key;
item = $.type( item ) === 'object' ? item.label : item;
elements.push(
html.element( 'input', {
'type': 'checkbox',
'checked': 'checked',
'id': item,
'name': item,
'value': key
}, item )
);
}
} );
return '<ul><li class="' + checkListClass + '-item">'+ elements.join('</li><li class="' + checkListClass + '-item">') + '</li></ul>';
}
}
this.checkList = $( checkList( options.list, options['class'] ) ).appendTo( el );
// Create element and the bind click event
self.checkList = this.checkList
.on( 'click', ':checkbox', function( event ){
var that = $( this );
if ( $.isFunction( options.click ) ){
options.click( event, {
checked: that.is( ':checked' ),
value: that.attr( 'value' ),
name: that.attr( 'name' )
} )
}
} );
return options.show || options.show === undefined ? self.checkList.show() : self.checkList.hide();
},
/**
* Create select elements from an array
*
* @since 1.9
*
* @param {array} options
*
* @return object
*/
selectlist: function( options ) {
var self = this,
el = self.element;
// Returns a list of elements
function selectList( list ) {
if ( list !== undefined ) {
var dropdown = '';
$.each( list, function( key, item ) {
key = $.type( item ) === 'object' ? item.key : key;
item = $.type( item ) === 'object' ? item.label : item;
dropdown = dropdown + html.element( 'option', {
'value': key,
'selected': options.selectedAll
},item );
} );
return html.element( 'select', {
'id': options['class'],
'class': options['class'],
'multiple': options.multiple || false,
'size': options.multiple ? ( list.length > 5 ? 5 : list.length ) : 1
}, new html.Raw( ( options.null ? html.element( 'option', { }, '' ) : '' ) + dropdown )
);
}
}
// Create element and bind the click event
this.selectList = $( selectList( options.list ) ).appendTo( el );
self.selectList = this.selectList
.on( 'change', function( event ){
var that = $( this );
if ( $.isFunction( options.change ) ){
options.change( event, {
selected: that.is( ':selected' ),
value: that.attr( 'value' )
} );
}
} );
return options.show || options.show === undefined ? self.selectList.show() : self.selectList.hide();
},
/**
* Remove objects
*
* @since 1.9
*/
destroy: function() {
$.Widget.prototype.destroy.apply( this );
}
} );
} )( jQuery, mediaWiki, semanticFormats );
|