2 * Add search suggestions to the search form.
5 $( document ).ready( function ( $ ) {
6 var map, searchboxesSelectors,
7 // Region where the suggestions box will appear directly below
8 // (using the same width). Can be a container element or the input
9 // itself, depending on what suits best in the environment.
10 // For Vector the suggestion box should align with the simpleSearch
11 // container's borders, in other skins it should align with the input
12 // element (not the search form, as that would leave the buttons
13 // vertically between the input and the suggestions).
14 $searchRegion = $( '#simpleSearch, #searchInput' ).first(),
15 $searchInput = $( '#searchInput' );
20 // Left-to-right languages
22 // SimpleSearch is broken in Opera < 9.6
29 // Right-to-left languages
40 if ( !$.client.test( map ) ) {
44 // General suggestions functionality for all search boxes
45 searchboxesSelectors = [
46 // Primary searchbox on every page in standard skins
48 // Secondary searchbox in legacy skins (LegacyTemplate::searchForm uses id "searchInput + unique id")
53 // Generic selector for skins with multiple searchboxes (used by CologneBlue)
56 $( searchboxesSelectors.join(', ') )
58 fetch: function ( query ) {
61 if ( query.length !== 0 ) {
64 url: mw.util.wikiScript( 'api' ),
73 success: function ( data ) {
74 if ( $.isArray( data ) && data.length ) {
75 $el.suggestions( 'suggestions', data[1] );
79 $el.data( 'request', jqXhr );
83 var jqXhr = $(this).data( 'request' );
84 // If the delay setting has caused the fetch to have not even happened
85 // yet, the jqXHR object will have never been set.
86 if ( jqXhr && $.isFunction( jqXhr.abort ) ) {
88 $(this).removeData( 'request' );
92 select: function ( $input ) {
93 $input.closest( 'form' ).submit();
99 .bind( 'paste cut drop', function () {
100 // make sure paste and cut events from the mouse and drag&drop events
101 // trigger the keypress handler and cause the suggestions to update
102 $( this ).trigger( 'keypress' );
105 // Ensure that the thing is actually present!
106 if ( $searchRegion.length === 0 ) {
107 // Don't try to set anything up if simpleSearch is disabled sitewide.
108 // The loader code loads us if the option is present, even if we're
109 // not actually enabled (anymore).
113 // Placeholder text for search box
115 .attr( 'placeholder', mw.msg( 'searchsuggest-search' ) )
118 // Special suggestions functionality for skin-provided search box
119 $searchInput.suggestions( {
121 select: function ( $input ) {
122 $input.closest( 'form' ).submit();
126 render: function ( query ) {
128 if ( $el.children().length === 0 ) {
132 .addClass( 'special-label' )
133 .text( mw.msg( 'searchsuggest-containing' ) ),
135 .addClass( 'special-query' )
141 $el.find( '.special-query' )
146 select: function ( $input ) {
147 $input.closest( 'form' ).append(
148 $( '<input type="hidden" name="fulltext" value="1"/>' )
150 $input.closest( 'form' ).submit();
153 $region: $searchRegion
156 // In most skins (at least Monobook and Vector), the font-size is messed up in <body>.
157 // (they use 2 elements to get a sane font-height). So, instead of making exceptions for
158 // each skin or adding more stylesheets, just copy it from the active element so auto-fit.
160 .data( 'suggestions-context' )
162 .css( 'fontSize', $searchInput.css( 'fontSize' ) );
166 }( mediaWiki, jQuery ) );