// JavaScript Document
$(document).ready(function() {
						   
	var cache = [];
	var marketstate = 1;
	var thisReady = false;
	// Arguments are image paths relative to the current page.
	$.preLoadImages = function() {
	  var args_len = arguments.length;
	  for (var i = args_len; i--;) {
		var cacheImage = document.createElement('img');
		cacheImage.src = arguments[i];
		cache.push(cacheImage);
	  }
	}
	
	$.preLoadImages("images/tabpanel2.png", "images/tabpanel3.png", "images/tabpanel4.png", "images/tabpanel5.png");
	
	Cufon.replace('.blackhead', { fontFamily: 'ArialBlack' });
	Cufon.replace('.boldhead', { fontFamily: 'ArialBold' });

	
	$('body').onImagesLoad({
             selectorCallback: startScroll
     });

	
	$('#pane2').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});
	$('#pane5fr').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});
	$('#pane6fr').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});
	$('#pane7fr').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});
	$('#pane8fr').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});
	$('#pane9fr').jScrollPane({showArrows:true, scrollbarWidth:12, scrollbarMargin:12, dragMinHeight:20, dragMaxHeight:20});


	// start scroll
	//---------------------------------------
	

var revolutions = 0;
var slideIndex = 1;


function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
	
    var idx = carousel.index(i, 3);
    carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));
	if(state == 'next') {
	slideIndex++;
	} else if(state == 'prev') {
	slideIndex--;
	}
	
	if(slideIndex > 3) {
	slideIndex=1;
	} else if(slideIndex < 1) {
	slideIndex=3;
	}
	var thisSlide = '#slide'+slideIndex;
	resetSlideBtns(thisSlide);
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
    carousel.remove(i);
	revolutions++;
	if(revolutions >= 3) {
		carousel.stopAuto();
	}
	if(state == "next") {
		marketstate++;
	}
	if(state == "prev") {
		marketstate--;
	}
	if(marketstate == 4) {
		marketstate=1;
	}
	if(marketstate == 0) {
		marketstate=3;
	}
};

function mycarousel_initCallback(carousel) {
	jQuery('#slide1').bind('click', function() {
		switch(slideIndex)
		{
		case 1:
			null;
		  break;
		case 2:
		  	carousel.next(2);
		  break;
		case 3:
		 	carousel.next();
		  break;
		default:
		 	carousel.next();
		}
		
		carousel.stopAuto();
        return false;
    });
    jQuery('#slide2').bind('click', function() {
        
		switch(slideIndex)
		{
		case 1:
		 	carousel.next();
		  break;
		case 2:
		  	null;
		  break;
		case 3:
		 	carousel.next(2);
		  break;
		default:
		 	carousel.next();
		}
		
		carousel.stopAuto();
        return false;
    });
	jQuery('#slide3').bind('click', function() {
        switch(slideIndex)
		{
		case 1:
		 	carousel.next(2);
		  break;
		case 2:
		 	carousel.next();
		  break;
		case 3:
		 	null;
		  break;
		default:
		 	carousel.next();
		}
		
		carousel.stopAuto();
        return false;
    });

    jQuery('.jcarousel-scroll select').bind('change', function() {
        carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
        return false;
    });

    jQuery('.slidearrowright').bind('click', function() {
        carousel.next();
		carousel.stopAuto();
        return false;
    });
	
	jQuery('.here').bind('click', function() {
        carousel.next(2);
		carousel.stopAuto();
        return false;
    });

    jQuery('.slidearrowleft').bind('click', function() {
        carousel.prev();
		carousel.stopAuto();
        return false;
    });
	// Pause autoscrolling if the user moves with the cursor over the clip.
    /*carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
		if(revolutions < 3) {
        carousel.startAuto();
		}
    });*/
	
};
/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    return '<div style="background-image:url(' + item.url + '); width:743px; height:196px;">' + item.blurb + '</div>';
};

