| /* |
| Copyright (c) 2008, Yahoo! Inc. All rights reserved. |
| Code licensed under the BSD License: |
| http://developer.yahoo.net/yui/license.txt |
| version: 2.6.0 |
| */ |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // YAHOO.widget.DataSource Backwards Compatibility |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| YAHOO.widget.DS_JSArray = YAHOO.util.LocalDataSource; |
| |
| YAHOO.widget.DS_JSFunction = YAHOO.util.FunctionDataSource; |
| |
| YAHOO.widget.DS_XHR = function(sScriptURI, aSchema, oConfigs) { |
| var DS = new YAHOO.util.XHRDataSource(sScriptURI, oConfigs); |
| DS._aDeprecatedSchema = aSchema; |
| return DS; |
| }; |
| |
| YAHOO.widget.DS_ScriptNode = function(sScriptURI, aSchema, oConfigs) { |
| var DS = new YAHOO.util.ScriptNodeDataSource(sScriptURI, oConfigs); |
| DS._aDeprecatedSchema = aSchema; |
| return DS; |
| }; |
| |
| YAHOO.widget.DS_XHR.TYPE_JSON = YAHOO.util.DataSourceBase.TYPE_JSON; |
| YAHOO.widget.DS_XHR.TYPE_XML = YAHOO.util.DataSourceBase.TYPE_XML; |
| YAHOO.widget.DS_XHR.TYPE_FLAT = YAHOO.util.DataSourceBase.TYPE_TEXT; |
| |
| // TODO: widget.DS_ScriptNode.scriptCallbackParam |
| |
| |
| |
| /** |
| * The AutoComplete control provides the front-end logic for text-entry suggestion and |
| * completion functionality. |
| * |
| * @module autocomplete |
| * @requires yahoo, dom, event, datasource |
| * @optional animation |
| * @namespace YAHOO.widget |
| * @title AutoComplete Widget |
| */ |
| |
| /****************************************************************************/ |
| /****************************************************************************/ |
| /****************************************************************************/ |
| |
| /** |
| * The AutoComplete class provides the customizable functionality of a plug-and-play DHTML |
| * auto completion widget. Some key features: |
| * <ul> |
| * <li>Navigate with up/down arrow keys and/or mouse to pick a selection</li> |
| * <li>The drop down container can "roll down" or "fly out" via configurable |
| * animation</li> |
| * <li>UI look-and-feel customizable through CSS, including container |
| * attributes, borders, position, fonts, etc</li> |
| * </ul> |
| * |
| * @class AutoComplete |
| * @constructor |
| * @param elInput {HTMLElement} DOM element reference of an input field. |
| * @param elInput {String} String ID of an input field. |
| * @param elContainer {HTMLElement} DOM element reference of an existing DIV. |
| * @param elContainer {String} String ID of an existing DIV. |
| * @param oDataSource {YAHOO.widget.DataSource} DataSource instance. |
| * @param oConfigs {Object} (optional) Object literal of configuration params. |
| */ |
| YAHOO.widget.AutoComplete = function(elInput,elContainer,oDataSource,oConfigs) { |
| if(elInput && elContainer && oDataSource) { |
| // Validate DataSource |
| if(oDataSource instanceof YAHOO.util.DataSourceBase) { |
| this.dataSource = oDataSource; |
| } |
| else { |
| YAHOO.log("Could not instantiate AutoComplete due to an invalid DataSource", "error", this.toString()); |
| return; |
| } |
| |
| // YAHOO.widget.DataSource schema backwards compatibility |
| // Converted deprecated schema into supported schema |
| // First assume key data is held in position 0 of results array |
| this.key = 0; |
| var schema = oDataSource.responseSchema; |
| // An old school schema has been defined in the deprecated DataSource constructor |
| if(oDataSource._aDeprecatedSchema) { |
| var aDeprecatedSchema = oDataSource._aDeprecatedSchema; |
| if(YAHOO.lang.isArray(aDeprecatedSchema)) { |
| |
| if((oDataSource.responseType === YAHOO.util.DataSourceBase.TYPE_JSON) || |
| (oDataSource.responseType === YAHOO.util.DataSourceBase.TYPE_UNKNOWN)) { // Used to default to unknown |
| // Store the resultsList |
| schema.resultsList = aDeprecatedSchema[0]; |
| // Store the key |
| this.key = aDeprecatedSchema[1]; |
| // Only resultsList and key are defined, so grab all the data |
| schema.fields = (aDeprecatedSchema.length < 3) ? null : aDeprecatedSchema.slice(1); |
| } |
| else if(oDataSource.responseType === YAHOO.util.DataSourceBase.TYPE_XML) { |
| schema.resultNode = aDeprecatedSchema[0]; |
| this.key = aDeprecatedSchema[1]; |
| schema.fields = aDeprecatedSchema.slice(1); |
| } |
| else if(oDataSource.responseType === YAHOO.util.DataSourceBase.TYPE_TEXT) { |
| schema.recordDelim = aDeprecatedSchema[0]; |
| schema.fieldDelim = aDeprecatedSchema[1]; |
| } |
| oDataSource.responseSchema = schema; |
| } |
| } |
| |
| // Validate input element |
| if(YAHOO.util.Dom.inDocument(elInput)) { |
| if(YAHOO.lang.isString(elInput)) { |
| this._sName = "instance" + YAHOO.widget.AutoComplete._nIndex + " " + elInput; |
| this._elTextbox = document.getElementById(elInput); |
| } |
| else { |
| this._sName = (elInput.id) ? |
| "instance" + YAHOO.widget.AutoComplete._nIndex + " " + elInput.id: |
| "instance" + YAHOO.widget.AutoComplete._nIndex; |
| this._elTextbox = elInput; |
| } |
| YAHOO.util.Dom.addClass(this._elTextbox, "yui-ac-input"); |
| } |
| else { |
| YAHOO.log("Could not instantiate AutoComplete due to an invalid input element", "error", this.toString()); |
| return; |
| } |
| |
| // Validate container element |
| if(YAHOO.util.Dom.inDocument(elContainer)) { |
| if(YAHOO.lang.isString(elContainer)) { |
| this._elContainer = document.getElementById(elContainer); |
| } |
| else { |
| this._elContainer = elContainer; |
| } |
| if(this._elContainer.style.display == "none") { |
| YAHOO.log("The container may not display properly if display is set to \"none\" in CSS", "warn", this.toString()); |
| } |
| |
| // For skinning |
| var elParent = this._elContainer.parentNode; |
| var elTag = elParent.tagName.toLowerCase(); |
| if(elTag == "div") { |
| YAHOO.util.Dom.addClass(elParent, "yui-ac"); |
| } |
| else { |
| YAHOO.log("Could not find the wrapper element for skinning", "warn", this.toString()); |
| } |
| } |
| else { |
| YAHOO.log("Could not instantiate AutoComplete due to an invalid container element", "error", this.toString()); |
| return; |
| } |
| |
| // Default applyLocalFilter setting is to enable for local sources |
| if(this.dataSource.dataType === YAHOO.util.DataSourceBase.TYPE_LOCAL) { |
| this.applyLocalFilter = true; |
| } |
| |
| // Set any config params passed in to override defaults |
| if(oConfigs && (oConfigs.constructor == Object)) { |
| for(var sConfig in oConfigs) { |
| if(sConfig) { |
| this[sConfig] = oConfigs[sConfig]; |
| } |
| } |
| } |
| |
| // Initialization sequence |
| this._initContainerEl(); |
| this._initProps(); |
| this._initListEl(); |
| this._initContainerHelperEls(); |
| |
| // Set up events |
| var oSelf = this; |
| var elTextbox = this._elTextbox; |
| |
| // Dom events |
| YAHOO.util.Event.addListener(elTextbox,"keyup",oSelf._onTextboxKeyUp,oSelf); |
| YAHOO.util.Event.addListener(elTextbox,"keydown",oSelf._onTextboxKeyDown,oSelf); |
| YAHOO.util.Event.addListener(elTextbox,"focus",oSelf._onTextboxFocus,oSelf); |
| YAHOO.util.Event.addListener(elTextbox,"blur",oSelf._onTextboxBlur,oSelf); |
| YAHOO.util.Event.addListener(elContainer,"mouseover",oSelf._onContainerMouseover,oSelf); |
| YAHOO.util.Event.addListener(elContainer,"mouseout",oSelf._onContainerMouseout,oSelf); |
| YAHOO.util.Event.addListener(elContainer,"click",oSelf._onContainerClick,oSelf); |
| YAHOO.util.Event.addListener(elContainer,"scroll",oSelf._onContainerScroll,oSelf); |
| YAHOO.util.Event.addListener(elContainer,"resize",oSelf._onContainerResize,oSelf); |
| YAHOO.util.Event.addListener(elTextbox,"keypress",oSelf._onTextboxKeyPress,oSelf); |
| YAHOO.util.Event.addListener(window,"unload",oSelf._onWindowUnload,oSelf); |
| |
| // Custom events |
| this.textboxFocusEvent = new YAHOO.util.CustomEvent("textboxFocus", this); |
| this.textboxKeyEvent = new YAHOO.util.CustomEvent("textboxKey", this); |
| this.dataRequestEvent = new YAHOO.util.CustomEvent("dataRequest", this); |
| this.dataReturnEvent = new YAHOO.util.CustomEvent("dataReturn", this); |
| this.dataErrorEvent = new YAHOO.util.CustomEvent("dataError", this); |
| this.containerPopulateEvent = new YAHOO.util.CustomEvent("containerPopulate", this); |
| this.containerExpandEvent = new YAHOO.util.CustomEvent("containerExpand", this); |
| this.typeAheadEvent = new YAHOO.util.CustomEvent("typeAhead", this); |
| this.itemMouseOverEvent = new YAHOO.util.CustomEvent("itemMouseOver", this); |
| this.itemMouseOutEvent = new YAHOO.util.CustomEvent("itemMouseOut", this); |
| this.itemArrowToEvent = new YAHOO.util.CustomEvent("itemArrowTo", this); |
| this.itemArrowFromEvent = new YAHOO.util.CustomEvent("itemArrowFrom", this); |
| this.itemSelectEvent = new YAHOO.util.CustomEvent("itemSelect", this); |
| this.unmatchedItemSelectEvent = new YAHOO.util.CustomEvent("unmatchedItemSelect", this); |
| this.selectionEnforceEvent = new YAHOO.util.CustomEvent("selectionEnforce", this); |
| this.containerCollapseEvent = new YAHOO.util.CustomEvent("containerCollapse", this); |
| this.textboxBlurEvent = new YAHOO.util.CustomEvent("textboxBlur", this); |
| this.textboxChangeEvent = new YAHOO.util.CustomEvent("textboxChange", this); |
| |
| // Finish up |
| elTextbox.setAttribute("autocomplete","off"); |
| YAHOO.widget.AutoComplete._nIndex++; |
| YAHOO.log("AutoComplete initialized","info",this.toString()); |
| } |
| // Required arguments were not found |
| else { |
| YAHOO.log("Could not instantiate AutoComplete due invalid arguments", "error", this.toString()); |
| } |
| }; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Public member variables |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * The DataSource object that encapsulates the data used for auto completion. |
| * This object should be an inherited object from YAHOO.widget.DataSource. |
| * |
| * @property dataSource |
| * @type YAHOO.widget.DataSource |
| */ |
| YAHOO.widget.AutoComplete.prototype.dataSource = null; |
| |
| /** |
| * By default, results from local DataSources will pass through the filterResults |
| * method to apply a client-side matching algorithm. |
| * |
| * @property applyLocalFilter |
| * @type Boolean |
| * @default true for local arrays and json, otherwise false |
| */ |
| YAHOO.widget.AutoComplete.prototype.applyLocalFilter = null; |
| |
| /** |
| * When applyLocalFilter is true, the local filtering algorthim can have case sensitivity |
| * enabled. |
| * |
| * @property queryMatchCase |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryMatchCase = false; |
| |
| /** |
| * When applyLocalFilter is true, results can be locally filtered to return |
| * matching strings that "contain" the query string rather than simply "start with" |
| * the query string. |
| * |
| * @property queryMatchContains |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryMatchContains = false; |
| |
| /** |
| * Enables query subset matching. When the DataSource's cache is enabled and queryMatchSubset is |
| * true, substrings of queries will return matching cached results. For |
| * instance, if the first query is for "abc" susequent queries that start with |
| * "abc", like "abcd", will be queried against the cache, and not the live data |
| * source. Recommended only for DataSources that return comprehensive results |
| * for queries with very few characters. |
| * |
| * @property queryMatchSubset |
| * @type Boolean |
| * @default false |
| * |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryMatchSubset = false; |
| |
| /** |
| * Number of characters that must be entered before querying for results. A negative value |
| * effectively turns off the widget. A value of 0 allows queries of null or empty string |
| * values. |
| * |
| * @property minQueryLength |
| * @type Number |
| * @default 1 |
| */ |
| YAHOO.widget.AutoComplete.prototype.minQueryLength = 1; |
| |
| /** |
| * Maximum number of results to display in results container. |
| * |
| * @property maxResultsDisplayed |
| * @type Number |
| * @default 10 |
| */ |
| YAHOO.widget.AutoComplete.prototype.maxResultsDisplayed = 10; |
| |
| /** |
| * Number of seconds to delay before submitting a query request. If a query |
| * request is received before a previous one has completed its delay, the |
| * previous request is cancelled and the new request is set to the delay. If |
| * typeAhead is also enabled, this value must always be less than the typeAheadDelay |
| * in order to avoid certain race conditions. |
| * |
| * @property queryDelay |
| * @type Number |
| * @default 0.2 |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryDelay = 0.2; |
| |
| /** |
| * If typeAhead is true, number of seconds to delay before updating input with |
| * typeAhead value. In order to prevent certain race conditions, this value must |
| * always be greater than the queryDelay. |
| * |
| * @property typeAheadDelay |
| * @type Number |
| * @default 0.5 |
| */ |
| YAHOO.widget.AutoComplete.prototype.typeAheadDelay = 0.5; |
| |
| /** |
| * When IME usage is detected, AutoComplete will switch to querying the input |
| * value at the given interval rather than per key event. |
| * |
| * @property queryInterval |
| * @type Number |
| * @default 500 |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryInterval = 500; |
| |
| /** |
| * Class name of a highlighted item within results container. |
| * |
| * @property highlightClassName |
| * @type String |
| * @default "yui-ac-highlight" |
| */ |
| YAHOO.widget.AutoComplete.prototype.highlightClassName = "yui-ac-highlight"; |
| |
| /** |
| * Class name of a pre-highlighted item within results container. |
| * |
| * @property prehighlightClassName |
| * @type String |
| */ |
| YAHOO.widget.AutoComplete.prototype.prehighlightClassName = null; |
| |
| /** |
| * Query delimiter. A single character separator for multiple delimited |
| * selections. Multiple delimiter characteres may be defined as an array of |
| * strings. A null value or empty string indicates that query results cannot |
| * be delimited. This feature is not recommended if you need forceSelection to |
| * be true. |
| * |
| * @property delimChar |
| * @type String | String[] |
| */ |
| YAHOO.widget.AutoComplete.prototype.delimChar = null; |
| |
| /** |
| * Whether or not the first item in results container should be automatically highlighted |
| * on expand. |
| * |
| * @property autoHighlight |
| * @type Boolean |
| * @default true |
| */ |
| YAHOO.widget.AutoComplete.prototype.autoHighlight = true; |
| |
| /** |
| * If autohighlight is enabled, whether or not the input field should be automatically updated |
| * with the first query result as the user types, auto-selecting the substring portion |
| * of the first result that the user has not yet typed. |
| * |
| * @property typeAhead |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.typeAhead = false; |
| |
| /** |
| * Whether or not to animate the expansion/collapse of the results container in the |
| * horizontal direction. |
| * |
| * @property animHoriz |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.animHoriz = false; |
| |
| /** |
| * Whether or not to animate the expansion/collapse of the results container in the |
| * vertical direction. |
| * |
| * @property animVert |
| * @type Boolean |
| * @default true |
| */ |
| YAHOO.widget.AutoComplete.prototype.animVert = true; |
| |
| /** |
| * Speed of container expand/collapse animation, in seconds.. |
| * |
| * @property animSpeed |
| * @type Number |
| * @default 0.3 |
| */ |
| YAHOO.widget.AutoComplete.prototype.animSpeed = 0.3; |
| |
| /** |
| * Whether or not to force the user's selection to match one of the query |
| * results. Enabling this feature essentially transforms the input field into a |
| * <select> field. This feature is not recommended with delimiter character(s) |
| * defined. |
| * |
| * @property forceSelection |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.forceSelection = false; |
| |
| /** |
| * Whether or not to allow browsers to cache user-typed input in the input |
| * field. Disabling this feature will prevent the widget from setting the |
| * autocomplete="off" on the input field. When autocomplete="off" |
| * and users click the back button after form submission, user-typed input can |
| * be prefilled by the browser from its cache. This caching of user input may |
| * not be desired for sensitive data, such as credit card numbers, in which |
| * case, implementers should consider setting allowBrowserAutocomplete to false. |
| * |
| * @property allowBrowserAutocomplete |
| * @type Boolean |
| * @default true |
| */ |
| YAHOO.widget.AutoComplete.prototype.allowBrowserAutocomplete = true; |
| |
| /** |
| * Enabling this feature prevents the toggling of the container to a collapsed state. |
| * Setting to true does not automatically trigger the opening of the container. |
| * Implementers are advised to pre-load the container with an explicit "sendQuery()" call. |
| * |
| * @property alwaysShowContainer |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.alwaysShowContainer = false; |
| |
| /** |
| * Whether or not to use an iFrame to layer over Windows form elements in |
| * IE. Set to true only when the results container will be on top of a |
| * <select> field in IE and thus exposed to the IE z-index bug (i.e., |
| * 5.5 < IE < 7). |
| * |
| * @property useIFrame |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.useIFrame = false; |
| |
| /** |
| * Whether or not the results container should have a shadow. |
| * |
| * @property useShadow |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.useShadow = false; |
| |
| /** |
| * Whether or not the input field should be updated with selections. |
| * |
| * @property supressInputUpdate |
| * @type Boolean |
| * @default false |
| */ |
| YAHOO.widget.AutoComplete.prototype.suppressInputUpdate = false; |
| |
| /** |
| * For backward compatibility to pre-2.6.0 formatResults() signatures, setting |
| * resultsTypeList to true will take each object literal result returned by |
| * DataSource and flatten into an array. |
| * |
| * @property resultTypeList |
| * @type Boolean |
| * @default true |
| */ |
| YAHOO.widget.AutoComplete.prototype.resultTypeList = true; |
| |
| /** |
| * For XHR DataSources, AutoComplete will automatically insert a "?" between the server URI and |
| * the "query" param/value pair. To prevent this behavior, implementers should |
| * set this value to false. To more fully customize the query syntax, implementers |
| * should override the generateRequest() method. |
| * |
| * @property queryQuestionMark |
| * @type Boolean |
| * @default true |
| */ |
| YAHOO.widget.AutoComplete.prototype.queryQuestionMark = true; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Public methods |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Public accessor to the unique name of the AutoComplete instance. |
| * |
| * @method toString |
| * @return {String} Unique name of the AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.toString = function() { |
| return "AutoComplete " + this._sName; |
| }; |
| |
| /** |
| * Returns DOM reference to input element. |
| * |
| * @method getInputEl |
| * @return {HTMLELement} DOM reference to input element. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getInputEl = function() { |
| return this._elTextbox; |
| }; |
| |
| /** |
| * Returns DOM reference to container element. |
| * |
| * @method getContainerEl |
| * @return {HTMLELement} DOM reference to container element. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getContainerEl = function() { |
| return this._elContainer; |
| }; |
| |
| /** |
| * Returns true if widget instance is currently focused. |
| * |
| * @method isFocused |
| * @return {Boolean} Returns true if widget instance is currently focused. |
| */ |
| YAHOO.widget.AutoComplete.prototype.isFocused = function() { |
| return (this._bFocused === null) ? false : this._bFocused; |
| }; |
| |
| /** |
| * Returns true if container is in an expanded state, false otherwise. |
| * |
| * @method isContainerOpen |
| * @return {Boolean} Returns true if container is in an expanded state, false otherwise. |
| */ |
| YAHOO.widget.AutoComplete.prototype.isContainerOpen = function() { |
| return this._bContainerOpen; |
| }; |
| |
| /** |
| * Public accessor to the <ul> element that displays query results within the results container. |
| * |
| * @method getListEl |
| * @return {HTMLElement[]} Reference to <ul> element within the results container. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getListEl = function() { |
| return this._elList; |
| }; |
| |
| /** |
| * Public accessor to the matching string associated with a given <li> result. |
| * |
| * @method getListItemMatch |
| * @param elListItem {HTMLElement} Reference to <LI> element. |
| * @return {String} Matching string. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getListItemMatch = function(elListItem) { |
| if(elListItem._sResultMatch) { |
| return elListItem._sResultMatch; |
| } |
| else { |
| return null; |
| } |
| }; |
| |
| /** |
| * Public accessor to the result data associated with a given <li> result. |
| * |
| * @method getListItemData |
| * @param elListItem {HTMLElement} Reference to <LI> element. |
| * @return {Object} Result data. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getListItemData = function(elListItem) { |
| if(elListItem._oResultData) { |
| return elListItem._oResultData; |
| } |
| else { |
| return null; |
| } |
| }; |
| |
| /** |
| * Public accessor to the index of the associated with a given <li> result. |
| * |
| * @method getListItemIndex |
| * @param elListItem {HTMLElement} Reference to <LI> element. |
| * @return {Number} Index. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getListItemIndex = function(elListItem) { |
| if(YAHOO.lang.isNumber(elListItem._nItemIndex)) { |
| return elListItem._nItemIndex; |
| } |
| else { |
| return null; |
| } |
| }; |
| |
| /** |
| * Sets HTML markup for the results container header. This markup will be |
| * inserted within a <div> tag with a class of "yui-ac-hd". |
| * |
| * @method setHeader |
| * @param sHeader {String} HTML markup for results container header. |
| */ |
| YAHOO.widget.AutoComplete.prototype.setHeader = function(sHeader) { |
| if(this._elHeader) { |
| var elHeader = this._elHeader; |
| if(sHeader) { |
| elHeader.innerHTML = sHeader; |
| elHeader.style.display = "block"; |
| } |
| else { |
| elHeader.innerHTML = ""; |
| elHeader.style.display = "none"; |
| } |
| } |
| }; |
| |
| /** |
| * Sets HTML markup for the results container footer. This markup will be |
| * inserted within a <div> tag with a class of "yui-ac-ft". |
| * |
| * @method setFooter |
| * @param sFooter {String} HTML markup for results container footer. |
| */ |
| YAHOO.widget.AutoComplete.prototype.setFooter = function(sFooter) { |
| if(this._elFooter) { |
| var elFooter = this._elFooter; |
| if(sFooter) { |
| elFooter.innerHTML = sFooter; |
| elFooter.style.display = "block"; |
| } |
| else { |
| elFooter.innerHTML = ""; |
| elFooter.style.display = "none"; |
| } |
| } |
| }; |
| |
| /** |
| * Sets HTML markup for the results container body. This markup will be |
| * inserted within a <div> tag with a class of "yui-ac-bd". |
| * |
| * @method setBody |
| * @param sBody {String} HTML markup for results container body. |
| */ |
| YAHOO.widget.AutoComplete.prototype.setBody = function(sBody) { |
| if(this._elBody) { |
| var elBody = this._elBody; |
| YAHOO.util.Event.purgeElement(elBody, true); |
| if(sBody) { |
| elBody.innerHTML = sBody; |
| elBody.style.display = "block"; |
| } |
| else { |
| elBody.innerHTML = ""; |
| elBody.style.display = "none"; |
| } |
| this._elList = null; |
| } |
| }; |
| |
| /** |
| * A function that converts an AutoComplete query into a request value which is then |
| * passed to the DataSource's sendRequest method in order to retrieve data for |
| * the query. By default, returns a String with the syntax: "query={query}" |
| * Implementers can customize this method for custom request syntaxes. |
| * |
| * @method generateRequest |
| * @param sQuery {String} Query string |
| */ |
| YAHOO.widget.AutoComplete.prototype.generateRequest = function(sQuery) { |
| var dataType = this.dataSource.dataType; |
| |
| // Transform query string in to a request for remote data |
| // By default, local data doesn't need a transformation, just passes along the query as is. |
| if(dataType === YAHOO.util.DataSourceBase.TYPE_XHR) { |
| // By default, XHR GET requests look like "{scriptURI}?{scriptQueryParam}={sQuery}&{scriptQueryAppend}" |
| if(!this.dataSource.connMethodPost) { |
| sQuery = (this.queryQuestionMark ? "?" : "") + (this.dataSource.scriptQueryParam || "query") + "=" + sQuery + |
| (this.dataSource.scriptQueryAppend ? ("&" + this.dataSource.scriptQueryAppend) : ""); |
| } |
| // By default, XHR POST bodies are sent to the {scriptURI} like "{scriptQueryParam}={sQuery}&{scriptQueryAppend}" |
| else { |
| sQuery = (this.dataSource.scriptQueryParam || "query") + "=" + sQuery + |
| (this.dataSource.scriptQueryAppend ? ("&" + this.dataSource.scriptQueryAppend) : ""); |
| } |
| } |
| // By default, remote script node requests look like "{scriptURI}&{scriptCallbackParam}={callbackString}&{scriptQueryParam}={sQuery}&{scriptQueryAppend}" |
| else if(dataType === YAHOO.util.DataSourceBase.TYPE_SCRIPTNODE) { |
| sQuery = "&" + (this.dataSource.scriptQueryParam || "query") + "=" + sQuery + |
| (this.dataSource.scriptQueryAppend ? ("&" + this.dataSource.scriptQueryAppend) : ""); |
| } |
| |
| return sQuery; |
| }; |
| |
| /** |
| * Makes query request to the DataSource. |
| * |
| * @method sendQuery |
| * @param sQuery {String} Query string. |
| */ |
| YAHOO.widget.AutoComplete.prototype.sendQuery = function(sQuery) { |
| // Adjust programatically sent queries to look like they input by user |
| // when delimiters are enabled |
| var newQuery = (this.delimChar) ? this._elTextbox.value + sQuery : sQuery; |
| this._sendQuery(newQuery); |
| }; |
| |
| /** |
| * Collapses container. |
| * |
| * @method collapseContainer |
| */ |
| YAHOO.widget.AutoComplete.prototype.collapseContainer = function() { |
| this._toggleContainer(false); |
| }; |
| |
| /** |
| * Handles subset matching for when queryMatchSubset is enabled. |
| * |
| * @method getSubsetMatches |
| * @param sQuery {String} Query string. |
| * @return {Object} oParsedResponse or null. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getSubsetMatches = function(sQuery) { |
| var subQuery, oCachedResponse, subRequest; |
| // Loop through substrings of each cached element's query property... |
| for(var i = sQuery.length; i >= this.minQueryLength ; i--) { |
| subRequest = this.generateRequest(sQuery.substr(0,i)); |
| this.dataRequestEvent.fire(this, subQuery, subRequest); |
| YAHOO.log("Searching for query subset \"" + subQuery + "\" in cache", "info", this.toString()); |
| |
| // If a substring of the query is found in the cache |
| oCachedResponse = this.dataSource.getCachedResponse(subRequest); |
| if(oCachedResponse) { |
| YAHOO.log("Found match for query subset \"" + subQuery + "\": " + YAHOO.lang.dump(oCachedResponse), "info", this.toString()); |
| return this.filterResults.apply(this.dataSource, [sQuery, oCachedResponse, oCachedResponse, {scope:this}]); |
| } |
| } |
| YAHOO.log("Did not find subset match for query subset \"" + sQuery + "\"" , "info", this.toString()); |
| return null; |
| }; |
| |
| /** |
| * Executed by DataSource (within DataSource scope via doBeforeParseData()) to |
| * handle responseStripAfter cleanup. |
| * |
| * @method preparseRawResponse |
| * @param sQuery {String} Query string. |
| * @return {Object} oParsedResponse or null. |
| */ |
| YAHOO.widget.AutoComplete.prototype.preparseRawResponse = function(oRequest, oFullResponse, oCallback) { |
| var nEnd = ((this.responseStripAfter !== "") && (oFullResponse.indexOf)) ? |
| oFullResponse.indexOf(this.responseStripAfter) : -1; |
| if(nEnd != -1) { |
| oFullResponse = oFullResponse.substring(0,nEnd); |
| } |
| return oFullResponse; |
| }; |
| |
| /** |
| * Executed by DataSource (within DataSource scope via doBeforeCallback()) to |
| * filter results through a simple client-side matching algorithm. |
| * |
| * @method filterResults |
| * @param sQuery {String} Original request. |
| * @param oFullResponse {Object} Full response object. |
| * @param oParsedResponse {Object} Parsed response object. |
| * @param oCallback {Object} Callback object. |
| * @return {Object} Filtered response object. |
| */ |
| |
| YAHOO.widget.AutoComplete.prototype.filterResults = function(sQuery, oFullResponse, oParsedResponse, oCallback) { |
| // Only if a query string is available to match against |
| if(sQuery && sQuery !== "") { |
| // First make a copy of the oParseResponse |
| oParsedResponse = YAHOO.widget.AutoComplete._cloneObject(oParsedResponse); |
| |
| var oAC = oCallback.scope, |
| oDS = this, |
| allResults = oParsedResponse.results, // the array of results |
| filteredResults = [], // container for filtered results |
| bMatchFound = false, |
| bMatchCase = (oDS.queryMatchCase || oAC.queryMatchCase), // backward compat |
| bMatchContains = (oDS.queryMatchContains || oAC.queryMatchContains); // backward compat |
| |
| // Loop through each result object... |
| for(var i = allResults.length-1; i >= 0; i--) { |
| var oResult = allResults[i]; |
| |
| // Grab the data to match against from the result object... |
| var sResult = null; |
| |
| // Result object is a simple string already |
| if(YAHOO.lang.isString(oResult)) { |
| sResult = oResult; |
| } |
| // Result object is an array of strings |
| else if(YAHOO.lang.isArray(oResult)) { |
| sResult = oResult[0]; |
| |
| } |
| // Result object is an object literal of strings |
| else if(this.responseSchema.fields) { |
| var key = this.responseSchema.fields[0].key || this.responseSchema.fields[0]; |
| sResult = oResult[key]; |
| } |
| // Backwards compatibility |
| else if(this.key) { |
| sResult = oResult[this.key]; |
| } |
| |
| if(YAHOO.lang.isString(sResult)) { |
| |
| var sKeyIndex = (bMatchCase) ? |
| sResult.indexOf(decodeURIComponent(sQuery)) : |
| sResult.toLowerCase().indexOf(decodeURIComponent(sQuery).toLowerCase()); |
| |
| // A STARTSWITH match is when the query is found at the beginning of the key string... |
| if((!bMatchContains && (sKeyIndex === 0)) || |
| // A CONTAINS match is when the query is found anywhere within the key string... |
| (bMatchContains && (sKeyIndex > -1))) { |
| // Stash the match |
| filteredResults.unshift(oResult); |
| } |
| } |
| } |
| oParsedResponse.results = filteredResults; |
| YAHOO.log("Filtered " + filteredResults.length + " results against query \"" + sQuery + "\": " + YAHOO.lang.dump(filteredResults), "info", this.toString()); |
| } |
| else { |
| YAHOO.log("Did not filter results against query", "info", this.toString()); |
| } |
| |
| return oParsedResponse; |
| }; |
| |
| /** |
| * Handles response for display. This is the callback function method passed to |
| * YAHOO.util.DataSourceBase#sendRequest so results from the DataSource are |
| * returned to the AutoComplete instance. |
| * |
| * @method handleResponse |
| * @param sQuery {String} Original request. |
| * @param oResponse {Object} Response object. |
| * @param oPayload {MIXED} (optional) Additional argument(s) |
| */ |
| YAHOO.widget.AutoComplete.prototype.handleResponse = function(sQuery, oResponse, oPayload) { |
| if((this instanceof YAHOO.widget.AutoComplete) && this._sName) { |
| this._populateList(sQuery, oResponse, oPayload); |
| } |
| }; |
| |
| /** |
| * Overridable method called before container is loaded with result data. |
| * |
| * @method doBeforeLoadData |
| * @param sQuery {String} Original request. |
| * @param oResponse {Object} Response object. |
| * @param oPayload {MIXED} (optional) Additional argument(s) |
| * @return {Boolean} Return true to continue loading data, false to cancel. |
| */ |
| YAHOO.widget.AutoComplete.prototype.doBeforeLoadData = function(sQuery, oResponse, oPayload) { |
| return true; |
| }; |
| |
| /** |
| * Overridable method that returns HTML markup for one result to be populated |
| * as innerHTML of an <LI> element. |
| * |
| * @method formatResult |
| * @param oResultData {Object} Result data object. |
| * @param sQuery {String} The corresponding query string. |
| * @param sResultMatch {HTMLElement} The current query string. |
| * @return {String} HTML markup of formatted result data. |
| */ |
| YAHOO.widget.AutoComplete.prototype.formatResult = function(oResultData, sQuery, sResultMatch) { |
| var sMarkup = (sResultMatch) ? sResultMatch : ""; |
| return sMarkup; |
| }; |
| |
| /** |
| * Overridable method called before container expands allows implementers to access data |
| * and DOM elements. |
| * |
| * @method doBeforeExpandContainer |
| * @param elTextbox {HTMLElement} The text input box. |
| * @param elContainer {HTMLElement} The container element. |
| * @param sQuery {String} The query string. |
| * @param aResults {Object[]} An array of query results. |
| * @return {Boolean} Return true to continue expanding container, false to cancel the expand. |
| */ |
| YAHOO.widget.AutoComplete.prototype.doBeforeExpandContainer = function(elTextbox, elContainer, sQuery, aResults) { |
| return true; |
| }; |
| |
| |
| /** |
| * Nulls out the entire AutoComplete instance and related objects, removes attached |
| * event listeners, and clears out DOM elements inside the container. After |
| * calling this method, the instance reference should be expliclitly nulled by |
| * implementer, as in myDataTable = null. Use with caution! |
| * |
| * @method destroy |
| */ |
| YAHOO.widget.AutoComplete.prototype.destroy = function() { |
| var instanceName = this.toString(); |
| var elInput = this._elTextbox; |
| var elContainer = this._elContainer; |
| |
| // Unhook custom events |
| this.textboxFocusEvent.unsubscribeAll(); |
| this.textboxKeyEvent.unsubscribeAll(); |
| this.dataRequestEvent.unsubscribeAll(); |
| this.dataReturnEvent.unsubscribeAll(); |
| this.dataErrorEvent.unsubscribeAll(); |
| this.containerPopulateEvent.unsubscribeAll(); |
| this.containerExpandEvent.unsubscribeAll(); |
| this.typeAheadEvent.unsubscribeAll(); |
| this.itemMouseOverEvent.unsubscribeAll(); |
| this.itemMouseOutEvent.unsubscribeAll(); |
| this.itemArrowToEvent.unsubscribeAll(); |
| this.itemArrowFromEvent.unsubscribeAll(); |
| this.itemSelectEvent.unsubscribeAll(); |
| this.unmatchedItemSelectEvent.unsubscribeAll(); |
| this.selectionEnforceEvent.unsubscribeAll(); |
| this.containerCollapseEvent.unsubscribeAll(); |
| this.textboxBlurEvent.unsubscribeAll(); |
| this.textboxChangeEvent.unsubscribeAll(); |
| |
| // Unhook DOM events |
| YAHOO.util.Event.purgeElement(elInput, true); |
| YAHOO.util.Event.purgeElement(elContainer, true); |
| |
| // Remove DOM elements |
| elContainer.innerHTML = ""; |
| |
| // Null out objects |
| for(var key in this) { |
| if(YAHOO.lang.hasOwnProperty(this, key)) { |
| this[key] = null; |
| } |
| } |
| |
| YAHOO.log("AutoComplete instance destroyed: " + instanceName); |
| }; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Public events |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Fired when the input field receives focus. |
| * |
| * @event textboxFocusEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.textboxFocusEvent = null; |
| |
| /** |
| * Fired when the input field receives key input. |
| * |
| * @event textboxKeyEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param nKeycode {Number} The keycode number. |
| */ |
| YAHOO.widget.AutoComplete.prototype.textboxKeyEvent = null; |
| |
| /** |
| * Fired when the AutoComplete instance makes a request to the DataSource. |
| * |
| * @event dataRequestEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sQuery {String} The query string. |
| * @param oRequest {Object} The request. |
| */ |
| YAHOO.widget.AutoComplete.prototype.dataRequestEvent = null; |
| |
| /** |
| * Fired when the AutoComplete instance receives query results from the data |
| * source. |
| * |
| * @event dataReturnEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sQuery {String} The query string. |
| * @param aResults {Object[]} Results array. |
| */ |
| YAHOO.widget.AutoComplete.prototype.dataReturnEvent = null; |
| |
| /** |
| * Fired when the AutoComplete instance does not receive query results from the |
| * DataSource due to an error. |
| * |
| * @event dataErrorEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sQuery {String} The query string. |
| */ |
| YAHOO.widget.AutoComplete.prototype.dataErrorEvent = null; |
| |
| /** |
| * Fired when the results container is populated. |
| * |
| * @event containerPopulateEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.containerPopulateEvent = null; |
| |
| /** |
| * Fired when the results container is expanded. |
| * |
| * @event containerExpandEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sQuery {String} The query string. |
| * @param aResults {Object[]} Results array. |
| */ |
| YAHOO.widget.AutoComplete.prototype.containerExpandEvent = null; |
| |
| /** |
| * Fired when the input field has been prefilled by the type-ahead |
| * feature. |
| * |
| * @event typeAheadEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sQuery {String} The query string. |
| * @param sPrefill {String} The prefill string. |
| */ |
| YAHOO.widget.AutoComplete.prototype.typeAheadEvent = null; |
| |
| /** |
| * Fired when result item has been moused over. |
| * |
| * @event itemMouseOverEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param elItem {HTMLElement} The <li> element item moused to. |
| */ |
| YAHOO.widget.AutoComplete.prototype.itemMouseOverEvent = null; |
| |
| /** |
| * Fired when result item has been moused out. |
| * |
| * @event itemMouseOutEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param elItem {HTMLElement} The <li> element item moused from. |
| */ |
| YAHOO.widget.AutoComplete.prototype.itemMouseOutEvent = null; |
| |
| /** |
| * Fired when result item has been arrowed to. |
| * |
| * @event itemArrowToEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param elItem {HTMLElement} The <li> element item arrowed to. |
| */ |
| YAHOO.widget.AutoComplete.prototype.itemArrowToEvent = null; |
| |
| /** |
| * Fired when result item has been arrowed away from. |
| * |
| * @event itemArrowFromEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param elItem {HTMLElement} The <li> element item arrowed from. |
| */ |
| YAHOO.widget.AutoComplete.prototype.itemArrowFromEvent = null; |
| |
| /** |
| * Fired when an item is selected via mouse click, ENTER key, or TAB key. |
| * |
| * @event itemSelectEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param elItem {HTMLElement} The selected <li> element item. |
| * @param oData {Object} The data returned for the item, either as an object, |
| * or mapped from the schema into an array. |
| */ |
| YAHOO.widget.AutoComplete.prototype.itemSelectEvent = null; |
| |
| /** |
| * Fired when a user selection does not match any of the displayed result items. |
| * |
| * @event unmatchedItemSelectEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @param sSelection {String} The selected string. |
| */ |
| YAHOO.widget.AutoComplete.prototype.unmatchedItemSelectEvent = null; |
| |
| /** |
| * Fired if forceSelection is enabled and the user's input has been cleared |
| * because it did not match one of the returned query results. |
| * |
| * @event selectionEnforceEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.selectionEnforceEvent = null; |
| |
| /** |
| * Fired when the results container is collapsed. |
| * |
| * @event containerCollapseEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.containerCollapseEvent = null; |
| |
| /** |
| * Fired when the input field loses focus. |
| * |
| * @event textboxBlurEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.textboxBlurEvent = null; |
| |
| /** |
| * Fired when the input field value has changed when it loses focus. |
| * |
| * @event textboxChangeEvent |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| */ |
| YAHOO.widget.AutoComplete.prototype.textboxChangeEvent = null; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Private member variables |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Internal class variable to index multiple AutoComplete instances. |
| * |
| * @property _nIndex |
| * @type Number |
| * @default 0 |
| * @private |
| */ |
| YAHOO.widget.AutoComplete._nIndex = 0; |
| |
| /** |
| * Name of AutoComplete instance. |
| * |
| * @property _sName |
| * @type String |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sName = null; |
| |
| /** |
| * Text input field DOM element. |
| * |
| * @property _elTextbox |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elTextbox = null; |
| |
| /** |
| * Container DOM element. |
| * |
| * @property _elContainer |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elContainer = null; |
| |
| /** |
| * Reference to content element within container element. |
| * |
| * @property _elContent |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elContent = null; |
| |
| /** |
| * Reference to header element within content element. |
| * |
| * @property _elHeader |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elHeader = null; |
| |
| /** |
| * Reference to body element within content element. |
| * |
| * @property _elBody |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elBody = null; |
| |
| /** |
| * Reference to footer element within content element. |
| * |
| * @property _elFooter |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elFooter = null; |
| |
| /** |
| * Reference to shadow element within container element. |
| * |
| * @property _elShadow |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elShadow = null; |
| |
| /** |
| * Reference to iframe element within container element. |
| * |
| * @property _elIFrame |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elIFrame = null; |
| |
| /** |
| * Whether or not the input field is currently in focus. If query results come back |
| * but the user has already moved on, do not proceed with auto complete behavior. |
| * |
| * @property _bFocused |
| * @type Boolean |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._bFocused = null; |
| |
| /** |
| * Animation instance for container expand/collapse. |
| * |
| * @property _oAnim |
| * @type Boolean |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._oAnim = null; |
| |
| /** |
| * Whether or not the results container is currently open. |
| * |
| * @property _bContainerOpen |
| * @type Boolean |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._bContainerOpen = false; |
| |
| /** |
| * Whether or not the mouse is currently over the results |
| * container. This is necessary in order to prevent clicks on container items |
| * from being text input field blur events. |
| * |
| * @property _bOverContainer |
| * @type Boolean |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._bOverContainer = false; |
| |
| /** |
| * Internal reference to <ul> elements that contains query results within the |
| * results container. |
| * |
| * @property _elList |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elList = null; |
| |
| /* |
| * Array of <li> elements references that contain query results within the |
| * results container. |
| * |
| * @property _aListItemEls |
| * @type HTMLElement[] |
| * @private |
| */ |
| //YAHOO.widget.AutoComplete.prototype._aListItemEls = null; |
| |
| /** |
| * Number of <li> elements currently displayed in results container. |
| * |
| * @property _nDisplayedItems |
| * @type Number |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._nDisplayedItems = 0; |
| |
| /* |
| * Internal count of <li> elements displayed and hidden in results container. |
| * |
| * @property _maxResultsDisplayed |
| * @type Number |
| * @private |
| */ |
| //YAHOO.widget.AutoComplete.prototype._maxResultsDisplayed = 0; |
| |
| /** |
| * Current query string |
| * |
| * @property _sCurQuery |
| * @type String |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sCurQuery = null; |
| |
| /** |
| * Selections from previous queries (for saving delimited queries). |
| * |
| * @property _sPastSelections |
| * @type String |
| * @default "" |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sPastSelections = ""; |
| |
| /** |
| * Stores initial input value used to determine if textboxChangeEvent should be fired. |
| * |
| * @property _sInitInputValue |
| * @type String |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sInitInputValue = null; |
| |
| /** |
| * Pointer to the currently highlighted <li> element in the container. |
| * |
| * @property _elCurListItem |
| * @type HTMLElement |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._elCurListItem = null; |
| |
| /** |
| * Whether or not an item has been selected since the container was populated |
| * with results. Reset to false by _populateList, and set to true when item is |
| * selected. |
| * |
| * @property _bItemSelected |
| * @type Boolean |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._bItemSelected = false; |
| |
| /** |
| * Key code of the last key pressed in textbox. |
| * |
| * @property _nKeyCode |
| * @type Number |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._nKeyCode = null; |
| |
| /** |
| * Delay timeout ID. |
| * |
| * @property _nDelayID |
| * @type Number |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._nDelayID = -1; |
| |
| /** |
| * TypeAhead delay timeout ID. |
| * |
| * @property _nTypeAheadDelayID |
| * @type Number |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._nTypeAheadDelayID = -1; |
| |
| /** |
| * Src to iFrame used when useIFrame = true. Supports implementations over SSL |
| * as well. |
| * |
| * @property _iFrameSrc |
| * @type String |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._iFrameSrc = "javascript:false;"; |
| |
| /** |
| * For users typing via certain IMEs, queries must be triggered by intervals, |
| * since key events yet supported across all browsers for all IMEs. |
| * |
| * @property _queryInterval |
| * @type Object |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._queryInterval = null; |
| |
| /** |
| * Internal tracker to last known textbox value, used to determine whether or not |
| * to trigger a query via interval for certain IME users. |
| * |
| * @event _sLastTextboxValue |
| * @type String |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sLastTextboxValue = null; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Private methods |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Updates and validates latest public config properties. |
| * |
| * @method __initProps |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._initProps = function() { |
| // Correct any invalid values |
| var minQueryLength = this.minQueryLength; |
| if(!YAHOO.lang.isNumber(minQueryLength)) { |
| this.minQueryLength = 1; |
| } |
| var maxResultsDisplayed = this.maxResultsDisplayed; |
| if(!YAHOO.lang.isNumber(maxResultsDisplayed) || (maxResultsDisplayed < 1)) { |
| this.maxResultsDisplayed = 10; |
| } |
| var queryDelay = this.queryDelay; |
| if(!YAHOO.lang.isNumber(queryDelay) || (queryDelay < 0)) { |
| this.queryDelay = 0.2; |
| } |
| var typeAheadDelay = this.typeAheadDelay; |
| if(!YAHOO.lang.isNumber(typeAheadDelay) || (typeAheadDelay < 0)) { |
| this.typeAheadDelay = 0.2; |
| } |
| var delimChar = this.delimChar; |
| if(YAHOO.lang.isString(delimChar) && (delimChar.length > 0)) { |
| this.delimChar = [delimChar]; |
| } |
| else if(!YAHOO.lang.isArray(delimChar)) { |
| this.delimChar = null; |
| } |
| var animSpeed = this.animSpeed; |
| if((this.animHoriz || this.animVert) && YAHOO.util.Anim) { |
| if(!YAHOO.lang.isNumber(animSpeed) || (animSpeed < 0)) { |
| this.animSpeed = 0.3; |
| } |
| if(!this._oAnim ) { |
| this._oAnim = new YAHOO.util.Anim(this._elContent, {}, this.animSpeed); |
| } |
| else { |
| this._oAnim.duration = this.animSpeed; |
| } |
| } |
| if(this.forceSelection && delimChar) { |
| YAHOO.log("The forceSelection feature has been enabled with delimChar defined.","warn", this.toString()); |
| } |
| }; |
| |
| /** |
| * Initializes the results container helpers if they are enabled and do |
| * not exist |
| * |
| * @method _initContainerHelperEls |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._initContainerHelperEls = function() { |
| if(this.useShadow && !this._elShadow) { |
| var elShadow = document.createElement("div"); |
| elShadow.className = "yui-ac-shadow"; |
| elShadow.style.width = 0; |
| elShadow.style.height = 0; |
| this._elShadow = this._elContainer.appendChild(elShadow); |
| } |
| if(this.useIFrame && !this._elIFrame) { |
| var elIFrame = document.createElement("iframe"); |
| elIFrame.src = this._iFrameSrc; |
| elIFrame.frameBorder = 0; |
| elIFrame.scrolling = "no"; |
| elIFrame.style.position = "absolute"; |
| elIFrame.style.width = 0; |
| elIFrame.style.height = 0; |
| elIFrame.tabIndex = -1; |
| elIFrame.style.padding = 0; |
| this._elIFrame = this._elContainer.appendChild(elIFrame); |
| } |
| }; |
| |
| /** |
| * Initializes the results container once at object creation |
| * |
| * @method _initContainerEl |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._initContainerEl = function() { |
| YAHOO.util.Dom.addClass(this._elContainer, "yui-ac-container"); |
| |
| if(!this._elContent) { |
| // The elContent div is assigned DOM listeners and |
| // helps size the iframe and shadow properly |
| var elContent = document.createElement("div"); |
| elContent.className = "yui-ac-content"; |
| elContent.style.display = "none"; |
| |
| this._elContent = this._elContainer.appendChild(elContent); |
| |
| var elHeader = document.createElement("div"); |
| elHeader.className = "yui-ac-hd"; |
| elHeader.style.display = "none"; |
| this._elHeader = this._elContent.appendChild(elHeader); |
| |
| var elBody = document.createElement("div"); |
| elBody.className = "yui-ac-bd"; |
| this._elBody = this._elContent.appendChild(elBody); |
| |
| var elFooter = document.createElement("div"); |
| elFooter.className = "yui-ac-ft"; |
| elFooter.style.display = "none"; |
| this._elFooter = this._elContent.appendChild(elFooter); |
| } |
| else { |
| YAHOO.log("Could not initialize the container","warn",this.toString()); |
| } |
| }; |
| |
| /** |
| * Clears out contents of container body and creates up to |
| * YAHOO.widget.AutoComplete#maxResultsDisplayed <li> elements in an |
| * <ul> element. |
| * |
| * @method _initListEl |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._initListEl = function() { |
| var nListLength = this.maxResultsDisplayed; |
| |
| var elList = this._elList || document.createElement("ul"); |
| var elListItem; |
| while(elList.childNodes.length < nListLength) { |
| elListItem = document.createElement("li"); |
| elListItem.style.display = "none"; |
| elListItem._nItemIndex = elList.childNodes.length; |
| elList.appendChild(elListItem); |
| } |
| if(!this._elList) { |
| var elBody = this._elBody; |
| YAHOO.util.Event.purgeElement(elBody, true); |
| elBody.innerHTML = ""; |
| this._elList = elBody.appendChild(elList); |
| } |
| |
| }; |
| |
| /** |
| * Enables interval detection for IME support. |
| * |
| * @method _enableIntervalDetection |
| * @re |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._enableIntervalDetection = function() { |
| var oSelf = this; |
| if(!oSelf._queryInterval && oSelf.queryInterval) { |
| oSelf._queryInterval = setInterval(function() { oSelf._onInterval(); }, oSelf.queryInterval); |
| YAHOO.log("Interval set", "info", this.toString()); |
| } |
| }; |
| |
| /** |
| * Enables query triggers based on text input detection by intervals (rather |
| * than by key events). |
| * |
| * @method _onInterval |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onInterval = function() { |
| var currValue = this._elTextbox.value; |
| var lastValue = this._sLastTextboxValue; |
| if(currValue != lastValue) { |
| this._sLastTextboxValue = currValue; |
| this._sendQuery(currValue); |
| } |
| }; |
| |
| /** |
| * Cancels text input detection by intervals. |
| * |
| * @method _clearInterval |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._clearInterval = function() { |
| if(this._queryInterval) { |
| clearInterval(this._queryInterval); |
| this._queryInterval = null; |
| YAHOO.log("Interval cleared", "info", this.toString()); |
| } |
| }; |
| |
| /** |
| * Whether or not key is functional or should be ignored. Note that the right |
| * arrow key is NOT an ignored key since it triggers queries for certain intl |
| * charsets. |
| * |
| * @method _isIgnoreKey |
| * @param nKeycode {Number} Code of key pressed. |
| * @return {Boolean} True if key should be ignored, false otherwise. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._isIgnoreKey = function(nKeyCode) { |
| if((nKeyCode == 9) || (nKeyCode == 13) || // tab, enter |
| (nKeyCode == 16) || (nKeyCode == 17) || // shift, ctl |
| (nKeyCode >= 18 && nKeyCode <= 20) || // alt, pause/break,caps lock |
| (nKeyCode == 27) || // esc |
| (nKeyCode >= 33 && nKeyCode <= 35) || // page up,page down,end |
| /*(nKeyCode >= 36 && nKeyCode <= 38) || // home,left,up |
| (nKeyCode == 40) || // down*/ |
| (nKeyCode >= 36 && nKeyCode <= 40) || // home,left,up, right, down |
| (nKeyCode >= 44 && nKeyCode <= 45) || // print screen,insert |
| (nKeyCode == 229) // Bug 2041973: Korean XP fires 2 keyup events, the key and 229 |
| ) { |
| return true; |
| } |
| return false; |
| }; |
| |
| /** |
| * Makes query request to the DataSource. |
| * |
| * @method _sendQuery |
| * @param sQuery {String} Query string. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._sendQuery = function(sQuery) { |
| // Widget has been effectively turned off |
| if(this.minQueryLength < 0) { |
| this._toggleContainer(false); |
| YAHOO.log("Property minQueryLength is less than 0", "info", this.toString()); |
| return; |
| } |
| // Delimiter has been enabled |
| var aDelimChar = (this.delimChar) ? this.delimChar : null; |
| if(aDelimChar) { |
| // Loop through all possible delimiters and find the rightmost one in the query |
| // A " " may be a false positive if they are defined as delimiters AND |
| // are used to separate delimited queries |
| var nDelimIndex = -1; |
| for(var i = aDelimChar.length-1; i >= 0; i--) { |
| var nNewIndex = sQuery.lastIndexOf(aDelimChar[i]); |
| if(nNewIndex > nDelimIndex) { |
| nDelimIndex = nNewIndex; |
| } |
| } |
| // If we think the last delimiter is a space (" "), make sure it is NOT |
| // a false positive by also checking the char directly before it |
| if(aDelimChar[i] == " ") { |
| for (var j = aDelimChar.length-1; j >= 0; j--) { |
| if(sQuery[nDelimIndex - 1] == aDelimChar[j]) { |
| nDelimIndex--; |
| break; |
| } |
| } |
| } |
| // A delimiter has been found in the query so extract the latest query from past selections |
| if(nDelimIndex > -1) { |
| var nQueryStart = nDelimIndex + 1; |
| // Trim any white space from the beginning... |
| while(sQuery.charAt(nQueryStart) == " ") { |
| nQueryStart += 1; |
| } |
| // ...and save the rest of the string for later |
| this._sPastSelections = sQuery.substring(0,nQueryStart); |
| // Here is the query itself |
| sQuery = sQuery.substr(nQueryStart); |
| } |
| // No delimiter found in the query, so there are no selections from past queries |
| else { |
| this._sPastSelections = ""; |
| } |
| } |
| |
| // Don't search queries that are too short |
| if((sQuery && (sQuery.length < this.minQueryLength)) || (!sQuery && this.minQueryLength > 0)) { |
| if(this._nDelayID != -1) { |
| clearTimeout(this._nDelayID); |
| } |
| this._toggleContainer(false); |
| YAHOO.log("Query \"" + sQuery + "\" is too short", "info", this.toString()); |
| return; |
| } |
| |
| sQuery = encodeURIComponent(sQuery); |
| this._nDelayID = -1; // Reset timeout ID because request is being made |
| |
| // Subset matching |
| if(this.dataSource.queryMatchSubset || this.queryMatchSubset) { // backward compat |
| var oResponse = this.getSubsetMatches(sQuery); |
| if(oResponse) { |
| this.handleResponse(sQuery, oResponse, {query: sQuery}); |
| return; |
| } |
| } |
| |
| if(this.responseStripAfter) { |
| this.dataSource.doBeforeParseData = this.preparseRawResponse; |
| } |
| if(this.applyLocalFilter) { |
| this.dataSource.doBeforeCallback = this.filterResults; |
| } |
| |
| var sRequest = this.generateRequest(sQuery); |
| this.dataRequestEvent.fire(this, sQuery, sRequest); |
| YAHOO.log("Sending query \"" + sRequest + "\"", "info", this.toString()); |
| |
| this.dataSource.sendRequest(sRequest, { |
| success : this.handleResponse, |
| failure : this.handleResponse, |
| scope : this, |
| argument: { |
| query: sQuery |
| } |
| }); |
| }; |
| |
| /** |
| * Populates the array of <li> elements in the container with query |
| * results. |
| * |
| * @method _populateList |
| * @param sQuery {String} Original request. |
| * @param oResponse {Object} Response object. |
| * @param oPayload {MIXED} (optional) Additional argument(s) |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._populateList = function(sQuery, oResponse, oPayload) { |
| // Clear previous timeout |
| if(this._nTypeAheadDelayID != -1) { |
| clearTimeout(this._nTypeAheadDelayID); |
| } |
| |
| sQuery = (oPayload && oPayload.query) ? oPayload.query : sQuery; |
| |
| // Pass data through abstract method for any transformations |
| var ok = this.doBeforeLoadData(sQuery, oResponse, oPayload); |
| |
| // Data is ok |
| if(ok && !oResponse.error) { |
| this.dataReturnEvent.fire(this, sQuery, oResponse.results); |
| |
| // Continue only if instance is still focused (i.e., user hasn't already moved on) |
| // Null indicates initialized state, which is ok too |
| if(this._bFocused || (this._bFocused === null)) { |
| |
| //TODO: is this still necessary? |
| /*var isOpera = (YAHOO.env.ua.opera); |
| var contentStyle = this._elContent.style; |
| contentStyle.width = (!isOpera) ? null : ""; |
| contentStyle.height = (!isOpera) ? null : "";*/ |
| |
| // Store state for this interaction |
| var sCurQuery = decodeURIComponent(sQuery); |
| this._sCurQuery = sCurQuery; |
| this._bItemSelected = false; |
| |
| var allResults = oResponse.results, |
| nItemsToShow = Math.min(allResults.length,this.maxResultsDisplayed), |
| sMatchKey = (this.dataSource.responseSchema.fields) ? |
| (this.dataSource.responseSchema.fields[0].key || this.dataSource.responseSchema.fields[0]) : 0; |
| |
| if(nItemsToShow > 0) { |
| // Make sure container and helpers are ready to go |
| if(!this._elList || (this._elList.childNodes.length < nItemsToShow)) { |
| this._initListEl(); |
| } |
| this._initContainerHelperEls(); |
| |
| var allListItemEls = this._elList.childNodes; |
| // Fill items with data from the bottom up |
| for(var i = nItemsToShow-1; i >= 0; i--) { |
| var elListItem = allListItemEls[i], |
| oResult = allResults[i]; |
| |
| // Backward compatibility |
| if(this.resultTypeList) { |
| // Results need to be converted back to an array |
| var aResult = []; |
| // Match key is first |
| aResult[0] = (YAHOO.lang.isString(oResult)) ? oResult : oResult[sMatchKey] || oResult[this.key]; |
| // Add additional data to the result array |
| var fields = this.dataSource.responseSchema.fields; |
| if(YAHOO.lang.isArray(fields) && (fields.length > 1)) { |
| for(var k=1, len=fields.length; k<len; k++) { |
| aResult[aResult.length] = oResult[fields[k].key || fields[k]]; |
| } |
| } |
| // No specific fields defined, so pass along entire data object |
| else { |
| // Already an array |
| if(YAHOO.lang.isArray(oResult)) { |
| aResult = oResult; |
| } |
| // Simple string |
| else if(YAHOO.lang.isString(oResult)) { |
| aResult = [oResult]; |
| } |
| // Object |
| else { |
| aResult[1] = oResult; |
| } |
| } |
| oResult = aResult; |
| } |
| |
| // The matching value, including backward compatibility for array format and safety net |
| elListItem._sResultMatch = (YAHOO.lang.isString(oResult)) ? oResult : (YAHOO.lang.isArray(oResult)) ? oResult[0] : (oResult[sMatchKey] || ""); |
| elListItem._oResultData = oResult; // Additional data |
| elListItem.innerHTML = this.formatResult(oResult, sCurQuery, elListItem._sResultMatch); |
| elListItem.style.display = ""; |
| } |
| |
| // Clear out extraneous items |
| if(nItemsToShow < allListItemEls.length) { |
| var extraListItem; |
| for(var j = allListItemEls.length-1; j >= nItemsToShow; j--) { |
| extraListItem = allListItemEls[j]; |
| extraListItem.style.display = "none"; |
| } |
| } |
| |
| this._nDisplayedItems = nItemsToShow; |
| |
| this.containerPopulateEvent.fire(this, sQuery, allResults); |
| |
| // Highlight the first item |
| if(this.autoHighlight) { |
| var elFirstListItem = this._elList.firstChild; |
| this._toggleHighlight(elFirstListItem,"to"); |
| this.itemArrowToEvent.fire(this, elFirstListItem); |
| YAHOO.log("Arrowed to first item", "info", this.toString()); |
| this._typeAhead(elFirstListItem,sQuery); |
| } |
| // Unhighlight any previous time |
| else { |
| this._toggleHighlight(this._elCurListItem,"from"); |
| } |
| |
| // Expand the container |
| ok = this.doBeforeExpandContainer(this._elTextbox, this._elContainer, sQuery, allResults); |
| this._toggleContainer(ok); |
| } |
| else { |
| this._toggleContainer(false); |
| } |
| |
| YAHOO.log("Container populated with " + nItemsToShow + " list items", "info", this.toString()); |
| return; |
| } |
| } |
| // Error |
| else { |
| this.dataErrorEvent.fire(this, sQuery); |
| } |
| |
| YAHOO.log("Could not populate list", "info", this.toString()); |
| }; |
| |
| /** |
| * When forceSelection is true and the user attempts |
| * leave the text input box without selecting an item from the query results, |
| * the user selection is cleared. |
| * |
| * @method _clearSelection |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._clearSelection = function() { |
| var sValue = this._elTextbox.value; |
| //TODO: need to check against all delimChars? |
| var sChar = (this.delimChar) ? this.delimChar[0] : null; |
| var nIndex = (sChar) ? sValue.lastIndexOf(sChar, sValue.length-2) : -1; |
| if(nIndex > -1) { |
| this._elTextbox.value = sValue.substring(0,nIndex); |
| } |
| else { |
| this._elTextbox.value = ""; |
| } |
| this._sPastSelections = this._elTextbox.value; |
| |
| // Fire custom event |
| this.selectionEnforceEvent.fire(this); |
| YAHOO.log("Selection enforced", "info", this.toString()); |
| }; |
| |
| /** |
| * Whether or not user-typed value in the text input box matches any of the |
| * query results. |
| * |
| * @method _textMatchesOption |
| * @return {HTMLElement} Matching list item element if user-input text matches |
| * a result, null otherwise. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._textMatchesOption = function() { |
| var elMatch = null; |
| |
| for(var i = this._nDisplayedItems-1; i >= 0 ; i--) { |
| var elListItem = this._elList.childNodes[i]; |
| var sMatch = ("" + elListItem._sResultMatch).toLowerCase(); |
| if(sMatch == this._sCurQuery.toLowerCase()) { |
| elMatch = elListItem; |
| break; |
| } |
| } |
| return(elMatch); |
| }; |
| |
| /** |
| * Updates in the text input box with the first query result as the user types, |
| * selecting the substring that the user has not typed. |
| * |
| * @method _typeAhead |
| * @param elListItem {HTMLElement} The <li> element item whose data populates the input field. |
| * @param sQuery {String} Query string. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._typeAhead = function(elListItem, sQuery) { |
| // Don't typeAhead if turned off or is backspace |
| if(!this.typeAhead || (this._nKeyCode == 8)) { |
| return; |
| } |
| |
| var oSelf = this, |
| elTextbox = this._elTextbox; |
| |
| // Only if text selection is supported |
| if(elTextbox.setSelectionRange || elTextbox.createTextRange) { |
| // Set and store timeout for this typeahead |
| this._nTypeAheadDelayID = setTimeout(function() { |
| // Select the portion of text that the user has not typed |
| var nStart = elTextbox.value.length; // any saved queries plus what user has typed |
| oSelf._updateValue(elListItem); |
| var nEnd = elTextbox.value.length; |
| oSelf._selectText(elTextbox,nStart,nEnd); |
| var sPrefill = elTextbox.value.substr(nStart,nEnd); |
| oSelf.typeAheadEvent.fire(oSelf,sQuery,sPrefill); |
| YAHOO.log("Typeahead occured with prefill string \"" + sPrefill + "\"", "info", oSelf.toString()); |
| },(this.typeAheadDelay*1000)); |
| } |
| }; |
| |
| /** |
| * Selects text in the input field. |
| * |
| * @method _selectText |
| * @param elTextbox {HTMLElement} Text input box element in which to select text. |
| * @param nStart {Number} Starting index of text string to select. |
| * @param nEnd {Number} Ending index of text selection. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._selectText = function(elTextbox, nStart, nEnd) { |
| if(elTextbox.setSelectionRange) { // For Mozilla |
| elTextbox.setSelectionRange(nStart,nEnd); |
| } |
| else if(elTextbox.createTextRange) { // For IE |
| var oTextRange = elTextbox.createTextRange(); |
| oTextRange.moveStart("character", nStart); |
| oTextRange.moveEnd("character", nEnd-elTextbox.value.length); |
| oTextRange.select(); |
| } |
| else { |
| elTextbox.select(); |
| } |
| }; |
| |
| /** |
| * Syncs results container with its helpers. |
| * |
| * @method _toggleContainerHelpers |
| * @param bShow {Boolean} True if container is expanded, false if collapsed |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._toggleContainerHelpers = function(bShow) { |
| var width = this._elContent.offsetWidth + "px"; |
| var height = this._elContent.offsetHeight + "px"; |
| |
| if(this.useIFrame && this._elIFrame) { |
| var elIFrame = this._elIFrame; |
| if(bShow) { |
| elIFrame.style.width = width; |
| elIFrame.style.height = height; |
| elIFrame.style.padding = ""; |
| YAHOO.log("Iframe expanded", "info", this.toString()); |
| } |
| else { |
| elIFrame.style.width = 0; |
| elIFrame.style.height = 0; |
| elIFrame.style.padding = 0; |
| YAHOO.log("Iframe collapsed", "info", this.toString()); |
| } |
| } |
| if(this.useShadow && this._elShadow) { |
| var elShadow = this._elShadow; |
| if(bShow) { |
| elShadow.style.width = width; |
| elShadow.style.height = height; |
| YAHOO.log("Shadow expanded", "info", this.toString()); |
| } |
| else { |
| elShadow.style.width = 0; |
| elShadow.style.height = 0; |
| YAHOO.log("Shadow collapsed", "info", this.toString()); |
| } |
| } |
| }; |
| |
| /** |
| * Animates expansion or collapse of the container. |
| * |
| * @method _toggleContainer |
| * @param bShow {Boolean} True if container should be expanded, false if container should be collapsed |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._toggleContainer = function(bShow) { |
| var elContainer = this._elContainer; |
| |
| // If implementer has container always open and it's already open, don't mess with it |
| // Container is initialized with display "none" so it may need to be shown first time through |
| if(this.alwaysShowContainer && this._bContainerOpen) { |
| return; |
| } |
| |
| // Reset states |
| if(!bShow) { |
| this._toggleHighlight(this._elCurListItem,"from"); |
| this._nDisplayedItems = 0; |
| this._sCurQuery = null; |
| |
| // Container is already closed, so don't bother with changing the UI |
| if(!this._bContainerOpen) { |
| this._elContent.style.display = "none"; |
| return; |
| } |
| } |
| |
| // If animation is enabled... |
| var oAnim = this._oAnim; |
| if(oAnim && oAnim.getEl() && (this.animHoriz || this.animVert)) { |
| if(oAnim.isAnimated()) { |
| oAnim.stop(true); |
| } |
| |
| // Clone container to grab current size offscreen |
| var oClone = this._elContent.cloneNode(true); |
| elContainer.appendChild(oClone); |
| oClone.style.top = "-9000px"; |
| oClone.style.width = ""; |
| oClone.style.height = ""; |
| oClone.style.display = ""; |
| |
| // Current size of the container is the EXPANDED size |
| var wExp = oClone.offsetWidth; |
| var hExp = oClone.offsetHeight; |
| |
| // Calculate COLLAPSED sizes based on horiz and vert anim |
| var wColl = (this.animHoriz) ? 0 : wExp; |
| var hColl = (this.animVert) ? 0 : hExp; |
| |
| // Set animation sizes |
| oAnim.attributes = (bShow) ? |
| {width: { to: wExp }, height: { to: hExp }} : |
| {width: { to: wColl}, height: { to: hColl }}; |
| |
| // If opening anew, set to a collapsed size... |
| if(bShow && !this._bContainerOpen) { |
| this._elContent.style.width = wColl+"px"; |
| this._elContent.style.height = hColl+"px"; |
| } |
| // Else, set it to its last known size. |
| else { |
| this._elContent.style.width = wExp+"px"; |
| this._elContent.style.height = hExp+"px"; |
| } |
| |
| elContainer.removeChild(oClone); |
| oClone = null; |
| |
| var oSelf = this; |
| var onAnimComplete = function() { |
| // Finish the collapse |
| oAnim.onComplete.unsubscribeAll(); |
| |
| if(bShow) { |
| oSelf._toggleContainerHelpers(true); |
| oSelf._bContainerOpen = bShow; |
| oSelf.containerExpandEvent.fire(oSelf); |
| YAHOO.log("Container expanded", "info", oSelf.toString()); |
| } |
| else { |
| oSelf._elContent.style.display = "none"; |
| oSelf._bContainerOpen = bShow; |
| oSelf.containerCollapseEvent.fire(oSelf); |
| YAHOO.log("Container collapsed", "info", oSelf.toString()); |
| } |
| }; |
| |
| // Display container and animate it |
| this._toggleContainerHelpers(false); // Bug 1424486: Be early to hide, late to show; |
| this._elContent.style.display = ""; |
| oAnim.onComplete.subscribe(onAnimComplete); |
| oAnim.animate(); |
| } |
| // Else don't animate, just show or hide |
| else { |
| if(bShow) { |
| this._elContent.style.display = ""; |
| this._toggleContainerHelpers(true); |
| this._bContainerOpen = bShow; |
| this.containerExpandEvent.fire(this); |
| YAHOO.log("Container expanded", "info", this.toString()); |
| } |
| else { |
| this._toggleContainerHelpers(false); |
| this._elContent.style.display = "none"; |
| this._bContainerOpen = bShow; |
| this.containerCollapseEvent.fire(this); |
| YAHOO.log("Container collapsed", "info", this.toString()); |
| } |
| } |
| |
| }; |
| |
| /** |
| * Toggles the highlight on or off for an item in the container, and also cleans |
| * up highlighting of any previous item. |
| * |
| * @method _toggleHighlight |
| * @param elNewListItem {HTMLElement} The <li> element item to receive highlight behavior. |
| * @param sType {String} Type "mouseover" will toggle highlight on, and "mouseout" will toggle highlight off. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._toggleHighlight = function(elNewListItem, sType) { |
| if(elNewListItem) { |
| var sHighlight = this.highlightClassName; |
| if(this._elCurListItem) { |
| // Remove highlight from old item |
| YAHOO.util.Dom.removeClass(this._elCurListItem, sHighlight); |
| this._elCurListItem = null; |
| } |
| |
| if((sType == "to") && sHighlight) { |
| // Apply highlight to new item |
| YAHOO.util.Dom.addClass(elNewListItem, sHighlight); |
| this._elCurListItem = elNewListItem; |
| } |
| } |
| }; |
| |
| /** |
| * Toggles the pre-highlight on or off for an item in the container. |
| * |
| * @method _togglePrehighlight |
| * @param elNewListItem {HTMLElement} The <li> element item to receive highlight behavior. |
| * @param sType {String} Type "mouseover" will toggle highlight on, and "mouseout" will toggle highlight off. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._togglePrehighlight = function(elNewListItem, sType) { |
| if(elNewListItem == this._elCurListItem) { |
| return; |
| } |
| |
| var sPrehighlight = this.prehighlightClassName; |
| if((sType == "mouseover") && sPrehighlight) { |
| // Apply prehighlight to new item |
| YAHOO.util.Dom.addClass(elNewListItem, sPrehighlight); |
| } |
| else { |
| // Remove prehighlight from old item |
| YAHOO.util.Dom.removeClass(elNewListItem, sPrehighlight); |
| } |
| }; |
| |
| /** |
| * Updates the text input box value with selected query result. If a delimiter |
| * has been defined, then the value gets appended with the delimiter. |
| * |
| * @method _updateValue |
| * @param elListItem {HTMLElement} The <li> element item with which to update the value. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._updateValue = function(elListItem) { |
| if(!this.suppressInputUpdate) { |
| var elTextbox = this._elTextbox; |
| var sDelimChar = (this.delimChar) ? (this.delimChar[0] || this.delimChar) : null; |
| var sResultMatch = elListItem._sResultMatch; |
| |
| // Calculate the new value |
| var sNewValue = ""; |
| if(sDelimChar) { |
| // Preserve selections from past queries |
| sNewValue = this._sPastSelections; |
| // Add new selection plus delimiter |
| sNewValue += sResultMatch + sDelimChar; |
| if(sDelimChar != " ") { |
| sNewValue += " "; |
| } |
| } |
| else { |
| sNewValue = sResultMatch; |
| } |
| |
| // Update input field |
| elTextbox.value = sNewValue; |
| |
| // Scroll to bottom of textarea if necessary |
| if(elTextbox.type == "textarea") { |
| elTextbox.scrollTop = elTextbox.scrollHeight; |
| } |
| |
| // Move cursor to end |
| var end = elTextbox.value.length; |
| this._selectText(elTextbox,end,end); |
| |
| this._elCurListItem = elListItem; |
| } |
| }; |
| |
| /** |
| * Selects a result item from the container |
| * |
| * @method _selectItem |
| * @param elListItem {HTMLElement} The selected <li> element item. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._selectItem = function(elListItem) { |
| this._bItemSelected = true; |
| this._updateValue(elListItem); |
| this._sPastSelections = this._elTextbox.value; |
| this._clearInterval(); |
| this.itemSelectEvent.fire(this, elListItem, elListItem._oResultData); |
| YAHOO.log("Item selected: " + YAHOO.lang.dump(elListItem._oResultData), "info", this.toString()); |
| this._toggleContainer(false); |
| }; |
| |
| /** |
| * If an item is highlighted in the container, the right arrow key jumps to the |
| * end of the textbox and selects the highlighted item, otherwise the container |
| * is closed. |
| * |
| * @method _jumpSelection |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._jumpSelection = function() { |
| if(this._elCurListItem) { |
| this._selectItem(this._elCurListItem); |
| } |
| else { |
| this._toggleContainer(false); |
| } |
| }; |
| |
| /** |
| * Triggered by up and down arrow keys, changes the current highlighted |
| * <li> element item. Scrolls container if necessary. |
| * |
| * @method _moveSelection |
| * @param nKeyCode {Number} Code of key pressed. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._moveSelection = function(nKeyCode) { |
| if(this._bContainerOpen) { |
| // Determine current item's id number |
| var elCurListItem = this._elCurListItem; |
| var nCurItemIndex = -1; |
| |
| if(elCurListItem) { |
| nCurItemIndex = elCurListItem._nItemIndex; |
| } |
| |
| var nNewItemIndex = (nKeyCode == 40) ? |
| (nCurItemIndex + 1) : (nCurItemIndex - 1); |
| |
| // Out of bounds |
| if(nNewItemIndex < -2 || nNewItemIndex >= this._nDisplayedItems) { |
| return; |
| } |
| |
| if(elCurListItem) { |
| // Unhighlight current item |
| this._toggleHighlight(elCurListItem, "from"); |
| this.itemArrowFromEvent.fire(this, elCurListItem); |
| YAHOO.log("Item arrowed from: " + elCurListItem._nItemIndex, "info", this.toString()); |
| } |
| if(nNewItemIndex == -1) { |
| // Go back to query (remove type-ahead string) |
| if(this.delimChar) { |
| this._elTextbox.value = this._sPastSelections + this._sCurQuery; |
| } |
| else { |
| this._elTextbox.value = this._sCurQuery; |
| } |
| return; |
| } |
| if(nNewItemIndex == -2) { |
| // Close container |
| this._toggleContainer(false); |
| return; |
| } |
| |
| var elNewListItem = this._elList.childNodes[nNewItemIndex]; |
| |
| // Scroll the container if necessary |
| var elContent = this._elContent; |
| var scrollOn = ((YAHOO.util.Dom.getStyle(elContent,"overflow") == "auto") || |
| (YAHOO.util.Dom.getStyle(elContent,"overflowY") == "auto")); |
| if(scrollOn && (nNewItemIndex > -1) && |
| (nNewItemIndex < this._nDisplayedItems)) { |
| // User is keying down |
| if(nKeyCode == 40) { |
| // Bottom of selected item is below scroll area... |
| if((elNewListItem.offsetTop+elNewListItem.offsetHeight) > (elContent.scrollTop + elContent.offsetHeight)) { |
| // Set bottom of scroll area to bottom of selected item |
| elContent.scrollTop = (elNewListItem.offsetTop+elNewListItem.offsetHeight) - elContent.offsetHeight; |
| } |
| // Bottom of selected item is above scroll area... |
| else if((elNewListItem.offsetTop+elNewListItem.offsetHeight) < elContent.scrollTop) { |
| // Set top of selected item to top of scroll area |
| elContent.scrollTop = elNewListItem.offsetTop; |
| |
| } |
| } |
| // User is keying up |
| else { |
| // Top of selected item is above scroll area |
| if(elNewListItem.offsetTop < elContent.scrollTop) { |
| // Set top of scroll area to top of selected item |
| this._elContent.scrollTop = elNewListItem.offsetTop; |
| } |
| // Top of selected item is below scroll area |
| else if(elNewListItem.offsetTop > (elContent.scrollTop + elContent.offsetHeight)) { |
| // Set bottom of selected item to bottom of scroll area |
| this._elContent.scrollTop = (elNewListItem.offsetTop+elNewListItem.offsetHeight) - elContent.offsetHeight; |
| } |
| } |
| } |
| |
| this._toggleHighlight(elNewListItem, "to"); |
| this.itemArrowToEvent.fire(this, elNewListItem); |
| YAHOO.log("Item arrowed to " + elNewListItem._nItemIndex, "info", this.toString()); |
| if(this.typeAhead) { |
| this._updateValue(elNewListItem); |
| } |
| } |
| }; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Private event handlers |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Handles <li> element mouseover events in the container. |
| * |
| * @method _onItemMouseover |
| * @param v {HTMLEvent} The mouseover event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| /*YAHOO.widget.AutoComplete.prototype._onItemMouseover = function(v,oSelf) { |
| if(oSelf.prehighlightClassName) { |
| oSelf._togglePrehighlight(this,"mouseover"); |
| } |
| else { |
| oSelf._toggleHighlight(this,"to"); |
| } |
| |
| oSelf.itemMouseOverEvent.fire(oSelf, this); |
| YAHOO.log("Item moused over", "info", oSelf.toString()); |
| };*/ |
| |
| /** |
| * Handles <li> element mouseout events in the container. |
| * |
| * @method _onItemMouseout |
| * @param v {HTMLEvent} The mouseout event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| /*YAHOO.widget.AutoComplete.prototype._onItemMouseout = function(v,oSelf) { |
| if(oSelf.prehighlightClassName) { |
| oSelf._togglePrehighlight(this,"mouseout"); |
| } |
| else { |
| oSelf._toggleHighlight(this,"from"); |
| } |
| |
| oSelf.itemMouseOutEvent.fire(oSelf, this); |
| YAHOO.log("Item moused out", "info", oSelf.toString()); |
| };*/ |
| |
| /** |
| * Handles <li> element click events in the container. |
| * |
| * @method _onItemMouseclick |
| * @param v {HTMLEvent} The click event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| /*YAHOO.widget.AutoComplete.prototype._onItemMouseclick = function(v,oSelf) { |
| // In case item has not been moused over |
| oSelf._toggleHighlight(this,"to"); |
| oSelf._selectItem(this); |
| };*/ |
| |
| /** |
| * Handles container mouseover events. |
| * |
| * @method _onContainerMouseover |
| * @param v {HTMLEvent} The mouseover event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onContainerMouseover = function(v,oSelf) { |
| var elTarget = YAHOO.util.Event.getTarget(v); |
| var elTag = elTarget.nodeName.toLowerCase(); |
| while(elTarget && (elTag != "table")) { |
| switch(elTag) { |
| case "body": |
| return; |
| case "li": |
| if(oSelf.prehighlightClassName) { |
| oSelf._togglePrehighlight(elTarget,"mouseover"); |
| } |
| else { |
| oSelf._toggleHighlight(elTarget,"to"); |
| } |
| |
| oSelf.itemMouseOverEvent.fire(oSelf, elTarget); |
| YAHOO.log("Item moused over " + elTarget._nItemIndex, "info", oSelf.toString()); |
| break; |
| case "div": |
| if(YAHOO.util.Dom.hasClass(elTarget,"yui-ac-container")) { |
| oSelf._bOverContainer = true; |
| return; |
| } |
| break; |
| default: |
| break; |
| } |
| |
| elTarget = elTarget.parentNode; |
| if(elTarget) { |
| elTag = elTarget.nodeName.toLowerCase(); |
| } |
| } |
| }; |
| |
| /** |
| * Handles container mouseout events. |
| * |
| * @method _onContainerMouseout |
| * @param v {HTMLEvent} The mouseout event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onContainerMouseout = function(v,oSelf) { |
| var elTarget = YAHOO.util.Event.getTarget(v); |
| var elTag = elTarget.nodeName.toLowerCase(); |
| while(elTarget && (elTag != "table")) { |
| switch(elTag) { |
| case "body": |
| return; |
| case "li": |
| if(oSelf.prehighlightClassName) { |
| oSelf._togglePrehighlight(elTarget,"mouseout"); |
| } |
| else { |
| oSelf._toggleHighlight(elTarget,"from"); |
| } |
| |
| oSelf.itemMouseOutEvent.fire(oSelf, elTarget); |
| YAHOO.log("Item moused out " + elTarget._nItemIndex, "info", oSelf.toString()); |
| break; |
| case "ul": |
| oSelf._toggleHighlight(oSelf._elCurListItem,"to"); |
| break; |
| case "div": |
| if(YAHOO.util.Dom.hasClass(elTarget,"yui-ac-container")) { |
| oSelf._bOverContainer = false; |
| return; |
| } |
| break; |
| default: |
| break; |
| } |
| |
| elTarget = elTarget.parentNode; |
| if(elTarget) { |
| elTag = elTarget.nodeName.toLowerCase(); |
| } |
| } |
| }; |
| |
| /** |
| * Handles container click events. |
| * |
| * @method _onContainerClick |
| * @param v {HTMLEvent} The click event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onContainerClick = function(v,oSelf) { |
| var elTarget = YAHOO.util.Event.getTarget(v); |
| var elTag = elTarget.nodeName.toLowerCase(); |
| while(elTarget && (elTag != "table")) { |
| switch(elTag) { |
| case "body": |
| return; |
| case "li": |
| // In case item has not been moused over |
| oSelf._toggleHighlight(elTarget,"to"); |
| oSelf._selectItem(elTarget); |
| return; |
| default: |
| break; |
| } |
| |
| elTarget = elTarget.parentNode; |
| if(elTarget) { |
| elTag = elTarget.nodeName.toLowerCase(); |
| } |
| } |
| }; |
| |
| |
| /** |
| * Handles container scroll events. |
| * |
| * @method _onContainerScroll |
| * @param v {HTMLEvent} The scroll event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onContainerScroll = function(v,oSelf) { |
| oSelf._elTextbox.focus(); |
| }; |
| |
| /** |
| * Handles container resize events. |
| * |
| * @method _onContainerResize |
| * @param v {HTMLEvent} The resize event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onContainerResize = function(v,oSelf) { |
| oSelf._toggleContainerHelpers(oSelf._bContainerOpen); |
| }; |
| |
| |
| /** |
| * Handles textbox keydown events of functional keys, mainly for UI behavior. |
| * |
| * @method _onTextboxKeyDown |
| * @param v {HTMLEvent} The keydown event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onTextboxKeyDown = function(v,oSelf) { |
| var nKeyCode = v.keyCode; |
| |
| // Clear timeout |
| if(oSelf._nTypeAheadDelayID != -1) { |
| clearTimeout(oSelf._nTypeAheadDelayID); |
| } |
| |
| switch (nKeyCode) { |
| case 9: // tab |
| if(!YAHOO.env.ua.opera && (navigator.userAgent.toLowerCase().indexOf("mac") == -1) || (YAHOO.env.ua.webkit>420)) { |
| // select an item or clear out |
| if(oSelf._elCurListItem) { |
| if(oSelf.delimChar && (oSelf._nKeyCode != nKeyCode)) { |
| if(oSelf._bContainerOpen) { |
| YAHOO.util.Event.stopEvent(v); |
| } |
| } |
| oSelf._selectItem(oSelf._elCurListItem); |
| } |
| else { |
| oSelf._toggleContainer(false); |
| } |
| } |
| break; |
| case 13: // enter |
| if(!YAHOO.env.ua.opera && (navigator.userAgent.toLowerCase().indexOf("mac") == -1) || (YAHOO.env.ua.webkit>420)) { |
| if(oSelf._elCurListItem) { |
| if(oSelf._nKeyCode != nKeyCode) { |
| if(oSelf._bContainerOpen) { |
| YAHOO.util.Event.stopEvent(v); |
| } |
| } |
| oSelf._selectItem(oSelf._elCurListItem); |
| } |
| else { |
| oSelf._toggleContainer(false); |
| } |
| } |
| break; |
| case 27: // esc |
| oSelf._toggleContainer(false); |
| return; |
| case 39: // right |
| oSelf._jumpSelection(); |
| break; |
| case 38: // up |
| if(oSelf._bContainerOpen) { |
| YAHOO.util.Event.stopEvent(v); |
| oSelf._moveSelection(nKeyCode); |
| } |
| break; |
| case 40: // down |
| if(oSelf._bContainerOpen) { |
| YAHOO.util.Event.stopEvent(v); |
| oSelf._moveSelection(nKeyCode); |
| } |
| break; |
| default: |
| oSelf._bItemSelected = false; |
| oSelf._toggleHighlight(oSelf._elCurListItem, "from"); |
| |
| oSelf.textboxKeyEvent.fire(oSelf, nKeyCode); |
| YAHOO.log("Textbox keyed", "info", oSelf.toString()); |
| break; |
| } |
| |
| if(nKeyCode === 18){ |
| oSelf._enableIntervalDetection(); |
| } |
| oSelf._nKeyCode = nKeyCode; |
| }; |
| |
| /** |
| * Handles textbox keypress events. |
| * @method _onTextboxKeyPress |
| * @param v {HTMLEvent} The keypress event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onTextboxKeyPress = function(v,oSelf) { |
| var nKeyCode = v.keyCode; |
| |
| // Expose only to non SF3 (bug 1978549) Mac browsers (bug 790337) and Opera browsers (bug 583531), |
| // where stopEvent is ineffective on keydown events |
| if(YAHOO.env.ua.opera || (navigator.userAgent.toLowerCase().indexOf("mac") != -1) && (YAHOO.env.ua.webkit < 420)) { |
| switch (nKeyCode) { |
| case 9: // tab |
| // select an item or clear out |
| if(oSelf._bContainerOpen) { |
| if(oSelf.delimChar) { |
| YAHOO.util.Event.stopEvent(v); |
| } |
| if(oSelf._elCurListItem) { |
| oSelf._selectItem(oSelf._elCurListItem); |
| } |
| else { |
| oSelf._toggleContainer(false); |
| } |
| } |
| break; |
| case 13: // enter |
| if(oSelf._bContainerOpen) { |
| YAHOO.util.Event.stopEvent(v); |
| if(oSelf._elCurListItem) { |
| oSelf._selectItem(oSelf._elCurListItem); |
| } |
| else { |
| oSelf._toggleContainer(false); |
| } |
| } |
| break; |
| default: |
| break; |
| } |
| } |
| |
| //TODO: (?) limit only to non-IE, non-Mac-FF for Korean IME support (bug 811948) |
| // Korean IME detected |
| else if(nKeyCode == 229) { |
| oSelf._enableIntervalDetection(); |
| } |
| }; |
| |
| /** |
| * Handles textbox keyup events to trigger queries. |
| * |
| * @method _onTextboxKeyUp |
| * @param v {HTMLEvent} The keyup event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onTextboxKeyUp = function(v,oSelf) { |
| var sText = this.value; //string in textbox |
| |
| // Check to see if any of the public properties have been updated |
| oSelf._initProps(); |
| |
| // Filter out chars that don't trigger queries |
| var nKeyCode = v.keyCode; |
| if(oSelf._isIgnoreKey(nKeyCode)) { |
| return; |
| } |
| |
| // Clear previous timeout |
| /*if(oSelf._nTypeAheadDelayID != -1) { |
| clearTimeout(oSelf._nTypeAheadDelayID); |
| }*/ |
| if(oSelf._nDelayID != -1) { |
| clearTimeout(oSelf._nDelayID); |
| } |
| |
| // Set new timeout |
| oSelf._nDelayID = setTimeout(function(){ |
| oSelf._sendQuery(sText); |
| },(oSelf.queryDelay * 1000)); |
| |
| //= nDelayID; |
| //else { |
| // No delay so send request immediately |
| //oSelf._sendQuery(sText); |
| //} |
| }; |
| |
| /** |
| * Handles text input box receiving focus. |
| * |
| * @method _onTextboxFocus |
| * @param v {HTMLEvent} The focus event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onTextboxFocus = function (v,oSelf) { |
| // Start of a new interaction |
| if(!oSelf._bFocused) { |
| oSelf._elTextbox.setAttribute("autocomplete","off"); |
| oSelf._bFocused = true; |
| oSelf._sInitInputValue = oSelf._elTextbox.value; |
| oSelf.textboxFocusEvent.fire(oSelf); |
| YAHOO.log("Textbox focused", "info", oSelf.toString()); |
| } |
| }; |
| |
| /** |
| * Handles text input box losing focus. |
| * |
| * @method _onTextboxBlur |
| * @param v {HTMLEvent} The focus event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onTextboxBlur = function (v,oSelf) { |
| // Don't treat as a blur if it was a selection via mouse click |
| if(!oSelf._bOverContainer || (oSelf._nKeyCode == 9)) { |
| // Current query needs to be validated as a selection |
| if(!oSelf._bItemSelected) { |
| var elMatchListItem = oSelf._textMatchesOption(); |
| // Container is closed or current query doesn't match any result |
| if(!oSelf._bContainerOpen || (oSelf._bContainerOpen && (elMatchListItem === null))) { |
| // Force selection is enabled so clear the current query |
| if(oSelf.forceSelection) { |
| oSelf._clearSelection(); |
| } |
| // Treat current query as a valid selection |
| else { |
| oSelf.unmatchedItemSelectEvent.fire(oSelf, oSelf._sCurQuery); |
| YAHOO.log("Unmatched item selected: " + oSelf._sCurQuery, "info", oSelf.toString()); |
| } |
| } |
| // Container is open and current query matches a result |
| else { |
| // Force a selection when textbox is blurred with a match |
| if(oSelf.forceSelection) { |
| oSelf._selectItem(elMatchListItem); |
| } |
| } |
| } |
| |
| if(oSelf._bContainerOpen) { |
| oSelf._toggleContainer(false); |
| } |
| oSelf._clearInterval(); |
| oSelf._bFocused = false; |
| if(oSelf._sInitInputValue !== oSelf._elTextbox.value) { |
| oSelf.textboxChangeEvent.fire(oSelf); |
| } |
| oSelf.textboxBlurEvent.fire(oSelf); |
| YAHOO.log("Textbox blurred", "info", oSelf.toString()); |
| } |
| }; |
| |
| /** |
| * Handles window unload event. |
| * |
| * @method _onWindowUnload |
| * @param v {HTMLEvent} The unload event. |
| * @param oSelf {YAHOO.widget.AutoComplete} The AutoComplete instance. |
| * @private |
| */ |
| YAHOO.widget.AutoComplete.prototype._onWindowUnload = function(v,oSelf) { |
| if(oSelf && oSelf._elTextbox && oSelf.allowBrowserAutocomplete) { |
| oSelf._elTextbox.setAttribute("autocomplete","on"); |
| } |
| }; |
| |
| ///////////////////////////////////////////////////////////////////////////// |
| // |
| // Deprecated for Backwards Compatibility |
| // |
| ///////////////////////////////////////////////////////////////////////////// |
| /** |
| * @method doBeforeSendQuery |
| * @deprecated Use generateRequest. |
| */ |
| YAHOO.widget.AutoComplete.prototype.doBeforeSendQuery = function(sQuery) { |
| return this.generateRequest(sQuery); |
| }; |
| |
| /** |
| * @method getListItems |
| * @deprecated Use getListEl().childNodes. |
| */ |
| YAHOO.widget.AutoComplete.prototype.getListItems = function() { |
| var allListItemEls = [], |
| els = this._elList.childNodes; |
| for(var i=els.length-1; i>=0; i--) { |
| allListItemEls[i] = els[i]; |
| } |
| return allListItemEls; |
| }; |
| |
| ///////////////////////////////////////////////////////////////////////// |
| // |
| // Private static methods |
| // |
| ///////////////////////////////////////////////////////////////////////// |
| |
| /** |
| * Clones object literal or array of object literals. |
| * |
| * @method AutoComplete._cloneObject |
| * @param o {Object} Object. |
| * @private |
| * @static |
| */ |
| YAHOO.widget.AutoComplete._cloneObject = function(o) { |
| if(!YAHOO.lang.isValue(o)) { |
| return o; |
| } |
| |
| var copy = {}; |
| |
| if(YAHOO.lang.isFunction(o)) { |
| copy = o; |
| } |
| else if(YAHOO.lang.isArray(o)) { |
| var array = []; |
| for(var i=0,len=o.length;i<len;i++) { |
| array[i] = YAHOO.widget.AutoComplete._cloneObject(o[i]); |
| } |
| copy = array; |
| } |
| else if(YAHOO.lang.isObject(o)) { |
| for (var x in o){ |
| if(YAHOO.lang.hasOwnProperty(o, x)) { |
| if(YAHOO.lang.isValue(o[x]) && YAHOO.lang.isObject(o[x]) || YAHOO.lang.isArray(o[x])) { |
| copy[x] = YAHOO.widget.AutoComplete._cloneObject(o[x]); |
| } |
| else { |
| copy[x] = o[x]; |
| } |
| } |
| } |
| } |
| else { |
| copy = o; |
| } |
| |
| return copy; |
| }; |
| |
| |
| |
| |
| YAHOO.register("autocomplete", YAHOO.widget.AutoComplete, {version: "2.6.0", build: "1321"}); |