// JavaScript Document

$(document).ready(function() {
	$('#slideshow').cycle({
		fx: 'fade',
		speed: 400,
		timeout: 6000,
		pager:  '#controls'
	});    

/* === ACTION FOR THE PAUSE/PLAY BUTTON === */
	$(".pausePlay").toggle(function(){
		$("#slideshow").cycle('pause');
		$(this).addClass("showPlay");
		$(this).attr('title','Play slideshow');
	}, function() {
		$("#slideshow").cycle('resume');
		$(this).removeClass("showPlay");
		$(this).attr('title','Pause slideshow');
	});
	
	/* === RESUMES SLIDESHOW WHEN CLICKING AN IMAGE NUMBER ON PAUSE === */
	$("#controls a").click(function(){
		$("#slideshow").cycle('resume');
		$(".pausePlay").removeClass("showPlay");
	});


	/* ==== ROLLOVER ACTION FOR BUTTONS ===== */
	$('.withSubs, .oneLink').hover(function(){
	  $(".cover", this).stop().fadeTo(150, 0.0, function(){
			$(this).hide();
	  });
	}, function() {
	  $(".cover", this).stop().show(0, function(){
			$(this).fadeTo(150, 1.0);
	  });
	});
	
	$(".oneLink a").html("");
	$(".oneLink").click(function(e){
	  e.preventDefault();
	  var a = $("a",this).get(0);
	  //console.log($(a).attr('target'));        
	  if($(a).attr('target') == 'blank') window.open(a.href);
	  else window.location = a.href;
	});
	
	
});


/* ====== HOMEPAGE SPECIALS ===== */
$(function(){
	var dsAjax = new DS.SpecialsService(s);
	var usedSpecials = dsAjax.getUsed(4); 
	for (var i = 0; i<usedSpecials.length; i++){
		usedSpecials[i].header = "PRE-OWNED";	
	}
	var themeName = "<div class='special' title='View more details on the ${title}'>"
		+"<div class='spHeader' style='background-color:#${button1Color}'><div class='specialType'>${header}</div>"
		+"<div class='expDate'>Expires: ${expDate}</div></div>"
		+"<div class='spBody' style='background-color:#${color4}; border-bottom:1px solid #${color1}'>"
		+"<div class='spBodyLeft'><img src='${imagePath}' alt='${title}' style='border:1px solid #${color1}' /><div class='spStockNum'>${stockNum}</div></div>"
		+"<div class='spBodyRight'><h3 style='color:#${color1}'>${title}</h3><h4 style='color:#${color2}'>${line1}</h4>"
		+"<span class='spLine2'>${line2}</span></div><div style='clear: both'></div></div>"
		+"<div class='spLinkBox'><a href='${specialLink}' style='background-color:#${color3}'>${button1Text}</a></div></div>";
	var containerID = "hpSpecials";

	dsAjax.render(containerID,usedSpecials,themeName);

	/*===== IF THERE ARE SPECIALS, SHOW THE CONTAINER. OTHERWISE, THE SPECIALS CONTAINER WILL REMAIN HIDDEN. =====*/
	if (usedSpecials.length)
		$("#specialsBox").show();
});

/*===== Make the special containing DIV clickable to the link within the special DIV ===== */
$(document).ready(function() {
	$(".special").click(function(){
		window.location = $("a", this).attr("href");
	});
});
