/* Begin: Invisible Children - Mend Library
/* created 4/09 by Rich Rudzinski
/*------------------------------------------*/
/*------------- BEGIN: resizableBg ----------------*/
/* makes a full screen scalable background for any browser that does not support min-height (IE). Also sets the background/adds the click event for the product pages. */
/* init */
function resizableBg() {
	var obj = this;
	this.bgImg = $('bgImg');
	this.imgZoom = $('image');
	if(this.imgZoom) this.swapSrc(this.imgZoom.getAttribute('src'));
	if(this.imgZoom) this.addClickEvent();
	this.getAspectRatio();
	if(this.bgImg.width >= document.viewport.getDimensions().width) return false;
	else this.resizeBg();
	window.onresize = function() { obj.resizeBg(); }
}
/* swaps out bg src if you are on a product page */
resizableBg.prototype.swapSrc = function(src) {
	var imgArray = src.split('/');
	var name = imgArray[imgArray.length - 1];
	this.bgImg.setAttribute('src', '/skin/frontend/mend/default/images/products_scalable/' + name);
}		
/* adds the click event for the product thumbnails */
resizableBg.prototype.addClickEvent = function() {
	var obj = this;
	this.imgZoom.thumbCont = document.getElementsByClassName('more-views')[0];
	this.imgZoom.thumbLinks = this.imgZoom.thumbCont.getElementsByTagName('a');
	for(i=0; i<this.imgZoom.thumbLinks.length; i++) {
		Event.observe(this.imgZoom.thumbLinks[i], 'click', function() {
			obj.swapSrc(this.getElementsByTagName('img')[0].getAttribute('src'));
			return false;
		});
	}
}
/* finds the image aspect ration. If on the product page it assumes the picture is 1024x768. */
resizableBg.prototype.getAspectRatio = function() {
	if(!this.imgZoom) {
		var rel = this.bgImg.getAttribute('rel').split(',');
		rel[0] = rel[0].replace('width=', '');
		rel[1] = rel[1].replace('height=', '');
		this.bgImg.aspectRatio = rel[0]/rel[1];
	} else {
		this.bgImg.aspectRatio = 1024/768;
	}
}
/* resizes the image to fit in the viewport */
resizableBg.prototype.resizeBg = function() {	
	var viewport = document.viewport.getDimensions();
	this.width = viewport.width; 
	this.height =  viewport.height; 
	if(this.height > Math.ceil(this.width * (1/this.bgImg.aspectRatio))) {
		this.bg.style.height = this.height + 'px';
		this.bg.style.width = Math.ceil(this.height * this.bgImg.aspectRatio) + 'px';				
	} else {		
		this.bgImg.style.width = this.width + 'px';
		this.bgImg.style.height = Math.ceil(this.width * (1/this.bgImg.aspectRatio)) + 'px';
	}
}
/*------------- BEGIN: detailSlider ----------------*/
/* collapses/expands the product detail information */
/* init */
function detailSlide() {
	this.toggle = $('detailSlide');
	this.toggleCont = document.getElementsByClassName('middle-container')[0];
	this.toggleCont.width = this.toggleCont.getWidth();
	this.increment = -15;
	this.toggleCont.endWidth = 73;
	this.animating = false;
	var obj = this;
	
	this.toggle.observe('click', function() {
		if(obj.toggleCont.hasClassName('closed') && obj.animating == false) {
			obj.increment = obj.increment * -1;
			obj.toggleCont.endWidth = 303;
			obj.animateWidth();
		} else if(obj.animating == false) {
			obj.toggleCont.addClassName('closed');
			obj.increment = -15;
			obj.toggleCont.endWidth = 73;
			obj.animateWidth();
		}
		return false;
	});
}
/* initializes width animation */
detailSlide.prototype.animateWidth = function() {
	this.animating = true;
	this.timer = setInterval(this.setWidth.bind(this), 40);
}	
/* sets intermediate width */
detailSlide.prototype.setWidth = function() {
	var compare = (this.increment > 0) ? this.toggleCont.width + this.increment < this.toggleCont.endWidth : this.toggleCont.width + this.increment > this.toggleCont.endWidth;
	if(compare) {
		this.toggleCont.width = this.toggleCont.width + this.increment; 
		this.toggleCont.style.width = this.toggleCont.width + 'px'; 
	} else if (this.toggleCont.width == this.endWidth) {
		clearTimeout(this.timer);
		if(this.increment > 0) this.toggleCont.removeClassName('closed');
		this.animating = false;
	} else {
		clearTimeout(this.timer);
		if(this.increment > 0) this.toggleCont.removeClassName('closed');
		this.toggleCont.width = this.toggleCont.endWidth; 
		this.toggleCont.style.width = this.toggleCont.width + 'px';
		this.animating = false;
	}
}
/*------------- BEGIN: document ready ----------------*/
Event.observe(window, 'load', function() {
	var slideLink = $('detailSlide');
	if(slideLink) var slide = new detailSlide();
});