diff src/nabble/view/web/util/dropdown_menu_hack.js @ 0:7ecd1a4ef557

add content
author Franklin Schmidt <fschmidt@gmail.com>
date Thu, 21 Mar 2019 19:15:52 -0600
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/nabble/view/web/util/dropdown_menu_hack.js	Thu Mar 21 19:15:52 2019 -0600
@@ -0,0 +1,144 @@
+// based on http://www.hedgerwow.com/360/dhtml/ui_select_with_fixed_width/demo.php
+
+
+function dropdown_menu_hack(el)
+{
+	if( navigator.appName.indexOf("Microsoft") == -1 )
+		return;
+	if(el.runtimeStyle.behavior.toLowerCase() != "none"){
+		el.runtimeStyle.behavior="none";
+	
+		el.ondblclick = function(e)
+		{
+			window.event.returnValue = false;
+			return false;
+		}
+		
+	
+		function showMenu()
+		{
+			
+			function selectMenu(obj) {
+				el.contentIndex = obj.selectedIndex;
+				el.selectedIndex = el.contentIndex;
+				el.menu.hide();
+				el.onchange();
+			}		
+			
+			
+			el.menu.show(0 , el.offsetHeight, 10,  10, el);
+			var mb = el.menu.document.body;
+			
+//			mb.style.cssText ="border:solid 1px black;margin:0;padding:0;overflow-y:auto;overflow-x:auto;background:white;text-aligbn:center;font-family:Verdana;font-size:12px;";
+//			mb.style.cssText ="border:solid 1px black;margin:0;padding:0;overflow-y:auto;overflow-x:auto;background:white;font-family:tahoma,geneva,helvetica,arial,sans-serif;font-size:10pt;";
+			mb.style.border = "solid 1px black";
+			mb.style.overflowY = "auto";
+			mb.style.margin = "0";
+			mb.style.padding = "0";
+			mb.style.fontSize = "8pt";
+			mb.style.fontFamily = "tahoma,geneva,helvetica,arial,sans-serif";
+			var t = el.contentHTML;
+			t = t.replace(/<select/gi,'<ul');
+			t = t.replace(/<option/gi,'<li');
+			t = t.replace(/<\/option/gi,'</li');
+			t = t.replace(/<\/select/gi,'</ul');
+			t = t.replace(/>  /gi,'>&nbsp;&nbsp;');
+			mb.innerHTML = t;
+			
+			el.select = mb.all.tags("ul")[0];
+			el.select.style.cssText="list-style:none;margin:0;padding:0;";
+			mb.options = el.select.getElementsByTagName("li");
+			
+			for(var i=0;i<mb.options.length;i++)
+			{
+				mb.options[i].selectedIndex = i;
+				mb.options[i].style.cssText = "list-style:none;margin:0;padding:1px 2px;width:100%;cursor:hand;cursor:pointer;white-space:nowrap;"
+				mb.options[i].title = mb.options[i].innerHTML;
+				mb.options[i].innerHTML = "<nobr>" + mb.options[i].innerHTML + "</nobr>";
+
+				mb.options[i].onmouseover = function()
+					{
+						if( mb.options.selected ){mb.options.selected.style.background="white";mb.options.selected.style.color="black";}
+						mb.options.selected = this;
+						this.style.background = "#316ac5";
+						this.style.color = "white";
+					}
+
+				mb.options[i].onmouseout = function(){
+					this.style.background="white";this.style.color="black";
+				}
+
+				mb.options[i].onmousedown = function(){selectMenu(this);}
+				mb.options[i].onkeydown = function(){selectMenu(this);}
+					
+	
+				if(i == el.contentIndex)
+				{
+					mb.options[i].style.background = "#316ac5";
+					mb.options[i].style.color = "white";	
+					mb.options.selected = mb.options[i];
+				}
+			}
+		
+//			var mwPadding = 22;	
+			var mwPadding = 4;
+			var mw = Math.max(   ( el.select.offsetWidth + mwPadding ), el.offsetWidth + mwPadding  );
+			mw = Math.max(  mw, ( mb.scrollWidth+mwPadding) );
+//			var mh =  mb.options.length * 15  + 8 ;
+			var mh =  mb.options.length * 15  + 2 ;
+				 
+			var mx = 0;
+			var my = el.offsetHeight - 2;
+			var docH =   document.documentElement.offsetHeight ;
+			var bottomH = docH  - el.getBoundingClientRect().bottom ; 
+	
+			mh = Math.min(mh, Math.max(( docH - el.getBoundingClientRect().top - 50),100)		);
+			
+			if( bottomH < mh )
+			{
+				
+				mh = Math.max( (bottomH - 12),10);
+				if( mh <100 ) 
+				{
+					my = -100 ;
+	
+				}
+				mh = Math.max(mh,100);			
+			}
+	
+			
+			self.focus(); 
+			
+			el.menu.show( mx, my+2,  mw, mh , el); 
+//			sync = null;
+			if(mb.options.selected)
+			{
+				mb.scrollTop = mb.options.selected.offsetTop;
+			}
+			
+			window.onresize = function(){el.menu.hide()};		
+		}
+
+		if(dropdown_menu_hack.menu ==null)
+		{
+			dropdown_menu_hack.menu =  window.createPopup();
+			document.attachEvent("onkeydown",dropdown_menu_hack.menu.hide);
+		}
+		el.menu = dropdown_menu_hack.menu ;
+		el.onclick = showMenu;
+	}
+	el.contentOptions = new Array();
+	el.contentIndex = el.selectedIndex;
+	el.contentHTML = el.outerHTML;
+
+	for(var i=0;i<el.options.length;i++)
+	{	
+		el.contentOptions [el.contentOptions.length] = 
+		{
+			"value": el.options[i].value,
+			"text": el.options[i].innerHTML
+		}
+
+//		if(!el.options[i].selected){el.options[i].removeNode(true);i--;};
+	}
+}