/*transCol.js (Cross-browser Visibility Transitions; column version)
*
* This script is a modified version of trans.js, discussed in column 19,
* and intended for use with the in-page examples of the column.
* To use as "trans.js", omit line 48 below.
* 
* Copyright (c) 1998 Mecklermedia Corp. To receive the right to license
* this code to use on your site the original code must be copied from
* Webreference.com. License is granted if and only if this entire copyright 
* notice is included, and you link from the page on which the code is used 
* to Webreference at http://webreference.com/dhtml/ for the latest version.
* By Peter Belesis. v1.0 980428 - column 19
*/

function doTrans(el,transNo,dur) {
	whichEl = (IE4) ? eval(el) : eval("document." + el);
	transNo = parseInt(transNo);
	arHidden = new Array(1,3,14,16);

	if (IE4) {doTransIE(whichEl,transNo,dur)}
	    else {doTransNS(whichEl,transNo,dur)}
}

function doTransIE(whichEl,transNo,dur) {
	whichEl.style.filter = "revealTrans(duration=" + dur + ",transition=" + transNo + ")";
	endState = "hidden";
	for (i=0; i<arHidden.length; i++) {
		if (arHidden[i] == transNo) {
			endState = "visible";
			whichEl.style.visibility="hidden";
		}
	}

	whichEl.onfilterchange = clearFilt;

	whichEl.filters.revealTrans.apply();
	    whichEl.style.visibility = endState;
	whichEl.filters.revealTrans.play();

}

function clearFilt() {
	whichEl.style.filter="";
/*
NOTE: next line not part of external script proper!!!! should be omitted. only used in column-specific script for in-page examples!!!
*/
	if(window.col)pp();
}

function doTransNS(whichEl,transNo,dur) {
	whichEl.origLeft = whichEl.clip.left;
	whichEl.origTop = whichEl.clip.top;
	whichEl.origRight = whichEl.clip.right;
	whichEl.origBottom = whichEl.clip.bottom;
	whichEl.hideIt = hideIt;

	mSecs = dur * 1000;
	intval = 100;
	visits = (mSecs/intval);

	fullW = whichEl.clip.width;
	fullH = whichEl.clip.height;;
	halfW = fullW/2;
	halfH = fullH/2;

	alternateW = alternateH = true;
	
	switch (transNo) {
		case 0:
		case 12:
			incW = halfW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = halfH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.transFunct = zero;
			break;
		
		case 1:
			incW = halfW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = halfH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.clip.left += halfW;
			whichEl.clip.right -= halfW;
		
			whichEl.clip.top += halfH;
			whichEl.clip.bottom -= halfH;

			whichEl.visibility = "show";
			whichEl.transFunct = one;
			break;
			
		case 2:
			largest = Math.max(halfW,halfH);
			increment = Math.round(largest/visits);
			
			largerW = (halfW > halfH);
		
			whichEl.transFunct = two;
			break;
			
		case 3:
			largest = Math.max(halfW,halfH);
			increment = Math.round(largest/visits);
			
			largerW = (halfW > halfH);
		
			whichEl.clip.left += halfW;
			whichEl.clip.right -= halfW;
		
			whichEl.clip.top += halfH;
			whichEl.clip.bottom -= halfH;

			whichEl.visibility = "show";
			whichEl.transFunct = three;
			break;	
		
		case 4:
			increment = fullH/visits;
			whichEl.transFunct = four;
			break;
		
		case 5:
			increment = fullH/visits;
			whichEl.transFunct = five;
			break;
		
		case 6:
			increment = fullW/visits;
			whichEl.transFunct = six;
			break;
		
		case 7:
			increment = fullW/visits;
			whichEl.transFunct = seven;
			break;
		
		case 8:
		case 10:
		case 13:
		case 22:
			increment = halfW/visits;
			whichEl.transFunct = thirteen;
			break;
		
		case 9:
		case 11:
		case 15:
		case 21:
			increment = halfH/visits;
			whichEl.transFunct = fifteen;
			break;
		
		case 14:
			increment = halfW/visits;
		
			whichEl.clip.left += halfW;
			whichEl.clip.right -= halfW;

			whichEl.visibility = "show";			
			whichEl.transFunct = fourteen;
			break;	
		
		case 16:		
			increment = halfH/visits;
				
			whichEl.clip.top += halfH;
			whichEl.clip.bottom -= halfH;
		
			whichEl.visibility = "show";
			whichEl.transFunct = sixteen;
			break;
		
		case 17:
			incW = fullW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = fullH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.transFunct = seventeen;
			break;
		
		case 18:
			incW = fullW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = fullH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.transFunct = eighteen;
			break;
		
		case 19:
			incW = fullW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = fullH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.transFunct = nineteen;
			break;
		
		case 20:
			incW = fullW/visits;
			incrementW = (incW >= 1) ? parseInt(incW) : 0;
			xtraPixW = Math.round((incW - incrementW) * visits);
		
			incH = fullH/visits;
			incrementH = (incH >= 1) ? parseInt(incH) : 0;
			xtraPixH = Math.round((incH - incrementH) * visits);
		
			whichEl.transFunct = twenty;
			break;
		
		case 23:
			twentythree(dur);
			return;
	}

	transTimer = setInterval("whichEl.transFunct()",intval)
}


