* by Robert Stojnic (April 2008)
*/
+// Make sure wgMWSuggestTemplate is defined
+if ( !mw.config.exists( 'wgMWSuggestTemplate' ) ) {
+ mw.config.set( 'wgMWSuggestTemplate', mw.config.get( 'wgServer' ) + mw.config.get( 'wgScriptPath' )
+ + "/api.php?action=opensearch\x26search={searchTerms}\x26namespace={namespaces}\x26suggest" );
+}
+
// search_box_id -> Results object
-var os_map = {};
+window.os_map = {};
// cached data, url -> json_text
-var os_cache = {};
+window.os_cache = {};
// global variables for suggest_keypress
-var os_cur_keypressed = 0;
-var os_keypressed_count = 0;
+window.os_cur_keypressed = 0;
+window.os_keypressed_count = 0;
// type: Timer
-var os_timer = null;
+window.os_timer = null;
// tie mousedown/up events
-var os_mouse_pressed = false;
-var os_mouse_num = -1;
+window.os_mouse_pressed = false;
+window.os_mouse_num = -1;
// if true, the last change was made by mouse (and not keyboard)
-var os_mouse_moved = false;
+window.os_mouse_moved = false;
// delay between keypress and suggestion (in ms)
-var os_search_timeout = 250;
+window.os_search_timeout = 250;
// these pairs of inputs/forms will be autoloaded at startup
-var os_autoload_inputs = new Array('searchInput', 'searchInput2', 'powerSearchText', 'searchText');
-var os_autoload_forms = new Array('searchform', 'searchform2', 'powersearch', 'search' );
+window.os_autoload_inputs = new Array('searchInput', 'searchInput2', 'powerSearchText', 'searchText');
+window.os_autoload_forms = new Array('searchform', 'searchform2', 'powersearch', 'search' );
// if we stopped the service
-var os_is_stopped = false;
+window.os_is_stopped = false;
// max lines to show in suggest table
-var os_max_lines_per_suggest = 7;
+window.os_max_lines_per_suggest = 7;
// number of steps to animate expansion/contraction of container width
-var os_animation_steps = 6;
+window.os_animation_steps = 6;
// num of pixels of smallest step
-var os_animation_min_step = 2;
+window.os_animation_min_step = 2;
// delay between steps (in ms)
-var os_animation_delay = 30;
+window.os_animation_delay = 30;
// max width of container in percent of normal size (1 == 100%)
-var os_container_max_width = 2;
+window.os_container_max_width = 2;
// currently active animation timer
-var os_animation_timer = null;
+window.os_animation_timer = null;
+// whether MWSuggest is enabled. Set to false when os_MWSuggestDisable() is called
+window.os_enabled = true;
+
/**
* <datalist> is a new HTML5 element that allows you to manually supply
* suggestion lists and have them rendered according to the right platform
* (maybe with a UA check) when some browser has a better implementation.
*/
// var os_use_datalist = 'list' in document.createElement( 'input' );
-var os_use_datalist = false;
+window.os_use_datalist = false;
/** Timeout timer class that will fetch the results */
-function os_Timer( id, r, query ) {
+window.os_Timer = function( id, r, query ) {
this.id = id;
this.r = r;
this.query = query;
-}
+};
/** Property class for single search box */
-function os_Results( name, formname ) {
+window.os_Results = function( name, formname ) {
this.searchform = formname; // id of the searchform
this.searchbox = name; // id of the searchbox
this.container = name + 'Suggest'; // div that holds results
this.containerTotal = 0; // total height of the container will all results
this.visible = false; // if container is visible
this.stayHidden = false; // don't try to show if lost focus
-}
+};
/** Timer user to animate expansion/contraction of container width */
-function os_AnimationTimer( r, target ) {
+window.os_AnimationTimer = function( r, target ) {
this.r = r;
var current = document.getElementById(r.container).offsetWidth;
this.inc = Math.round( ( target - current ) / os_animation_steps );
this.inc = -os_animation_min_step;
}
this.target = target;
-}
+};
/******************
* Initialization
******************/
/** Initialization, call upon page onload */
-function os_MWSuggestInit() {
- for( i = 0; i < os_autoload_inputs.length; i++ ) {
+window.os_MWSuggestInit = function() {
+ if ( !window.os_enabled ) {
+ return;
+ }
+
+ for( var i = 0; i < os_autoload_inputs.length; i++ ) {
var id = os_autoload_inputs[i];
var form = os_autoload_forms[i];
element = document.getElementById( id );
os_initHandlers( id, form, element );
}
}
+};
+
+/* Teardown, called when things like SimpleSearch need to disable MWSuggest */
+window.os_MWSuggestTeardown = function() {
+ for( var i = 0; i < os_autoload_inputs.length; i++ ) {
+ var id = os_autoload_inputs[i];
+ var form = os_autoload_forms[i];
+ element = document.getElementById( id );
+ if( element != null ) {
+ os_teardownHandlers( id, form, element );
+ }
+ }
+};
+
+/* Call this to disable MWSuggest. Works regardless of whether MWSuggest has been initialized already. */
+window.os_MWSuggestDisable = function() {
+ window.os_MWSuggestTeardown();
+ window.os_enabled = false;
}
+
/** Init Result objects and event handlers */
-function os_initHandlers( name, formname, element ) {
+window.os_initHandlers = function( name, formname, element ) {
var r = new os_Results( name, formname );
+ var formElement = document.getElementById( formname );
+ if( !formElement ) {
+ // Older browsers (Opera 8) cannot get form elements
+ return;
+ }
// event handler
- os_hookEvent( element, 'keyup', function( event ) { os_eventKeyup( event ); } );
- os_hookEvent( element, 'keydown', function( event ) { os_eventKeydown( event ); } );
- os_hookEvent( element, 'keypress', function( event ) { os_eventKeypress( event ); } );
+ os_hookEvent( element, 'keyup', os_eventKeyup );
+ os_hookEvent( element, 'keydown', os_eventKeydown );
+ os_hookEvent( element, 'keypress', os_eventKeypress );
if ( !os_use_datalist ) {
// These are needed for the div hack to hide it if the user blurs.
- os_hookEvent( element, 'blur', function( event ) { os_eventBlur( event ); } );
- os_hookEvent( element, 'focus', function( event ) { os_eventFocus( event ); } );
+ os_hookEvent( element, 'blur', os_eventBlur );
+ os_hookEvent( element, 'focus', os_eventFocus );
// We don't want browser auto-suggestions interfering with our div, but
// autocomplete must be on for datalist to work (at least in Opera
// 10.10).
element.setAttribute( 'autocomplete', 'off' );
}
// stopping handler
- os_hookEvent( document.getElementById( formname ), 'submit', function( event ) { return os_eventOnsubmit( event ); } );
+ os_hookEvent( formElement, 'submit', os_eventOnsubmit );
os_map[name] = r;
// toggle link
if( document.getElementById( r.toggle ) == null ) {
} */
}
-}
+};
-function os_hookEvent( element, hookName, hookFunct ) {
+window.os_teardownHandlers = function( name, formname, element ) {
+ var formElement = document.getElementById( formname );
+ if( !formElement ) {
+ // Older browsers (Opera 8) cannot get form elements
+ return;
+ }
+
+ os_unhookEvent( element, 'keyup', os_eventKeyup );
+ os_unhookEvent( element, 'keydown', os_eventKeydown );
+ os_unhookEvent( element, 'keypress', os_eventKeypress );
+ if ( !os_use_datalist ) {
+ // These are needed for the div hack to hide it if the user blurs.
+ os_unhookEvent( element, 'blur', os_eventBlur );
+ os_unhookEvent( element, 'focus', os_eventFocus );
+ // We don't want browser auto-suggestions interfering with our div, but
+ // autocomplete must be on for datalist to work (at least in Opera
+ // 10.10).
+ element.removeAttribute( 'autocomplete' );
+ }
+ // stopping handler
+ os_unhookEvent( formElement, 'submit', os_eventOnsubmit );
+};
+
+
+window.os_hookEvent = function( element, hookName, hookFunct ) {
if ( element.addEventListener ) {
element.addEventListener( hookName, hookFunct, false );
} else if ( window.attachEvent ) {
element.attachEvent( 'on' + hookName, hookFunct );
}
+};
+
+window.os_unhookEvent = function( element, hookName, hookFunct ) {
+ if ( element.removeEventListener ) {
+ element.removeEventListener( hookName, hookFunct, false );
+ } else if ( element.detachEvent ) {
+ element.detachEvent( 'on' + hookName, hookFunct );
+ }
}
/********************
********************/
/** Event handler that will fetch results on keyup */
-function os_eventKeyup( e ) {
+window.os_eventKeyup = function( e ) {
var targ = os_getTarget( e );
var r = os_map[targ.id];
if( r == null ) {
}
var query = targ.value;
os_fetchResults( r, query, os_search_timeout );
-}
+};
/** catch arrows up/down and escape to hide the suggestions */
-function os_processKey( r, keypressed, targ ) {
+window.os_processKey = function( r, keypressed, targ ) {
if ( keypressed == 40 && !r.visible && os_timer == null ) {
// If the user hits the down arrow, fetch results immediately if none
// are already displayed.
} else if( r.query != document.getElementById( r.searchbox ).value ) {
// os_hideResults( r ); // don't show old suggestions
}
-}
+};
/** When keys is held down use a timer to output regular events */
-function os_eventKeypress( e ) {
+window.os_eventKeypress = function( e ) {
var targ = os_getTarget( e );
var r = os_map[targ.id];
if( r == null ) {
os_keypressed_count++;
os_processKey( r, keypressed, targ );
-}
+};
/** Catch the key code (Firefox bug) */
-function os_eventKeydown( e ) {
+window.os_eventKeydown = function( e ) {
if ( !e ) {
e = window.event;
}
os_cur_keypressed = ( e.keyCode == undefined ) ? e.which : e.keyCode;
os_keypressed_count = 0;
-}
+};
/** When the form is submitted hide everything, cancel updates... */
-function os_eventOnsubmit( e ) {
+window.os_eventOnsubmit = function( e ) {
var targ = os_getTarget( e );
os_is_stopped = true;
}
}
return true;
-}
+};
/** Hide results from the user, either making the div visibility=hidden or
* detaching the datalist from the input. */
-function os_hideResults( r ) {
+window.os_hideResults = function( r ) {
if ( os_use_datalist ) {
document.getElementById( r.searchbox ).setAttribute( 'list', '' );
} else {
}
r.visible = false;
r.selected = -1;
-}
+};
-function os_decodeValue( value ) {
+window.os_decodeValue = function( value ) {
if ( decodeURIComponent ) {
return decodeURIComponent( value );
}
return unescape( value );
}
return null;
-}
+};
-function os_encodeQuery( value ) {
+window.os_encodeQuery = function( value ) {
if ( encodeURIComponent ) {
return encodeURIComponent( value );
}
return escape( value );
}
return null;
-}
+};
/** Handles data from XMLHttpRequest, and updates the suggest results */
-function os_updateResults( r, query, text, cacheKey ) {
+window.os_updateResults = function( r, query, text, cacheKey ) {
os_cache[cacheKey] = text;
r.query = query;
r.original = query;
os_cache[cacheKey] = null;
}
}
-}
+};
/**
* Create and populate a <datalist>.
* @param r os_Result object
* @param results Array of the new results to replace existing ones
*/
-function os_setupDatalist( r, results ) {
+window.os_setupDatalist = function( r, results ) {
var s = document.getElementById( r.searchbox );
var c = document.getElementById( r.container );
if ( c == null ) {
r.results[i] = title;
c.appendChild( opt );
}
-}
+};
/** Fetch namespaces from checkboxes or hidden fields in the search form,
if none defined use wgSearchNamespaces global */
-function os_getNamespaces( r ) {
+window.os_getNamespaces = function( r ) {
var namespaces = '';
var elements = document.forms[r.searchform].elements;
for( i = 0; i < elements.length; i++ ) {
namespaces = wgSearchNamespaces.join('|');
}
return namespaces;
-}
+};
/** Update results if user hasn't already typed something else */
-function os_updateIfRelevant( r, query, text, cacheKey ) {
+window.os_updateIfRelevant = function( r, query, text, cacheKey ) {
var t = document.getElementById( r.searchbox );
if( t != null && t.value == query ) { // check if response is still relevant
os_updateResults( r, query, text, cacheKey );
}
r.query = query;
-}
+};
/** Fetch results after some timeout */
-function os_delayedFetch() {
+window.os_delayedFetch = function() {
if( os_timer == null ) {
return;
}
var r = os_timer.r;
var query = os_timer.query;
os_timer = null;
- var path = wgMWSuggestTemplate.replace( "{namespaces}", os_getNamespaces( r ) )
+ var path = mw.config.get( 'wgMWSuggestTemplate' ).replace( "{namespaces}", os_getNamespaces( r ) )
.replace( "{dbname}", wgDBname )
.replace( "{searchTerms}", os_encodeQuery( query ) );
}
}
}
-}
+};
/** Init timed update via os_delayedUpdate() */
-function os_fetchResults( r, query, timeout ) {
+window.os_fetchResults = function( r, query, timeout ) {
if( query == '' ) {
r.query = '';
os_hideResults( r );
os_timer = new os_Timer( null, r, query );
os_delayedFetch(); // do it now!
}
-}
+};
/** Find event target */
-function os_getTarget( e ) {
+window.os_getTarget = function( e ) {
if ( !e ) {
e = window.event;
}
} else {
return null;
}
-}
+};
/** Check if x is a valid integer */
-function os_isNumber( x ) {
+window.os_isNumber = function( x ) {
if( x == '' || isNaN( x ) ) {
return false;
}
}
}
return true;
-}
+};
/** Call this to enable suggestions on input (id=inputId), on a form (name=formName) */
-function os_enableSuggestionsOn( inputId, formName ) {
+window.os_enableSuggestionsOn = function( inputId, formName ) {
os_initHandlers( inputId, formName, document.getElementById( inputId ) );
-}
+};
/** Call this to disable suggestios on input box (id=inputId) */
-function os_disableSuggestionsOn( inputId ) {
+window.os_disableSuggestionsOn = function( inputId ) {
r = os_map[inputId];
if( r != null ) {
// cancel/hide results
if ( index >= 0 ) {
os_autoload_inputs[index] = os_autoload_forms[index] = '';
}
-}
+};
/************************************************
* Div-only functions (irrelevant for datalist)
************************************************/
/** Event: loss of focus of input box */
-function os_eventBlur( e ) {
+window.os_eventBlur = function( e ) {
var targ = os_getTarget( e );
var r = os_map[targ.id];
if( r == null ) {
}
os_timer = null;
}
-}
+};
/** Event: focus (catch only when stopped) */
-function os_eventFocus( e ) {
+window.os_eventFocus = function( e ) {
var targ = os_getTarget( e );
var r = os_map[targ.id];
if( r == null ) {
return; // not our event
}
r.stayHidden = false;
-}
+};
/**
* Create and populate a <div>, for non-<datalist>-supporting browsers.
* @param r os_Result object
* @param results Array of the new results to replace existing ones
*/
-function os_setupDiv( r, results ) {
+window.os_setupDiv = function( r, results ) {
var c = document.getElementById( r.container );
if ( c == null ) {
c = os_createContainer( r );
os_fitContainer( r );
os_trimResultText( r );
os_showResults( r );
-}
+};
/** Create the result table to be placed in the container div */
-function os_createResultTable( r, results ) {
+window.os_createResultTable = function( r, results ) {
var c = document.getElementById( r.container );
var width = c.offsetWidth - os_operaWidthFix( c.offsetWidth );
var html = '<table class="os-suggest-results" id="' + r.resultTable + '" style="width: ' + width + 'px;">';
}
html += '</table>';
return html;
-}
+};
/** Show results div */
-function os_showResults( r ) {
+window.os_showResults = function( r ) {
if( os_is_stopped ) {
return;
}
c.style.visibility = 'visible';
r.visible = true;
}
-}
+};
-function os_operaWidthFix( x ) {
+window.os_operaWidthFix = function( x ) {
// For browsers that don't understand overflow-x, estimate scrollbar width
if( typeof document.body.style.overflowX != 'string' ) {
return 30;
}
return 0;
-}
+};
/** Brower-dependent functions to find window inner size, and scroll status */
-function f_clientWidth() {
+window.f_clientWidth = function() {
return f_filterResults(
window.innerWidth ? window.innerWidth : 0,
document.documentElement ? document.documentElement.clientWidth : 0,
document.body ? document.body.clientWidth : 0
);
-}
+};
-function f_clientHeight() {
+window.f_clientHeight = function() {
return f_filterResults(
window.innerHeight ? window.innerHeight : 0,
document.documentElement ? document.documentElement.clientHeight : 0,
document.body ? document.body.clientHeight : 0
);
-}
+};
-function f_scrollLeft() {
+window.f_scrollLeft = function() {
return f_filterResults(
window.pageXOffset ? window.pageXOffset : 0,
document.documentElement ? document.documentElement.scrollLeft : 0,
document.body ? document.body.scrollLeft : 0
);
-}
+};
-function f_scrollTop() {
+window.f_scrollTop = function() {
return f_filterResults(
window.pageYOffset ? window.pageYOffset : 0,
document.documentElement ? document.documentElement.scrollTop : 0,
document.body ? document.body.scrollTop : 0
);
-}
+};
-function f_filterResults( n_win, n_docel, n_body ) {
+window.f_filterResults = function( n_win, n_docel, n_body ) {
var n_result = n_win ? n_win : 0;
if ( n_docel && ( !n_result || ( n_result > n_docel ) ) ) {
n_result = n_docel;
}
return n_body && ( !n_result || ( n_result > n_body ) ) ? n_body : n_result;
-}
+};
/** Get the height available for the results container */
-function os_availableHeight( r ) {
+window.os_availableHeight = function( r ) {
var absTop = document.getElementById( r.container ).style.top;
var px = absTop.lastIndexOf( 'px' );
if( px > 0 ) {
absTop = absTop.substring( 0, px );
}
return f_clientHeight() - ( absTop - f_scrollTop() );
-}
+};
/** Get element absolute position {left,top} */
-function os_getElementPosition( elemID ) {
+window.os_getElementPosition = function( elemID ) {
var offsetTrail = document.getElementById( elemID );
var offsetLeft = 0;
var offsetTop = 0;
offsetTop += document.body.topMargin;
}
return { left:offsetLeft, top:offsetTop };
-}
+};
/** Create the container div that will hold the suggested titles */
-function os_createContainer( r ) {
- var c = document.createElement( 'div' );
- var s = document.getElementById( r.searchbox );
- var pos = os_getElementPosition( r.searchbox );
+window.os_createContainer = function(r) {
+ var c = document.createElement('div');
+ var s = document.getElementById(r.searchbox);
+ var pos = os_getElementPosition(r.searchbox);
var left = pos.left;
var top = pos.top + s.offsetHeight;
c.className = 'os-suggest';
- c.setAttribute( 'id', r.container );
- document.body.appendChild( c );
+ c.setAttribute('id', r.container);
+ document.body.appendChild(c);
// dynamically generated style params
// IE workaround, cannot explicitely set "style" attribute
- c = document.getElementById( r.container );
+ c = document.getElementById(r.container);
c.style.top = top + 'px';
c.style.left = left + 'px';
c.style.width = s.offsetWidth + 'px';
// mouse event handlers
- c.onmouseover = function( event ) { os_eventMouseover( r.searchbox, event ); };
- c.onmousemove = function( event ) { os_eventMousemove( r.searchbox, event ); };
- c.onmousedown = function( event ) { return os_eventMousedown( r.searchbox, event ); };
- c.onmouseup = function( event ) { os_eventMouseup( r.searchbox, event ); };
+ c.onmouseover = function(event) {
+ os_eventMouseover(r.searchbox, event);
+ };
+ c.onmousemove = function(event) {
+ os_eventMousemove(r.searchbox, event);
+ };
+ c.onmousedown = function(event) {
+ return os_eventMousedown(r.searchbox, event);
+ };
+ c.onmouseup = function(event) {
+ os_eventMouseup(r.searchbox, event);
+ };
return c;
-}
+};
/** change container height to fit to screen */
-function os_fitContainer( r ) {
+window.os_fitContainer = function( r ) {
var c = document.getElementById( r.container );
var h = os_availableHeight( r ) - 20;
var inc = r.containerRow;
c.style.height = r.containerTotal + 'px';
r.containerCount = r.resultCount;
}
-}
+};
/** If some entries are longer than the box, replace text with "..." */
-function os_trimResultText( r ) {
+window.os_trimResultText = function( r ) {
// find max width, first see if we could expand the container to fit it
var maxW = 0;
for( var i = 0; i < r.resultCount; i++ ) {
document.getElementById( r.resultTable + i ).setAttribute( 'title', r.results[i] );
}
}
-}
+};
/** Invoked on timer to animate change in container width */
-function os_animateChangeWidth() {
+window.os_animateChangeWidth = function() {
var r = os_animation_timer.r;
var c = document.getElementById( r.container );
var w = c.offsetWidth;
c.style.left = ( normL + normW + ( target - nw ) - os_animation_timer.target - 1 ) + 'px';
}
}
-}
+};
/** Change the highlighted row (i.e. suggestion), from position cur to next */
-function os_changeHighlight( r, cur, next, updateSearchBox ) {
+window.os_changeHighlight = function( r, cur, next, updateSearchBox ) {
if ( next >= r.resultCount ) {
next = r.resultCount - 1;
}
if( updateSearchBox ) {
os_updateSearchQuery( r, newText );
}
-}
+};
-function os_HighlightClass() {
+window.os_HighlightClass = function() {
var match = navigator.userAgent.match(/AppleWebKit\/(\d+)/);
if ( match ) {
var webKitVersion = parseInt( match[1] );
}
}
return 'os-suggest-result-hl';
-}
+};
-function os_updateSearchQuery( r, newText ) {
+window.os_updateSearchQuery = function( r, newText ) {
document.getElementById( r.searchbox ).value = newText;
r.query = newText;
-}
+};
/********************
********************/
/** Mouse over the container */
-function os_eventMouseover( srcId, e ) {
+window.os_eventMouseover = function( srcId, e ) {
var targ = os_getTarget( e );
var r = os_map[srcId];
if( r == null || !os_mouse_moved ) {
if( num >= 0 ) {
os_changeHighlight( r, r.selected, num, false );
}
-}
+};
/* Get row where the event occured (from its id) */
-function os_getNumberSuffix( id ) {
+window.os_getNumberSuffix = function( id ) {
var num = id.substring( id.length - 2 );
if( !( num.charAt( 0 ) >= '0' && num.charAt( 0 ) <= '9' ) ) {
num = num.substring( 1 );
} else {
return -1;
}
-}
+};
/** Save mouse move as last action */
-function os_eventMousemove( srcId, e ) {
+window.os_eventMousemove = function( srcId, e ) {
os_mouse_moved = true;
-}
+};
/** Mouse button held down, register possible click */
-function os_eventMousedown( srcId, e ) {
+window.os_eventMousedown = function( srcId, e ) {
var targ = os_getTarget( e );
var r = os_map[srcId];
if( r == null ) {
document.getElementById( r.searchbox ).focus();
return false; // prevents selection
-}
+};
/** Mouse button released, check for click on some row */
-function os_eventMouseup( srcId, e ) {
+window.os_eventMouseup = function( srcId, e ) {
var targ = os_getTarget( e );
var r = os_map[srcId];
if( r == null ) {
os_mouse_pressed = false;
// keep the focus on the search field
document.getElementById( r.searchbox ).focus();
-}
+};
/** Toggle stuff seems to be dead code? */
/** Return the span element that contains the toggle link */
-function os_createToggle( r, className ) {
+window.os_createToggle = function( r, className ) {
var t = document.createElement( 'span' );
t.className = className;
t.setAttribute( 'id', r.toggle );
link.appendChild( msg );
t.appendChild( link );
return t;
-}
+};
/** Call when user clicks on some of the toggle links */
-function os_toggle( inputId, formName ) {
+window.os_toggle = function( inputId, formName ) {
r = os_map[inputId];
var msg = '';
if( r == null ) {
// change message
var link = document.getElementById( r.toggle ).firstChild;
link.replaceChild( document.createTextNode( msg ), link.firstChild );
-}
+};
hookEvent( 'load', os_MWSuggestInit );
scripts.mit.edu / autoinstallsdev / mediawiki.git / blobdiff