| Index: trunk/phase3/skins/monobook/main.css |
| — | — | @@ -1246,8 +1246,8 @@ |
| 1247 | 1247 | } |
| 1248 | 1248 | |
| 1249 | 1249 | /* God-damned hack for the crappy layout */ |
| 1250 | | -.os-suggest { |
| 1251 | | - font-size: 127%; |
| | 1250 | +.ui-autocomplete { |
| | 1251 | + font-size: 127%!important; |
| 1252 | 1252 | } |
| 1253 | 1253 | |
| 1254 | 1254 | /* Sometimes people don't want personal tools to be lowercase! */ |
| Index: trunk/phase3/skins/common/shared.css |
| — | — | @@ -193,6 +193,24 @@ |
| 194 | 194 | /* |
| 195 | 195 | * OpenSearch ajax suggestions |
| 196 | 196 | */ |
| | 197 | +.ui-autocomplete { |
| | 198 | + font-size: 95%!important; |
| | 199 | + border: 1px solid #AAA!important; |
| | 200 | + overflow: auto; |
| | 201 | + height: 100px; |
| | 202 | +} |
| | 203 | +.ui-autocomplete #ui-active-menuitem { |
| | 204 | + background: #4C59A6; |
| | 205 | + background: Highlight; |
| | 206 | + color: white; |
| | 207 | + color: HighlightText; |
| | 208 | + border-color: #4C59A6; |
| | 209 | + border-color: Highlight; |
| | 210 | +} |
| | 211 | +.ui-autocomplete .ui-menu-item a{ |
| | 212 | + line-height: 1.1!important; |
| | 213 | + font-size: 95%!important; |
| | 214 | +} |
| 197 | 215 | .os-suggest { |
| 198 | 216 | overflow: auto; |
| 199 | 217 | overflow-x: hidden; |
| Index: trunk/phase3/skins/common/mwsuggest.js |
| — | — | @@ -1,1066 +1,92 @@ |
| 2 | | -/* |
| 3 | | - * OpenSearch ajax suggestion engine for MediaWiki |
| 4 | | - * |
| 5 | | - * uses core MediaWiki open search support to fetch suggestions |
| 6 | | - * and show them below search boxes and other inputs |
| 7 | | - * |
| 8 | | - * by Robert Stojnic (April 2008) |
| 9 | | - */ |
| 10 | | - |
| 11 | | -// Make sure wgMWSuggestTemplate is defined |
| 12 | | -if ( !mw.config.exists( 'wgMWSuggestTemplate' ) ) { |
| 13 | | - mw.config.set( 'wgMWSuggestTemplate', mw.config.get( 'wgServer' ) + mw.config.get( 'wgScriptPath' ) |
| 14 | | - + "/api.php?action=opensearch\x26search={searchTerms}\x26namespace={namespaces}\x26suggest" ); |
| 15 | | -} |
| 16 | | - |
| 17 | | -// search_box_id -> Results object |
| 18 | | -window.os_map = {}; |
| 19 | | -// cached data, url -> json_text |
| 20 | | -window.os_cache = {}; |
| 21 | | -// global variables for suggest_keypress |
| 22 | | -window.os_cur_keypressed = 0; |
| 23 | | -window.os_keypressed_count = 0; |
| 24 | | -// type: Timer |
| 25 | | -window.os_timer = null; |
| 26 | | -// tie mousedown/up events |
| 27 | | -window.os_mouse_pressed = false; |
| 28 | | -window.os_mouse_num = -1; |
| 29 | | -// if true, the last change was made by mouse (and not keyboard) |
| 30 | | -window.os_mouse_moved = false; |
| 31 | | -// delay between keypress and suggestion (in ms) |
| 32 | | -window.os_search_timeout = 250; |
| 33 | | -// these pairs of inputs/forms will be autoloaded at startup |
| 34 | | -window.os_autoload_inputs = new Array('searchInput', 'searchInput2', 'powerSearchText', 'searchText'); |
| 35 | | -window.os_autoload_forms = new Array('searchform', 'searchform2', 'powersearch', 'search' ); |
| 36 | | -// if we stopped the service |
| 37 | | -window.os_is_stopped = false; |
| 38 | | -// max lines to show in suggest table |
| 39 | | -window.os_max_lines_per_suggest = 7; |
| 40 | | -// number of steps to animate expansion/contraction of container width |
| 41 | | -window.os_animation_steps = 6; |
| 42 | | -// num of pixels of smallest step |
| 43 | | -window.os_animation_min_step = 2; |
| 44 | | -// delay between steps (in ms) |
| 45 | | -window.os_animation_delay = 30; |
| 46 | | -// max width of container in percent of normal size (1 == 100%) |
| 47 | | -window.os_container_max_width = 2; |
| 48 | | -// currently active animation timer |
| 49 | | -window.os_animation_timer = null; |
| 50 | | -// whether MWSuggest is enabled. Set to false when os_MWSuggestDisable() is called |
| 51 | | -window.os_enabled = true; |
| 52 | | - |
| 53 | | -/** |
| 54 | | - * <datalist> is a new HTML5 element that allows you to manually supply |
| 55 | | - * suggestion lists and have them rendered according to the right platform |
| 56 | | - * conventions. Opera as of version 11 has a fatal problem: the suggestion |
| 57 | | - * lags behind what the user types by one keypress. (Reported as DSK-276870 to |
| 58 | | - * Opera's secret bug tracker.) However, Firefox 4 supports it without |
| 59 | | - * problems, so Opera is just blacklisted here. Ideally we wouldn't blacklist |
| 60 | | - * future versions, in case they fix it, but the fallback isn't bad at all and |
| 61 | | - * the failure if they don't fix it is very annoying, so in this case we'll |
| 62 | | - * blacklist future versions too. |
| 63 | | - */ |
| 64 | | -window.os_use_datalist = 'list' in document.createElement( 'input' ) |
| 65 | | - && $.client.profile().name != 'opera'; |
| 66 | | - |
| 67 | | -/** Timeout timer class that will fetch the results */ |
| 68 | | -window.os_Timer = function( id, r, query ) { |
| 69 | | - this.id = id; |
| 70 | | - this.r = r; |
| 71 | | - this.query = query; |
| 72 | | -}; |
| 73 | | - |
| 74 | | -/** Property class for single search box */ |
| 75 | | -window.os_Results = function( name, formname ) { |
| 76 | | - this.searchform = formname; // id of the searchform |
| 77 | | - this.searchbox = name; // id of the searchbox |
| 78 | | - this.container = name + 'Suggest'; // div that holds results |
| 79 | | - this.resultTable = name + 'Result'; // id base for the result table (+num = table row) |
| 80 | | - this.resultText = name + 'ResultText'; // id base for the spans within result tables (+num) |
| 81 | | - this.toggle = name + 'Toggle'; // div that has the toggle (enable/disable) link |
| 82 | | - this.query = null; // last processed query |
| 83 | | - this.results = null; // parsed titles |
| 84 | | - this.resultCount = 0; // number of results |
| 85 | | - this.original = null; // query that user entered |
| 86 | | - this.selected = -1; // which result is selected |
| 87 | | - this.containerCount = 0; // number of results visible in container |
| 88 | | - this.containerRow = 0; // height of result field in the container |
| 89 | | - this.containerTotal = 0; // total height of the container will all results |
| 90 | | - this.visible = false; // if container is visible |
| 91 | | - this.stayHidden = false; // don't try to show if lost focus |
| 92 | | -}; |
| 93 | | - |
| 94 | | -/** Timer user to animate expansion/contraction of container width */ |
| 95 | | -window.os_AnimationTimer = function( r, target ) { |
| 96 | | - this.r = r; |
| 97 | | - var current = document.getElementById(r.container).offsetWidth; |
| 98 | | - this.inc = Math.round( ( target - current ) / os_animation_steps ); |
| 99 | | - if( this.inc < os_animation_min_step && this.inc >=0 ) { |
| 100 | | - this.inc = os_animation_min_step; // minimal animation step |
| 101 | | - } |
| 102 | | - if( this.inc > -os_animation_min_step && this.inc < 0 ) { |
| 103 | | - this.inc = -os_animation_min_step; |
| 104 | | - } |
| 105 | | - this.target = target; |
| 106 | | -}; |
| 107 | | - |
| 108 | | -/****************** |
| 109 | | - * Initialization |
| 110 | | - ******************/ |
| 111 | | - |
| 112 | | -/** Initialization, call upon page onload */ |
| 113 | | -window.os_MWSuggestInit = function() { |
| 114 | | - if ( !window.os_enabled ) { |
| 115 | | - return; |
| 116 | | - } |
| | 2 | +var $container = $('<div>', {'class' : 'open-search-suggestions'}), |
| | 3 | + cache = {}, |
| | 4 | + $t, |
| | 5 | + url = mw.config.get('wgScriptPath') + '/api.php?format=json&action=opensearch&search=', |
| | 6 | + maxRowWindow; |
| 117 | 7 | |
| 118 | | - for( var i = 0; i < os_autoload_inputs.length; i++ ) { |
| 119 | | - var id = os_autoload_inputs[i]; |
| 120 | | - var form = os_autoload_forms[i]; |
| 121 | | - element = document.getElementById( id ); |
| 122 | | - if( element != null ) { |
| 123 | | - os_initHandlers( id, form, element ); |
| 124 | | - } |
| 125 | | - } |
| 126 | | -}; |
| | 8 | +$('body').append( $container ); |
| 127 | 9 | |
| 128 | | -/* Teardown, called when things like SimpleSearch need to disable MWSuggest */ |
| 129 | | -window.os_MWSuggestTeardown = function() { |
| 130 | | - for( var i = 0; i < os_autoload_inputs.length; i++ ) { |
| 131 | | - var id = os_autoload_inputs[i]; |
| 132 | | - var form = os_autoload_forms[i]; |
| 133 | | - element = document.getElementById( id ); |
| 134 | | - if( element != null ) { |
| 135 | | - os_teardownHandlers( id, form, element ); |
| | 10 | +//Grabs namespaces from DOM |
| | 11 | +//@return: Array of Namespaces |
| | 12 | +getNamespaces = function() { |
| | 13 | + var namespaces = []; |
| | 14 | + $('form#powersearch, form#search').find( '[name^="ns"]' ).each(function() { |
| | 15 | + if ( this.checked || ( this.type == 'hidden' && this.value == '1' ) ) { |
| | 16 | + namespaces.push( this.name.substring( 2 ) ); |
| 136 | 17 | } |
| | 18 | + }); |
| | 19 | + if ( !namespaces.length ) { |
| | 20 | + namespaces = wgSearchNamespaces; |
| 137 | 21 | } |
| | 22 | + return namespaces.join('|'); |
| 138 | 23 | }; |
| 139 | 24 | |
| 140 | | -/* Call this to disable MWSuggest. Works regardless of whether MWSuggest has been initialized already. */ |
| 141 | | -window.os_MWSuggestDisable = function() { |
| 142 | | - window.os_MWSuggestTeardown(); |
| 143 | | - window.os_enabled = false; |
| 144 | | -} |
| 145 | | - |
| 146 | 25 | |
| 147 | | -/** Init Result objects and event handlers */ |
| 148 | | -window.os_initHandlers = function( name, formname, element ) { |
| 149 | | - var r = new os_Results( name, formname ); |
| 150 | | - var formElement = document.getElementById( formname ); |
| 151 | | - if( !formElement ) { |
| 152 | | - // Older browsers (Opera 8) cannot get form elements |
| 153 | | - return; |
| 154 | | - } |
| 155 | | - // event handler |
| 156 | | - os_hookEvent( element, 'keyup', os_eventKeyup ); |
| 157 | | - os_hookEvent( element, 'keydown', os_eventKeydown ); |
| 158 | | - os_hookEvent( element, 'keypress', os_eventKeypress ); |
| 159 | | - if ( !os_use_datalist ) { |
| 160 | | - // These are needed for the div hack to hide it if the user blurs. |
| 161 | | - os_hookEvent( element, 'blur', os_eventBlur ); |
| 162 | | - os_hookEvent( element, 'focus', os_eventFocus ); |
| 163 | | - // We don't want browser auto-suggestions interfering with our div, but |
| 164 | | - // autocomplete must be on for datalist to work (at least in Opera |
| 165 | | - // 10.10). |
| 166 | | - element.setAttribute( 'autocomplete', 'off' ); |
| 167 | | - } |
| 168 | | - // stopping handler |
| 169 | | - os_hookEvent( formElement, 'submit', os_eventOnsubmit ); |
| 170 | | - os_map[name] = r; |
| 171 | | - // toggle link |
| 172 | | - if( document.getElementById( r.toggle ) == null ) { |
| 173 | | - // TODO: disable this while we figure out a way for this to work in all browsers |
| 174 | | - /* if( name == 'searchInput' ) { |
| 175 | | - // special case: place above the main search box |
| 176 | | - var t = os_createToggle( r, 'os-suggest-toggle' ); |
| 177 | | - var searchBody = document.getElementById( 'searchBody' ); |
| 178 | | - var first = searchBody.parentNode.firstChild.nextSibling.appendChild(t); |
| 179 | | - } else { |
| 180 | | - // default: place below search box to the right |
| 181 | | - var t = os_createToggle( r, 'os-suggest-toggle-def' ); |
| 182 | | - var top = element.offsetTop + element.offsetHeight; |
| 183 | | - var left = element.offsetLeft + element.offsetWidth; |
| 184 | | - t.style.position = 'absolute'; |
| 185 | | - t.style.top = top + 'px'; |
| 186 | | - t.style.left = left + 'px'; |
| 187 | | - element.parentNode.appendChild( t ); |
| 188 | | - // only now width gets calculated, shift right |
| 189 | | - left -= t.offsetWidth; |
| 190 | | - t.style.left = left + 'px'; |
| 191 | | - t.style.visibility = 'visible'; |
| 192 | | - } */ |
| 193 | | - } |
| 194 | | - |
| 195 | | -}; |
| 196 | | - |
| 197 | | -window.os_teardownHandlers = function( name, formname, element ) { |
| 198 | | - var formElement = document.getElementById( formname ); |
| 199 | | - if( !formElement ) { |
| 200 | | - // Older browsers (Opera 8) cannot get form elements |
| 201 | | - return; |
| 202 | | - } |
| 203 | | - |
| 204 | | - os_unhookEvent( element, 'keyup', os_eventKeyup ); |
| 205 | | - os_unhookEvent( element, 'keydown', os_eventKeydown ); |
| 206 | | - os_unhookEvent( element, 'keypress', os_eventKeypress ); |
| 207 | | - if ( !os_use_datalist ) { |
| 208 | | - // These are needed for the div hack to hide it if the user blurs. |
| 209 | | - os_unhookEvent( element, 'blur', os_eventBlur ); |
| 210 | | - os_unhookEvent( element, 'focus', os_eventFocus ); |
| 211 | | - // We don't want browser auto-suggestions interfering with our div, but |
| 212 | | - // autocomplete must be on for datalist to work (at least in Opera |
| 213 | | - // 10.10). |
| 214 | | - element.removeAttribute( 'autocomplete' ); |
| 215 | | - } |
| 216 | | - // stopping handler |
| 217 | | - os_unhookEvent( formElement, 'submit', os_eventOnsubmit ); |
| 218 | | -}; |
| 219 | | - |
| 220 | | - |
| 221 | | -window.os_hookEvent = function( element, hookName, hookFunct ) { |
| 222 | | - if ( element.addEventListener ) { |
| 223 | | - element.addEventListener( hookName, hookFunct, false ); |
| 224 | | - } else if ( window.attachEvent ) { |
| 225 | | - element.attachEvent( 'on' + hookName, hookFunct ); |
| 226 | | - } |
| 227 | | -}; |
| 228 | | - |
| 229 | | -window.os_unhookEvent = function( element, hookName, hookFunct ) { |
| 230 | | - if ( element.removeEventListener ) { |
| 231 | | - element.removeEventListener( hookName, hookFunct, false ); |
| 232 | | - } else if ( element.detachEvent ) { |
| 233 | | - element.detachEvent( 'on' + hookName, hookFunct ); |
| 234 | | - } |
| 235 | | -} |
| 236 | | - |
| 237 | | -/******************** |
| 238 | | - * Keyboard events |
| 239 | | - ********************/ |
| 240 | | - |
| 241 | | -/** Event handler that will fetch results on keyup */ |
| 242 | | -window.os_eventKeyup = function( e ) { |
| 243 | | - var targ = os_getTarget( e ); |
| 244 | | - var r = os_map[targ.id]; |
| 245 | | - if( r == null ) { |
| 246 | | - return; // not our event |
| 247 | | - } |
| 248 | | - |
| 249 | | - // some browsers won't generate keypressed for arrow keys, catch it |
| 250 | | - if( os_keypressed_count == 0 ) { |
| 251 | | - os_processKey( r, os_cur_keypressed, targ ); |
| 252 | | - } |
| 253 | | - var query = targ.value; |
| 254 | | - os_fetchResults( r, query, os_search_timeout ); |
| 255 | | -}; |
| 256 | | - |
| 257 | | -/** catch arrows up/down and escape to hide the suggestions */ |
| 258 | | -window.os_processKey = function( r, keypressed, targ ) { |
| 259 | | - if ( keypressed == 40 && !r.visible && os_timer == null ) { |
| 260 | | - // If the user hits the down arrow, fetch results immediately if none |
| 261 | | - // are already displayed. |
| 262 | | - r.query = ''; |
| 263 | | - os_fetchResults( r, targ.value, 0 ); |
| 264 | | - } |
| 265 | | - // Otherwise, if we're not using datalist, we need to handle scrolling and |
| 266 | | - // so on. |
| 267 | | - if ( os_use_datalist ) { |
| 268 | | - return; |
| 269 | | - } |
| 270 | | - if ( keypressed == 40 ) { // Arrow Down |
| 271 | | - if ( r.visible ) { |
| 272 | | - os_changeHighlight( r, r.selected, r.selected + 1, true ); |
| 273 | | - } |
| 274 | | - } else if ( keypressed == 38 ) { // Arrow Up |
| 275 | | - if ( r.visible ) { |
| 276 | | - os_changeHighlight( r, r.selected, r.selected - 1, true ); |
| 277 | | - } |
| 278 | | - } else if( keypressed == 27 ) { // Escape |
| 279 | | - document.getElementById( r.searchbox ).value = r.original; |
| 280 | | - r.query = r.original; |
| 281 | | - os_hideResults( r ); |
| 282 | | - } else if( r.query != document.getElementById( r.searchbox ).value ) { |
| 283 | | - // os_hideResults( r ); // don't show old suggestions |
| 284 | | - } |
| 285 | | -}; |
| 286 | | - |
| 287 | | -/** When keys is held down use a timer to output regular events */ |
| 288 | | -window.os_eventKeypress = function( e ) { |
| 289 | | - var targ = os_getTarget( e ); |
| 290 | | - var r = os_map[targ.id]; |
| 291 | | - if( r == null ) { |
| 292 | | - return; // not our event |
| 293 | | - } |
| 294 | | - |
| 295 | | - var keypressed = os_cur_keypressed; |
| 296 | | - |
| 297 | | - os_keypressed_count++; |
| 298 | | - os_processKey( r, keypressed, targ ); |
| 299 | | -}; |
| 300 | | - |
| 301 | | -/** Catch the key code (Firefox bug) */ |
| 302 | | -window.os_eventKeydown = function( e ) { |
| 303 | | - if ( !e ) { |
| 304 | | - e = window.event; |
| 305 | | - } |
| 306 | | - var targ = os_getTarget( e ); |
| 307 | | - var r = os_map[targ.id]; |
| 308 | | - if( r == null ) { |
| 309 | | - return; // not our event |
| 310 | | - } |
| 311 | | - |
| 312 | | - os_mouse_moved = false; |
| 313 | | - |
| 314 | | - os_cur_keypressed = ( e.keyCode == undefined ) ? e.which : e.keyCode; |
| 315 | | - os_keypressed_count = 0; |
| 316 | | -}; |
| 317 | | - |
| 318 | | - |
| 319 | | -/** When the form is submitted hide everything, cancel updates... */ |
| 320 | | -window.os_eventOnsubmit = function( e ) { |
| 321 | | - var targ = os_getTarget( e ); |
| 322 | | - |
| 323 | | - os_is_stopped = true; |
| 324 | | - // kill timed requests |
| 325 | | - if( os_timer != null && os_timer.id != null ) { |
| 326 | | - clearTimeout( os_timer.id ); |
| 327 | | - os_timer = null; |
| 328 | | - } |
| 329 | | - // Hide all suggestions |
| 330 | | - for( i = 0; i < os_autoload_inputs.length; i++ ) { |
| 331 | | - var r = os_map[os_autoload_inputs[i]]; |
| 332 | | - if( r != null ) { |
| 333 | | - var b = document.getElementById( r.searchform ); |
| 334 | | - if( b != null && b == targ ) { |
| 335 | | - // set query value so the handler won't try to fetch additional results |
| 336 | | - r.query = document.getElementById( r.searchbox ).value; |
| 337 | | - } |
| 338 | | - os_hideResults( r ); |
| 339 | | - } |
| 340 | | - } |
| 341 | | - return true; |
| 342 | | -}; |
| 343 | | - |
| 344 | | - |
| 345 | | - |
| 346 | | -/** Hide results from the user, either making the div visibility=hidden or |
| 347 | | - * detaching the datalist from the input. */ |
| 348 | | -window.os_hideResults = function( r ) { |
| 349 | | - if ( os_use_datalist ) { |
| 350 | | - document.getElementById( r.searchbox ).setAttribute( 'list', '' ); |
| | 26 | +deliverResult = function( obj, response, maxRowWindow ) { |
| | 27 | + if (obj && obj.length > 1) { |
| | 28 | + response( obj[1] ); |
| | 29 | + var maxRow = Math.min.apply( Math, [7, obj[1].length, maxRowWindow] ); |
| | 30 | + $t.css( 'height', maxRow * $t.find( '.ui-menu-item' ).eq( 0 ).height() ); |
| 351 | 31 | } else { |
| 352 | | - var c = document.getElementById( r.container ); |
| 353 | | - if ( c != null ) { |
| 354 | | - c.style.visibility = 'hidden'; |
| 355 | | - } |
| | 32 | + response( [] ); |
| 356 | 33 | } |
| 357 | | - r.visible = false; |
| 358 | | - r.selected = -1; |
| 359 | 34 | }; |
| 360 | 35 | |
| 361 | | -window.os_decodeValue = function( value ) { |
| 362 | | - if ( decodeURIComponent ) { |
| 363 | | - return decodeURIComponent( value ); |
| 364 | | - } |
| 365 | | - if( unescape ) { |
| 366 | | - return unescape( value ); |
| 367 | | - } |
| 368 | | - return null; |
| 369 | | -}; |
| 370 | | - |
| 371 | | -window.os_encodeQuery = function( value ) { |
| 372 | | - if ( encodeURIComponent ) { |
| 373 | | - return encodeURIComponent( value ); |
| 374 | | - } |
| 375 | | - if( escape ) { |
| 376 | | - return escape( value ); |
| 377 | | - } |
| 378 | | - return null; |
| 379 | | -}; |
| 380 | | - |
| 381 | | -/** Handles data from XMLHttpRequest, and updates the suggest results */ |
| 382 | | -window.os_updateResults = function( r, query, text, cacheKey ) { |
| 383 | | - os_cache[cacheKey] = text; |
| 384 | | - r.query = query; |
| 385 | | - r.original = query; |
| 386 | | - if( text == '' ) { |
| 387 | | - r.results = null; |
| 388 | | - r.resultCount = 0; |
| 389 | | - os_hideResults( r ); |
| 390 | | - } else { |
| 391 | | - try { |
| 392 | | - var p = eval( '(' + text + ')' ); // simple json parse, could do a safer one |
| 393 | | - if( p.length < 2 || p[1].length == 0 ) { |
| 394 | | - r.results = null; |
| 395 | | - r.resultCount = 0; |
| 396 | | - os_hideResults( r ); |
| 397 | | - return; |
| 398 | | - } |
| 399 | | - if ( os_use_datalist ) { |
| 400 | | - os_setupDatalist( r, p[1] ); |
| 401 | | - } else { |
| 402 | | - os_setupDiv( r, p[1] ); |
| 403 | | - } |
| 404 | | - } catch( e ) { |
| 405 | | - // bad response from server or such |
| 406 | | - os_hideResults( r ); |
| 407 | | - os_cache[cacheKey] = null; |
| | 36 | +$("#searchInput").autocomplete({ |
| | 37 | + minLength: 2, |
| | 38 | + source: function ( request, response ) { |
| | 39 | + request.term = $.trim (request.term); |
| | 40 | + var namespaces = getNamespaces(); |
| | 41 | + var term = request.term + namespaces; |
| | 42 | + if (term in cache) { |
| | 43 | + deliverResult( cache[term], response, maxRowWindow ); |
| | 44 | + return; |
| 408 | 45 | } |
| | 46 | + $.getJSON(url + mw.util.rawurlencode( request.term ) + '&namespace=' + namespaces, function ( obj ) { |
| | 47 | + cache[term] = obj; |
| | 48 | + deliverResult( obj, response, maxRowWindow ); |
| | 49 | + }); |
| | 50 | + }, |
| | 51 | + select: function() { |
| | 52 | + $('#searchGoButton').click(); |
| | 53 | + }, |
| | 54 | + create : function() { |
| | 55 | + $t = $container.find('ul'); |
| | 56 | + }, |
| | 57 | + appendTo: '.open-search-suggestions', |
| | 58 | + open: function() { |
| | 59 | + maxRowWindow = Math.floor( ( $(window).height() - $t.offset().top + $(window).scrollTop() ) / $t.find( '.ui-menu-item' ).eq( 0 ).height() ); |
| | 60 | + }, |
| | 61 | + focus : function() { |
| | 62 | + console.log('focused'); |
| 409 | 63 | } |
| | 64 | +}); |
| | 65 | +$("#searchInput").data("autocomplete")._resizeMenu = function () { |
| 410 | 66 | }; |
| 411 | | - |
| 412 | | -/** |
| 413 | | - * Create and populate a <datalist>. |
| 414 | | - * |
| 415 | | - * @param r os_Result object |
| 416 | | - * @param results Array of the new results to replace existing ones |
| 417 | | - */ |
| 418 | | -window.os_setupDatalist = function( r, results ) { |
| 419 | | - var s = document.getElementById( r.searchbox ); |
| 420 | | - var c = document.getElementById( r.container ); |
| 421 | | - if ( c == null ) { |
| 422 | | - c = document.createElement( 'datalist' ); |
| 423 | | - c.setAttribute( 'id', r.container ); |
| 424 | | - document.body.appendChild( c ); |
| 425 | | - } else { |
| 426 | | - c.innerHTML = ''; |
| 427 | | - } |
| 428 | | - s.setAttribute( 'list', r.container ); |
| 429 | | - |
| 430 | | - r.results = new Array(); |
| 431 | | - r.resultCount = results.length; |
| 432 | | - r.visible = true; |
| 433 | | - for ( i = 0; i < results.length; i++ ) { |
| 434 | | - var title = os_decodeValue( results[i] ); |
| 435 | | - var opt = document.createElement( 'option' ); |
| 436 | | - opt.value = title; |
| 437 | | - r.results[i] = title; |
| 438 | | - c.appendChild( opt ); |
| 439 | | - } |
| 440 | | -}; |
| 441 | | - |
| 442 | | -/** Fetch namespaces from checkboxes or hidden fields in the search form, |
| 443 | | - if none defined use wgSearchNamespaces global */ |
| 444 | | -window.os_getNamespaces = function( r ) { |
| 445 | | - var namespaces = ''; |
| 446 | | - var elements = document.forms[r.searchform].elements; |
| 447 | | - for( i = 0; i < elements.length; i++ ) { |
| 448 | | - var name = elements[i].name; |
| 449 | | - if( typeof name != 'undefined' && name.length > 2 && name[0] == 'n' && |
| 450 | | - name[1] == 's' && ( |
| 451 | | - ( elements[i].type == 'checkbox' && elements[i].checked ) || |
| 452 | | - ( elements[i].type == 'hidden' && elements[i].value == '1' ) |
| 453 | | - ) |
| 454 | | - ) { |
| 455 | | - if( namespaces != '' ) { |
| 456 | | - namespaces += '|'; |
| 457 | | - } |
| 458 | | - namespaces += name.substring( 2 ); |
| 459 | | - } |
| 460 | | - } |
| 461 | | - if( namespaces == '' ) { |
| 462 | | - namespaces = wgSearchNamespaces.join('|'); |
| 463 | | - } |
| 464 | | - return namespaces; |
| 465 | | -}; |
| 466 | | - |
| 467 | | -/** Update results if user hasn't already typed something else */ |
| 468 | | -window.os_updateIfRelevant = function( r, query, text, cacheKey ) { |
| 469 | | - var t = document.getElementById( r.searchbox ); |
| 470 | | - if( t != null && t.value == query ) { // check if response is still relevant |
| 471 | | - os_updateResults( r, query, text, cacheKey ); |
| 472 | | - } |
| 473 | | - r.query = query; |
| 474 | | -}; |
| 475 | | - |
| 476 | | -/** Fetch results after some timeout */ |
| 477 | | -window.os_delayedFetch = function() { |
| 478 | | - if( os_timer == null ) { |
| 479 | | - return; |
| 480 | | - } |
| 481 | | - var r = os_timer.r; |
| 482 | | - var query = os_timer.query; |
| 483 | | - os_timer = null; |
| 484 | | - var path = mw.config.get( 'wgMWSuggestTemplate' ).replace( "{namespaces}", os_getNamespaces( r ) ) |
| 485 | | - .replace( "{dbname}", wgDBname ) |
| 486 | | - .replace( "{searchTerms}", os_encodeQuery( query ) ); |
| 487 | | - |
| 488 | | - // try to get from cache, if not fetch using ajax |
| 489 | | - var cached = os_cache[path]; |
| 490 | | - if( cached != null && cached != undefined ) { |
| 491 | | - os_updateIfRelevant( r, query, cached, path ); |
| 492 | | - } else { |
| 493 | | - var xmlhttp = sajax_init_object(); |
| 494 | | - if( xmlhttp ) { |
| 495 | | - try { |
| 496 | | - xmlhttp.open( 'GET', path, true ); |
| 497 | | - xmlhttp.onreadystatechange = function() { |
| 498 | | - if ( xmlhttp.readyState == 4 && typeof os_updateIfRelevant == 'function' ) { |
| 499 | | - os_updateIfRelevant( r, query, xmlhttp.responseText, path ); |
| 500 | | - } |
| 501 | | - }; |
| 502 | | - xmlhttp.send( null ); |
| 503 | | - } catch ( e ) { |
| 504 | | - if ( window.location.hostname == 'localhost' ) { |
| 505 | | - alert( "Your browser blocks XMLHttpRequest to 'localhost', try using a real hostname for development/testing." ); |
| 506 | | - } |
| 507 | | - throw e; |
| 508 | | - } |
| 509 | | - } |
| 510 | | - } |
| 511 | | -}; |
| 512 | | - |
| 513 | | -/** Init timed update via os_delayedUpdate() */ |
| 514 | | -window.os_fetchResults = function( r, query, timeout ) { |
| 515 | | - if( query == '' ) { |
| 516 | | - r.query = ''; |
| 517 | | - os_hideResults( r ); |
| 518 | | - return; |
| 519 | | - } else if( query == r.query ) { |
| 520 | | - return; // no change |
| 521 | | - } |
| 522 | | - |
| 523 | | - os_is_stopped = false; // make sure we're running |
| 524 | | - |
| 525 | | - // cancel any pending fetches |
| 526 | | - if( os_timer != null && os_timer.id != null ) { |
| 527 | | - clearTimeout( os_timer.id ); |
| 528 | | - } |
| 529 | | - // schedule delayed fetching of results |
| 530 | | - if( timeout != 0 ) { |
| 531 | | - os_timer = new os_Timer( setTimeout( "os_delayedFetch()", timeout ), r, query ); |
| 532 | | - } else { |
| 533 | | - os_timer = new os_Timer( null, r, query ); |
| 534 | | - os_delayedFetch(); // do it now! |
| 535 | | - } |
| 536 | | -}; |
| 537 | | - |
| 538 | | -/** Find event target */ |
| 539 | | -window.os_getTarget = function( e ) { |
| 540 | | - if ( !e ) { |
| 541 | | - e = window.event; |
| 542 | | - } |
| 543 | | - if ( e.target ) { |
| 544 | | - return e.target; |
| 545 | | - } else if ( e.srcElement ) { |
| 546 | | - return e.srcElement; |
| 547 | | - } else { |
| 548 | | - return null; |
| 549 | | - } |
| 550 | | -}; |
| 551 | | - |
| 552 | | -/** Check if x is a valid integer */ |
| 553 | | -window.os_isNumber = function( x ) { |
| 554 | | - if( x == '' || isNaN( x ) ) { |
| 555 | | - return false; |
| 556 | | - } |
| 557 | | - for( var i = 0; i < x.length; i++ ) { |
| 558 | | - var c = x.charAt( i ); |
| 559 | | - if( !( c >= '0' && c <= '9' ) ) { |
| 560 | | - return false; |
| 561 | | - } |
| 562 | | - } |
| 563 | | - return true; |
| 564 | | -}; |
| 565 | | - |
| 566 | | -/** Call this to enable suggestions on input (id=inputId), on a form (name=formName) */ |
| 567 | | -window.os_enableSuggestionsOn = function( inputId, formName ) { |
| 568 | | - os_initHandlers( inputId, formName, document.getElementById( inputId ) ); |
| 569 | | -}; |
| 570 | | - |
| 571 | | -/** Call this to disable suggestios on input box (id=inputId) */ |
| 572 | | -window.os_disableSuggestionsOn = function( inputId ) { |
| 573 | | - r = os_map[inputId]; |
| 574 | | - if( r != null ) { |
| 575 | | - // cancel/hide results |
| 576 | | - os_timer = null; |
| 577 | | - os_hideResults( r ); |
| 578 | | - // turn autocomplete on ! |
| 579 | | - document.getElementById( inputId ).setAttribute( 'autocomplete', 'on' ); |
| 580 | | - // remove descriptor |
| 581 | | - os_map[inputId] = null; |
| 582 | | - } |
| 583 | | - |
| 584 | | - // Remove the element from the os_autoload_* arrays |
| 585 | | - var index = os_autoload_inputs.indexOf( inputId ); |
| 586 | | - if ( index >= 0 ) { |
| 587 | | - os_autoload_inputs[index] = os_autoload_forms[index] = ''; |
| 588 | | - } |
| 589 | | -}; |
| 590 | | - |
| 591 | | -/************************************************ |
| 592 | | - * Div-only functions (irrelevant for datalist) |
| 593 | | - ************************************************/ |
| 594 | | - |
| 595 | | -/** Event: loss of focus of input box */ |
| 596 | | -window.os_eventBlur = function( e ) { |
| 597 | | - var targ = os_getTarget( e ); |
| 598 | | - var r = os_map[targ.id]; |
| 599 | | - if( r == null ) { |
| 600 | | - return; // not our event |
| 601 | | - } |
| 602 | | - if( !os_mouse_pressed ) { |
| 603 | | - os_hideResults( r ); |
| 604 | | - // force canvas to stay hidden |
| 605 | | - r.stayHidden = true; |
| 606 | | - // cancel any pending fetches |
| 607 | | - if( os_timer != null && os_timer.id != null ) { |
| 608 | | - clearTimeout( os_timer.id ); |
| 609 | | - } |
| 610 | | - os_timer = null; |
| 611 | | - } |
| 612 | | -}; |
| 613 | | - |
| 614 | | -/** Event: focus (catch only when stopped) */ |
| 615 | | -window.os_eventFocus = function( e ) { |
| 616 | | - var targ = os_getTarget( e ); |
| 617 | | - var r = os_map[targ.id]; |
| 618 | | - if( r == null ) { |
| 619 | | - return; // not our event |
| 620 | | - } |
| 621 | | - r.stayHidden = false; |
| 622 | | -}; |
| 623 | | - |
| 624 | | -/** |
| 625 | | - * Create and populate a <div>, for non-<datalist>-supporting browsers. |
| 626 | | - * |
| 627 | | - * @param r os_Result object |
| 628 | | - * @param results Array of the new results to replace existing ones |
| 629 | | - */ |
| 630 | | -window.os_setupDiv = function( r, results ) { |
| 631 | | - var c = document.getElementById( r.container ); |
| 632 | | - if ( c == null ) { |
| 633 | | - c = os_createContainer( r ); |
| 634 | | - } |
| 635 | | - c.innerHTML = os_createResultTable( r, results ); |
| 636 | | - // init container table sizes |
| 637 | | - var t = document.getElementById( r.resultTable ); |
| 638 | | - r.containerTotal = t.offsetHeight; |
| 639 | | - r.containerRow = t.offsetHeight / r.resultCount; |
| 640 | | - os_fitContainer( r ); |
| 641 | | - os_trimResultText( r ); |
| 642 | | - os_showResults( r ); |
| 643 | | -}; |
| 644 | | - |
| 645 | | -/** Create the result table to be placed in the container div */ |
| 646 | | -window.os_createResultTable = function( r, results ) { |
| 647 | | - var c = document.getElementById( r.container ); |
| 648 | | - var width = c.offsetWidth - os_operaWidthFix( c.offsetWidth ); |
| 649 | | - var html = '<table class="os-suggest-results" id="' + r.resultTable + '" style="width: ' + width + 'px;">'; |
| 650 | | - r.results = new Array(); |
| 651 | | - r.resultCount = results.length; |
| 652 | | - for( i = 0; i < results.length; i++ ) { |
| 653 | | - var title = os_decodeValue( results[i] ); |
| 654 | | - r.results[i] = title; |
| 655 | | - html += '<tr><td class="os-suggest-result" id="' + r.resultTable + i + '"><span id="' + r.resultText + i + '">' + title + '</span></td></tr>'; |
| 656 | | - } |
| 657 | | - html += '</table>'; |
| 658 | | - return html; |
| 659 | | -}; |
| 660 | | - |
| 661 | | -/** Show results div */ |
| 662 | | -window.os_showResults = function( r ) { |
| 663 | | - if( os_is_stopped ) { |
| 664 | | - return; |
| 665 | | - } |
| 666 | | - if( r.stayHidden ) { |
| 667 | | - return; |
| 668 | | - } |
| 669 | | - os_fitContainer( r ); |
| 670 | | - var c = document.getElementById( r.container ); |
| 671 | | - r.selected = -1; |
| 672 | | - if( c != null ) { |
| 673 | | - c.scrollTop = 0; |
| 674 | | - c.style.visibility = 'visible'; |
| 675 | | - r.visible = true; |
| 676 | | - } |
| 677 | | -}; |
| 678 | | - |
| 679 | | -window.os_operaWidthFix = function( x ) { |
| 680 | | - // For browsers that don't understand overflow-x, estimate scrollbar width |
| 681 | | - if( typeof document.body.style.overflowX != 'string' ) { |
| 682 | | - return 30; |
| 683 | | - } |
| 684 | | - return 0; |
| 685 | | -}; |
| 686 | | - |
| 687 | | -/** Brower-dependent functions to find window inner size, and scroll status */ |
| 688 | | -window.f_clientWidth = function() { |
| 689 | | - return f_filterResults( |
| 690 | | - window.innerWidth ? window.innerWidth : 0, |
| 691 | | - document.documentElement ? document.documentElement.clientWidth : 0, |
| 692 | | - document.body ? document.body.clientWidth : 0 |
| 693 | | - ); |
| 694 | | -}; |
| 695 | | - |
| 696 | | -window.f_clientHeight = function() { |
| 697 | | - return f_filterResults( |
| 698 | | - window.innerHeight ? window.innerHeight : 0, |
| 699 | | - document.documentElement ? document.documentElement.clientHeight : 0, |
| 700 | | - document.body ? document.body.clientHeight : 0 |
| 701 | | - ); |
| 702 | | -}; |
| 703 | | - |
| 704 | | -window.f_scrollLeft = function() { |
| 705 | | - return f_filterResults( |
| 706 | | - window.pageXOffset ? window.pageXOffset : 0, |
| 707 | | - document.documentElement ? document.documentElement.scrollLeft : 0, |
| 708 | | - document.body ? document.body.scrollLeft : 0 |
| 709 | | - ); |
| 710 | | -}; |
| 711 | | - |
| 712 | | -window.f_scrollTop = function() { |
| 713 | | - return f_filterResults( |
| 714 | | - window.pageYOffset ? window.pageYOffset : 0, |
| 715 | | - document.documentElement ? document.documentElement.scrollTop : 0, |
| 716 | | - document.body ? document.body.scrollTop : 0 |
| 717 | | - ); |
| 718 | | -}; |
| 719 | | - |
| 720 | | -window.f_filterResults = function( n_win, n_docel, n_body ) { |
| 721 | | - var n_result = n_win ? n_win : 0; |
| 722 | | - if ( n_docel && ( !n_result || ( n_result > n_docel ) ) ) { |
| 723 | | - n_result = n_docel; |
| 724 | | - } |
| 725 | | - return n_body && ( !n_result || ( n_result > n_body ) ) ? n_body : n_result; |
| 726 | | -}; |
| 727 | | - |
| 728 | | -/** Get the height available for the results container */ |
| 729 | | -window.os_availableHeight = function( r ) { |
| 730 | | - var absTop = document.getElementById( r.container ).style.top; |
| 731 | | - var px = absTop.lastIndexOf( 'px' ); |
| 732 | | - if( px > 0 ) { |
| 733 | | - absTop = absTop.substring( 0, px ); |
| 734 | | - } |
| 735 | | - return f_clientHeight() - ( absTop - f_scrollTop() ); |
| 736 | | -}; |
| 737 | | - |
| 738 | | -/** Get element absolute position {left,top} */ |
| 739 | | -window.os_getElementPosition = function( elemID ) { |
| 740 | | - var offsetTrail = document.getElementById( elemID ); |
| 741 | | - var offsetLeft = 0; |
| 742 | | - var offsetTop = 0; |
| 743 | | - while ( offsetTrail ) { |
| 744 | | - offsetLeft += offsetTrail.offsetLeft; |
| 745 | | - offsetTop += offsetTrail.offsetTop; |
| 746 | | - offsetTrail = offsetTrail.offsetParent; |
| 747 | | - } |
| 748 | | - if ( navigator.userAgent.indexOf('Mac') != -1 && typeof document.body.leftMargin != 'undefined' ) { |
| 749 | | - offsetLeft += document.body.leftMargin; |
| 750 | | - offsetTop += document.body.topMargin; |
| 751 | | - } |
| 752 | | - return { left:offsetLeft, top:offsetTop }; |
| 753 | | -}; |
| 754 | | - |
| 755 | | -/** Create the container div that will hold the suggested titles */ |
| 756 | | -window.os_createContainer = function( r ) { |
| 757 | | - var c = document.createElement( 'div' ); |
| 758 | | - var s = document.getElementById( r.searchbox ); |
| 759 | | - var pos = os_getElementPosition( r.searchbox ); |
| 760 | | - var left = pos.left; |
| 761 | | - var top = pos.top + s.offsetHeight; |
| 762 | | - c.className = 'os-suggest'; |
| 763 | | - c.setAttribute( 'id', r.container ); |
| 764 | | - document.body.appendChild( c ); |
| 765 | | - |
| 766 | | - // dynamically generated style params |
| 767 | | - // IE workaround, cannot explicitely set "style" attribute |
| 768 | | - c = document.getElementById( r.container ); |
| 769 | | - c.style.top = top + 'px'; |
| 770 | | - c.style.left = left + 'px'; |
| 771 | | - c.style.width = s.offsetWidth + 'px'; |
| 772 | | - |
| 773 | | - // mouse event handlers |
| 774 | | - c.onmouseover = function( event ) { os_eventMouseover( r.searchbox, event ); }; |
| 775 | | - c.onmousemove = function( event ) { os_eventMousemove( r.searchbox, event ); }; |
| 776 | | - c.onmousedown = function( event ) { return os_eventMousedown( r.searchbox, event ); }; |
| 777 | | - c.onmouseup = function( event ) { os_eventMouseup( r.searchbox, event ); }; |
| 778 | | - return c; |
| 779 | | -}; |
| 780 | | - |
| 781 | | -/** change container height to fit to screen */ |
| 782 | | -window.os_fitContainer = function( r ) { |
| 783 | | - var c = document.getElementById( r.container ); |
| 784 | | - var h = os_availableHeight( r ) - 20; |
| 785 | | - var inc = r.containerRow; |
| 786 | | - h = parseInt( h / inc ) * inc; |
| 787 | | - if( h < ( 2 * inc ) && r.resultCount > 1 ) { // min: two results |
| 788 | | - h = 2 * inc; |
| 789 | | - } |
| 790 | | - if( ( h / inc ) > os_max_lines_per_suggest ) { |
| 791 | | - h = inc * os_max_lines_per_suggest; |
| 792 | | - } |
| 793 | | - if( h < r.containerTotal ) { |
| 794 | | - c.style.height = h + 'px'; |
| 795 | | - r.containerCount = parseInt( Math.round( h / inc ) ); |
| 796 | | - } else { |
| 797 | | - c.style.height = r.containerTotal + 'px'; |
| 798 | | - r.containerCount = r.resultCount; |
| 799 | | - } |
| 800 | | -}; |
| 801 | | - |
| 802 | | -/** If some entries are longer than the box, replace text with "..." */ |
| 803 | | -window.os_trimResultText = function( r ) { |
| 804 | | - // find max width, first see if we could expand the container to fit it |
| 805 | | - var maxW = 0; |
| 806 | | - for( var i = 0; i < r.resultCount; i++ ) { |
| 807 | | - var e = document.getElementById( r.resultText + i ); |
| 808 | | - if( e.offsetWidth > maxW ) { |
| 809 | | - maxW = e.offsetWidth; |
| 810 | | - } |
| 811 | | - } |
| 812 | | - var w = document.getElementById( r.container ).offsetWidth; |
| 813 | | - var fix = 0; |
| 814 | | - if( r.containerCount < r.resultCount ) { |
| 815 | | - fix = 20; // give 20px for scrollbar |
| 816 | | - } else { |
| 817 | | - fix = os_operaWidthFix( w ); |
| 818 | | - } |
| 819 | | - if( fix < 4 ) { |
| 820 | | - fix = 4; // basic padding |
| 821 | | - } |
| 822 | | - maxW += fix; |
| 823 | | - |
| 824 | | - // resize container to fit more data if permitted |
| 825 | | - var normW = document.getElementById( r.searchbox ).offsetWidth; |
| 826 | | - var prop = maxW / normW; |
| 827 | | - if( prop > os_container_max_width ) { |
| 828 | | - prop = os_container_max_width; |
| 829 | | - } else if( prop < 1 ) { |
| 830 | | - prop = 1; |
| 831 | | - } |
| 832 | | - var newW = Math.round( normW * prop ); |
| 833 | | - if( w != newW ) { |
| 834 | | - w = newW; |
| 835 | | - if( os_animation_timer != null ) { |
| 836 | | - clearInterval( os_animation_timer.id ); |
| 837 | | - } |
| 838 | | - os_animation_timer = new os_AnimationTimer( r, w ); |
| 839 | | - os_animation_timer.id = setInterval( "os_animateChangeWidth()", os_animation_delay ); |
| 840 | | - w -= fix; // this much is reserved |
| 841 | | - } |
| 842 | | - |
| 843 | | - // trim results |
| 844 | | - if( w < 10 ) { |
| 845 | | - return; |
| 846 | | - } |
| 847 | | - for( var i = 0; i < r.resultCount; i++ ) { |
| 848 | | - var e = document.getElementById( r.resultText + i ); |
| 849 | | - var replace = 1; |
| 850 | | - var lastW = e.offsetWidth + 1; |
| 851 | | - var iteration = 0; |
| 852 | | - var changedText = false; |
| 853 | | - while( e.offsetWidth > w && ( e.offsetWidth < lastW || iteration < 2 ) ) { |
| 854 | | - changedText = true; |
| 855 | | - lastW = e.offsetWidth; |
| 856 | | - var l = e.innerHTML; |
| 857 | | - e.innerHTML = l.substring( 0, l.length - replace ) + '...'; |
| 858 | | - iteration++; |
| 859 | | - replace = 4; // how many chars to replace |
| 860 | | - } |
| 861 | | - if( changedText ) { |
| 862 | | - // show hint for trimmed titles |
| 863 | | - document.getElementById( r.resultTable + i ).setAttribute( 'title', r.results[i] ); |
| 864 | | - } |
| 865 | | - } |
| 866 | | -}; |
| 867 | | - |
| 868 | | -/** Invoked on timer to animate change in container width */ |
| 869 | | -window.os_animateChangeWidth = function() { |
| 870 | | - var r = os_animation_timer.r; |
| 871 | | - var c = document.getElementById( r.container ); |
| 872 | | - var w = c.offsetWidth; |
| 873 | | - var normW = document.getElementById( r.searchbox ).offsetWidth; |
| 874 | | - var normL = os_getElementPosition( r.searchbox ).left; |
| 875 | | - var inc = os_animation_timer.inc; |
| 876 | | - var target = os_animation_timer.target; |
| 877 | | - var nw = w + inc; |
| 878 | | - if( ( inc > 0 && nw >= target ) || ( inc <= 0 && nw <= target ) ) { |
| 879 | | - // finished ! |
| 880 | | - c.style.width = target + 'px'; |
| 881 | | - clearInterval( os_animation_timer.id ); |
| 882 | | - os_animation_timer = null; |
| 883 | | - } else { |
| 884 | | - // in-progress |
| 885 | | - c.style.width = nw + 'px'; |
| 886 | | - if( document.documentElement.dir == 'rtl' ) { |
| 887 | | - c.style.left = ( normL + normW + ( target - nw ) - os_animation_timer.target - 1 ) + 'px'; |
| 888 | | - } |
| 889 | | - } |
| 890 | | -}; |
| 891 | | - |
| 892 | | -/** Change the highlighted row (i.e. suggestion), from position cur to next */ |
| 893 | | -window.os_changeHighlight = function( r, cur, next, updateSearchBox ) { |
| 894 | | - if ( next >= r.resultCount ) { |
| 895 | | - next = r.resultCount - 1; |
| 896 | | - } |
| 897 | | - if ( next < -1 ) { |
| 898 | | - next = -1; |
| 899 | | - } |
| 900 | | - r.selected = next; |
| 901 | | - if ( cur == next ) { |
| 902 | | - return; // nothing to do. |
| 903 | | - } |
| 904 | | - |
| 905 | | - if( cur >= 0 ) { |
| 906 | | - var curRow = document.getElementById( r.resultTable + cur ); |
| 907 | | - if( curRow != null ) { |
| 908 | | - curRow.className = 'os-suggest-result'; |
| 909 | | - } |
| 910 | | - } |
| 911 | | - var newText; |
| 912 | | - if( next >= 0 ) { |
| 913 | | - var nextRow = document.getElementById( r.resultTable + next ); |
| 914 | | - if( nextRow != null ) { |
| 915 | | - nextRow.className = os_HighlightClass(); |
| 916 | | - } |
| 917 | | - newText = r.results[next]; |
| 918 | | - } else { |
| 919 | | - newText = r.original; |
| 920 | | - } |
| 921 | | - |
| 922 | | - // adjust the scrollbar if any |
| 923 | | - if( r.containerCount < r.resultCount ) { |
| 924 | | - var c = document.getElementById( r.container ); |
| 925 | | - var vStart = c.scrollTop / r.containerRow; |
| 926 | | - var vEnd = vStart + r.containerCount; |
| 927 | | - if( next < vStart ) { |
| 928 | | - c.scrollTop = next * r.containerRow; |
| 929 | | - } else if( next >= vEnd ) { |
| 930 | | - c.scrollTop = ( next - r.containerCount + 1 ) * r.containerRow; |
| 931 | | - } |
| 932 | | - } |
| 933 | | - |
| 934 | | - // update the contents of the search box |
| 935 | | - if( updateSearchBox ) { |
| 936 | | - os_updateSearchQuery( r, newText ); |
| 937 | | - } |
| 938 | | -}; |
| 939 | | - |
| 940 | | -window.os_HighlightClass = function() { |
| 941 | | - var match = navigator.userAgent.match(/AppleWebKit\/(\d+)/); |
| 942 | | - if ( match ) { |
| 943 | | - var webKitVersion = parseInt( match[1] ); |
| 944 | | - if ( webKitVersion < 523 ) { |
| 945 | | - // CSS system highlight colors broken on old Safari |
| 946 | | - // https://bugs.webkit.org/show_bug.cgi?id=6129 |
| 947 | | - // Safari 3.0.4, 3.1 known ok |
| 948 | | - return 'os-suggest-result-hl-webkit'; |
| 949 | | - } |
| 950 | | - } |
| 951 | | - return 'os-suggest-result-hl'; |
| 952 | | -}; |
| 953 | | - |
| 954 | | -window.os_updateSearchQuery = function( r, newText ) { |
| 955 | | - document.getElementById( r.searchbox ).value = newText; |
| 956 | | - r.query = newText; |
| 957 | | -}; |
| 958 | | - |
| 959 | | - |
| 960 | | -/******************** |
| 961 | | - * Mouse events |
| 962 | | - ********************/ |
| 963 | | - |
| 964 | | -/** Mouse over the container */ |
| 965 | | -window.os_eventMouseover = function( srcId, e ) { |
| 966 | | - var targ = os_getTarget( e ); |
| 967 | | - var r = os_map[srcId]; |
| 968 | | - if( r == null || !os_mouse_moved ) { |
| 969 | | - return; // not our event |
| 970 | | - } |
| 971 | | - var num = os_getNumberSuffix( targ.id ); |
| 972 | | - if( num >= 0 ) { |
| 973 | | - os_changeHighlight( r, r.selected, num, false ); |
| 974 | | - } |
| 975 | | -}; |
| 976 | | - |
| 977 | | -/* Get row where the event occured (from its id) */ |
| 978 | | -window.os_getNumberSuffix = function( id ) { |
| 979 | | - var num = id.substring( id.length - 2 ); |
| 980 | | - if( !( num.charAt( 0 ) >= '0' && num.charAt( 0 ) <= '9' ) ) { |
| 981 | | - num = num.substring( 1 ); |
| 982 | | - } |
| 983 | | - if( os_isNumber( num ) ) { |
| 984 | | - return parseInt( num ); |
| 985 | | - } else { |
| 986 | | - return -1; |
| 987 | | - } |
| 988 | | -}; |
| 989 | | - |
| 990 | | -/** Save mouse move as last action */ |
| 991 | | -window.os_eventMousemove = function( srcId, e ) { |
| 992 | | - os_mouse_moved = true; |
| 993 | | -}; |
| 994 | | - |
| 995 | | -/** Mouse button held down, register possible click */ |
| 996 | | -window.os_eventMousedown = function( srcId, e ) { |
| 997 | | - var targ = os_getTarget( e ); |
| 998 | | - var r = os_map[srcId]; |
| 999 | | - if( r == null ) { |
| 1000 | | - return; // not our event |
| 1001 | | - } |
| 1002 | | - var num = os_getNumberSuffix( targ.id ); |
| 1003 | | - |
| 1004 | | - os_mouse_pressed = true; |
| 1005 | | - if( num >= 0 ) { |
| 1006 | | - os_mouse_num = num; |
| 1007 | | - // os_updateSearchQuery( r, r.results[num] ); |
| 1008 | | - } |
| 1009 | | - // keep the focus on the search field |
| 1010 | | - document.getElementById( r.searchbox ).focus(); |
| 1011 | | - |
| 1012 | | - return false; // prevents selection |
| 1013 | | -}; |
| 1014 | | - |
| 1015 | | -/** Mouse button released, check for click on some row */ |
| 1016 | | -window.os_eventMouseup = function( srcId, e ) { |
| 1017 | | - var targ = os_getTarget( e ); |
| 1018 | | - var r = os_map[srcId]; |
| 1019 | | - if( r == null ) { |
| 1020 | | - return; // not our event |
| 1021 | | - } |
| 1022 | | - var num = os_getNumberSuffix( targ.id ); |
| 1023 | | - |
| 1024 | | - if( num >= 0 && os_mouse_num == num ) { |
| 1025 | | - os_updateSearchQuery( r, r.results[num] ); |
| 1026 | | - os_hideResults( r ); |
| 1027 | | - document.getElementById( r.searchform ).submit(); |
| 1028 | | - } |
| 1029 | | - os_mouse_pressed = false; |
| 1030 | | - // keep the focus on the search field |
| 1031 | | - document.getElementById( r.searchbox ).focus(); |
| 1032 | | -}; |
| 1033 | | - |
| 1034 | | -/** Toggle stuff seems to be dead code? */ |
| 1035 | | - |
| 1036 | | -/** Return the span element that contains the toggle link */ |
| 1037 | | -window.os_createToggle = function( r, className ) { |
| 1038 | | - var t = document.createElement( 'span' ); |
| 1039 | | - t.className = className; |
| 1040 | | - t.setAttribute( 'id', r.toggle ); |
| 1041 | | - var link = document.createElement( 'a' ); |
| 1042 | | - link.setAttribute( 'href', 'javascript:void(0);' ); |
| 1043 | | - link.onclick = function() { os_toggle( r.searchbox, r.searchform ); }; |
| 1044 | | - var msg = document.createTextNode( wgMWSuggestMessages[0] ); |
| 1045 | | - link.appendChild( msg ); |
| 1046 | | - t.appendChild( link ); |
| 1047 | | - return t; |
| 1048 | | -}; |
| 1049 | | - |
| 1050 | | -/** Call when user clicks on some of the toggle links */ |
| 1051 | | -window.os_toggle = function( inputId, formName ) { |
| 1052 | | - r = os_map[inputId]; |
| 1053 | | - var msg = ''; |
| 1054 | | - if( r == null ) { |
| 1055 | | - os_enableSuggestionsOn( inputId, formName ); |
| 1056 | | - r = os_map[inputId]; |
| 1057 | | - msg = wgMWSuggestMessages[0]; |
| 1058 | | - } else{ |
| 1059 | | - os_disableSuggestionsOn( inputId, formName ); |
| 1060 | | - msg = wgMWSuggestMessages[1]; |
| 1061 | | - } |
| 1062 | | - // change message |
| 1063 | | - var link = document.getElementById( r.toggle ).firstChild; |
| 1064 | | - link.replaceChild( document.createTextNode( msg ), link.firstChild ); |
| 1065 | | -}; |
| 1066 | | - |
| 1067 | | -hookEvent( 'load', os_MWSuggestInit ); |
| | 67 | +// $("#searchInput").data("autocomplete")._resizeMenu = function () { |
| | 68 | +// var ul = this.menu.element; |
| | 69 | +// ul.width( "" ); |
| | 70 | +// ul.children().each(function() { |
| | 71 | +// console.log($(this).width('').width()); |
| | 72 | +// }); |
| | 73 | +// //Fix weird webkit reflow bug |
| | 74 | +// // window.setTimeout(function(ul) { |
| | 75 | +// // var ul = $('.ui-autocomplete'); |
| | 76 | +// // ul.outerWidth( Math.max( |
| | 77 | +// // ul.width( "" ).outerWidth(), |
| | 78 | +// // this.element.outerWidth() |
| | 79 | +// // ) ); |
| | 80 | +// // }, 80); |
| | 81 | +// // window.setTimeout(function(ul) { |
| | 82 | +// var ht = ul[0].offsetWidth |
| | 83 | +// // }, 10); |
| | 84 | +// // var children = ul.children(); |
| | 85 | +// // ul.empty(); |
| | 86 | +// // ul.append(children); |
| | 87 | +// |
| | 88 | +// |
| | 89 | +// } |
| | 90 | +/* Teardown, called when things like SimpleSearch need to disable MWSuggest */ |
| | 91 | +window.os_MWSuggestTeardown = function() { |
| | 92 | + $("#searchInput").autocomplete( "destroy" ); |
| | 93 | +}; |
| \ No newline at end of file |
| Index: trunk/phase3/resources/Resources.php |
| — | — | @@ -652,7 +652,7 @@ |
| 653 | 653 | 'scripts' => 'common/mwsuggest.js', |
| 654 | 654 | 'remoteBasePath' => $GLOBALS['wgStylePath'], |
| 655 | 655 | 'localBasePath' => $GLOBALS['wgStyleDirectory'], |
| 656 | | - 'dependencies' => array( 'mediawiki.legacy.wikibits', 'jquery.client' ), |
| | 656 | + 'dependencies' => array( 'mediawiki.legacy.wikibits', 'jquery.client', 'jquery.ui.autocomplete', 'jquery.suggestions' ), |
| 657 | 657 | 'messages' => array( 'search-mwsuggest-enabled', 'search-mwsuggest-disabled' ), |
| 658 | 658 | ), |
| 659 | 659 | 'mediawiki.legacy.preview' => array( |
| Index: trunk/phase3/resources/jquery.ui/themes/vector/jquery.ui.autocomplete.css |
| — | — | @@ -13,6 +13,7 @@ |
| 14 | 14 | padding: 2px; |
| 15 | 15 | margin: 0; |
| 16 | 16 | display:block; |
| | 17 | + float: left; |
| 17 | 18 | } |
| 18 | 19 | .ui-menu .ui-menu { |
| 19 | 20 | margin-top: -3px; |
| Index: trunk/phase3/resources/jquery.ui/themes/default/jquery.ui.autocomplete.css |
| — | — | @@ -13,6 +13,7 @@ |
| 14 | 14 | padding: 2px; |
| 15 | 15 | margin: 0; |
| 16 | 16 | display:block; |
| | 17 | + float: left; |
| 17 | 18 | } |
| 18 | 19 | .ui-menu .ui-menu { |
| 19 | 20 | margin-top: -3px; |
| Index: trunk/phase3/resources/jquery.ui/jquery.ui.autocomplete.js |
| — | — | @@ -1,5 +1,5 @@ |
| 2 | 2 | /* |
| 3 | | - * jQuery UI Autocomplete 1.8.11 |
| | 3 | + * jQuery UI Autocomplete 1.8.14 |
| 4 | 4 | * |
| 5 | 5 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) |
| 6 | 6 | * Dual licensed under the MIT or GPL Version 2 licenses. |
| — | — | @@ -352,8 +352,9 @@ |
| 353 | 353 | }, |
| 354 | 354 | |
| 355 | 355 | _suggest: function( items ) { |
| 356 | | - var ul = this.menu.element |
| 357 | | - .empty() |
| | 356 | + var ul = this.menu.element; |
| | 357 | + ul.children().remove(); |
| | 358 | + ul.empty() |
| 358 | 359 | .zIndex( this.element.zIndex() + 1 ); |
| 359 | 360 | this._renderMenu( ul, items ); |
| 360 | 361 | // TODO refresh should check if the active item is still in the dom, removing the need for a manual deactivate |
| — | — | @@ -470,10 +471,10 @@ |
| 471 | 472 | var self = this; |
| 472 | 473 | |
| 473 | 474 | // don't refresh list items that are already adapted |
| 474 | | - var items = this.element.children("li:not(.ui-menu-item):has(a)") |
| 475 | | - .addClass("ui-menu-item") |
| 476 | | - .attr("role", "menuitem"); |
| 477 | | - |
| | 475 | + var items = this.element.children("li:not(.ui-menu-item):has(a)") |
| | 476 | + .addClass("ui-menu-item") |
| | 477 | + .attr("role", "menuitem"); |
| | 478 | + // |
| 478 | 479 | items.children("a") |
| 479 | 480 | .addClass("ui-corner-all") |
| 480 | 481 | .attr("tabindex", -1) |
| — | — | @@ -490,12 +491,12 @@ |
| 491 | 492 | this.deactivate(); |
| 492 | 493 | if (this.hasScroll()) { |
| 493 | 494 | var offset = item.offset().top - this.element.offset().top, |
| 494 | | - scroll = this.element.attr("scrollTop"), |
| | 495 | + scroll = this.element.scrollTop(), |
| 495 | 496 | elementHeight = this.element.height(); |
| 496 | 497 | if (offset < 0) { |
| 497 | | - this.element.attr("scrollTop", scroll + offset); |
| | 498 | + this.element.scrollTop( scroll + offset); |
| 498 | 499 | } else if (offset >= elementHeight) { |
| 499 | | - this.element.attr("scrollTop", scroll + offset - elementHeight + item.height()); |
| | 500 | + this.element.scrollTop( scroll + offset - elementHeight + item.height()); |
| 500 | 501 | } |
| 501 | 502 | } |
| 502 | 503 | this.active = item.eq(0) |
| — | — | @@ -601,7 +602,7 @@ |
| 602 | 603 | }, |
| 603 | 604 | |
| 604 | 605 | hasScroll: function() { |
| 605 | | - return this.element.height() < this.element.attr("scrollHeight"); |
| | 606 | + return this.element.height() < this.element[ $.fn.prop ? "prop" : "attr" ]("scrollHeight"); |
| 606 | 607 | }, |
| 607 | 608 | |
| 608 | 609 | select: function( event ) { |