/*
transitions 0 & 12:
 0 - BOX IN - behavior exactly as IE
12 - RANDOM DISSOLVE - not possible, transition 0 substituted
element transition from visible to hidden
*/

function zero() {
	if (xtraPixW > 0) {
		if (xtraPixW <= visits) {
			if (alternateW) {
				this.clip.left++;
				this.clip.right--;
				xtraPixW--;
			}
			alternateW = !alternateW;
		}	
		else {
			this.clip.left++;
			this.clip.right--;
			xtraPixW--;
		}
	}
	this.clip.left += incrementW;
	this.clip.right -= incrementW;

	if (xtraPixH > 0) {
		if (xtraPixH <= visits) {
			if (alternateH) {
				this.clip.top++;
				this.clip.bottom--;
				xtraPixH--;
			}
			alternateH = !alternateH;
		}	
		else {
			this.clip.top++;
			this.clip.bottom--;
			xtraPixH--;
		}
	}
	this.clip.top += incrementH;
	this.clip.bottom -= incrementH;

	visits--;

	if (this.clip.height <= 0 && this.clip.width <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 1 - BOX OUT:
behavior exactly as IE;
element transition from hidden to visible;
*/

function one(){
	if ((this.clip.left - this.origLeft) <= incrementW) {
		this.clip.left = this.origLeft;
		this.clip.right = this.origRight;
	}		
	else {
		if (xtraPixW > 0) {
			if (xtraPixW <= visits) {
				if (alternateW) {
					this.clip.left--;
					this.clip.right++;
					xtraPixW--;
				}
				alternateW = !alternateW;
			}	
			else {
				this.clip.left--;
				this.clip.right++;
				xtraPixW--;
			}
		}
		this.clip.left -= incrementW;
		this.clip.right += incrementW;
	}
	
	if ((this.clip.top - this.origTop) <= incrementH) {
		this.clip.top = this.origTop;
		this.clip.bottom = this.origBottom;
	}
	else {
		if (xtraPixH > 0) {
			if (xtraPixH <= visits) {
				if (alternateH) {
					this.clip.top--;
					this.clip.bottom++;
					xtraPixH--;
				}
				alternateH = !alternateH;
			}	
			else {
				this.clip.top--;
				this.clip.bottom++;
				xtraPixH--;
			}
		}

		this.clip.top -= incrementH;
		this.clip.bottom += incrementH;
	}

	visits--;
	if (this.clip.left==this.origLeft && this.clip.top==this.origTop) clearInterval(transTimer);
}

/*
transition 2 - CIRCLE IN:
circle shape not possible; square substituted;
element transition from visible to hidden;
*/

function two(){
	if (largerW) {
		this.clip.left += increment;
		this.clip.right -= increment;
		if (this.clip.height >= this.clip.width) {	
			this.clip.top += increment;
			this.clip.bottom -= increment;
		}
	}
	else {
		this.clip.top += increment;
		this.clip.bottom -= increment;
		if (this.clip.width >= this.clip.height){
			this.clip.left += increment;
			this.clip.right -= increment;}
	}

	if (this.clip.height<=0 && this.clip.width<=0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 3 - CIRCLE OUT:
circle shape not possible; square substituted;
element transition from hidden to visible;
*/

function three(){
	if (largerW) {
		if ((this.clip.left - this.origLeft) <= increment) {
			this.clip.left = this.origLeft;
			this.clip.right = this.origRight;
		}
		else {
			this.clip.left -= increment;
			this.clip.right += increment;
		}
		if (this.clip.height <= this.clip.width) {
			if ((this.clip.top - this.origTop) <= increment) {
				this.clip.top = this.origTop;
				this.clip.bottom = this.origBottom;		
			}
			else {
				this.clip.top -= increment;
				this.clip.bottom += increment;
			}
		}
	}
	else {
		if ((this.clip.top - this.origTop) <= increment) {
			this.clip.top = this.origTop;
			this.clip.bottom = this.origBottom;		
		}
		else {
			this.clip.top -= increment;
			this.clip.bottom += increment;
		}
		if (this.clip.width <= this.clip.height) {
			if ((this.clip.left - this.origLeft) <= increment) {
				this.clip.left = this.origLeft;
				this.clip.right = this.origRight;
			}
			else {
				this.clip.left -= increment;
				this.clip.right += increment;
			}
		}
	}

	if (this.clip.left == this.origLeft && this.clip.top == this.origTop) clearInterval(transTimer);
}

/*
transition 4 - WIPE UP:
behavior exactly as IE;
element transition from visible to hidden;
*/

function four(){
	this.clip.height -= increment;
	if (this.clip.bottom <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 5 - WIPE DOWN:
behavior exactly as IE;
element transition from visible to hidden;
*/

function five(){
	this.clip.top += increment;
	if (this.clip.height <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 6 - WIPE RIGHT:
behavior exactly as IE;
element transition from visible to hidden;
*/

function six(){
	this.clip.left += increment;
	if (this.clip.width <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 7 - WIPE LEFT:
behavior exactly as IE;
element transition from visible to hidden;
*/

function seven(){
	this.clip.right -= increment;
	if (this.clip.width <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transitions 8, 10, 13 & 22: 
 8 - VERTICAL BLINDS - not possible, transition 13 substituted;
10 - CHECKERBOARD ACROSS - not possible, transition 13 substituted;
13 - SPLIT VERTICAL IN - behavior exactly as IE;
22 - RANDOM BARS VERTICAL - not possible, transition 13 substituted;
element transition from visible to hidden;
*/

function thirteen(){
	this.clip.left += increment;
	this.clip.right -= increment;
	if (this.clip.width <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transitions 9, 11, 15 & 21: 
 9 - HORIZONTAL BLINDS - not possible, transition 15 substituted;
11 - CHECKERBOARD DOWN - not possible, transition 15 substituted;
15 - SPLIT HORIZONTAL IN - behavior exactly as IE;
21 - RANDOM BARS HORIZONTAL - not possible, transition 15 substituted;
element transition from visible to hidden;
*/

function fifteen(){
	this.clip.top += increment;
	this.clip.bottom -= increment;
	if (this.clip.height <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 14 - SPLIT VERTICAL OUT:
behavior exactly as IE;
element transition from hidden to visible;
*/

function fourteen(){
	if ((this.clip.left - this.origLeft) <= increment) {
		this.clip.left = this.origLeft;
		this.clip.right = this.origRight;
		clearInterval(transTimer);
	}
	else {
		this.clip.left -= increment;
		this.clip.right += increment;
	}
}

/*
transition 16 - SPLIT HORIZONTAL OUT:
behavior exactly as IE;
element transition from hidden to visible;
*/

function sixteen(){
	if ((this.clip.top - this.origTop) <= increment) {
		this.clip.top = this.origTop;
		this.clip.bottom = this.origBottom;
		clearInterval(transTimer);
	}
	else {
		this.clip.top -= increment;
		this.clip.bottom += increment;
	}
}

/*
transition 17 - STRIPS LEFT DOWN: 
diagonal wipe not possible; box-in to bottom-left corner substituted;
element transition from visible to hidden;
*/

function seventeen(){
	if (xtraPixW > 0) {
		if (xtraPixW <= visits) {
			if (alternateW) {
				this.clip.right--;
				xtraPixW--;
			}
			alternateW = !alternateW;
		}	
		else {
			this.clip.right--;
			xtraPixW--;
		}
	}
	this.clip.right -= incrementW;

	if (xtraPixH > 0) {
		if (xtraPixH <= visits) {
			if (alternateH) {
				this.clip.top++;
				xtraPixH--;
			}
			alternateH = !alternateH;
		}	
		else {
			this.clip.top++;
			xtraPixH--;
		}
	}

	this.clip.top += incrementH;

	visits--;

	if (this.clip.height <= 0 && whichEl.clip.width <= 0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 18 - STRIPS LEFT UP: 
diagonal wipe not possible; box-in to top-left corner substituted;
element transition from visible to hidden;
*/

function eighteen(){
	if (xtraPixW > 0) {
		if (xtraPixW <= visits) {
			if (alternateW) {
				this.clip.right--;
				xtraPixW--;
			}
			alternateW = !alternateW;
		}	
		else {
			this.clip.right--;
			xtraPixW--;
		}
	}
	this.clip.right -= incrementW;

	if (xtraPixH > 0) {
		if (xtraPixH <= visits) {
			if (alternateH) {
				this.clip.bottom--;
				xtraPixH--;
			}
			alternateH = !alternateH;
		}	
		else {
			this.clip.bottom--;
			xtraPixH--;
		}
	}
	this.clip.bottom -= incrementH;

	visits--;

	if (this.clip.height <= 0 && whichEl.clip.width<=0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 19 - STRIPS RIGHT DOWN: 
diagonal wipe not possible; box-in to bottom-right corner substituted;
element transition from visible to hidden;
*/

function nineteen(){

	if (xtraPixW > 0) {
		if (xtraPixW <= visits) {
			if (alternateW) {
				this.clip.left++;
				xtraPixW--;
			}
			alternateW = !alternateW;
		}	
		else {
			this.clip.left++;
			xtraPixW--;
		}
	}
	this.clip.left += incrementW;

	if (xtraPixH > 0) {
		if (xtraPixH <= visits) {
			if (alternateH) {
				this.clip.top++;
				xtraPixH--;
			}
			alternateH = !alternateH;
		}	
		else {
			this.clip.top++;
			xtraPixH--;
		}
	}
	this.clip.top += incrementH;

	visits--;

	if (this.clip.height <= 0 && whichEl.clip.width<=0) {
		clearInterval(transTimer);
		this.hideIt();
	}
}

/*
transition 20 - STRIPS RIGHT UP: 
diagonal wipe not possible; box-in to top-right corner substituted;
element transition from visible to hidden;
*/

function twenty(){
	if (xtraPixW > 0) {
		if (xtraPixW <= visits) {
			if (alternateW) {
				this.clip.left++;
				xtraPixW--;
			}
			alternateW = !alternateW;
		}	
		else {
			this.clip.left++;
			xtraPixW--;
		}
	}
	this.clip.left += incrementW;

	if (xtraPixH > 0) {
		if (xtraPixH <= visits) {
			if (alternateH) {
				this.clip.bottom--;
				xtraPixH--;
			}
			alternateH = !alternateH;
		}	
		else {
			this.clip.bottom--;
			xtraPixH--;
		}
	}
	this.clip.bottom -= incrementH;

	visits--;

	if (this.clip.height <= 0 && whichEl.clip.width<=0) {
		clearInterval(transTimer);
		this.hideIt();
	}

}

/*
transition 23 - RANDOM: 
transitions 1, 3, 14 & 16 (hidden to visible) excluded from random selection
element transition from visible to hidden only;
*/

function twentythree(dur){
	newTrans = getRandNums(0,22);
	doTransNS(whichEl,newTrans,dur);
}

function getRandNums(from,to){
    temp = parseInt((Math.random() * (to-from)) + (from));
    while (isNaN(temp)) {
        temp = parseInt((Math.random() * (to - from)) + (from));
    }

	for (i=0; i<arHidden.length; i++) {
		if (temp == arHidden[i]) {
			temp = parseInt((Math.random() * (to - from)) + (from));
		    while (isNaN(temp)) {
    		    temp = parseInt((Math.random() * (to - from)) + (from));
    		}
			i=0;
		}
	}

    return temp
}

function hideIt() {
	this.visibility = "hide";
	this.clip.left = this.origLeft;
	this.clip.top = this.origTop;
	this.clip.right = this.origRight;
	this.clip.bottom = this.origBottom;
}