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
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
|
/**
* Add search suggestions to the search form.
*/
( function ( mw, $ ) {
$( function () {
var map, resultRenderCache, searchboxesSelectors,
// Region where the suggestions box will appear directly below
// (using the same width). Can be a container element or the input
// itself, depending on what suits best in the environment.
// For Vector the suggestion box should align with the simpleSearch
// container's borders, in other skins it should align with the input
// element (not the search form, as that would leave the buttons
// vertically between the input and the suggestions).
$searchRegion = $( '#simpleSearch, #searchInput' ).first(),
$searchInput = $( '#searchInput' );
// Compatibility map
map = {
browsers: {
// Left-to-right languages
ltr: {
// SimpleSearch is broken in Opera < 9.6
opera: [['>=', 9.6]],
docomo: false,
blackberry: false,
ipod: false,
iphone: false
},
// Right-to-left languages
rtl: {
opera: [['>=', 9.6]],
docomo: false,
blackberry: false,
ipod: false,
iphone: false
}
}
};
if ( !$.client.test( map ) ) {
return;
}
// Compute form data for search suggestions functionality.
function computeResultRenderCache( context ) {
var $form, formAction, baseHref, linkParams;
// Compute common parameters for links' hrefs
$form = context.config.$region.closest( 'form' );
formAction = $form.attr( 'action' );
baseHref = formAction + ( formAction.match(/\?/) ? '&' : '?' );
linkParams = {};
$.each( $form.serializeArray(), function ( idx, obj ) {
linkParams[ obj.name ] = obj.value;
} );
return {
textParam: context.data.$textbox.attr( 'name' ),
linkParams: linkParams,
baseHref: baseHref
};
}
// The function used to render the suggestions.
function renderFunction( text, context ) {
if ( !resultRenderCache ) {
resultRenderCache = computeResultRenderCache( context );
}
// linkParams object is modified and reused
resultRenderCache.linkParams[ resultRenderCache.textParam ] = text;
// this is the container <div>, jQueryfied
this
.append(
// the <span> is needed for $.autoEllipsis to work
$( '<span>' )
.css( 'whiteSpace', 'nowrap' )
.text( text )
)
.wrap(
$( '<a>' )
.attr( 'href', resultRenderCache.baseHref + $.param( resultRenderCache.linkParams ) )
.addClass( 'mw-searchSuggest-link' )
);
}
function specialRenderFunction( query, context ) {
var $el = this;
if ( !resultRenderCache ) {
resultRenderCache = computeResultRenderCache( context );
}
// linkParams object is modified and reused
resultRenderCache.linkParams[ resultRenderCache.textParam ] = query;
if ( $el.children().length === 0 ) {
$el
.append(
$( '<div>' )
.addClass( 'special-label' )
.text( mw.msg( 'searchsuggest-containing' ) ),
$( '<div>' )
.addClass( 'special-query' )
.text( query )
.autoEllipsis()
)
.show();
} else {
$el.find( '.special-query' )
.text( query )
.autoEllipsis();
}
if ( $el.parent().hasClass( 'mw-searchSuggest-link' ) ) {
$el.parent().attr( 'href', resultRenderCache.baseHref + $.param( resultRenderCache.linkParams ) + '&fulltext=1' );
} else {
$el.wrap(
$( '<a>' )
.attr( 'href', resultRenderCache.baseHref + $.param( resultRenderCache.linkParams ) + '&fulltext=1' )
.addClass( 'mw-searchSuggest-link' )
);
}
}
// General suggestions functionality for all search boxes
searchboxesSelectors = [
// Primary searchbox on every page in standard skins
'#searchInput',
// Special:Search
'#powerSearchText',
'#searchText',
// Generic selector for skins with multiple searchboxes (used by CologneBlue)
'.mw-searchInput'
];
$( searchboxesSelectors.join(', ') )
.suggestions( {
fetch: function ( query ) {
var $el;
if ( query.length !== 0 ) {
$el = $( this );
$el.data( 'request', ( new mw.Api() ).get( {
action: 'opensearch',
search: query,
namespace: 0,
suggest: ''
} ).done( function ( data ) {
$el.suggestions( 'suggestions', data[1] );
} ) );
}
},
cancel: function () {
var apiPromise = $( this ).data( 'request' );
// If the delay setting has caused the fetch to have not even happened
// yet, the apiPromise object will have never been set.
if ( apiPromise && $.isFunction( apiPromise.abort ) ) {
apiPromise.abort();
$( this ).removeData( 'request' );
}
},
result: {
render: renderFunction,
select: function ( $input ) {
$input.closest( 'form' ).submit();
}
},
delay: 120,
highlightInput: true
} )
.bind( 'paste cut drop', function () {
// make sure paste and cut events from the mouse and drag&drop events
// trigger the keypress handler and cause the suggestions to update
$( this ).trigger( 'keypress' );
} );
// Ensure that the thing is actually present!
if ( $searchRegion.length === 0 ) {
// Don't try to set anything up if simpleSearch is disabled sitewide.
// The loader code loads us if the option is present, even if we're
// not actually enabled (anymore).
return;
}
// Special suggestions functionality for skin-provided search box
$searchInput.suggestions( {
result: {
render: renderFunction,
select: function ( $input ) {
$input.closest( 'form' ).submit();
}
},
special: {
render: specialRenderFunction,
select: function ( $input ) {
$input.closest( 'form' ).append(
$( '<input type="hidden" name="fulltext" value="1"/>' )
);
$input.closest( 'form' ).submit();
}
},
$region: $searchRegion
} );
// In most skins (at least Monobook and Vector), the font-size is messed up in <body>.
// (they use 2 elements to get a sane font-height). So, instead of making exceptions for
// each skin or adding more stylesheets, just copy it from the active element so auto-fit.
$searchInput
.data( 'suggestions-context' )
.data.$container
.css( 'fontSize', $searchInput.css( 'fontSize' ) );
} );
}( mediaWiki, jQuery ) );
|
