<PUBLIC:COMPONENT lightWeight = true > <PUBLIC:DEFAULTS contentEditable = false tabStop = true /> <PUBLIC:attach event="ondocumentready" onevent="initElement()" /> <PUBLIC:attach event="onmouseover" onevent="elementOnMouseOver()" /> <PUBLIC:attach event="onmouseout" onevent="elementOnMouseOut()" /> <PUBLIC:attach event="onmousedown" onevent="elementOnMouseDown()" /> <PUBLIC:attach event="onmouseup" onevent="elementOnMouseUp()" /> <PUBLIC:attach event="onpropertychange" onevent="elementPropertyChange()" /> <PUBLIC:attach event="onselectstart" onevent="elementOnSelect()" /> <PUBLIC:attach event="oncontextmenu" onevent="elementOnContextMenu()" /> <PUBLIC:attach event="ondetach" onevent="cleanupElement()" /> <PUBLIC:property name="enabled" value=true /> <PUBLIC:property name="options" value="" /> <PUBLIC:property name="dropDownState" value=false /> <PUBLIC:property name="size" value=-1 /> <PUBLIC:property name="value" id="propValue" value="" get="returnValue" /> <PUBLIC:property name="text" id="propText" value="" get="returnText" /> <PUBLIC:property name="selectedIndex" value=-1 /> <PUBLIC:method name="itemCount" /> <PUBLIC:method name="addItem" /> <PUBLIC:method name="removeItem" /> <PUBLIC:method name="clear" /> <PUBLIC:method name="getItemIndex" /> <PUBLIC:method name="getItemIndexFromValue" /> <PUBLIC:method name="setSelectedItem" /> <PUBLIC:method name="getItemText" /> <PUBLIC:method name="getItemValue" /> <PUBLIC:method name="getItemTag" /> <PUBLIC:event name="onchange" id="onchange" /> <script language="jscript"> // ---------------------------------------------------- // 2k3Widgets: 2k3MenuSelect // // Copyright ©2002-2004 Stedy Software and Systems // Please see http://www.stedy.com for terms of use. // ---------------------------------------------------- var imageCell = 0 ; var captionCell = 1 ; var valueCell = 2 ; var tagCell = 3 ; var elementDropdown = null ; var optionsElement = null ; var elementCaption = null ; var menuShadowArray = new Array(null, null, null, null) ; var normalWidth = 0 ; var settingValueInternally = false ; // ---------------------------------------------------- // initialize/terminate functions // ---------------------------------------------------- function initElement() { settingValueInternally = true ; element.enabled = makeBooleanOfAttribute("enabled") ; element.dropDownState = makeBooleanOfAttribute("dropDownState") ; if (!element.enabled) { element.className = "2k3MenuSelectDisabled" ; ; } settingValueInternally = false ; elementCaption = document.createElement("<span class='2k3MenuSelectCaption'>") ; element.insertAdjacentElement("afterBegin", elementCaption) ; elementDropdown = window.document.getElementById(element.options) ; optionsElement = elementDropdown.children[0] ; with (optionsElement) { for (var i = 0; i < rows.length; i++) { var row = rows[i] ; if (element.selectedIndex == -1) { if (row.outerHTML.indexOf("selected") != -1) { with (element) { selectedIndex = row.rowIndex ; text = row.children[captionCell].innerText ; value = row.children[valueCell].innerText ; elementCaption.innerText = row.children[captionCell].innerText ; } } } with (row.children[imageCell]) { if (children.length == 0) { var imgElement = document.createElement("IMG") ; imgElement.src = element.currentStyle.noImageUrl ; insertAdjacentElement("beforeEnd", imgElement) ; } children[0].hideFocus = true ; } } } with (elementDropdown) { with (style) { zIndex = 5000 ; if (element.size != -1) { height = getDropdownHeight(element.size) ; } width = element.offsetWidth + 2 ; } } } function cleanupElement() { elementCaption.removeNode(true) ; } // ---------------------------------------------------- // element functions // ---------------------------------------------------- function elementOnMouseOver() { if (!element.enabled) { return ; } if (normalWidth == 0) { normalWidth = element.offsetWidth ; } var fromElement = window.event.fromElement ; if (fromElement != null) { if (getRealItem(fromElement) == element) { return ; } } if (!element.dropDownState) { if (element.parentElement.parentElement.parentElement.parentElement.activeChild == null) { showOver(element) ; } } } function elementOnMouseOut() { if (!element.enabled) { return ; } var toElement = window.event.toElement ; if (toElement != null) { if (getRealItem(toElement) == element) { return ; } } if (!element.dropDownState) { if (element.parentElement.parentElement.parentElement.parentElement.activeChild == null) { showNormal(element) ; } } } function elementOnMouseDown() { if (!element.enabled) { return ; } if (!element.dropDownState) { if (element.parentElement.parentElement.parentElement.parentElement.activeChild == null) { showActive(element) ; } } } function elementOnMouseUp() { if (!element.enabled) { return ; } if (element.dropDownState) { hideDropdown() ; showOver(element) ; element.dropDownState = false ; } else { if (element.parentElement.parentElement.parentElement.parentElement.activeChild == null) { showDropdown() ; element.dropDownState = true ; } } } function elementPropertyChange() { if (settingValueInternally) { return ; } if (window.event.propertyName == "enabled") { if (element.enabled) { showEnabled(element) ; } else { showDisabled(element) ; } } } function elementOnSelect() { with (window.event) { cancelBubble = true ; returnValue = false ; } return false ; } function elementOnContextMenu() { with (window.event) { cancelBubble = true ; returnValue = false ; } return false ; } // ---------------------------------------------------- // public element methods // ---------------------------------------------------- function itemCount() { return optionsElement.rows.length ; } function addItem(itmType, text, value, itemIndex, exData, tagData) { var strSaveText = element.text ; if (element.selectedIndex != -1) { optionsElement.rows[element.selectedIndex].className = "2k3MenuSelectItem" ; } element.selectedIndex = -1 ; var row = optionsElement.insertRow(itemIndex) ; with (row) { className = "2k3MenuSelectItem" ; for (var c = 0; c <= 3; c++) { insertCell(c) ; } with (children[imageCell]) { className = "itemImage" ; switch ((itmType).toLowerCase()) { case "n": innerHTML = "<img src='" + element.currentStyle.noImageUrl + "'>" ; break ; case "i": if (exData == "") { exData = element.currentStyle.noImageUrl ; } innerHTML = "<img src='" + exData + "'>" ; break ; } } with (children[captionCell]) { className = "itemCaption" ; innerHTML = text ; } with (children[valueCell]) { className = "itemValue" ; innerText = value ; } with (children[tagCell]) { className = "itemTag" ; innerText = tagData ; } } if (element.size != -1) { elementDropdown.style.height = getDropdownHeight(element.size) ; } setSelectedItem(getItemIndex(strSaveText)) ; } function removeItem(itemIndex) { var strSaveText = element.text ; if (itemIndex > (element.itemCount() - 1) || element.itemCount() == 0) { return ; } if (element.selectedIndex != -1) { optionsElement.rows[element.selectedIndex].className = "2k3MenuSelectItem" ; } element.selectedIndex = -1 ; optionsElement.deleteRow(itemIndex) ; if (element.size != -1) { elementDropdown.style.height = getDropdownHeight(element.size) ; } setSelectedItem(getItemIndex(strSaveText)) ; } function clear() { for (var i = 0; i < element.itemCount(); i++) { optionsElement.deleteRow(-1) ; } element.selectedIndex = -1 ; } function getItemIndex(itemText) { with (optionsElement) { for (var i = 0; i < element.itemCount(); i++) { with (rows[i].children[captionCell]) { if (innerText == itemText) { return rows[i].rowIndex ; } } } } return -1 ; } function getItemIndexFromValue(itemValueText) { with (optionsElement) { for (var i = 0; i < element.itemCount(); i++) { with (rows[i].children[valueCell]) { if (innerText == itemValueText) { return rows[i].rowIndex ; } } } } } function getItemText(itemIndex) { if (itemIndex > (element.itemCount() - 1) || element.itemCount() == 0) { return ; } return optionsElement.rows[itemIndex].children[captionCell].innerText ; } function getItemValue(itemIndex) { if (itemIndex > (element.itemCount() - 1) || element.itemCount() == 0) { return ; } return optionsElement.rows[itemIndex].children[valueCell].innerText ; } function getItemTag(itemIndex) { if (itemIndex > (element.itemCount() - 1) || element.itemCount() == 0) { return ; } return optionsElement.rows[itemIndex].children[tagCell].innerText ; } function setSelectedItem(itemIndex) { var currentText = element.text ; if (itemIndex == -1) { if (element.selectedIndex != -1) { if (element.selectedIndex > (element.itemCount() - 1)) { with (element) { selectedIndex = -1 ; text = "" ; value = "" ; if (ctlStyle == 1) { elementCaption.value = "" ; } else { elementCaption.innerText = "" ; } } return } optionsElement.rows[element.selectedIndex].className = "2k3MenuSelectItem" ; with (element) { selectedIndex = -1 ; text = "" ; value = "" ; if (ctlStyle == 1) { elementCaption.value = "" ; } else { elementCaption.innerText = "" ; } } onchange.fire() ; } else { with (element) { selectedIndex = -1 ; text = "" ; value = "" ; if (ctlStyle == 1) { elementCaption.value = "" ; } else { elementCaption.innerText = "" ; } } } } else { if (itemIndex > (element.itemCount() - 1)) { with (element) { selectedIndex = -1 ; text = "" ; value = "" ; if (ctlStyle == 1) { elementCaption.value = "" ; } else { elementCaption.innerText = "" ; } } return ; } if (element.selectedIndex != -1) { optionsElement.rows[element.selectedIndex].className = "jsSelectItem" ; } with (optionsElement.rows(itemIndex)) { className = "jsSelectItemSelected" ; element.selectedIndex = rowIndex ; element.text = children[captionCell].innerText ; element.value = children[valueCell].innerText ; if (element.ctlStyle == 1) { elementCaption.value = children[captionCell].innerText ; } else { elementCaption.innerText = children[captionCell].innerText ; } scrollIntoView(false) ; } if (itemIndex > element.size - 1) { elementDropdown.scrollTop = elementDropdown.scrollTop + 1 ; } if (currentText != element.text) { onchange.fire() ; } } } // ---------------------------------------------------- // element dropdown functions // ---------------------------------------------------- function dropdownOnMouseOver() { var el = getRealItem(window.event.srcElement) ; if (el.className == "2k3MenuSelectItem" || el.className == "2k3MenuSelectItemSelected") { el.className = "2k3MenuSelectItemOver" ; } } function dropdownOnMouseOut() { var el = getRealItem(window.event.srcElement) ; if (el.className == "2k3MenuSelectItemOver") { if (parseInt(element.selectedIndex) == parseInt(el.rowIndex)) { el.className = "2k3MenuSelectItemSelected" ; } else { el.className = "2k3MenuSelectItem" ; } } } function dropdownOnClick() { var el = getRealItem(window.event.srcElement) ; if (el.className == "2k3MenuSelectItemOver") { window.event.cancelBubble = true ; window.event.returnValue = false ; if (element.selectedIndex != -1) { optionsElement.rows[element.selectedIndex].className = "2k3MenuSelectItem" ; } el.className = "2k3MenuSelectItemSelected" ; with (element) { selectedIndex = el.rowIndex ; text = el.children[captionCell].innerText ; value = el.children[valueCell].innerText ; elementCaption.innerText = el.children[captionCell].innerText ; } element.dropDownState = false ; showNormal(element) ; hideDropdown() ; onchange.fire() ; } } // ---------------------------------------------------- // show dropdown functions // ---------------------------------------------------- function showDropdown() { var dropDownTop = 0 ; var absoluteX = getRealLeft(element) ; var absoluteY = getRealTop(element) ; if (parseInt(element.selectedIndex) != -1) { with (optionsElement.rows[selectedIndex]) { className = "2k3MenuSelectItemSelected" ; scrollIntoView(false) ; } with (elementDropdown) { if (parseInt(element.selectedIndex) > parseInt(element.size - 1)) { scrollTop += 1 ; } } } window.document.attachEvent("onmousedown", hideDropdownEx) ; with (elementDropdown) { if (parseInt(window.document.body.clientHeight - absoluteY - element.offsetHeight - 4) < parseInt(offsetHeight)) { dropDownTop = (absoluteY - offsetHeight) ; } else { dropDownTop = (absoluteY + element.offsetHeight) ; } with (style) { top = dropDownTop ; left = absoluteX ; visibility = "visible" ; } } showMenuShadow(elementDropdown) ; with (elementDropdown) { attachEvent("onmouseover", dropdownOnMouseOver) ; attachEvent("onmouseout", dropdownOnMouseOut) ; attachEvent("onclick", dropdownOnClick) ; } element.parentElement.parentElement.parentElement.parentElement.activeChild = element ; } function hideDropdown() { window.document.detachEvent("onmousedown", hideDropdownEx) ; with (elementDropdown) { detachEvent("onmouseover", dropdownOnMouseOver) ; detachEvent("onmouseout", dropdownOnMouseOut) ; detachEvent("onclick", dropdownOnClick) ; hideMenuShadow() ; style.visibility = "hidden" ; } element.parentElement.parentElement.parentElement.parentElement.activeChild = null ; } function hideDropdownEx() { if (!isElement(window.event.srcElement, element) && !isElement(window.event.srcElement, elementDropdown)) { hideDropdown() ; showNormal(element) ; element.dropDownState = false ; } } // ---------------------------------------------------- // internal functions // ---------------------------------------------------- function showMenuShadow(el) { for (var i = 3; i >= 0; i--) { if (menuShadowArray[i] == null) { menuShadowArray[i] = window.document.createElement("SPAN") ; menuShadowArray[i].className = "2k3ShadowElement" ; window.document.body.insertAdjacentElement("afterBegin", menuShadowArray[i]) ; } with (menuShadowArray[i].style) { left = el.offsetLeft + (4 + i) ; top = el.offsetTop + (4 + i) ; width = el.offsetWidth - (i * 2) ; height = el.offsetHeight - (i * 2) ; zIndex = el.style.zIndex - 1 ; visibility = "visible" ; } } } function hideMenuShadow() { for (var i = 0; i <= 3; i++) { if (menuShadowArray[i] != null) { menuShadowArray[i].style.visibility = "hidden" ; menuShadowArray[i].removeNode(true) ; menuShadowArray[i] = null ; } } } function showNormal(el) { with (el) { className = "2k3MenuSelect" ; style.width = normalWidth ; } } function showOver(el) { with (el) { className = "2k3MenuSelectOver" ; style.width = normalWidth + 2 ; } } function showActive(el) { with (el) { className = "2k3MenuSelectActive" ; style.width = normalWidth + 2 ; } } function showDisabled(el) { with (el) { className = "2k3MenuSelectDisabled" ; style.width = normalWidth ; } } function showEnabled(el) { with (el) { className = "2k3MenuSelect" ; style.width = normalWidth ; } } function returnText() { if (element.selectedIndex == -1) { return "" ; } else { return optionsElement.rows[element.selectedIndex].children[captionCell].innerText ; } } function returnValue() { if (element.selectedIndex == -1) { return "" ; } else { return optionsElement.rows[element.selectedIndex].children[valueCell].innerText ; } } function makeBooleanOfAttribute(attName) { a = element.getAttribute(attName) ; if (typeof(a) == "boolean") { return a ; } else if (a == null) { a = false ; } else if (typeof(a) == "string") { a = a.toLowerCase() ; a = (a == "true" || a == "1" || a == "yes") ; } else { a = new Boolean(a) ; } return a ; } function isElement(el, parentElement) { var tElement = el ; while (tElement != null) { if (tElement == parentElement) { return true ; } tElement = tElement.parentElement ; } return false ; } function getDropdownHeight(intSize) { var intHeight = 0 ; for (var i = 0; i < intSize; i++) { if (i > element.itemCount() - 1) { break ; } intHeight += optionsElement.rows[i].offsetHeight ; } return intHeight + 2 ; } function getRealTop(el) { var t = 0 ; var tElement = el ; while (tElement != null) { t += tElement.offsetTop ; tElement = tElement.offsetParent ; } return t ; } function getRealLeft(el) { var l = 0 ; var tElement = el ; while (tElement != null) { l += tElement.offsetLeft ; tElement = tElement.offsetParent ; } return l ; } function getRealItem(el) { var tmpElement = el ; if (tmpElement == null) { return tmpElement ; } if (tmpElement.tagName.toLowerCase() == "img") { tmpElement = tmpElement.parentElement ; } if (tmpElement.tagName.toLowerCase() == "span") { tmpElement = tmpElement.parentElement ; } if (tmpElement.tagName.toLowerCase() == "td") { tmpElement = tmpElement.parentElement ; } return tmpElement ; } </script> </PUBLIC:COMPONENT>