var buttons = new Array();

function Init () {
	$$('.button').each(function (el) {
		buttons[el.id] = new Button(el);
	});
	//var param = getURLParam('featured');
	//var index = findProduct(param);
	ProductPage.setCurrent('3');
	ProductPage.initProducts();
	winnersToggle();
	login();
	dob();
	getNameWidth();
}

var ProductPage = {};
ProductPage.width = 180;
ProductPage.newLeft = 64;
ProductPage.deltaLeft = 130;
ProductPage.totalItems = 0;
ProductPage.Products = null;
ProductPage.newFeatured = null;
ProductPage.animating = false;
ProductPage.direction = null;
ProductPage.featured = null;
ProductPage.activeImage = null;
ProductPage.setProducts = function() {
	ProductPage.Products = $('products');
}
ProductPage.getActive = function() {
	var elt = $E('.activeImage');
	return elt;
}
ProductPage.getShrink = function() {
	return new Fx.Styles(ProductPage.activeImage, {
		duration: 250, 
		transition: Fx.Transitions.linear
	});
}
ProductPage.getGrow = function(){
	return new Fx.Styles(ProductPage.activeImage, {
		duration: 250,
		transition: Fx.Transitions.linear
	});
}
ProductPage.transFeatured = function(el) {
	return new Fx.Style(el, 'width' , {
		duration: 250
	});
}
ProductPage.initProducts = function() {
	var productPage = $('productBox');
	if(!$defined(productPage)) return;
	ProductPage.getActive();
	totalItems = $$('.Product').length - 1;
	$$('.product').each(function (el) {
		ProductPage.width += ProductPage.deltaLeft;
	});
	ProductPage.Products = $('products');
	ProductPage.Products.setStyle('width', ProductPage.width);
	$ES('.prev').addEvent('click',function(event){ProductPage.slideLeft();});
	$ES('.next').addEvent('click',function(event){ProductPage.slideRight();});
	
	ProductPage.activeImage = $E('.activeImage');
	ProductPage.shrink = ProductPage.getShrink(); 
	ProductPage.slide = new Fx.Style(ProductPage.Products, 'left', {
		duration: 500,
		transition: Fx.Transitions.linear
	});
	ProductPage.allAnimations();
}; // fn ProductPage.initProducts
ProductPage.allAnimations = function() {
	
	
	ProductPage.slide.addEvent('onComplete', function() {
		var featured = ProductPage.getFeatured();
		var img = getImg(featured);
		img.removeClass('activeImage');
	}).addEvent('onComplete', function() {
		var newFeatured = ProductPage.getNewFeatured();
		var img = newFeatured.getChildren()[0];
		img.addClass('activeImage');
		img.setProperty('src', img.getProperty('src')[0].replace(/.sm.jpg/,'.lg.jpg'));
		ProductPage.setActiveId(img.getProperty('rel')[0]);
		img.setStyle('height',220);
		var img = getImg(newFeatured);
		ProductPage.activeImage = img[0];
		var grow = ProductPage.getGrow();
		grow.start({
			'height':[220,287]
		});
	}).addEvent('onComplete', function () {
		var newFeatured = ProductPage.getNewFeatured();
		ProductPage.setNewFeatured(newFeatured);
	}).addEvent('onComplete', function() {
		var oldElt = null;
		$$('.details').each(function(container){
			if (container.getStyle("display") != "none") {
				oldElt = container;
			}
		});
		var elt = $(ProductPage.activeId);
		var fadeOld = new Fx.Style(oldElt, 'opacity', {
			duration: 450
		});
		var fade = new Fx.Style(elt, 'opacity', {
			duration: 450
		});
		fadeOld.start(1,0).addEvent('onComplete', function() {
			oldElt.setStyle('display','none');
		}).addEvent('onComplete', function() {
			elt.setStyle("opacity","0");
			elt.setStyle("display","block");
			fade.start(0,1);
		});
	}).addEvent('onComplete',
		function() {
			ProductPage.animating = false;
			//var newFeatured = ProductPage.getNewFeatured();
		}
	);
}
ProductPage.setActiveId = function(id) {
	ProductPage.activeId = id;
}
ProductPage.setNewFeatured = function(elt) {
	ProductPage.newFeatured = elt;
}
ProductPage.getNewFeatured = function()  {
	return ProductPage.newFeatured;
}
ProductPage.nextRight = function () {
	if (Math.abs(ProductPage.Products.getStyle('left').toInt() - ProductPage.deltaLeft*8)>= ProductPage.Products.getStyle('width').toInt()) {
		ProductPage.Products.getFirst().injectAfter(ProductPage.Products.getLast());
		ProductPage.Products.setStyle('left', (ProductPage.Products.getStyle('left').toInt()+ProductPage.deltaLeft)+"px");
		var startPos = ProductPage.Products.getStyle('left').toInt();
		var endPos = startPos - ProductPage.deltaLeft;
	} else {
		var startPos = ProductPage.Products.getStyle('left').toInt();
		var endPos = startPos - ProductPage.deltaLeft;
	}
	return new Array(startPos,endPos);
}; // fn ProductPage.getNextLeft

