control.js

vc-mfc编程实例 很简单的东西,以后回多传自己的东西

/////////////////////////////////////////////
//Copyright © 2006-2007 by FarStone Technology, Inc.
//////////////////////////////////////////////


Array.prototype.push=function(value)
{
	this[this.length]=value;
}
//单选按钮控件
////////////////////////Class radioButton///////////////////////////////////
//nav bar
//preproty:	text		//the text display in the radio button
//			
//Method:	setValue(String value) 		
//			applyStyle(UIStyle style)	//apply the uistyle object to the radio button;
//			attachMeToContainer(string containerName)	//attach radio to a group container
//			displayButton()		//display the button in html page
//			Enable()			//
//			Disable()				//
//			check()				// 
//			unCheck()
//event : 	onclick()  //Fire when click on the object
//			oncheck()  //Fire when check the radioButton
//
//
/////////////////////////
var uiBox=function()
{
	this.width=0;
	this.height=0;
	this.backGround="";
	this.startPositionX=0;
	this.startPositionY=0;
	this.text=" ";
	this.setProperty=function(bgPic,width,height,x,y)
	{
		this.backGround=bgPic;
		this.width=width;
		this.height=height;
		this.startPositionX=x;
		this.startPositionY=y;
	}
}

var radioButton=function()
{
	this.Super=uiBox;
	this.Super();
	this.containerName="";
	this.otX=0;
	this.otY=0;
	this.target="";
	this.url="";
	this.jsString="";
	var htmlStr="";
	this.value=""
	this.Default=false;
	this.flag="";	
	this.data="";
	this.id="";
	var id="rbt"+(Math.floor(Math.random()*100000))+"_"+(Math.floor(Math.random()*100000));
	this.id = id; 
	this.disableX="";
	this.disableY="";
	this.isEnable=true;
	this.onclick=function(){};
	this.oncheck=function(){};
	this.text="";
	this.checkText="";
	
	this.setFlag=function(flag)
	{
		this.flag=flag;	
	}
	
	this.setData=function(data)
	{
		this.data=data;	
	}
	
	this.attachMeToContainer=function(cname)
	{
		this.containerName=cname;
		var objContainer=eval(cname);
		objContainer.addRadioButtonId(this)
	}
	
	this.setDisablePoint=function(x,y)
	{
		this.disableX=x;
		this.disableY=y;
	}
	
	this.applyStyle=function(styleObj)
	{
		this.backGround=styleObj.picture
		this.width=styleObj.width
		this.height=styleObj.height
		this.startPositionX=styleObj.startX
		this.startPositionY=styleObj.startY
		this.otX=styleObj.otX
		this.otY=styleObj.otY
		this.disableX=styleObj.disableX
		this.disableY=styleObj.disableY
		this.disableSelectedX=styleObj.disableSelectedX;
		this.disableSelectedY=styleObj.disableSelectedY;
	}
	
	this.displayButton=function()
	{
		var htmlStr;
		if (this.backGround=="" || this.width==0)
		{
			return "";
		}
		
		var positonPropertiseString="dx=\""+this.disableX+"\" dy=\""+this.disableY+"\" ex=\""+this.startPositionX+"\" ey=\""+this.startPositionY+"\" otx=\""+this.otX+"\" oty=\""+this.otY+"\" dsx=\""+this.disableSelectedX+"\" dsy=\""+this.disableSelectedY+"\""
		
		if (this.Default)
		{
			htmlStr="<div "+positonPropertiseString+" isdisable=\"false\" id=\""+this.id+"\" evalue='"+this.value+"' stpst=\""+this.startPositionX+"|"+this.startPositionY+"\"  style=\"background-image:url("+this.backGround+");width:"+this.width+"px;height:"+this.height+"px;padding: 0;margin: 0;cursor:hand;background-position-x:-"+this.otX+"px;background-position-y:-"+this.otY+"px;\" ";
		}
		else
		{
			htmlStr="<div "+positonPropertiseString+" isdisable=\"false\" id=\""+this.id+"\" evalue='"+this.value+"' stpst=\""+this.startPositionX+"|"+this.startPositionY+"\"  style=\"background-image:url("+this.backGround+");width:"+this.width+"px;height:"+this.height+"px;padding: 0;margin: 0;cursor:hand;background-position-x:-"+this.startPositionX+"px;background-position-y:-"+this.startPositionY+"px;\" ";
		}
		

		htmlStr+=">"
		if (this.text=="")
		{
			htmlStr+="<img name=\"\" src=\"\" width=\"1\" height=\"1\" alt=\"\" /></div>"
		}
		else
		{
			htmlStr+=(this.text+"</div>")	
		}
		document.write(htmlStr);
		if (this.Default)
		{			
			eval(this.containerName+".proObj=document.getElementById('"+id+"');")			
		}
		//document.getElementById(this.id).attachEvent("onclick",this.onClickEvent(this));
		document.getElementById(this.id).onclick=this.onClickEvent(this);
	}
	
	this.GetHeml=function()
	{
		if (this.backGround=="" || this.width==0)
		{
			return "";
		}
		
		var positonPropertiseString="dx=\""+this.disableX+"\" dy=\""+this.disableY+"\" ex=\""+this.startPositionX+"\" ey=\""+this.startPositionY+"\" otx=\""+this.otX+"\" oty=\""+this.otY+"\" dsx=\""+this.disableSelectedX+"\" dsy=\""+this.disableSelectedY+"\""
		
		if (this.Default)
		{
			htmlStr="<div  "+positonPropertiseString+"  isdisable=\"false\" id=\""+this.id+"\" evalue='"+this.value+"' stpst=\""+this.startPositionX+"|"+this.startPositionY+"\"  style=\"background-image:url("+this.backGround+");width:"+this.width+"px;height:"+this.height+"px;padding: 0;margin: 0;cursor:hand;background-position-x:-"+this.otX+"px;background-position-y:-"+this.otY+"px;\" ";
		}
		else
		{
			htmlStr="<div  "+positonPropertiseString+"   isdisable=\"false\" id=\""+this.id+"\" evalue='"+this.value+"' stpst=\""+this.startPositionX+"|"+this.startPositionY+"\"  style=\"background-image:url("+this.backGround+");width:"+this.width+"px;height:"+this.height+"px;padding: 0;margin: 0;cursor:hand;background-position-x:-"+this.startPositionX+"px;background-position-y:-"+this.startPositionY+"px;\" ";
		}
		
		if (this.url!="")
		{
			htmlStr+=" onclick=\""+this.containerName+".doSwitch(this,"+this.otX+","+this.otY+");window.open('"+this.url+"','"+this.target+"');\""	
		}
		else if(this.jsString!="")
		{
			htmlStr+=" onclick=\""+this.containerName+".doSwitch(this,"+this.otX+","+this.otY+");"+this.jsString+";\""	
		}
		else
		{
			htmlStr+=" onclick=\""+this.containerName+".doSwitch(this,"+this.otX+","+this.otY+");\"";
		}
		htmlStr+=">"
		if (this.text=="")
		{
			htmlStr+="<img name=\"\" src=\"\" width=\"1\" height=\"1\" alt=\"\" /></div>"
		}
		else
		{
			htmlStr+=(this.text+"</div>")	
		}
		//document.write(htmlStr);
		if (this.Default)
		{
			//eval(this.containerName+".proObj=document.getElementById('"+id+"');")
			//alert("document.getElementById('"+id+"').click();");
			//eval("document.getElementById('"+id+"').click();");
		}
		return htmlStr;
	}
	
	this.onClickEvent=function(obj)
	{
		return function()
		{
			obj.onclick();
			if (obj.isEnable==false)
			{
				return;	
			}
			var ctnObj=eval(obj.containerName);
			if (obj.url!="")
			{
				ctnObj.doSwitch(this,obj.otX,obj.otY,obj);
				window.open(obj.url,obj.target);
			}
			else if(obj.jsString!="")
			{
				ctnObj.doSwitch(this,obj.otX,obj.otY,obj);
				eval(this.jsString);
			}
			else
			{
				ctnObj.doSwitch(this,obj.otX,obj.otY,obj);
			}
			if (obj.checkText!="")
			{
				this.innerHTML=obj.checkText;
			}
			obj.oncheck();
		}
	}
	
	
	
	this.setOtPosition=function(x1,y1)
	{
		this.otX=x1;
		this.otY=y1;
	}
	this.setOpenUrl=function(target,url)
	{
		this.target=target;
		this.url=url;
	}
	this.setJavascriptOperation=function(jsString)
	{
		this.jsString=jsString;
	}
	this.setValue=function(value)
	{
		this.value=value;
	}
	this.setDefault=function()
	{
		var ctn=eval(this.containerName);
		ctn.proObjID=this.id;
		this.Default=true;
	}
	this.Check=function()
	{
		document.getElementById(this.id).click();
	}
	
	this.Enable=function()
	{
		var ctn=eval(this.containerName);
		var domObj=document.getElementById(this.id);
		ctn.setBgPosition(domObj,domObj.otx,domObj.oty)
		this.isEnable=true;
	}
	
	this.Disable=function()
	{
		var ctn=eval(this.containerName);
		var domObj=document.getElementById(this.id);
		ctn.setBgPosition(domObj,domObj.dsx,domObj.dsy)
		this.isEnable=false;
	}
	this.check=function()
	{
		var domObj=document.getElementById(this.id);
		domObj.click();
	}
	this.unCheck=function()
	{
		alert("eeee");	
	}
}
/////////////////// container Class //////////////////
//method: 	Disable()
//			Enable()
//			unCheckAll();
//property 	isEnable
/////////////////////////////
var container=function(value)
{
	this.proObj=null;
	this.value=value;
	this.proObjID="";
	this.rdbtArray=new Array();
	this.rdbtObjArray=new Array();
	this.isEnable=true;
	this.proCusObj=null;
	this.doSwitch=function(obj,x,y,cusObj)
	{
		if (!this.isEnable)
		{
			return;	
		}
		this.proObj=document.getElementById(this.proObjID);
		
		if(this.proObj!=null)
		{
			var tmpStr=this.proObj.stpst;
			var tmpArr=tmpStr.split("|");
			this.proObj.style.backgroundPositionX=(-(tmpArr[0]))+"px";
			this.proObj.style.backgroundPositionY=(-(tmpArr[1]))+"px";
		}
		if (this.proCusObj!=null && this.proCusObj.text!="")
		{
			document.getElementById(this.proCusObj.id).innerHTML=this.proCusObj.text;
		}
		this.value=obj.evalue;
		//this.proObj=obj;
		this.proObjID=obj.id;
		this.proCusObj=cusObj;
		this.setBgPosition(obj,x,y);
	}
	this.setBgPosition=function(obj,x,y)
	{
		obj.style.backgroundPositionX=(-x)+"px";
		obj.style.backgroundPositionY=(-y)+"px";
	}
	this.Disable=function()
	{
		this.isEnable=false;
		var tmpDomObj=null;
		for (var i=0;i<this.rdbtArray.length;i++)
		{
			tmpDomObj=document.getElementById(this.rdbtArray[i]);
			if (this.value==tmpDomObj.evalue)
			{
				this.setBgPosition(tmpDomObj,tmpDomObj.dsx,tmpDomObj.dsy)
			}
			else
			{
				this.setBgPosition(tmpDomObj,tmpDomObj.dx,tmpDomObj.dy)
			}
			this.rdbtObjArray[i].isEnable=false;
		}
	}
	this.Enable=function()
	{
		this.isEnable=true;
		var tmpDomObj=null;
		for (var i=0;i<this.rdbtArray.length;i++)
		{
			//alert(document.getElementById(this.rdbtArray[i]))
			tmpDomObj=document.getElementById(this.rdbtArray[i]);
			if (this.value==tmpDomObj.evalue)
			{
				this.setBgPosition(tmpDomObj,tmpDomObj.otx,tmpDomObj.oty)
			}
			else
			{
				this.setBgPosition(tmpDomObj,tmpDomObj.ex,tmpDomObj.ey)
			}
			this.rdbtObjArray[i].isEnable=true;
		}	
	}
	
	this.addRadioButtonId=function(obj)
	{
		this.rdbtObjArray.push(obj);
		this.rdbtArray.push(obj.id)
	}
	this.unCheckAll=function()
	{
		this.proObj_unck=document.getElementById(this.proObjID);
		if(this.proObj_unck!=null)
		{
			var tmpStr=this.proObj_unck.stpst;
			var tmpArr=tmpStr.split("|");
			this.proObj_unck.style.backgroundPositionX=(-(tmpArr[0]))+"px";
			this.proObj_unck.style.backgroundPositionY=(-(tmpArr[1]))+"px";
		}
		if (this.proCusObj!=null && this.proCusObj.text!="")
		{
			document.getElementById(this.proCusObj.id).innerHTML=this.proCusObj.text;
		}
	}
}
///////////////////////////end radioButton Class/////////////////////
//sample:
//var container1=new container("2");
//radioButton1=new radioButton();创建一个单选按钮对?
//radioButton1.setProperty("images/radiobutton.jpg",12,12,12,0);
//radioButton1.setOtPosition(0,0);
//radioButton1.attachMeToContainer("container1");将VALUE保存在container1?
//radioButton1.setValue("2");
//radioButton1.setDefault();设置默认选中
//radioButton1.setJavascriptOperation("isselect();");单击事件要执行的函数
//<script language="javascript">radioButton1.displayButton();<\\script>//
var UIStyle=function()
{
	this.className="UIStyle";
	this.picture="";
	this.width="";
	this.height="";
	this.startX="";
	this.startY="";
	this.otX="";
	this.otY="";
	this.disableX="";
	this.disableY="";
	this.disableSelectedX="";
	this.disableSelectedY="";
	this.setStyle=function(picture,width,height,startX,startY)
	{
		this.picture=picture;
		this.width=width;
		this.height=height;
		this.startX=startX;
		this.startY=startY;
	}
	this.setReversalPosition=function(otX,otY)
	{
		this.otX=otX;
		this.otY=otY;
	}
	this.setDisablePosition=function(disableX,disableY)
	{
		this.disableX=disableX;
		this.disableY=disableY;
	}
	this.setDisableSelectedPosition=function(disableSelectedX,disableSelectedY)
	{
		this.disableSelectedX=disableSelectedX;
		this.disableSelectedY=disableSelectedY;
	}
}






////////////////Class downListCreator/////////////
// 	It's drop down list generator.
// 	 	method:  	getCtrl(Array listValue,String dropDownListName,String parentNodeName,String defaultValue,int size)
//						listValue:   List value 
//						dropDownListName: The name of the dropdownlist, it's exclusive.
//						parentNodeName: Where you want the dropdownlist to be append, it's the parent node's id.
//						defaultValue:default Value.