Author: vmolotkov
Date: 2007-12-28 11:14:31 -0500 (Fri, 28 Dec 2007)
New Revision: 5084
Modified:
trunk/sandbox/ui/combobox/src/main/java/org/richfaces/renderkit/ComboBoxBaseRenderer.java
trunk/sandbox/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js
trunk/sandbox/ui/combobox/src/main/templates/combobox.jspx
Log:
filtering of data was added
Modified:
trunk/sandbox/ui/combobox/src/main/java/org/richfaces/renderkit/ComboBoxBaseRenderer.java
===================================================================
---
trunk/sandbox/ui/combobox/src/main/java/org/richfaces/renderkit/ComboBoxBaseRenderer.java 2007-12-28
15:58:20 UTC (rev 5083)
+++
trunk/sandbox/ui/combobox/src/main/java/org/richfaces/renderkit/ComboBoxBaseRenderer.java 2007-12-28
16:14:31 UTC (rev 5084)
@@ -1,6 +1,7 @@
package org.richfaces.renderkit;
import java.io.IOException;
+import java.util.Collections;
import java.util.HashMap;
import java.util.Iterator;
import java.util.List;
@@ -11,6 +12,7 @@
import javax.faces.context.ResponseWriter;
import org.ajax4jsf.javascript.JSFunction;
+import org.ajax4jsf.javascript.ScriptUtils;
import org.ajax4jsf.renderkit.HeaderResourcesRendererBase;
import org.ajax4jsf.renderkit.RendererUtils.HTML;
import org.richfaces.component.UIComboBox;
@@ -57,7 +59,7 @@
UIComboBox comboBox = (UIComboBox)component;
List <String> suggestionValues = comboBox.getSuggestionValues();
ResponseWriter writer = context.getResponseWriter();
-
+ Collections.sort(suggestionValues);
if (suggestionValues != null) {
for (Iterator <String> iterator = suggestionValues.iterator();
iterator.hasNext();) {
String suggestion = iterator .next();
@@ -87,4 +89,12 @@
return (function.toString() + ";");
}*/
+
+ public String getItemsTextAsJSArray(FacesContext context, UIComponent component) {
+ UIComboBox comboBox = (UIComboBox)component;
+ List <String> suggestionValues = comboBox.getSuggestionValues();
+
+ Collections.sort(suggestionValues); //FIXME
+ return ScriptUtils.toScript(suggestionValues);
+ }
}
Modified:
trunk/sandbox/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js
===================================================================
---
trunk/sandbox/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js 2007-12-28
15:58:20 UTC (rev 5083)
+++
trunk/sandbox/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js 2007-12-28
16:14:31 UTC (rev 5084)
@@ -2,9 +2,9 @@
Richfaces.ComboBox = Class.create();
Richfaces.ComboBox.prototype = {
- initialize: function(combobox, listId, fieldId, buttonId, classes, listWidth,
listHeight) {
+ initialize: function(combobox, listId, fieldId, buttonId, classes, listWidth,
listHeight, itemsText) {
this.combobox = $(combobox);
- this.comboList = new Richfaces.ComboBoxList(listId, classes, listWidth, listHeight);
+ this.comboList = new Richfaces.ComboBoxList(listId, classes, listWidth, listHeight,
itemsText);
this.field = $(fieldId);
this.button = $(buttonId);
@@ -15,16 +15,17 @@
this.button.observe("click",
function(e){this.clickHandler(e);}.bindAsEventListener(this));
this.field.observe("keydown",
function(e){this.keyboardManager(e);}.bindAsEventListener(this));
//this.field.observe("blur",
function(e){this.focusHandler(e);}.bindAsEventListener(this));
- this.field.observe("change",
function(e){this.dataUpdating(e);}.bindAsEventListener(this));
+ this.field.observe("keyup",
function(e){this.dataUpdating(e);}.bindAsEventListener(this));
- this.comboList.list.observe("mousemove",
function(e){this.listListener(e)}.bindAsEventListener(this));
- this.comboList.list.observe("click",
function(e){this.valueHandler(e);}.bindAsEventListener(this));
+ this.comboList.listParent.observe("mousemove",
function(e){this.listListener(e)}.bindAsEventListener(this));
+ this.comboList.listParent.observe("click",
function(e){this.valueHandler(e);}.bindAsEventListener(this));
},
clickHandler : function(event) {
if (this.comboList.visible()) {
this.comboList.hide();
} else {
+ this.comboList.createDefaultList();
this.comboList.show();
}
this.field.focus();
@@ -39,11 +40,15 @@
},
valueHandler : function(event) {
- this.field.value = this.comboList.selectedItem.innerHTML;
+ this.setValue();
this.comboList.hide();
},
+ setValue : function() {
+ this.field.value = this.comboList.selectedItem.innerHTML;
+ },
+
keyboardManager : function(event) {
if ((event.keyCode == Event.KEY_UP) || (event.keyCode == Event.KEY_DOWN)) {
this.comboList.moveSelectedItem(event);
@@ -54,68 +59,83 @@
this.comboList.hide();
},
- dataUpdating : function() {
- this.comboList.setItems(this.comboList.dataFilter(this.field.value));
- this.comboList.show();
+ dataUpdating : function(event) {
+ //this.comboList.setItems(this.comboList.dataFilter(this.field.value));
+ if ((event.keyCode != Event.KEY_UP) && (event.keyCode != Event.KEY_DOWN)) {
+ this.comboList.dataFilter(this.field.value);
+ this.comboList.show();
+ }
+ this.setValue();
}
};
Richfaces.ComboBoxList = Class.create();
Richfaces.ComboBoxList.prototype = {
- initialize: function(listId, classes, width, height) {
+ initialize: function(listId, classes, width, height, itemsText) {
this.list = $(listId);
- this.items = this.getItems();
+ this.listParent = this.list.parentNode;
- this.currentItems = this.items;
+ this.itemsText = itemsText;
+ //this.items = this.getItems();
+
this.classes = classes;
this.selectedItem = null;
this.setSize(width, height);
},
+ createDefaultList : function() {
+ var items = new Array();
+ for (var i = 0; i < this.itemsText.length; i++) {
+ items.push(this.createItem(this.itemsText[i], this.classes.ITEM.NORMAL));
+ }
+ this.createNewList(items);
+ },
+
getItems : function() {
return this.list.childNodes;
},
show : function() {
- if (this.currentItems.length != 0) {
- this.selectItem(this.currentItems[0]);
+ var curItems = this.getItems();
+ if (curItems.length != 0) {
+ this.selectItem(curItems[0]);
}
- this.list.show();
+ this.listParent.show();
},
hide : function() {
this.resetState();
- this.list.hide();
+ this.listParent.hide();
},
visible : function() {
- return this.list.visible();
+ return this.listParent.visible();
},
setSize : function(width, height) {
- this.list.style.width = width + "px";
- this.list.style.height = height + "px";
+ this.listParent.style.width = width + "px";
+ this.listParent.style.height = height + "px";
},
scrolling : function(event) {
var increment;
- var listTop = Richfaces.ComboBoxList.getElemXY(this.list).top;
- var scrollTop = this.list.scrollTop;
+ var listTop = Richfaces.ComboBoxList.getElemXY(this.listParent).top;
+ var scrollTop = this.listParent.scrollTop;
var itemTop = Richfaces.ComboBoxList.getElemXY(this.selectedItem).top;
if ((event.keyCode == Event.KEY_UP) || (event.keyCode == 33)) {
increment = (itemTop - scrollTop) - listTop;
if (increment < 0) {
- this.list.scrollTop += increment;
+ this.listParent.scrollTop += increment;
}
} else if ((event.keyCode == Event.KEY_DOWN) || (event.keyCode == 34)) {
var itemBottom = itemTop + this.selectedItem.offsetHeight;
- var increment = (itemBottom - scrollTop) - (listTop + this.list.clientHeight);
+ var increment = (itemBottom - scrollTop) - (listTop + this.listParent.clientHeight);
if (increment > 0) {
- this.list.scrollTop += increment;
+ this.listParent.scrollTop += increment;
}
}
Event.stop(event);
@@ -142,7 +162,7 @@
getEventItem : function(event) {
var item = Event.findElement(event, "div");
- if ((item == null) || (item.id == this.list.id)) {
+ if ((item == null) || (item.id == this.listParent.id)) {
return;
}
return item;
@@ -165,31 +185,46 @@
},
itemsRearrangement : function(item, newItem) {
- this.normalizeItem(item);
+ //this.normalizeItem(item);
this.selectItem(newItem);
},
resetState : function() {
- this.normalizeItem(this.selectedItem);
+ if (this.selectedItem) {
+ this.normalizeItem(this.selectedItem);
+ }
this.selectedItem = null;
},
- setItems : function(newItems) {
- this.currentItems = newItems;
-
- this.list.innerHTML = newItems.join(""); //FIXME: to optimaize
+ dataFilter : function(text) {
+ this.createNewList(this.getFilteredItems(text));
},
- dataFilter : function(text) {
- var filteredData = new Array();
- for (var i = 0; i < this.items.length; i++) {
- var item = this.items[i];
- if (item.innerHTML.substr(0, text.length).toLowerCase() == text.toLowerCase()) {
//FIXME: to optimaize
- filteredData.push(item);
+ getFilteredItems : function(text) {
+
+ var items = new Array();
+ for (var i = 0; i < this.itemsText.length; i++) {
+ var itText = this.itemsText[i];
+ if (itText.substr(0, text.length).toLowerCase() == text.toLowerCase()) { //FIXME: to
optimaize
+ items.push(this.createItem(itText, this.classes.ITEM.NORMAL));
}
}
- return filteredData;
+ return items;
},
+
+ createNewList : function(items) {
+ //TODO: write code for IE
+ var tempList = this.list.cloneNode(false);
+ this.listParent.removeChild(this.listParent.firstChild);
+
+ tempList.innerHTML = items.join("");
+ this.listParent.appendChild(tempList);
+ this.list = this.listParent.firstChild;
+ },
+
+ createItem : function(text, className) {
+ return "<div class=" + className+ ">" + text +
"</div>";
+ }
}
Richfaces.ComboBoxList.getElemXY = function(elem) {
Modified: trunk/sandbox/ui/combobox/src/main/templates/combobox.jspx
===================================================================
--- trunk/sandbox/ui/combobox/src/main/templates/combobox.jspx 2007-12-28 15:58:20 UTC
(rev 5083)
+++ trunk/sandbox/ui/combobox/src/main/templates/combobox.jspx 2007-12-28 16:14:31 UTC
(rev 5084)
@@ -25,14 +25,17 @@
<input id="comboboxField#{clientId}" class=""
type="text" size="20" autocomplete="off"/>
<img id="comboboxButton#{clientId}" class=""
style="position:absolute; top:0pt; border:1px solid black;"
src="#{combo_img}"/>
</div>
- <div id="list#{clientId}" style="display:none"
class="rich-combobox-list">
- <f:call name="encodeItems"/>
+ <div id="listParent#{clientId}" style="display:none"
class="rich-combobox-list">
+ <div id="list#{clientId}">
+ <f:call name="encodeItems"/>
+ </div>
</div>
</div>
<script type="text/javascript">
var combobox = new Richfaces.ComboBox("#{clientId}",
"list#{clientId}",
"comboboxField#{clientId}",
- "comboboxButton#{clientId}", Richfaces.ComboBoxList.CLASSES, 100,
150);
+ "comboboxButton#{clientId}", Richfaces.ComboBoxList.CLASSES, 100,
150,
+ #{this:getItemsTextAsJSArray(context, component)});
</script>
</f:root>
\ No newline at end of file