// JavaScript Document
$(document).ready(function(){
	
	// FancyBox Lightbox
	$("a.lightbox").fancybox({
		padding			: 5,
		cyclic			: true,
		overlayOpacity	: 0.3
	});
	
	// Priprema bitnih varijabli
	var meni = $("ul.glmeni");
	var linija = $("div.linija");
	var podnozje = $("div#podnozje");
	var logo = $("div#logo");
	var slideshow = $('#slideshow');
	var aktivniMeniMeni = $("ul.menimeni li a.selected");
	var dgmZatvori = $("p.dgm-zatvori");
	var sirinaprozora = $(window).width();
	var visinaprozora = $(window).height();
	var prikazani;
	var sadrzajaktivan = false;
	
	$("div.menipull").css("width", $(window).width() - 210);

	// Slideshow u pozadini
    slideshow.cycle({
		fx: 'fade',
		speed	:	3500,
		timeout	:	6000
	});

	// Inicijalno su meni i linija skriveni
	meni.hide()
	linija.hide();
	
	// Fadein logotipa
	logo.fadeIn(1300);
	logo.css("left", sirinaprozora - 300);
	
	// Podešavanje širine podnožje prema
	// širini prozora
	podnozje.width(sirinaprozora);
	podnozje.css("top", visinaprozora - 40);
	
	//Otvaranje glavnog menija
	$("p.dgm-zatvori").hover(
		function(){
			$(this).animate({
				backgroundPosition	:	'-28px 0px'
			}, 400);
		},
		function(){
			$(this).stop(true).animate({
				backgroundPosition	:	'0px 0px'
			}, 400);
		}
	)
	
	dgmZatvori.click(
	function(){
		zatvoriMeni();
	});

	
	//Otvaranje glavnog menija
	$("div.menipull").hover(
		function(){
			
			slideshow.cycle('pause');
			$(this).animate({
				top: -42
			}, 600);	
			
			linija.fadeIn(800);
			linija.animate({
				top: 0
			}, 800);
			
			meni.stop(true)
			meni.show();
			meni.animate({
				top:		115,
				opacity:	1
				}, 
			1000);
			
			slideshow.animate({
				opacity	:	.4
			}, 600);
		}
	)


	//MouseOver preko glavnog menija
	$("ul.glmeni li a").hover(
		function(){
			$(this).animate({
				backgroundPosition	:	'0px 0px'
			}, 400);
		},
		function(){
			$(this).stop(true).animate({
				backgroundPosition	:	'164px 0px'
			}, 200);
		}
	)
	
	
	// Servisiranje klika na meni
	$("ul.glmeni li a").click(function(e){
		
		$("ul.glmeni li a").removeClass("selected");
		
		var izabrani = $(this).attr("href");
		
		$(this).addClass("selected");
		
		if (sadrzajaktivan == true)
		{
			prikazani.fadeOut(500, prikaziSadrzaj(izabrani));
		}
		
		prikaziSadrzaj(izabrani);
		e.preventDefault();
	})
	
	// Zatvaranje glavnog menija
	// na mouseOut prozora ili klikom na dugme
	function zatvoriMeni()
	{
		slideshow.cycle('resume');
		$("div.menipull").animate({
			top: 0
		}, 600);
		
		if (sadrzajaktivan == true)
		{
			prikazani.fadeOut(350);
			sadrzajaktivan = false;
		}

		
		linija.fadeOut(550);
		linija.animate({
			top: -50
		}, 550);
		
		meni.animate({
			top:		80,
			opacity:	0
			}, 
		650, 
		function(){
			meni.hide();
			$("ul.glmeni li a").removeClass("selected");
		});
		
		slideshow.animate({
			opacity	:	1
		}, 450);
	}
	
	function prikaziSadrzaj(izabrani)
	{
//		alert(izabrani);		
		prikazani = $("div" + izabrani)
//		prikazani.animate({
//			opacity	:	1,
//			top		: 	85
//		}, 800);
		prikazani.fadeIn(800);
		$('ul.kompletanmeni').anythingSlider(1);
		
		sadrzajaktivan = true;	
	}
	
	
	// Aktiviranje slajdera za 
	// prikaz Peppers menija
	$('ul.kompletanmeni').anythingSlider({
		width			: 550,
		height			: 480,
		buildArrows		: false,
		buildNavigation	: false,
		startStopped	: true
	})
	
	$("ul.menimeni li a").click(function(){
		
		var broj = $(this).attr("id");
	
		aktivniMeniMeni.removeClass("selected");
		$(this).addClass("selected");
		aktivniMeniMeni = $(this);
		
		$(function(){
			$('ul.kompletanmeni').anythingSlider(broj);
			return false;
		});
	});
	
	
	//Rollover FB linka u podnozju
	$(".txt-podnozje a.fb").hover(
		function(){
			$(this).css({color: '#FFF'}).stop(true).animate({
				backgroundPosition	:	'0px 0px',
			}, 400);
		},
		function(){
			$(this).css({color: '#CCC'}).stop(true).animate({
				backgroundPosition	:	'200px 0px'
			}, 400);
		}
	)

	
	// Funkcija za hendlanje promjene 
	// velicine prozora 
	$(window).resize(function() {
		
		$("div#podnozje").width($(window).width());
		$("div#podnozje").css("top", $(window).height() - 40);
		$("div.menipull").css("width", $(window).width() - 210);
		logo.stop(true);		
		logo.animate({
			left: $(window).width() - 300
			},
		800);
	});

});