// JavaScript Document
//var $j = jQuery.noConflict();
$(document).ready(function(){


//Create Rollover and Down Effect - Main Menu

function rolloverInit() {
    var imageArray = $('.RolloverImage');
    for (var i=0; i<imageArray.length; i++) {
            setupRollover(imageArray[i]);
    }
}

function setupRollover(thisImage) {
	thisImage.outImage = new Image();
	thisImage.outImage.src = thisImage.src;
	thisImage.onmouseout = rollOut;
	
	thisImage.overImage = new Image();
	thisImage.overImage.src = "https://www.sunpill.com/images/" + thisImage.id + "_over.jpg"; 
	thisImage.onmouseover = rollOver;
	
	thisImage.clickImage = new Image();
	thisImage.clickImage.src = "https://www.sunpill.com/images/" + thisImage.id + "_on.jpg";
	thisImage.onclick = rollClick;
}

function rollOut() {	
	this.src = this.outImage.src;
}

function rollOver() {
	if(lastClick) {
		if(lastClick.id != this.id){
			this.src = this.overImage.src;	
		}
	}
	else {
		this.src = this.overImage.src;
	}	
}

function rollClick() {
	if(lastClick){		
		lastClick.onmouseout = rollOut;
		lastClick.src = lastClick.outImage.src;
	}	
	this.src = this.clickImage.src;
	this.onmouseout = rollClickSecond;
	lastClick = this;
	
}

function rollClickSecond() {
    if(lastClick){       
        lastClick.onmouseout = rollOut;
        lastClick.src = lastClick.outImage.src;
    }   
    this.src = this.clickImage.src;
     this.onmouseout = rollClickSecond;
    lastClick = this;
}

var lastClick = null;
rolloverInit();  

//Create Rollover Effect - Carousel Buttons

function rolloverInit2() {
    var imageArray2 = $('.mainscrollButtons_left');
    for (var i=0; i<imageArray2.length; i++) {
			   setupRollover2(imageArray2[i]);
    }
}

function rolloverInit3() {
    var imageArray2 = $('.mainscrollButtons_right');
    for (var i=0; i<imageArray2.length; i++) {
            setupRollover2(imageArray2[i]);
    }
}


function setupRollover2(thisImage) {
	thisImage.outImage = new Image();
	thisImage.outImage.src = thisImage.src;
	thisImage.onmouseout = rollOut2;
	
	thisImage.overImage = new Image();
	thisImage.overImage.src = "https://www.sunpill.com/images/" + thisImage.id + "_over.png"; 
	thisImage.onmouseover = rollOver2;
}

function rollOut2() {	
	this.src = this.outImage.src;
}

function rollOver2() {
	if(lastClick) {
		if(lastClick.id != this.id){
			this.src = this.overImage.src;	
		}
	}
	else {
		this.src = this.overImage.src;
	}	
}  

var lastClick2 = null;

//Create Rollover Effect - Grey Buttons

function rolloverInit4() {
    var imageArray4 = $('.RolloverImageGrey');
    for (var i=0; i<imageArray4.length; i++) {
            setupRollover4(imageArray4[i]);
    }
}


function setupRollover4(thisImage) {
	thisImage.outImage = new Image();
	thisImage.outImage.src = thisImage.src;
	thisImage.onmouseout = rollOut4;
	
	thisImage.overImage = new Image();
	thisImage.overImage.src = "https://www.sunpill.com/images/" + thisImage.id + "_over.png"; 
	thisImage.onmouseover = rollOver4;
}

function rollOut4() {	
	this.src = this.outImage.src;
}

function rollOver4() {
	if(lastClick) {
		if(lastClick.id != this.id){
			this.src = this.overImage.src;	
		}
	}
	else {
		this.src = this.overImage.src;
	}	
}  

var lastClick4 = null;






//Scroll Set Up for MAIN CONTENT

 var $mc_panels = $('#main_content .panel');
 var $mc_container = $('#main_content .container'); 
 var mc_horizontal = true;
 	  if (mc_horizontal) {
		 $mc_panels.css({
			'float' : 'left',
			'position' : 'relative'
		  });
		$mc_container.css('width', 1710); 
	 }

var $mc_scroll = $('#main_content .scroll').css('overflow', 'hidden');

 $mc_scroll
   .before('<img class="mainscrollButtons_left" id="carousel_arrow_left" src="http://www.sunpill.com/images/carousel_arrow_left.png" />')
   .after('<img class="mainscrollButtons_right" id="carousel_arrow_right" src="http://www.sunpill.com/images/carousel_arrow_right.png" />');

 var scrollOptions = {
		target: $mc_scroll,
		items: $mc_panels,
		//navigation: '.navigation',
		axis: 'xy',
		duration: 500,
		easing: 'swing',
		prev: 'img.mainscrollButtons_left', 
        next: 'img.mainscrollButtons_right'
	};
	
$('#main_content').serialScroll(scrollOptions);
$.localScroll(scrollOptions);

rolloverInit2();
rolloverInit3();
rolloverInit4();


});