$(document).ready(function() {
    
    var heroAnimating = false;
    var heroFirst = 1;
    var heroLast = 4;
    var heroItems = $("#hero-items li").length;
    var heroWidth = 146;
    var heroActive = 1;
    var heroSpeed = 500;
    var heroTimer = setInterval(function() { nextHero(); }, 4000);
	

	// grab the URL set in the attributes for the hero-items a
	var linkValue = $('#hero-items a').attr('href');
	// add the 'read more' link to the first li on load
	$('#hero-items li a:first').parent().children('span').fadeIn();
	
		
    // clear timer as soon as mouse enters
    $("#hero-container").mouseenter(function() {
        clearInterval(heroTimer);
    });
    // start again as mouse leaves
    $("#hero-container").mouseleave(function() {
        clearInterval(heroTimer)
        heroTimer = setInterval(function() { nextHero(); }, 4000);
    });
    
    // add numbers to items
    i = 1;
    $("#hero-items a").not('span a').each(function() {
        $(this).addClass(i.toString());
        i++;
    });
	
	
    // individual hero item is clicked
    $("#hero-items a").not('span a').click(function() {
		
		// return if item is active
        if(heroActive == parseInt($(this).attr("class"))) return false;        
        // calculate where to move active box to
        left = (parseInt($(this).attr("class")) * heroWidth) - (heroWidth * heroFirst) + 34;
        // change active hero
        changeHero($(this).attr("class"));
		
        // animate
        $("#hero-item-active").animate({
            left: left + "px"
        }, heroSpeed, "easeInOutCirc");
        return false;
    });
		
    
	
    // prev/next controls are clicked
    $(".hero-control a").click(function() {
    
        // just return if items are already animating
        if(heroAnimating) return false;
        // at either end of item strip, don't move strip, but just move active box
        id = $(this).parent().attr("id");
        switch(id) {
            case "hero-prev":
                if(heroActive > heroFirst || heroFirst == 1) {
                    changeTo = heroActive - 1;
                    $("#hero-items a." + changeTo).trigger("click");
                    return false;
					
                }
                break;
            case "hero-next":
                if(heroActive < heroLast || heroLast == heroItems) {
                    changeTo = heroActive + 1;
                    $("#hero-items a." + changeTo).trigger("click");
                    return false;
                }
                break;
        }
        
        // calculate new margin
        changeTo = null;
        m = $("#hero-items").css("margin-left");
        m = parseInt(m.substring(0, m.length-2));
        switch(id) {
            case "hero-prev": m += 146; heroFirst--; heroLast--; changeTo = heroActive-1; break;
            case "hero-next": m -= 146; heroFirst++; heroLast++; changeTo = heroActive+1; break;
        }
        // change active hero
        changeHero(changeTo);
        // animate
        heroAnimating = true;
        $("#hero-items").animate({
            marginLeft: m + "px"
        }, heroSpeed, "easeInOutCirc", function() { heroAnimating = false; });
        return false;
    });
	
	
	
    
    // changes active hero
    var changeHero = function(to) {
		
        // enable/disable buttons
        if(to == 1) {
            $("#hero-prev a").addClass("disabled");
            $("#hero-next a").removeClass("disabled");			

        }
        if(to > 1 && to < heroItems) {
            $("#hero-prev a").removeClass("disabled");
            $("#hero-next a").removeClass("disabled");
        }
        if(to == heroItems) {
            $("#hero-next a").addClass("disabled");
        }
        
        to = parseInt(to) - 1;
        $("#hero-items li.active").removeClass("active");
        $("#hero-items li:eq("+to+")").addClass("active");

        
        $(".hero").eq(to).fadeIn(heroSpeed);
        $(".hero-active").fadeOut(heroSpeed).removeClass("hero-active");

        $(".hero").eq(to).addClass("hero-active");
        heroActive = to+1;
		
		//
		var goTo = to + 1;
		// first fade out the 'read more' link
		$('#hero-items li a').parent().children('span').fadeOut();
		//next fade in the 'read more' link
		$('#hero-items li a.' + goTo).parent().children('span').fadeIn();
		
    }
    
    // make whole hero clickable
    $("#hero-frame").click(function() {
        url = $(".hero-active").find(".link").attr("href");
        window.location.href = url;
    });
    
    // advance to next hero
    var nextHero = function() {
        if(heroActive == heroItems) {
			
            // reset everything
            heroActive = 1;
            heroFirst = 1;
            heroLast = 4;
            heroAnimating = true;
            changeHero(1);
			console.log(heroActive);
            $("#hero-item-active").animate({
                left: "34px"
            }, heroSpeed, "easeInOutCirc");
			
            $("#hero-items").animate({
                marginLeft: "43px"
            }, heroSpeed, "easeInOutCirc", function()
			{
				heroAnimating = false;
			});
            
        } else {
            $("#hero-next a").trigger("click");
        }
    }
    
     // in your area map
     /*
    var mapOver = function() {

        // hide any open region popups
        $("div.map-popup-open").hide();
        $("#map area").removeClass("open");
        
        // show region popup
        $(this).addClass("open");
        region = $(this).attr("class").replace(" open", "");
        popup = $("div." + region);
        popup.show();
        bottom = parseInt(popup.css("bottom").replace("px", ""))+20;
        popup.hide();
        popup.addClass("map-popup-open").css("bottom", bottom + "px").show().animate({ bottom: bottom-20 + "px" }, 500, "easeOutBounce");
    }
    
    var mapConfig = {    
        sensitivity: 3,  
        interval: 100, 
        timeout: 300, 
        over: mapOver,
        out: function() { return false; }
    }
    $("#map area").not(".open").hoverIntent(mapConfig);
    */
    
	// In Your Area map
	/* change background image position on rollover */
	var map = $('#inYourAreaMap img.map');
	var arr = populateRegionsArray();
	//var arr = new Array('Scotland', 'Northwest', 'NorthernIreland', 'YorkshireHumber', 'NorthEast', 'SouthWest', 'SouthEast', 'EastMidlands', 'WestMidlands', 'Wales', 'London', 'EastEngland');
	$('#inYourAreaMap').each(function () {
		for (var i = 0; i < arr.length; i++) {
			$(this).find('#map' + arr[i]).attr('rel', i ).mouseover(function () {
				map.css({'background-position': '0 -' + ((parseInt($(this).attr('rel'))+1)*502) + 'px' }); 
			}).click(function() {
				$('#inYourAreaMap .regionTitle').hide();
				if ($('#inYourAreaMap').hasClass('on' + arr[$(this).attr('rel')])) {
					var r = true;
				}
				for (var j = 0; j < arr.length; j++) {
					$('#inYourAreaMap').removeClass('on' + arr[j]);
				}
				if (!r) {
					$('#inYourAreaMap').addClass('on' + arr[$(this).attr('rel')]);
				}
				return false;
			});
		}
	});

	/* reset to default on mouseout */
	$('#inYourAreaMap area').mouseout(function(){
		$('#inYourAreaMap img.map').css({'background-position': '0 0'});
	});

	/* reset to default when close is clicked */
	$('#inYourAreaMap .close').click(function(){
		for (var i = 0; i < arr.length; i++) {
	        $('#inYourAreaMap').removeClass('on' + arr[i]);
	    }
		return false;
	});

	/* get name of region for hover label */
	/*
	$('#inYourAreaMap area').each(function(){
		var region = $(this).attr('alt');
		var regionClass = region.replace('& ','').replace(' ','');
		$(this).parent().append('<span class="regionTitle regionTitle' + regionClass + '">' + region + '</span>');
	}).mouseover(function(){
		var region = $(this).attr('alt').replace('& ','').replace(' ','');
		$(this).parent().find('.regionTitle' + region).show();
	}).mouseout(function(){
		var region = $(this).attr('alt').replace('& ','').replace(' ','');
		$(this).parent().find('.regionTitle' + region).hide();
	});
	*/
      
});



function populateRegionsArray()
{
    var i = 0;
    var arr = new Array();
    $('#inYourAreaMap area').each(function () {
        var item = $(this).attr('id');
        if(item.indexOf('map') != -1)
        {
            arr[i] = item.substring(3);
            i = i + 1;
        }
     });
          
     return arr;     
};