1 | |
---|
2 | (function() |
---|
3 | {var arrowImage=path_jabberit+'templates/default/images/select_arrow.gif';var arrowImageOver=path_jabberit+'templates/default/images/select_arrow_over.gif';var arrowImageDown=path_jabberit+'templates/default/images/select_arrow_down.gif';var activeOption;var selectBoxIds=0;var currentlyOpenedOptionBox=false;var editableSelect_activeArrow=false;function configEvents(pObj,pEvent,pHandler) |
---|
4 | {if(typeof pObj=='object') |
---|
5 | {if(pEvent.substring(0,2)=='on') |
---|
6 | pEvent=pEvent.substring(2,pEvent.length);if(pObj.addEventListener) |
---|
7 | pObj.addEventListener(pEvent,pHandler,false);else if(pObj.attachEvent) |
---|
8 | pObj.attachEvent('on'+pEvent,pHandler);}} |
---|
9 | function createEditableSelect() |
---|
10 | {var dest="";var _left="";var _top="";if(arguments.length>0) |
---|
11 | {dest=arguments[0];_top=arguments[1];_left=arguments[2];} |
---|
12 | else |
---|
13 | {return false;} |
---|
14 | dest.className='selectBoxInput';var div=document.createElement('DIV');div.id='selectBox'+selectBoxIds;div.style.top=_top+"px";div.style.left=_left+"px";div.style.width=dest.offsetWidth;div.style.position='absolute';var parent=dest.parentNode;parent.insertBefore(div,dest);div.appendChild(dest);div.className='selectBox';var img=document.createElement('IMG');img.src=arrowImage;img.className='selectBoxArrow';img.onclick=selectBox_showOptions;img.id='arrowSelectBox'+selectBoxIds;div.appendChild(img);var optionDiv=document.createElement('DIV');optionDiv.id='selectBoxOptions'+selectBoxIds;optionDiv.className='selectBoxOptionContainer';optionDiv.style.width=div.offsetWidth-2+'px';div.appendChild(optionDiv);if(dest.getAttribute('selectBoxOptions')) |
---|
15 | {var options=dest.getAttribute('selectBoxOptions').split(';');var optionsTotalHeight=0;var optionArray=new Array();for(var no=0;no<options.length;no++) |
---|
16 | {var anOption=document.createElement('DIV');anOption.innerHTML=options[no];anOption.className='selectBoxAnOption';anOption.onclick=selectOptionValue;anOption.style.width=optionDiv.style.width.replace('px','')-2+'px';anOption.onmouseover=highlightSelectBoxOption;optionDiv.appendChild(anOption);optionsTotalHeight=optionsTotalHeight+anOption.offsetHeight;optionArray.push(anOption);} |
---|
17 | if(optionsTotalHeight>optionDiv.offsetHeight) |
---|
18 | {for(var no=0;no<optionArray.length;no++) |
---|
19 | {optionArray[no].style.width=optionDiv.style.width.replace('px','')-22+'px';}} |
---|
20 | optionDiv.style.display='none';optionDiv.style.visibility='visible';optionDiv.style.zIndex=loadscript.getZIndex();} |
---|
21 | configEvents(dest,'onkeydown',function(e) |
---|
22 | {switch(e.keyCode) |
---|
23 | {case 13:case 27:dest.value=dest.value;dest.focus();dest.select();break;}});configEvents(dest,'onclick',function(e) |
---|
24 | {dest.value=dest.value;dest.focus();dest.select();document.getElementById('selectBoxOptions0').style.display='none';document.getElementById('arrowSelectBox0').src=arrowImageOver;});} |
---|
25 | function highlightSelectBoxOption() |
---|
26 | {if(this.style.backgroundColor=='#316AC5') |
---|
27 | {this.style.backgroundColor='';this.style.color='';} |
---|
28 | else |
---|
29 | {this.style.backgroundColor='#316AC5';this.style.color='#FFF';} |
---|
30 | if(activeOption) |
---|
31 | {activeOption.style.backgroundColor='';activeOption.style.color='';} |
---|
32 | activeOption=this;} |
---|
33 | function selectOptionValue() |
---|
34 | {var parentNode=this.parentNode.parentNode;var textInput=parentNode.getElementsByTagName('INPUT')[0];textInput.value=this.innerHTML;this.parentNode.style.display='none';document.getElementById('arrowSelectBox'+parentNode.id.replace(/[^\d]/g,'')).src=arrowImageOver;} |
---|
35 | function selectBox_showOptions() |
---|
36 | {if(editableSelect_activeArrow&&editableSelect_activeArrow!=this) |
---|
37 | editableSelect_activeArrow.src=arrowImage;editableSelect_activeArrow=this;var numId=this.id.replace(/[^\d]/g,'');var optionDiv=document.getElementById('selectBoxOptions'+numId);if(optionDiv.style.display=='block') |
---|
38 | {optionDiv.style.display='none';this.src=arrowImageOver;} |
---|
39 | else |
---|
40 | {optionDiv.style.display='block';this.src=arrowImageDown;if(currentlyOpenedOptionBox&¤tlyOpenedOptionBox!=optionDiv) |
---|
41 | currentlyOpenedOptionBox.style.display='none';currentlyOpenedOptionBox=optionDiv;}} |
---|
42 | function SelectEditable(){} |
---|
43 | SelectEditable.prototype.create=createEditableSelect;window.SelectEditable=SelectEditable;})(); |
---|