Author: pyaschenko Date: 2011-01-26 13:10:37 -0500 (Wed, 26 Jan 2011) New Revision: 21241 Modified: trunk/core/impl/src/main/resources/META-INF/resources/richfaces.js trunk/examples/input-demo/src/main/webapp/examples/autocomplete.xhtml trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/Autocomplete.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js Log: http://jira.jboss.com/jira/browse/RF-9722 Modified: trunk/core/impl/src/main/resources/META-INF/resources/richfaces.js =================================================================== --- trunk/core/impl/src/main/resources/META-INF/resources/richfaces.js 2011-01-26 16:19:34 UTC (rev 21240) +++ trunk/core/impl/src/main/resources/META-INF/resources/richfaces.js 2011-01-26 18:10:37 UTC (rev 21241) @@ -595,4 +595,92 @@ window.attachEvent("onunload", richfaces.cleanDom); } }(jQuery, RichFaces)); + +// RichFaces.utils +// RichFaces.utils.cache +(function ($, rf) { + rf.utils = rf.utils || {}; + rf.utils.Cache = function (key, items, values, useCache) { + this.key = key.toLowerCase(); + this.cache = {}; + this.cache[this.key] = items || []; + this.originalValues = typeof values == "function" ? values(items) : values || this.cache[this.key]; + this.values = processValues(this.originalValues); + this.useCache = useCache || checkValuesPrefix.call(this); + }; + + var processValues = function (values) { + var processedValues = []; + for (var i = 0; i<values.length; i++) { + processedValues.push(values[i].toLowerCase()); + } + return processedValues; + }; + + var checkValuesPrefix = function () { + var result = true; + for (var i = 0; i<this.values.length; i++) { + if (this.values[i].indexOf(this.key)!=0) { + result = false; + break; + } + } + return result; + }; + + var getItems = function (key, filterFunction) { + key = key.toLowerCase(); + var newCache = []; + + if (key.length < this.key.length) { + return newCache; + } + + if (this.cache[key]) { + newCache = this.cache[key]; + } else { + var useCustomFilterFunction = typeof filterFunction == "function"; + var itemsCache = this.cache[this.key]; + for (var i = 0; i<this.values.length; i++) { + var value = this.values[i]; + if (useCustomFilterFunction && filterFunction(key, value)) { + newCache.push(itemsCache[i]); + } else { + var p = value.indexOf(key); + if (p == 0) { + newCache.push(itemsCache[i]); + } + } + } + + if ((!this.lastKey || key.indexOf(this.lastKey)!=0) && newCache.length > 0) { + this.cache[key] = newCache; + if (newCache.length==1) { + this.lastKey = key; + } + } + } + + return newCache; + }; + + var getItemValue = function (item) { + return this.originalValues[this.cache[this.key].index(item)]; + }; + + var isCached = function (key) { + key = key.toLowerCase(); + return this.cache[key] || this.useCache && key.indexOf(this.key)==0; + }; + + $.extend(rf.utils.Cache.prototype, (function () { + return { + getItems: getItems, + getItemValue: getItemValue, + isCached: isCached + }; + })()); + +})(jQuery, RichFaces); + Modified: trunk/examples/input-demo/src/main/webapp/examples/autocomplete.xhtml =================================================================== --- trunk/examples/input-demo/src/main/webapp/examples/autocomplete.xhtml 2011-01-26 16:19:34 UTC (rev 21240) +++ trunk/examples/input-demo/src/main/webapp/examples/autocomplete.xhtml 2011-01-26 18:10:37 UTC (rev 21241) @@ -68,7 +68,7 @@ </script> <br /> <select style="width: 200px" name="select"> - <option>ccccc</option> + <option>option 0</option><option>option 1</option><option>option 2</option><option>option 3</option><option>option 4</option><option>option 5</option><option>option 6</option><option>option 7</option><option>option 8</option><option>option 9</option><option>option 10</option><option>option 11</option><option>option 12</option><option>option 13</option><option>option 14</option><option>option 15</option><option>option 16</option><option>option 17</option><option>option 18</option><option>option 19</option><option>option 20</option><option>option 21</option><option>option 22</option><option>option 23</option><option>option 24</option><option>option 25</option><option>option 26</option><option>option 27</option><option>option 28</option><option>option 29</option><option>option 30</option><option>option 31</option><option>option 32</option><option>option 33</option><option>option 34</option><option>option 35</option><option>option 36</option><option>option 37</option><option! </option </select> &nbsp;text block text block text block text block text block text block text block text block text block text block text block text block text block text block text block text block text block text Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/Autocomplete.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/Autocomplete.js 2011-01-26 16:19:34 UTC (rev 21240) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/Autocomplete.js 2011-01-26 18:10:37 UTC (rev 21241) @@ -1,91 +1,5 @@ (function ($, rf) { - rf.utils = rf.utils || {}; - rf.utils.Cache = function (key, items, values, useCache) { - this.key = key.toLowerCase(); - this.cache = {}; - this.cache[this.key] = items || []; - this.originalValues = typeof values == "function" ? values(items) : values || this.cache[this.key]; - this.values = processValues(this.originalValues); - this.useCache = useCache || checkValuesPrefix.call(this); - }; - - var processValues = function (values) { - var processedValues = []; - for (var i = 0; i<values.length; i++) { - processedValues.push(values[i].toLowerCase()); - } - return processedValues; - }; - - var checkValuesPrefix = function () { - var result = true; - for (var i = 0; i<this.values.length; i++) { - if (this.values[i].indexOf(this.key)!=0) { - result = false; - break; - } - } - return result; - }; - - var getItems = function (key, filterFunction) { - key = key.toLowerCase(); - var newCache = []; - - if (key.length < this.key.length) { - return newCache; - } - - if (this.cache[key]) { - newCache = this.cache[key]; - } else { - var useCustomFilterFunction = typeof filterFunction == "function"; - var itemsCache = this.cache[this.key]; - for (var i = 0; i<this.values.length; i++) { - var value = this.values[i]; - if (useCustomFilterFunction && filterFunction(key, value)) { - newCache.push(itemsCache[i]); - } else { - var p = value.indexOf(key); - if (p == 0) { - newCache.push(itemsCache[i]); - } - } - } - - if ((!this.lastKey || key.indexOf(this.lastKey)!=0) && newCache.length > 0) { - this.cache[key] = newCache; - if (newCache.length==1) { - this.lastKey = key; - } - } - } - - return newCache; - }; - - var getItemValue = function (item) { - return this.originalValues[this.cache[this.key].index(item)]; - }; - - var isCached = function (key) { - key = key.toLowerCase(); - return this.cache[key] || this.useCache && key.indexOf(this.key)==0; - }; - - $.extend(rf.utils.Cache.prototype, (function () { - return { - getItems: getItems, - getItemValue: getItemValue, - isCached: isCached - }; - })()); - -})(jQuery, RichFaces); - -(function ($, rf) { - /* * TODO: add user's event handlers call from options * TODO: add fire events @@ -103,6 +17,8 @@ this.value = ""; this.index = null; this.isFirstAjax = true; + this.lastMouseX = null; + this.lastMouseY = null; updateTokenOptions.call(this); bindEventHandlers.call(this); updateItemsList.call(this, ""); @@ -158,16 +74,42 @@ }; var bindEventHandlers = function () { - rf.Event.bind(rf.getDomElement(this.id+ID.ITEMS).parentNode, "click"+this.namespace+" mouseover"+this.namespace, onMouseAction, this); + var handlers = {}; + handlers["click"+this.namespace] = handlers["mouseover"+this.namespace] = onMouseAction; + if (!$.browser.msie && !$.browser.opera) { + handlers["mouseenter"+this.namespace] = onMouseEnter; + handlers["mouseleave"+this.namespace] = onMouseLeave; + } + rf.Event.bind(rf.getDomElement(this.id+ID.ITEMS).parentNode, handlers, this); }; + + var onMouseLeave = function(event) { + rf.Event.unbind(rf.getDomElement(this.id+ID.ITEMS).parentNode, "mousemove"+this.namespace); + this.lastMouseX = null; + this.lastMouseY = null; + }; + + var onMouseMove = function(event) { + this.lastMouseX = event.pageX; this.lastMouseY = event.pageY; + }; + + var onMouseEnter = function(event) { + this.lastMouseX = event.pageX; this.lastMouseY = event.pageY; + rf.Event.bind(rf.getDomElement(this.id+ID.ITEMS).parentNode, "mousemove"+this.namespace, onMouseMove, this); + }; var onMouseAction = function(event) { var element = $(event.target).closest("."+this.options.itemClass, event.currentTarget).get(0); if (element) { if (event.type=="mouseover") { - var index = this.items.index(element); - selectItem.call(this, event, index); + if (this.lastMouseX==null || this.lastMouseX!=event.pageX || this.lastMouseY!=event.pageY) + { + //window.console && console.log && console.log("[mouseover] lastMouseX:" + this.lastMouseX+" lastMouseY:" + this.lastMouseY); + //window.console && console.log && console.log("[mouseover] pageX:" + event.pageX+" pageY:" + event.pageY); + var index = this.items.index(element); + selectItem.call(this, event, index); + } } else { this.__onEnter(event); rf.Selection.setCaretTo(rf.getDomElement(this.fieldId)); @@ -296,7 +238,6 @@ this.items = $(newItems); //TODO: works only with simple markup, not with <tr> $(rf.getDomElement(this.id+ID.ITEMS)).empty().append(this.items); - window.console && console.log && console.log("updateItemsFromCache"); }; var clearItems = function () { Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js 2011-01-26 16:19:34 UTC (rev 21240) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/popupList.js 2011-01-26 18:10:37 UTC (rev 21241) @@ -3,6 +3,7 @@ rf.ui = rf.ui || {}; rf.ui.PopupList = function(id, listener, options) { + this.namespace = this.namespace || "."+rf.Event.createNamespace(this.name, id); var mergedOptions = $.extend({}, defaultOptions, options); $super.constructor.call(this, id, mergedOptions); this.selectListener = listener; @@ -11,9 +12,10 @@ this.itemCss = mergedOptions.itemCss; this.listCss = mergedOptions.listCss; this.index = -1; - this.popup.bind("mouseover", $.proxy(this.__onMouseOver, this)); - this.popup.bind("click", $.proxy(this.__onClick, this)); + this.lastMouseX = null; + this.lastMouseY = null; + bindEventHandlers.call(this); this.__updateItemsList(); }; @@ -25,7 +27,48 @@ positionType: "DROPDOWN", positionOffset: [0,0] }; - + + var bindEventHandlers = function () { + var handlers = {}; + handlers["click"+this.namespace] = onClick; + handlers["mouseover"+this.namespace] = onMouseOver; + if (!$.browser.msie && !$.browser.opera) { + handlers["mouseenter"+this.namespace] = onMouseEnter; + handlers["mouseleave"+this.namespace] = onMouseLeave; + } + rf.Event.bind(this.popup, handlers, this); + }; + + var onMouseLeave = function(e) { + rf.Event.unbind(this.popup, "mousemove"+this.namespace); + this.lastMouseX = null; + this.lastMouseY = null; + }; + + var onMouseMove = function(e) { + this.lastMouseX = e.pageX; this.lastMouseY = e.pageY; + }; + + var onMouseEnter = function(e) { + this.lastMouseX = e.pageX; this.lastMouseY = e.pageY; + rf.Event.bind(this.popup, "mousemove"+this.namespace, onMouseMove, this); + }; + + var onMouseOver = function(e) { + if (this.lastMouseX==null || this.lastMouseX!=e.pageX || this.lastMouseY!=e.pageY) + { + var item = this.__getItem(e); + if(item) { + this.__select(item); + } + } + }; + + var onClick = function(e) { + var item = this.__getItem(e); + this.processItem(item); + this.__select(item); + }; $.extend(rf.ui.PopupList.prototype, ( function () { @@ -145,19 +188,6 @@ __selectNext: function() { this.__selectByIndex(1, true); }, - - __onMouseOver: function(e) { - var item = this.__getItem(e); - if(item) { - this.__select(item); - } - }, - - __onClick: function(e) { - var item = this.__getItem(e); - this.processItem(item); - this.__select(item); - }, __getItem: function(e) { return $(e.target).closest("."+this.itemCss, e.currentTarget).get(0); Modified: trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js =================================================================== --- trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2011-01-26 16:19:34 UTC (rev 21240) +++ trunk/ui/input/ui/src/main/resources/META-INF/resources/org.richfaces/select.js 2011-01-26 18:10:37 UTC (rev 21241) @@ -1,99 +1,5 @@ -//TODO anton -> Cache impl should be moved to the utils - (function ($, rf) { - rf.utils = rf.utils || {}; - - rf.utils.Cache = function (key, items, values, useCache) { - this.key = key.toLowerCase(); - this.cache = {} - this.cache[this.key] = items || []; - this.originalValues = typeof values == "function" ? values(items) : values || this.cache[this.key]; - this.values = processValues(this.originalValues); - this.useCache = useCache || checkValuesPrefix.call(this); - }; - var processValues = function (values) { - var processedValues = []; - for (var i = 0; i<values.length; i++) { - processedValues.push(values[i].toLowerCase()); - } - return processedValues; - } - - var checkValuesPrefix = function () { - var result = true; - for (var i = 0; i<this.values.length; i++) { - if (this.values[i].indexOf(this.key)!=0) { - result = false; break; - } - } - return result; - } - - var getItems = function (key, filterFunction) { - key = key.toLowerCase(); - var newCache = []; - - if (key.length < this.key.length) { - return newCache; - } - - if (this.cache[key]) { - newCache = this.cache[key]; - } else { - - var useCustomFilterFunction = typeof filterFunction == "function"; - var itemsCache = this.cache[this.key]; - - for (var i = 0; i<this.values.length; i++) { - var value = this.values[i]; - - if (useCustomFilterFunction && filterFunction(key, value)) { - newCache.push(itemsCache[i]); - } else { - var p = value.indexOf(key); - if (p == 0) { - newCache.push(itemsCache[i]); - } - } - } - - if ((!this.lastKey || key.indexOf(this.lastKey)!=0) && newCache.length > 0) { - this.cache[key] = newCache; - - if (newCache.length==1) { - this.lastKey = key; - } - } - } - - return newCache; - }; - - var getItemValue = function (item) { - return this.originalValues[this.cache[this.key].index(item)]; - }; - - var isCached = function (key) { - key = key.toLowerCase(); - return this.cache[key] || this.useCache && key.indexOf(this.key)==0; - }; - - $.extend(rf.utils.Cache.prototype, (function () { - return { - getItems: getItems, - getItemValue: getItemValue, - isCached: isCached - }; - })()); - - -})(jQuery, RichFaces); - -//--> - -(function ($, rf) { - rf.ui = rf.ui || {}; rf.ui.Select = function(id, options) {