ProductPage.nextLeft = function() {
	if (ProductPage.Products.getStyle('left').toInt() == 0 || ProductPage.Products.getStyle('left').toInt() == -ProductPage.newLeft) {
		//at start
		ProductPage.Products.getLast().injectBefore(ProductPage.Products.getFirst());
		ProductPage.Products.setStyle('left', (-ProductPage.deltaLeft-ProductPage.newLeft)+"px");
		var startPos = -ProductPage.deltaLeft-ProductPage.newLeft;
		var endPos = -ProductPage.newLeft;
	} else {
		var startPos = ProductPage.Products.getStyle('left').toInt();
		var endPos = startPos + ProductPage.deltaLeft;
	}
	return new Array(startPos,endPos);
}; // fn ProductPage.getNextRight

ProductPage.slideLeft = function(){
	if (ProductPage.animating) {
		return;
	}
	ProductPage.animating = true;
	var pos = ProductPage.nextLeft();
	ProductPage.direction = 'back';
	//ProductPage.slide.start(pos[0],pos[1]);
	ProductPage.doSlide(pos[0],pos[1]);
};
ProductPage.slideRight = function(){
	if (ProductPage.animating) {
		return;
	}
	ProductPage.animating = true;
	var pos = ProductPage.nextRight();
	ProductPage.direction = 'forward';
	//ProductPage.slide.start(pos[0],pos[1]);
	ProductPage.doSlide(pos[0],pos[1]);
};
ProductPage.doSlide = function(start,end) {
	ProductPage.activeImage = $E('.activeImage');
	ProductPage.setFeatured();
	ProductPage.setProducts();
	ProductPage.start = start;
	ProductPage.end = end;
	ProductPage.shrink = ProductPage.getShrink();
	ProductPage.shrink.start({
		'height':[287,220]
	}).addEvent('onComplete', function() {
		var featured = ProductPage.getFeatured();
		featured.setStyle('width', 300);
		var smoothFeat = ProductPage.transFeatured($E('.featured'));
		smoothFeat.start(300, 130);
		featured.removeClass('featured');
		var img = getImg(featured);
		img.setProperty('src', img.getProperty('src')[0].replace(/.lg.jpg/,'.sm.jpg'));
	}).addEvent('onComplete', function(){
		var featured = ProductPage.getFeatured();
		var elt = (ProductPage.direction == 'forward') ? featured.getNext() : featured.getPrevious();
		ProductPage.setNewFeatured(elt);
		var newFeatured = ProductPage.getNewFeatured();
		newFeatured.setStyle('width', 130);
		newFeatured.addClass('featured');
		var smoothFeat = ProductPage.transFeatured($E('.featured'));
		smoothFeat.start(130, 300);
	}).addEvent('onComplete', function() {
		var featured = ProductPage.getFeatured();
		ProductPage.slide.start(ProductPage.start,ProductPage.end);
	});
}; // ProductPage.doSlide
/** 
 * Prevents capture.
 */
ProductPage.getStart = function() {
	return ProductPage.start;
}
ProductPage.getEnd = function() {
	return ProductPage.end;
}
ProductPage.setFeatured = function() {
	ProductPage.featured = $$('.featured');
}
ProductPage.getFeatured = function() {
	return ProductPage.featured;
}

