2 * Add search suggestions to the search form.
6 // queries the wiki and calls response with the result
7 request: function ( api
, query
, response
, maxRows
) {
15 } ).done( function ( data
) {
16 response( data
[ 1 ] );
19 // The name of the request api for event logging purposes
24 var api
, map
, searchboxesSelectors
,
25 // Region where the suggestions box will appear directly below
26 // (using the same width). Can be a container element or the input
27 // itself, depending on what suits best in the environment.
28 // For Vector the suggestion box should align with the simpleSearch
29 // container's borders, in other skins it should align with the input
30 // element (not the search form, as that would leave the buttons
31 // vertically between the input and the suggestions).
32 $searchRegion
= $( '#simpleSearch, #searchInput' ).first(),
33 $searchInput
= $( '#searchInput' ),
34 previousSearchText
= $searchInput
.val();
38 // SimpleSearch is broken in Opera < 9.6
39 opera
: [ [ '>=', 9.6 ] ],
40 // Older Konquerors are unable to position the suggestions correctly (bug 50805)
41 konqueror
: [ [ '>=', '4.11' ] ],
44 // Support for iOS 6 or higher. It has not been tested on iOS 5 or lower
45 ipod
: [ [ '>=', 6 ] ],
46 iphone
: [ [ '>=', 6 ] ]
49 if ( !$.client
.test( map
) ) {
53 // Compute form data for search suggestions functionality.
54 function getFormData( context
) {
55 var $form
, baseHref
, linkParams
;
57 if ( !context
.formData
) {
58 // Compute common parameters for links' hrefs
59 $form
= context
.config
.$region
.closest( 'form' );
61 baseHref
= $form
.attr( 'action' );
62 baseHref
+= baseHref
.indexOf( '?' ) > -1 ? '&' : '?';
64 linkParams
= $form
.serializeObject();
67 textParam
: context
.data
.$textbox
.attr( 'name' ),
68 linkParams
: linkParams
,
73 return context
.formData
;
77 * Callback that's run when the user changes the search input text
78 * 'this' is the search input box (jQuery object)
82 function onBeforeUpdate() {
83 var searchText
= this.val();
85 if ( searchText
&& searchText
!== previousSearchText
) {
86 mw
.track( 'mediawiki.searchSuggest', {
87 action
: 'session-start'
90 previousSearchText
= searchText
;
94 * Callback that's run when suggestions have been updated either from the cache or the API
95 * 'this' is the search input box (jQuery object)
99 function onAfterUpdate() {
100 var context
= this.data( 'suggestionsContext' );
102 mw
.track( 'mediawiki.searchSuggest', {
103 action
: 'impression-results',
104 numberOfResults
: context
.config
.suggestions
.length
,
105 resultSetType
: mw
.searchSuggest
.type
109 // The function used to render the suggestions.
110 function renderFunction( text
, context
) {
111 var formData
= getFormData( context
),
112 textboxConfig
= context
.data
.$textbox
.data( 'mw-searchsuggest' ) || {};
114 // linkParams object is modified and reused
115 formData
.linkParams
[ formData
.textParam
] = text
;
117 // this is the container <div>, jQueryfield
120 // wrap only as link, if the config doesn't disallow it
121 if ( textboxConfig
.wrapAsLink
!== false ) {
124 .attr( 'href', formData
.baseHref
+ $.param( formData
.linkParams
) )
125 .attr( 'title', text
)
126 .addClass( 'mw-searchSuggest-link' )
131 // The function used when the user makes a selection
132 function selectFunction( $input
) {
133 var context
= $input
.data( 'suggestionsContext' ),
136 mw
.track( 'mediawiki.searchSuggest', {
137 action
: 'click-result',
138 numberOfResults
: context
.config
.suggestions
.length
,
139 clickIndex
: context
.config
.suggestions
.indexOf( text
) + 1
142 // allow the form to be submitted
146 function specialRenderFunction( query
, context
) {
148 formData
= getFormData( context
);
150 // linkParams object is modified and reused
151 formData
.linkParams
[ formData
.textParam
] = query
;
153 if ( $el
.children().length
=== 0 ) {
157 .addClass( 'special-label' )
158 .text( mw
.msg( 'searchsuggest-containing' ) ),
160 .addClass( 'special-query' )
165 $el
.find( '.special-query' )
169 if ( $el
.parent().hasClass( 'mw-searchSuggest-link' ) ) {
170 $el
.parent().attr( 'href', formData
.baseHref
+ $.param( formData
.linkParams
) + '&fulltext=1' );
174 .attr( 'href', formData
.baseHref
+ $.param( formData
.linkParams
) + '&fulltext=1' )
175 .addClass( 'mw-searchSuggest-link' )
180 // Generic suggestions functionality for all search boxes
181 searchboxesSelectors
= [
182 // Primary searchbox on every page in standard skins
187 // Generic selector for skins with multiple searchboxes (used by CologneBlue)
188 // and for MediaWiki itself (special pages with page title inputs)
191 $( searchboxesSelectors
.join( ', ' ) )
193 fetch: function ( query
, response
, maxRows
) {
194 var node
= this[ 0 ];
196 api
= api
|| new mw
.Api();
198 $.data( node
, 'request', mw
.searchSuggest
.request( api
, query
, response
, maxRows
) );
200 cancel: function () {
201 var node
= this[ 0 ],
202 request
= $.data( node
, 'request' );
206 $.removeData( node
, 'request' );
210 render
: renderFunction
,
211 select: function () {
212 // allow the form to be submitted
219 .bind( 'paste cut drop', function () {
220 // make sure paste and cut events from the mouse and drag&drop events
221 // trigger the keypress handler and cause the suggestions to update
222 $( this ).trigger( 'keypress' );
224 // In most skins (at least Monobook and Vector), the font-size is messed up in <body>.
225 // (they use 2 elements to get a sane font-height). So, instead of making exceptions for
226 // each skin or adding more stylesheets, just copy it from the active element so auto-fit.
228 var $this = $( this );
230 .data( 'suggestions-context' )
232 .css( 'fontSize', $this.css( 'fontSize' ) );
235 // Ensure that the thing is actually present!
236 if ( $searchRegion
.length
=== 0 ) {
237 // Don't try to set anything up if simpleSearch is disabled sitewide.
238 // The loader code loads us if the option is present, even if we're
239 // not actually enabled (anymore).
243 // Special suggestions functionality and tracking for skin-provided search box
244 $searchInput
.suggestions( {
246 before
: onBeforeUpdate
,
250 render
: renderFunction
,
251 select
: selectFunction
254 render
: specialRenderFunction
,
255 select: function ( $input
) {
256 $input
.closest( 'form' )
257 .append( $( '<input type="hidden" name="fulltext" value="1"/>' ) );
258 return true; // allow the form to be submitted
261 $region
: $searchRegion
264 $searchInput
.closest( 'form' )
265 // track the form submit event
266 .on( 'submit', function () {
267 var context
= $searchInput
.data( 'suggestionsContext' );
268 mw
.track( 'mediawiki.searchSuggest', {
269 action
: 'submit-form',
270 numberOfResults
: context
.config
.suggestions
.length
273 // If the form includes any fallback fulltext search buttons, remove them
274 .find( '.mw-fallbackSearchButton' ).remove();
277 }( mediaWiki
, jQuery
) );