// Slicing steps hover

$(function(){

	 var options = {
		    newsList: "#news_ticker",
		    startDelay: 4,
		    placeHolder1: " []",
			controls: false
	}
	$().newsTicker(options);
  
	$("#introsteps .st").mouseenter(function(){
		
		$("#introsteps .st_active").animate({ height : "0px" }, 600);
		$("#introsteps .st_active p.active a.naruci_sad").animate({ bottom: "-70px" }, 500)
		$("#introsteps .st_active p.active a.info_btn").animate({ bottom: "-70px" }, 400)
		
		$("#introsteps .st_active p.active a.bot_thumb_1").animate({ bottom: "-70px" }, 500)
		$("#introsteps .st_active p.active a.bot_thumb_2").animate({ bottom: "-70px" }, 400)
		$("#introsteps .st_active .step_linker").animate({ bottom: "-70px" }, 1000)
		
		
		var  gclass = $(this).attr("class");
		
		
		gclass =  gclass.replace(/st st_background /, "");
		
		
		var height_active="10px";
		
		//svaki box ima drukciju visinu, u "height_active" varijablu se sprema vrijednost 
		if(( gclass=="st_1") || ( gclass=="st_5")){ height_active="279px"; }
		if(( gclass=="st_2") || ( gclass=="st_4")){ height_active="309px"; }
		if ( gclass=="st_3"){ height_active = "339px" }
		

		$("." + gclass + ':not(.st_background)').animate({ height:height_active }, 600); //
		
		

		$("#introsteps .st_active").removeClass("st_active");
		

		$("." + gclass + ':not(.st_background)').addClass("st_active");
		

		setTimeout('$(".st_active p.active a.naruci_sad").animate({ bottom: "9px" }, 400);',500);
		setTimeout('$(".st_active p.active a.info_btn").animate({ bottom: "9px" }, 350);',400);		
		
		setTimeout('$(".st_active p.active a.bot_thumb_1").animate({ bottom: "18px" }, 400);',500);
		setTimeout('$(".st_active p.active a.bot_thumb_2").animate({ bottom: "9px" }, 350);',400);		
		setTimeout('$(".st_active .step_linker").animate({ bottom: "8px" }, 350);',400);		
		
		
	
	})//end mouseenter .st
	
	
	
	//Custom settings
	var style_in = 'easeOutBounce';
	var style_out = 'jswing';
	var speed_in = 1000;
	var speed_out = 300;	

	//Calculation for corners
	var neg = Math.round($('.qitem').width() / 2) * (-1);	
	var pos = neg * (-1);	
	var out = pos * 2;
	
	$('.qitem').each(function () {
	
		url = $(this).find('a').attr('href');
		img = $(this).find('img').attr('src');
		alt = $(this).find('img').attr('img');
		
		$('img', this).remove();
		$(this).append('<div class="topLeft"></div><div class="topRight"></div><div class="bottomLeft"></div><div class="bottomRight"></div>');
		$(this).children('div').css('background-image','url('+ img + ')');

		$(this).find('div.topLeft').css({top:0, left:0, width:pos , height:pos});	
		$(this).find('div.topRight').css({top:0, left:pos, width:pos , height:pos});	
		$(this).find('div.bottomLeft').css({bottom:0, left:0, width:pos , height:pos});	
		$(this).find('div.bottomRight').css({bottom:0, left:pos, width:pos , height:pos});	

	}).hover(function () {
	
		$(this).find('div.topLeft').stop(false, true).animate({top:neg, left:neg}, {duration:speed_out, easing:style_out});	
		$(this).find('div.topRight').stop(false, true).animate({top:neg, left:out}, {duration:speed_out, easing:style_out});	
		$(this).find('div.bottomLeft').stop(false, true).animate({bottom:neg, left:neg}, {duration:speed_out, easing:style_out});	
		$(this).find('div.bottomRight').stop(false, true).animate({bottom:neg, left:out}, {duration:speed_out, easing:style_out});	
				
	},
	
	function () {

		$(this).find('div.topLeft').stop(false, true).animate({top:0, left:0}, {duration:speed_in, easing:style_in});	
		$(this).find('div.topRight').stop(false, true).animate({top:0, left:pos}, {duration:speed_in, easing:style_in});	
		$(this).find('div.bottomLeft').stop(false, true).animate({bottom:0, left:0}, {duration:speed_in, easing:style_in});	
		$(this).find('div.bottomRight').stop(false, true).animate({bottom:0, left:pos}, {duration:speed_in, easing:style_in});	
	
	}).click (function () {
		window.location = $(this).find('a').attr('href');	
	});


})