ProductPage.setCurrent = function(index) {
	var containers = $$('.product');
	var i = 0;
	var centerContainer;
	var oldCenterImg;
	containers.each(function(container) {
		if (i++ == 3) {
			centerContainer = container;
			oldCenterImg = container.getChildren()[0];
		}
	});
	i=0;
	containers.each(function(container) {
		if (i++ == index) {
			//centerContainer.addClass('featured');
			var newImg = container.getChildren()[0];
			newImg.src = newImg.src.replace(/.sm.jpg/,'.lg.jpg');
			newImg.addClass('activeImage');
			//centerContainer.removeChild(oldCenterImg);
			//centerContainer.appendChild(newImg);
			//container.appendChild(oldCenterImg);
			ProductPage.setActiveId(newImg.getProperty('rel'));
			$(ProductPage.activeId).setStyle('display','block');
		}
	});
}; // fn setCurrent. 
function findProduct(ProductName) {
	var containers = $$('.product');
	var i=0;
	var j=0;
	containers.each(function(container) {
		var img = getImg(container);
		if (img.src.indexOf(ProductName) != -1) {
			j = i;
		}
		i++;
	});
	return j;
}

function getImg(iContainer) {
	var img = iContainer.getChildren()[0];
	return img;
}

/*where to buy province swap*/
function where2buy(province){
	var chart = $$('.buyChart');
	chart.each(function(el){
		el.setStyle('display', 'none' );
	});
	var selectedProvince = $$('#'+province);
	selectedProvince.setStyle('display', 'block');
}

function dryMixes(value){
	if(value == '3' || value == '4') {
		$$('#register3_4').setStyle('display', 'block');
	} else {
		$$('#register3_4').setStyle('display', 'none');
	}
}

/*popup*/
function popup(url, type){
	if (type=="recipe") {
		var newwindow = window.open(url,'name','height=600,width=580');
	}else {
		var newwindow = window.open(url,'name','height=700,width=565,scrollbars=yes');
	}
	if (window.focus) {newwindow.focus()}
	return false;
}

/*get url param*/
function getURLParam(strParamName){
  var strReturn = "";
  var strHref = window.location.href;
  if ( strHref.indexOf("?") > -1 ){
    var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase();
    var aQueryString = strQueryString.split("&");
    for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){
      if ( aQueryString[iParam].indexOf(strParamName + "=") > -1 ){
        var aParam = aQueryString[iParam].split("=");
        strReturn = aParam[1];
        break;
      }
    }
  }
  return strReturn;
}

/*winners toggle*/
function winnersToggle() {
	var winnersPage = $('winnersDropdown');
	if(!$defined(winnersPage)) return;
	winnersPage.addEvent('change', function() {
		var value = winnersPage.getValue();
		$$('.winMonth').setStyle('display', 'none');
		$(value).setStyle('display', 'block');
		var img = $(value).getProperty('image');
		var alt = $(value).getProperty('copy');
		$('contest_image').setProperty('src', $('contest_image').getProperty('src').replace(/.\w+.jpg/g, '.'+img+'.jpg'));
		$('contest_image').setProperty('alt', alt);
	});
}

/*Mouseover class*/

var Button = new Class({
	initialize: function(el){
		this.el = el;
		ref = this;
		this.src = el.getProperty('src');
		el.addEvent('mouseover', function (e) {
			e = new Event(e);
			//uncomment once all over .gifs are made
			el.setProperty('src',this.src.replace(/.off.([gif|jpg])/,".on.$1"));
		}.bind(ref));
		el.addEvent('mouseout', function (e) {
			e = new Event(e);
			el.setProperty('src',this.src);
		}.bind(ref));
	}
});

function login(){
	$$('.login').addEvent('click', function (e) {
		$$('#popup').setStyle('display', 'block');
		$$('#popup #loginform').setStyle('display', 'block');
	});
	$$('.close').addEvent('click', function (e) {
		$$('#popup #loginform').setStyle('display', 'none');
		$$('#popup #forgotform').setStyle('display', 'none');
		$$('#popup').setStyle('display', 'none');
	});
	$$('.forgot').addEvent('click', function (e) {
		$$('#popup #loginform').setStyle('display', 'none');
		$$('#popup #forgotform').setStyle('display', 'block');
	});
}

function dob() {
	$$('#dob input').each(function(el) {
		rel = el.getProperty('rel');
		if(rel != null ) {
			el.setProperty('value',el.getProperty('rel'));  
			el.addEvent('focus', function() { if(el.getProperty('value') == el.getProperty('rel')) { el.setProperty('value',''); } });  
			el.addEvent('blur', function() { if(el.getProperty('value') == '') { el.setProperty('value',el.getProperty('rel')); } }); 
		}
	});
}

function getNameWidth() {
	if($('namelength')) {
		var length = $('namelength').offsetWidth;
		$('hide').setStyle('display', 'none');
		$('logout_name').setStyle('background-position', String((270 - length)) + 'px 0');
	}
}

window.addEvent('domready', Init);