function startScroll() {
    $('#mycarousel').jcarousel({
		auto: 3,
		scroll: 1,
        wrap: 'circular',
		initCallback: mycarousel_initCallback,
        itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
        itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback}
    });
};
		
	
	// end scroll
	//---------------------------------------
	

	
	
	
	//var slideState = 'slide1';
	 
	$('#slide2').click(function() {
		resetSlideBtns('#slide2');
	});
	$('#slide3').click(function() {
		resetSlideBtns('#slide3');
	});
	
	
	function resetSlideBtns(selectId) {
		$('#slide1').removeClass("colorblue");
		$('#slide1').addClass("grayselect");
		$('#slide2').removeClass("colorblue");
		$('#slide2').addClass("grayselect"); 
		$('#slide3').removeClass("colorblue");
		$('#slide3').addClass("grayselect");
		$(selectId).removeClass("grayselect");
		$(selectId).addClass("colorblue");
	}
	
	
	
	$('.tab1').click(function() {
		var classTrue = $(this).hasClass("tab_off");
		if(classTrue == true) {
			setTabsOff();
			$(this).removeClass("tab_off");
			$(this).addClass("tab_select");
			$("#tabs_cont").css("background-image", "url(images/tabpanel1.png)");
			$('#tabbot_one').css({'display' : 'block'});
			$('#tabbot_two').css({'display' : 'none'});
			$('#tabbot_three').css({'display' : 'none'});
			$('#tabbot_four').css({'display' : 'none'});
			$('#tabbot_five').css({'display' : 'none'});
		}
	});
	$('.tab2').click(function() {
		var classTrue = $(this).hasClass("tab_off");
		if(classTrue == true) {
			setTabsOff();
			$(this).removeClass("tab_off");
			$(this).addClass("tab_select"); 
			$("#tabs_cont").css("background-image", "url(images/tabpanel2.png)");
			$('#tabbot_one').css({'display' : 'none'});
			$('#tabbot_two').css({'display' : 'block'});
			$('#tabbot_three').css({'display' : 'none'});
			$('#tabbot_four').css({'display' : 'none'});
			$('#tabbot_five').css({'display' : 'none'});
		}
	});
	$('.tab3').click(function() {
		var classTrue = $(this).hasClass("tab_off");
		if(classTrue == true) {
			setTabsOff();
			$(this).removeClass("tab_off");
			$(this).addClass("tab_select"); 
			$("#tabs_cont").css("background-image", "url(images/tabpanel3.png)");
			$('#tabbot_one').css({'display' : 'none'});
			$('#tabbot_two').css({'display' : 'none'});
			$('#tabbot_three').css({'display' : 'block'});
			$('#tabbot_four').css({'display' : 'none'});
			$('#tabbot_five').css({'display' : 'none'});
		}
	});
	$('.tab4').click(function() {
		var classTrue = $(this).hasClass("tab_off");
		if(classTrue == true) {
			setTabsOff();
			$(this).removeClass("tab_off");
			$(this).addClass("tab_select");
			$("#tabs_cont").css("background-image", "url(images/tabpanel4.png)");
			$('#tabbot_one').css({'display' : 'none'});
			$('#tabbot_two').css({'display' : 'none'});
			$('#tabbot_three').css({'display' : 'none'});
			$('#tabbot_four').css({'display' : 'block'});
			$('#tabbot_five').css({'display' : 'none'});
		}
	});
	$('.tab5').click(function() {
		var classTrue = $(this).hasClass("tab_off");
		if(classTrue == true) {
			setTabsOff();
			$(this).removeClass("tab_off");
			$(this).addClass("tab_select");
			$("#tabs_cont").css("background-image", "url(images/tabpanel5.png)");
			$('#tabbot_one').css({'display' : 'none'});
			$('#tabbot_two').css({'display' : 'none'});
			$('#tabbot_three').css({'display' : 'none'});
			$('#tabbot_four').css({'display' : 'none'});
			$('#tabbot_five').css({'display' : 'block'});
		}
	});
	
	function setTabsOff() {
		$('#tabs_top').children().each( 
		  function(){
			$(this).removeClass("tab_select");
			$(this).addClass("tab_off"); 
		  }
		);
		
	

	}
	
	
	
	Image1= new Image(759,206)
	Image1.src = "images/tabpanel1.png"
	Image2= new Image(759,206)
	Image2.src = "images/tabpanel2.png"
	Image3= new Image(759,206)
	Image3.src = "images/tabpanel3.png"
	Image4= new Image(759,206)
	Image4.src = "images/tabpanel4.png"
	Image5= new Image(759,206)
	Image5.src = "images/tabpanel5.png"
	
	$('#slidemask').click(function() {
		console.log(marketstate)
	});
	
	
		$('#tabbot_one').css({'display' : 'block'});
		$('#tabbot_two').css({'display' : 'none'});
		$('#tabbot_three').css({'display' : 'none'});
		$('#tabbot_four').css({'display' : 'none'});
		$('#tabbot_five').css({'display' : 'none'});
	
});

var mycarousel_itemList = [
    {url: 'images/slide1.png', blurb: '<div id="blurb1"><span class="marketone">Proven solutions that save oil and gas companies - <br />like yours - time and money</span></div>'},
    {url: 'images/slide2.png', blurb: '<div id="blurb1"><span class="marketone">Speed-up the flow of information between <br />you and your business partners</span></div>'},
    {url: 'images/slide3.png', blurb: '<div id="blurb1"><span class="marketone">Simplify the way you manage and analyze revenue, <br />production, and cost information</span></div>'}
];