popupdialog.js

ds18b20的代码及结构及其介绍 以及一些相关资料

	
	/* ---------------------------------------------------------------------- *\
	  Function    : popupDialog ()
	  Description : create a new popup window
	  Usage       : popupDialog( Width , Height )
	  Arguments   : Width    - The default Width of the window
					Height   - The default Height of the window

	  Last Modify By AiGuo Li At 2006-04-12
	\* ---------------------------------------------------------------------- */

	// CSS Diretory
	cssDir = "/manage/css/";

	// Images Directory
	imageDir = "/manage/images/dialog/";

	// Include Style Sheet
	document.write('<link rel="stylesheet" type="text/css" href="'+cssDir+'popupStyle.css">\n');
	
	function popupDialog ( pWidth , pHeight ) {
	
		// define variables
		this.width = pWidth ? pWidth : "300";
		this.height = pHeight ? pHeight : "180";
		this.defaultIcon = "<img id='icon' src='"+imageDir+"alert.gif' align=\"center\" valign=\"absmiddle\">";
		
		var fullBg = '<div id="fullPageBg" style="position:absolute;top:0px;left:0px;width:100%;height:100%;background:url('+imageDir+'blank.gif);"></div>';

		if ( getElement("popupDialogTable") == null ) {
			this.oDiv = document.createElement("span");
			this.oDiv.id = "dialogContainer";
			this.oDiv.innerHTML = fullBg;
			document.body.appendChild(this.oDiv);
			getElement("fullPageBg").style.height = document.body.scrollHeight;
		
			this.oShadow = document.createElement("div");
			this.oShadow.id = "dialogShadow";
			this.oShadow.style.display = "none";
			document.body.appendChild(this.oShadow);		

			this.oTable = document.createElement("table");
			this.oTable.id = "popupDialogTable";
			this.oTable.style.width = this.width + "px";
			this.oTable.style.height = this.height + "px";
			//this.oTable.style.border = "1px solid #000000";
			this.oTable.style.backgroundColor = "#FFFFFF";
			this.oTable.cellSpacing = 0;
			this.oTable.cellPadding = 2;
			this.oTable.border = 0;

			// determine the windows position when first open
			var pClientWidth = parent ? parent.document.body.clientWidth : document.body.clientWidth;
			var pClientHeight = parent ? parent.document.body.clientHeight : document.body.clientHeight;
			var pScrollTop = parent ? parent.document.body.scrollTop : document.body.scrollTop;
			var pTop = -40 + (pClientHeight / 2 + pScrollTop) - (this.height / 2);

			this.oTable.style.position = "absolute";
			this.oTable.style.left = (document.body.clientWidth / 2) - (this.width / 2);			
			this.oTable.style.top = pTop > 0 ? pTop : (pClientHeight / 2 + pScrollTop) - (this.height / 2);
			
			// append to current document'body
			document.body.appendChild(this.oTable);
			
			// add a row for the titlebar
			this.oTrTitle = this.oTable.insertRow(0);
			this.oTrTitle.className = "popupTitle";
						
			// Title: add the title to the titlebar	
			this.oTdTitle = this.oTrTitle.insertCell(0);
			this.oTdTitle.id = "titleContainer";
			this.oTdTitle.onmousedown = onMouseDown;
			this.oTdTitle.style.backgroundImage = "url(" + imageDir + "titleBg.gif)";
			this.oTdTitle.height = "27";
			this.oTdTitle.width = "98%";

			// add the close image to the titlebar
			this.oTdClose = this.oTrTitle.insertCell(1); 
			this.oTdClose.innerHTML = "<img src='" + imageDir + "close.gif' onmouseover='this.src=\""+imageDir+"onClose.gif\";' onmouseout='this.src=\""+imageDir+"close.gif\";' onClick='new popupDialog().reset();'>";
			this.oTdClose.style.backgroundImage = "url(" + imageDir + "rightTitle.gif)";
			this.oTdClose.style.paddingLeft = "1px";
			this.oTdClose.style.cursor = "hand";
			this.oTdClose.width = "8%";		

			this.oTrBody = this.oTable.insertRow(1);
			this.oTdBody = this.oTrBody.insertCell(0);
			this.oTdBody.id = "popupBody";
			this.oTdBody.colSpan = 2;
			this.oTdBody.className = "popupBody";
			this.oTdBody.style.backgroundImage = "url(" + imageDir + "bodyBg.gif)";

			this.oDivContent = document.createElement("div");
			this.oDivContent.id = "contentContainer";
			this.oDivContent.className = "popupContent";
			this.oTdBody.appendChild(this.oDivContent);

			this.oDivButton = document.createElement("div");
			this.oDivButton.id = "buttonContainer";
			this.oDivButton.className = "popupButton";
			this.oTdBody.appendChild(this.oDivButton);
			
			this.oTableContent = document.createElement("table");
			this.oTableContent.style.width = "100%";
			this.oTableContent.style.height = "80%";
			this.oDivContent.appendChild(this.oTableContent);

			this.oTrContent = this.oTableContent.insertRow(0);

			this.oTdIcon = this.oTrContent.insertCell(0);
			this.oTdIcon.id = "iconContainer";
			this.oTdIcon.className = "popupIcon";
			this.oTdIcon.innerHTML = this.defaultIcon;
			this.oTdMsg = this.oTrContent.insertCell(1);
			this.oTdMsg.id = "msgContainer";
			this.oTdMsg.className = "popupMsg";

			dialogOver("popupDialogTable");
		}

		this.shadow = function () {
			var oShadow = getElement("dialogShadow");
			var oDialog = getElement("popupDialogTable");
			oShadow['style']['position'] = "absolute";
			oShadow['style']['background']	= "#A8DA8F";
			oShadow['style']['display']	= "";
			oShadow['style']['opacity']	= "0.2";
			oShadow['style']['filter'] = "alpha(opacity=40)";
			oShadow['style']['top'] = oDialog.offsetTop + 5;
			oShadow['style']['left'] = oDialog.offsetLeft + 5;
			oShadow['style']['width'] = oDialog.offsetWidth;
			oShadow['style']['height'] = oDialog.offsetHeight;
		}

		this.setValue = function ( pObject , pValue ) {
			if ( pValue != "" ){
				switch (  pObject) {
				case "title" :
					getElement("titleContainer").innerHTML = pValue;
					break;
				case "content" :
					getElement("msgContainer").innerHTML = pValue;
					break;	
				case "icon" :
					getElement("icon") ? getElement("icon").src =  imageDir + pValue + '.gif' : function(){};	
					break;
				}
			}
		}

		this.reset = function () {
			getElement('dialogContainer') ? getElement('dialogContainer').parentNode.removeChild(getElement('dialogContainer')) : function(){};
			getElement('dialogShadow') ? getElement('dialogShadow').parentNode.removeChild(getElement('dialogShadow')) : function(){};
			getElement('popupDialogTable') ? getElement('popupDialogTable').parentNode.removeChild(getElement('popupDialogTable')) : function(){};
			dialogOut();
		}

		this.event = function ( pOkFunc , pCancelFunc ) {

			if ( pCancelFunc && pCancelFunc != "" ) {
				this.oDivButton.innerHTML = '<input id="buttonOk" type="button" class="buttonOkStyle" onClick="new popupDialog().reset();"/> <input id="buttonCancel" type="button" class="buttonCancelStyle" onClick="new popupDialog().reset();"/>';
				this.buttonFunc('buttonOk',pOkFunc);
				//this.buttonFunc('buttonCancel',pCancelFunc);
			} else {
				this.oDivButton.innerHTML = '<input id="buttonOk" type="button" class="buttonOkStyle" onClick="new popupDialog().reset();"/>';	
				this.buttonFunc('buttonOk',pOkFunc);
			}
		}

		this.buttonFunc = function ( pbuttonObj, pFunction ) {
			if ( getElement(pbuttonObj) ) {
				getElement(pbuttonObj).style.display = '';
				if ( getElement(pbuttonObj).addEventListener ) {
					if ( getElement(pbuttonObj).act ) {
						getElement(pbuttonObj).removeEventListener('click', function(){eval(getElement(pbuttonObj).act)}, false);
					}
					getElement(pbuttonObj).act = pFunction;
					getElement(pbuttonObj).addEventListener('click', function(){eval(pFunction)}, false);
				} else {
					if( getElement(pbuttonObj).act ) {
						getElement(pbuttonObj).detachEvent('onclick', function(){eval(getElement(pbuttonObj).act)});
					}
					getElement(pbuttonObj).act = pFunction;
					getElement(pbuttonObj).attachEvent('onclick', function(){eval(pFunction)});
				}
			}
		}
	}

	function onMouseDown ( event ) {
		var oObj = getElement("popupDialogTable");
		oObj.onmousemove = mousemove;
		oObj.onmouseup = mouseup;
		oObj.setCapture ? oObj.setCapture() : function(){};
		oEvent = window.event ? window.event : event;
		var dragData = {x : oEvent.clientX, y : oEvent.clientY};
		var backData = {x : parseInt(oObj.style.top), y : parseInt(oObj.style.left)};
		
		function mousemove(){
			var oEvent = window.event ? window.event : event;
			var iLeft = oEvent.clientX - dragData["x"] + parseInt(oObj.style.left);
			var iTop = oEvent.clientY - dragData["y"] + parseInt(oObj.style.top);
			oObj.style.left = iLeft;
			oObj.style.top = iTop;
			getElement("dialogShadow").style.left = iLeft + 5;
			getElement("dialogShadow").style.top = iTop + 5;
			dragData = {x: oEvent.clientX, y: oEvent.clientY};
			dialogOver("popupDialogTable");
		}

		function mouseup () {
			var oEvent = window.event ? window.event : event;
			oObj.onmousemove = null;
			oObj.onmouseup = null;
			if(oEvent.clientX < 1 || oEvent.clientY < 1 || oEvent.clientX > document.body.clientWidth || oEvent.clientY > document.body.clientHeight){
				oObj.style.left = backData.y;
				oObj.style.top = backData.x;
				getElement("dialogShadow").style.left = backData.y + 5;
				getElement("dialogShadow").style.top = backData.x + 5;
			}
			oObj.releaseCapture ? oObj.releaseCapture() : function(){};
		}
	}

	function  dialogOver ( objID ) {
		var sels = document.getElementsByTagName('select'); 
		for ( var i = 0; i < sels.length; i++ ) {
			if ( ObjAOverObjB(getElement(objID) , sels[i]) ){
				sels[i].style.visibility = 'hidden';
			} else {
				dialogOut();
			}
		}
	}

	function  dialogOut () {	
		var sels = document.getElementsByTagName('select'); 
		for ( var i = 0; i < sels.length; i++ ) {
			sels[i].style.visibility = 'visible';
		}
	}

	function ObjAOverObjB ( objA , objB ) {  
		var pos1 = getPosition(objA) 
		var pos2 = getPosition(objB) 
			
		var result = true; 
		var obj1Left = pos1.left - window.document.body.scrollLeft + 100; 
		var obj1Top = pos1.top - window.document.body.scrollTop - 20; 
		var obj1Right = obj1Left + objA.offsetWidth + 50; 
		var obj1Bottom = obj1Top + objA.offsetHeight + 50;
		var obj2Left = pos2.left - window.document.body.scrollLeft; 
		var obj2Top = pos2.top - window.document.body.scrollTop; 
		var obj2Right = obj2Left + objB.offsetWidth; 
		var obj2Bottom = obj2Top + objB.offsetHeight;

		if ( obj1Right <= obj2Left || obj1Bottom <= obj2Top || obj1Left >= obj2Right || obj1Top >= obj2Bottom ) 
			result = false; 

		return result; 
	}

	// 获取对象的坐标
	function getPosition ( Obj ) {
		for ( var sumTop=0,sumLeft=0;Obj!=window.document.body;sumTop+=Obj.offsetTop,sumLeft+=Obj.offsetLeft, Obj=Obj.offsetParent );
		return {left:sumLeft,top:sumTop}
	}

	function getElement ( ElementID ) {
		return document.getElementById(ElementID);
	}

	function showInfor ( pContent , pIcon , pFunc , pTitle ) {
		var Title = pTitle ? pTitle : "&nbsp;&nbsp;TOM BLOG 提示您 ";
		var Icon = pIcon ? pIcon : "";

		Dialog = new popupDialog();
		Dialog.shadow();
		Dialog.setValue("title",Title);
		Dialog.setValue("content",pContent);
		Dialog.setValue("icon",Icon);
		Dialog.event(pFunc);
	}

	function confirmInfor ( pContent , pIcon , pOkFunc , pCancelFunc , pTitle ) {
		var Title = pTitle ? pTitle : "&nbsp;&nbsp;TOM BLOG 提示您 ";
		var Icon = pIcon ? pIcon : "confirm";

		Dialog = new popupDialog();
		Dialog.shadow();
		Dialog.setValue("title",Title);
		Dialog.setValue("content",pContent);
		Dialog.setValue("icon",Icon);
		Dialog.event(pOkFunc,pCancelFunc);
	}