Author: abelevich Date: 2008-10-03 07:07:11 -0400 (Fri, 03 Oct 2008) New Revision: 10657 Modified: trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxUtils.js trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxstyles.js trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combolist.js Log: https://jira.jboss.org/jira/browse/RF-3630 Modified: trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js =================================================================== --- trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js 2008-10-03 09:37:32 UTC (rev 10656) +++ trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combobox.js 2008-10-03 11:07:11 UTC (rev 10657) @@ -12,21 +12,19 @@ this.directInputSuggestions = directInputSuggestions; this.filterNewValue = filterNewValue; this.combobox = $(combobox); - this.comboValue = $(valueFieldId); - this.field = $(fieldId); + this.comboValue = document.getElementById(valueFieldId); + this.field = document.getElementById(fieldId); + this.tempItem; + this.BUTTON_WIDTH = 17; //px this.classes = Richfaces.mergeStyles(userStyles,commonStyles); - //this.field.prevValue = null; + this.button = document.getElementById(buttonId); + this.buttonBG = document.getElementById(buttonBGId); - this.button = $(buttonId); - this.buttonBG = $(buttonBGId); - this.setInputWidth(); -// var fieldDem = Richfaces.ComboBoxList.getElemXY(this.field); -// fieldDem.height = this.field.offsetHeight; listWidth = (!listWidth) ? this.getCurrentWidth() : listWidth; this.comboList = new Richfaces.ComboBoxList(listId, parentListId, selectFirstOnUpdate, filterNewValue, this.classes.combolist, listWidth, @@ -37,8 +35,6 @@ var item = this.comboList.findItemBySubstr(value); if (item) { this.comboList.doSelectItem(item); -// initialize moved to the template http://jira.jboss.com/jira/browse/RF-2956 -// this.comboValue.value = item.innerHTML.unescapeHTML(); } } else { if (this.defaultMessage) { @@ -56,9 +52,6 @@ } if (Richfaces.browser.isIE6) { - //http://jira.jboss.com/jira/browse/RF-3255 -// this.comboList.createIframe(this.comboList.listParent.parentNode, listWidth, this.combobox.id, -// "rich-combobox-list-width rich-combobox-list-scroll rich-combobox-list-position"); this.comboList.createIframe(this.comboList.listParent.parentNode, listWidth, this.combobox.id, "rich-combobox-list-width rich-combobox-list-scroll rich-combobox-list-position"); } @@ -67,32 +60,25 @@ }, initHandlers : function() { - this.button.observe("click", function(e){this.buttonClickHandler(e);}.bindAsEventListener(this)); - this.button.observe("mouseup", function(e){this.buttonMouseUpHandler(e);}.bindAsEventListener(this)); - this.button.observe("mousedown", function(e){this.buttonMousedownHandler(e);}.bindAsEventListener(this)); - this.button.observe("mouseover", function(e){this.buttonMouseOverHandler(e);}.bindAsEventListener(this)); - this.button.observe("mouseout", function(e){this.buttonMouseOutHandler(e);}.bindAsEventListener(this)); + Event.observe(this.button, "click", this.buttonClickHandler.bindAsEventListener(this)); + Event.observe(this.button, "mouseup", this.buttonMouseUpHandler.bindAsEventListener(this)); + Event.observe(this.button, "mousedown", this.buttonMousedownHandler.bindAsEventListener(this)); + Event.observe(this.button, "mouseover", this.buttonMouseOverHandler.bindAsEventListener(this)); + Event.observe(this.button, "mouseout", this.buttonMouseOutHandler.bindAsEventListener(this)); - this.field.observe("keydown", function(e){this.fieldKeyDownHandler(e);}.bindAsEventListener(this)); - this.field.observe("blur", function(e){this.fieldBlurHandler(e);}.bindAsEventListener(this)); - this.field.observe("focus", function(e){this.fieldFocusHandler(e);}.bindAsEventListener(this)); - this.field.observe("keyup", function(e){this.dataUpdating(e);}.bindAsEventListener(this)); + Event.observe(this.field, "keydown", this.fieldKeyDownHandler.bindAsEventListener(this)); + Event.observe(this.field, "blur", this.fieldBlurHandler.bindAsEventListener(this)); + Event.observe(this.field, "focus", this.fieldFocusHandler.bindAsEventListener(this)); + Event.observe(this.field, "keyup", this.dataUpdating.bindAsEventListener(this)); - this.comboList.listParent.observe("mousedown", function(e){this.listMousedownHandler(e);}.bindAsEventListener(this)); - this.comboList.listParent.observe("mouseup", function(e){this.listMouseUpHandler(e);}.bindAsEventListener(this)); - this.comboList.listParent.observe("mousemove", function(e){this.listMouseMoveHandler(e)}.bindAsEventListener(this)); - this.comboList.listParent.observe("click", function(e){this.listClickHandler(e);}.bindAsEventListener(this)); + Event.observe(this.comboList.listParent, "mousedown", this.listMousedownHandler.bindAsEventListener(this)); + Event.observe(this.comboList.listParent, "mouseup", this.listMouseUpHandler.bindAsEventListener(this)); + Event.observe(this.comboList.listParent, "mousemove", this.listMouseMoveHandler.bindAsEventListener(this)); + Event.observe(this.comboList.listParent, "click", this.listClickHandler.bindAsEventListener(this)); }, setInputWidth : function() { var width = (parseInt(this.field.parentNode.style.width) - this.BUTTON_WIDTH) + Richfaces.getBorderWidth(this.field, "lr"); -// if (Prototype.Browser.Gecko) { - //border width and padding width not included in the general component width -// width -= Richfaces.getPaddingWidth(this.field, "lr") -// + Richfaces.getPaddingWidth(this.button, "lr") -// + Richfaces.getBorderWidth(this.field, "lr") -// + Richfaces.getBorderWidth(this.button, "lr"); -// } this.field.style.width = width + "px"; }, @@ -127,10 +113,15 @@ if (this.isActive()) { this.button.className= classCss.active + " " + classCss.hovered; - this.button.style.backgroundImage = iconStyles.active; + if (!iconStyles.active.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.active}); + } + } else { this.button.className = classCss.normal + " " + classCss.hovered; - this.button.style.backgroundImage = iconStyles.normal; + if (!iconStyles.normal.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.normal}); + } } }, @@ -140,34 +131,36 @@ if (this.isActive()) { this.button.className= classCss.active; - this.button.style.backgroundImage = iconStyles.active; + if (!iconStyles.active.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.active}); + } } else { this.button.className = classCss.normal; - this.button.style.backgroundImage = iconStyles.normal; + if (!iconStyles.normal.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.normal}); + } } }, listMouseMoveHandler : function(event) { //changes item's decoration - var item = this.comboList.getEventItem(event); - if (item) { - this.comboList.doActiveItem(this.comboList.getEventItem(event)); + var item = event.target; + if(Element.match(item,"span")) { + if (item && this.tempItem != item ) { + this.comboList.doActiveItem(item); + } + this.tempItem = item; } + }, - listMousedownHandler : function(e) { + listMousedownHandler : function(event) { if (Prototype.Browser.IE) { - if (!this.comboList.getEventItem(e)) { + if (!Element.match(event.target,"span")) { this.clickOnScroll = true; } - this.comboList.isList = true; - } else if (Prototype.Browser.Gecko) { - if (this.comboList.getEventItem(e)) { - this.comboList.isList = true; - } - } else { - this.comboList.isList = true; - } + } + this.comboList.isList = true; }, listMouseUpHandler : function(e) { @@ -321,7 +314,6 @@ if (this.directInputSuggestions) { var startInd = this.field.value.length; var endInd = value.length; - //this.field.prevValue = this.field.value; this.field.value = value; Richfaces.ComboBox.textboxSelect(this.field, startInd, endInd); } @@ -346,13 +338,16 @@ } var iconStyles = this.classes.buttonicon.style; - this.button.style.backgroundImage = iconStyles.active; - + if (!iconStyles.active.blank()) { + Element.setStyle(this.button, {backgroundImage:iconStyles.active}); + } + this.field.className = this.classes.field.classes.active; - Element.setStyle(this.field, this.classes.field.style.active); + Element.setStyle(this.field, this.classes.field.style.active); + this.isDisabled = false; }, - + disable : function() { this.button.className = this.classes.button.classes.disabled; this.buttonBG.className = this.classes.buttonbg.classes.disabled; @@ -360,12 +355,13 @@ Element.setStyle(this.field, this.classes.field.style.disabled); var iconStyles = this.classes.buttonicon.style; - this.button.style.backgroundImage = iconStyles.disabled; - + if(!iconStyles.disabled.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.disabled}); + } + this.button.disabled = true; this.field.disabled = true; - this.isDisabled = true; }, @@ -373,11 +369,14 @@ this.button.className = this.classes.button.classes.normal; this.buttonBG.className = this.classes.buttonbg.classes.normal; this.field.className = this.classes.field.classes.normal; - Element.setStyle(this.field, this.classes.field.style.normal); - + var fieldStyles = this.classes.field.style.normal; + Element.setStyle(this.field, fieldStyles); + var iconStyles = this.classes.buttonicon.style; - this.button.style.backgroundImage = iconStyles.normal; - + if(!iconStyles.normal.blank()) { + Element.setStyle(this.button,{backgroundImage : iconStyles.normal}); + } + this.button.disabled = false; this.field.disabled = false; this.isDisabled = false; Modified: trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxUtils.js =================================================================== --- trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxUtils.js 2008-10-03 09:37:32 UTC (rev 10656) +++ trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxUtils.js 2008-10-03 11:07:11 UTC (rev 10657) @@ -22,7 +22,7 @@ RichComboUtils.Condition = { ElementPresent : function(element) { return function () { - var el = $(element); + var el = document.getElementById(element); return el && el.offsetHeight > 0; }; } @@ -86,10 +86,8 @@ Richfaces.getStyles = function(el, sides, styles) { var val = 0; for(var i = 0, len = sides.length; i < len; i++){ - //if (el.getStyle) { var w = parseInt(Element.getStyle(el, styles[sides.charAt(i)]), 10); if(!isNaN(w)) val += w; - //} } return val; } Modified: trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxstyles.js =================================================================== --- trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxstyles.js 2008-10-03 09:37:32 UTC (rev 10656) +++ trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/comboboxstyles.js 2008-10-03 11:07:11 UTC (rev 10657) @@ -11,7 +11,7 @@ style : { normal: "", active: "", - disabled: ""} + disabled: ""} }, buttonbg : { @@ -45,7 +45,7 @@ classes :{ active : "rich-combobox-list-cord rich-combobox-list-scroll rich-combobox-list-decoration rich-combobox-list-position"}, style : {active: "" - } + } }, item : {normal : "rich-combobox-item", Modified: trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combolist.js =================================================================== --- trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combolist.js 2008-10-03 09:37:32 UTC (rev 10656) +++ trunk/ui/combobox/src/main/resources/org/richfaces/renderkit/html/scripts/combolist.js 2008-10-03 11:07:11 UTC (rev 10657) @@ -5,14 +5,13 @@ initialize: function(listId, parentListId, selectFirstOnUpdate, filterNewValues, classes, width, height, itemsText, onlistcall, fieldId, shadowId,decorationId, showDelay, hideDelay) { - this.list = $(listId); + this.list = document.getElementById(listId); this.listParent = $(parentListId); this.listParentContainer = this.listParent.parentNode; - //this.iframe = $(iframeId); this.iframe = null; - this.fieldElem = $(fieldId); + this.fieldElem = document.getElementById(fieldId); this.itemsText = itemsText; - this.shadowElem = $(shadowId); + this.shadowElem = document.getElementById(shadowId); this.onlistcall = onlistcall; if (this.onlistcall) { @@ -40,7 +39,7 @@ initDimensions : function() { this.listParent.style.visibility = "hidden"; - this.listParent.show(); + this.listParent.style.display = ""; var el = this.listParent.childNodes[1].firstChild; this.LAYOUT_BORDER_V = Richfaces.getBorderWidth(el, "tb"); @@ -48,7 +47,7 @@ this.LAYOUT_PADDING_V = Richfaces.getPaddingWidth(el, "tb"); this.LAYOUT_PADDING_H = Richfaces.getPaddingWidth(el, "lr"); - this.listParent.hide(); + this.listParent.style.display = "none"; this.listParent.style.visibility = "visible"; }, @@ -77,13 +76,12 @@ this.fieldDimensions.left = pos[0]; this.fieldDimensions.top = pos[1]; -// Richfaces.ComboBoxList.getElemXY(this.fieldElem); this.fieldDimensions.height = this.fieldElem.parentNode.offsetHeight; this.listParent.style.visibility = "hidden"; - this.listParent.show(); + this.listParent.style.display = ""; this.setSize(); - this.listParent.hide(); + this.listParent.style.display = "none"; this.listParent.style.visibility = "visible"; //attach list to the document body @@ -100,9 +98,9 @@ var items = this.getItems(); if (items.length != 0) { if (this.iframe) { - this.iframe.show(); + this.iframe.style.display=""; } - this.listParent.show(); + this.listParent.style.display = ""; if (this.selectFirstOnUpdate) { if (this.selectedItem) { this.doActiveItem(this.selectedItem); @@ -148,14 +146,14 @@ this.outjectListFromBody(this.listParentContainer, this.listParent); this.resetState(); if (this.iframe) { - this.iframe.hide(); + this.iframe.style.display= "none"; } var component = this.listParent.parentNode; component.style.position = "static"; component.style.zIndex = 0; - this.listParent.hide(); + this.listParent.style.display = "none"; }, visible : function() { @@ -209,7 +207,6 @@ setWidth : function(width) { var positionElem = this.listParent.childNodes[1]; var combobox = this.listParent.parentNode; - //positionElem.style.width = width; var correction = parseInt(width) - Richfaces.getBorderWidth(positionElem.firstChild, "lr") - Richfaces.getPaddingWidth(positionElem.firstChild, "lr") + "px"; this.list.style.width = correction; combobox.style.width = correction; @@ -220,7 +217,6 @@ setPosition : function(fieldTop, fieldLeft, fieldHeight) { var component = this.listParent.parentNode; - //component.style.position = "relative"; component.style.zIndex = 2; var docHeight = Richfaces.getDocumentHeight(); @@ -231,18 +227,11 @@ var showPoint = fieldHeight; if (parseInt(listHeight) > (docHeight - comBottom)) { if (topPosition > (docHeight - comBottom)) { - //topPosition = fieldTop - parseInt(listHeight); showPoint = -parseInt(listHeight); } } - /*this.listParent.style.left = fieldLeft + "px"; - this.listParent.style.top = topPosition + "px"; - - if (this.iframe) { - this.iframe.style.top = topPosition + "px"; - this.iframe.style.left = fieldLeft + "px"; - }*/ + this.clonePosition(this.listParent, this.fieldElem, showPoint); if (this.iframe) { this.clonePosition(this.iframe, this.fieldElem, showPoint); @@ -301,14 +290,6 @@ item.className = className; }, - getEventItem : function(event) { - var item = Event.findElement(event, "span"); - /*if ((item == null) || (item.id == this.listParent.id) || (item.id == this.list.id)) { - return; - }*/ - return item; - }, - moveActiveItem : function(event) { var item = this.activeItem; if (event.keyCode == Event.KEY_UP) { @@ -396,6 +377,7 @@ } this.list.innerHTML = items.join(""); //was created new item list, so necessary to recreate selectedItem + if (this.selectedItem) { var item = this.findItemBySubstr(text); if (item) { @@ -418,16 +400,15 @@ iframe.style.position = "absolute"; iframe.frameBorder="0"; iframe.scrolling="no"; -// iframe.style.backgroundColor="#FFFFFF"; iframe.style.width = width; -// iframe.style.zIndex = "2"; + iframe.className = classes; -// parentElem.appendChild(iframe); + parentElem.insertBefore(iframe,parentElem.firstChild); - this.iframe = $(iframe.id); + this.iframe = document.getElementById(iframe.id); }, PX_REGEX: /px$/, @@ -486,28 +467,14 @@ Richfaces.ComboBoxList.getElemXY = function(elem) { - // for FF support - /*var originalVisibility = elem.style.visibility; - var originalPosition = elem.style.position; - var originalDisplay = elem.style.display; - - elem.style.visibility = 'hidden'; - elem.style.position = 'absolute'; - elem.style.display = 'block';*/ - var x = elem.offsetLeft; var y = elem.offsetTop; - //for (var parent = Element.getOffsetParent(elem); parent != document.body; parent = Element.getOffsetParent(parent)) { for (var parent = elem.offsetParent; parent; parent = parent.offsetParent) { x += parent.offsetLeft; y += parent.offsetTop; } - - /*elem.style.display = originalDisplay; - elem.style.visibility = originalVisibility; - elem.style.position = originalPosition;*/ - + return {left: x, top: y}; }