/*
	Sliding Doors
	-------------
	
	Function Parameters :
		1) container : Container of sliding doors (example : window.document, getElementById("sdContainer"))
	
	Attribute keys :
		1) type : Defines element as Sliding Doors element (slidingDoors / slidingDoors2)
		2) sdWidth : Width of sliding image's container (width of sliding image/2)
		3) sdHeight (optional): Height of sliding image's container (height of sliding image) . If not defined will follow innerHTML's height.
		4) slidingImg : Path for sliding image (not applicable for type "slidingDoors2")
		5) sdDir(optional) : Direction for sliding (forward - left to right / backwards - right to left)
	
	Example :
 		
		slidingImg.jpg (Height:100px , Width:200px) , container (Height:100px, Width:100px)
		
		
		1)	
			<div type="slidingDoors" sdWidth="100" slidingImg="slidingImg.jpg" sdDir="forward"><img src="spacer.gif" width="100" height="100"></div>
			<script language="javascript">initSD(document)</script>
	
		
		2) 	
			<div type="slidingDoors2" sdWidth="100" sdDir="forward"><img src="slidingImg.jpg" width="200" /></div>
			<script language="javascript">initSD(document)</script>


		3) 	
	
			<div type="slidingDoors2">Lorem Ipsum ... </div>
			
			<div id="containDIV">
				<div type="slidingDoors2" sdWidth="100" sdDir="forward"><img src="slidingImg.jpg" width="200" /></div>
			</div>	

			<script language="javascript">initSD(document.getElementById("containDIV")</script>
			<!-- Will only initialize Sliding Doors div inside "containDIV" --->																			 
																		 
																		 
*/

function initSD(container){
	var aTmp = new Array();
	
	aTmp[0] = container.getElementsByTagName('td');
	aTmp[1] = container.getElementsByTagName('div');
	
	for(i=0;i<aTmp.length;i++){
		for(j=0;j<aTmp[i].length;j++){
			var thisObj = aTmp[i][j];
			
			if(!thisObj.getAttribute('sdDir'))
				var direction = "forward";
			else
				var direction = thisObj.getAttribute('sdDir');
			
			if(thisObj.getAttribute('type') == "slidingDoors"){
				thisObj.style.width=thisObj.getAttribute('sdWidth') + "px";
				thisObj.style.overflow="hidden";
				if(thisObj.getAttribute('sdHeight'))
					thisObj.style.height=thisObj.getAttribute('sdHeight') + "px";
					
				thisObj.style.background="url(" + thisObj.getAttribute('slidingImg') + ") no-repeat";
				if(direction == "backwards"){
					thisObj.style.backgroundPosition = thisObj.getAttribute('sdWidth') + 'px';
					thisObj.onmouseover = new Function("this.style.backgroundPosition = '0px';");
					thisObj.onmouseout = new Function("this.style.backgroundPosition = '-" + thisObj.getAttribute('sdWidth') + "px';");
				}else{
					thisObj.onmouseover = new Function("this.style.backgroundPosition = '-" + thisObj.getAttribute('sdWidth') + "px';");
					thisObj.onmouseout = new Function("this.style.backgroundPosition = '0px';");
				}
			}
			if(thisObj.getAttribute('type') == "slidingDoors2"){
				thisObj.style.width=thisObj.getAttribute('sdWidth') + "px";
				thisObj.style.overflow="hidden";

				if(thisObj.getAttribute('sdHeight'))
					thisObj.style.height=thisObj.getAttribute('sdHeight') + "px";
				if(direction == "backwards"){
					thisObj.scrollLeft = thisObj.getAttribute('sdWidth');
					thisObj.onmouseover = new Function("this.scrollLeft = '0';");
					thisObj.onmouseout = new Function("this.scrollLeft = '" + thisObj.getAttribute('sdWidth') + "';");
				}else{						
					thisObj.onmouseover = new Function("this.scrollLeft = '" + thisObj.getAttribute('sdWidth') + "';");
					thisObj.onmouseout = new Function("this.scrollLeft = '0';");
				}
			}	
		}
	}		
	return;
}