// Replace $ with $jq to stop sitecore conflicts

var $jq = jQuery.noConflict();


// Lets set this carousel up!!
jQuery(document).ready(function() {
    jQuery("#carousel").jcarousel({
        scroll: 1,
        auto: 5,
        animation: 1000,
        wrap: "last",
        initCallback: function(jc, state) {
            if (state == 'init') {
                /* Mod this code to get it to pause on hover and continue after your mouse leaves */
                /* WORKING! */
                jc.buttonNext[0].style.display = 'none';
                jc.buttonPrev[0].style.display = 'none';
                jQuery('.jcarousel-control a').bind('click', function() {
					jQuery('.jcarousel-control a').removeClass('active')
                    jc.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
					jQuery(this).addClass('active');
                    return false;
                });
                jc.startAutoOrig = jc.startAuto;
                jc.startAuto = function() {
                    if (!jc.paused) {
                        jc.startAutoOrig();
                    }
                }
                jc.pause = function() {
                    jc.paused = true;
                    jc.stopAuto();
                };
                jc.play = function() {
                    jc.paused = false;
                    jc.startAuto();
                };
                $jq('li.jcarousel-item').mouseover(function() {
                    jc.pause();
                });
                $jq('li.jcarousel-item').mouseout(function() {
                    jc.play();
                });
            }
                jc.play();
            }
    });
    

});

//Expandable menu
$jq(document).ready(function () {
    $jq(".openCloseButton").click(function () {
        $jq(".openCloseButton").toggleClass('open');
        if ($jq(".openCloseButton").hasClass('open')) {
            $jq("#pop-up-panel").animate({ "height": "155px" }, "fast");
        }
        else {
            $jq("#pop-up-panel").animate({ "height": "30px" }, "fast");
            //$jq("#carouselContainer").css('display:none');
        }

    });
    
    $jq(".imageBox").click(function(e){
         window.location=$jq(this).find("a").attr("href");
         e.preventDefault();
    });

	$jq('#mainCarousel').jcarousel({
			scroll: 1,
			auto: 0,
			buttonNextHTML: '<div id="btnNext"></div>',
			buttonPrevHTML: '<div id="btnPrev"></div>'
		});

	$jq('#caseStudyMainCarousel').jcarousel({
			scroll: 1,
			auto: 0,
			animation: 300,
			buttonNextHTML: '<div id="btnNext"></div>',
			buttonPrevHTML: '<div id="btnPrev"></div>'
		});

	$jq('#caseStudyMiniCarousel').jcarousel({
			scroll: 1,
			auto: 0,
			animation: 1300,
			buttonNextHTML: '<div id="btnNext"></div>',
			buttonPrevHTML: '<div id="btnPrev"></div>'
		});
//Controls for fading image and displaying link in carousel for Inspiration Bank

	$jq(".template1 .imageBox, .template2 .imageBox").hover(
		function() {
		    $jq('.content', this).css('z-index', 200);
			$jq('.content a', this).css('z-index', 200);
			$jq('.image', this).css('z-index', 1);	
			$jq('.image img', this).css('z-index', 1);			
			$jq('.image', this).fadeTo(200, 0.15);
			$jq('.content', this).fadeTo(200, 1);			
		},
		function() {
		    $jq('.content', this).css('z-index', 0);
			$jq('.content a', this).css('z-index', 0);
			$jq('.image', this).css('z-index', 5);
			$jq('.image img', this).css('z-index', 5);			
			$jq('.content', this).fadeTo(200, 0);
			$jq('.image', this).fadeTo(200, 1);
			
		}
	);
	
});