var $stripes = 1;
	var $brow = $.browser.name;
	var $browWidth = getW();
	var $browHeight = getH();
	var $picwid = 1920;
	var $pichei = 1285;

	function getW(){
		var $localw;
		if ($brow == 'chrome') {
			$localw = window.innerWidth;
		} else {
			$localw = $(window).width();
		}
		return $localw;
	}

	function getH(){
		var $localh;
		if ($brow == 'chrome') {
			$localh = window.innerHeight;
		} else {
			$localh = $(window).height(true);
		}
		return $localh;
	}
	
	function bookmark($level, $id){
		if ($level == 0){
			window.location.hash = '';
			window.location.hash = "area="+$id;
		}
		if ($level == 1){
			var $allHash =  window.location.hash.split(",");
			if ($allHash.length > 1){
				$allHash[1] = ",subarea="+$id;
				$allHash[2] = "";
				window.location.hash = $allHash[0]+$allHash[1];
			} else {
				window.location.hash = window.location.hash + ",subarea="+$id;
			}
		}
		
		if ($level == 2){
			var $allHash =  window.location.hash.split(",");
			if ($allHash.length > 2){
				$allHash[2] = "article="+$id;
				window.location.hash = $allHash[0]+","+$allHash[1]+","+$allHash[2];
			} else {
				window.location.hash = window.location.hash + ",article="+$id;
			}
		}
		
	}
	
	function simulatedClick(target, options) {

        var event = target.ownerDocument.createEvent('MouseEvents'),
            options = options || {};

        //Set your default options to the right of ||
        var opts = {
            type: options.click                     || 'click',
            canBubble:options.canBubble             || true,
            cancelable:options.cancelable           || true,
            view:options.view                       || target.ownerDocument.defaultView, 
            detail:options.detail                   || 1,
            screenX:options.screenX                 || 0, //The coordinates within the entire page
            screenY:options.screenY                 || 0,
            clientX:options.clientX                 || 0, //The coordinates within the viewport
            clientY:options.clientY                 || 0,
            ctrlKey:options.ctrlKey                 || false,
            altKey:options.altKey                   || false,
            shiftKey:options.shiftKey               || false,
            metaKey:options.metaKey                 || false, //I *think* 'meta' is 'Cmd/Apple' on Mac, and 'Windows key' on Win. Not sure, though!
            button:options.button                   || 0, //0 = left, 1 = middle, 2 = right
            relatedTarget:options.relatedTarget     || null,
        }

        //Pass in the options
        event.initMouseEvent(
            opts.type,
            opts.canBubble,
            opts.cancelable,
            opts.view, 
            opts.detail,
            opts.screenX,
            opts.screenY,
            opts.clientX,
            opts.clientY,
            opts.ctrlKey,
            opts.altKey,
            opts.shiftKey,
            opts.metaKey,
            opts.button,
            opts.relatedTarget
        );

        //Fire the event
        target.dispatchEvent(event);
    }


	function setDiv($div){
		$d = $($div);
		var $b = $('body');
		$b.hide();
		$d.hide();
		var $width = getW();
		var $height = getH();
		$d.css({'width': $width, 'height': $height, 'overflow': 'hidden', 'position': 'absolute'});
		$b.show();
		$d.show();
	}

	function setDivs(){
		setDiv('#main');
		setDiv('#slider');
	}

	function bckgResize($picwidth, $picheight){
		var $b = $('body');
		$b.hide();
		var $h = getH();
		var $w = getW();
		var $koef = $h/$w;
		var $pickoef = $picheight / $picwidth;
		var $dimensions = new Array(4);
		if ($koef < $pickoef){
			$koef = $w/$picwidth;
			var $hp = $koef * $picheight;
			var $ptop = $h - $hp;
			$dimensions[0] = 0;
			$dimensions[1] = $ptop;
			$dimensions[2] = $w;
			$dimensions[3] = $hp;
		} else {
			$koef = $h/$picheight;
			$wp = $koef * $picwidth;
			$pleft = ($w/2) - ($wp/2);
			$dimensions[0] = $pleft;
			$dimensions[1] = 0;
			$dimensions[2] = $wp;
			$dimensions[3] = $h;
		}
		$b.show();
		return $dimensions;
	}

	function setImages($div){
		var $selector = $div + ' > img';
		var $dim = new Array(4);
		$($selector).each(
			function(){
				$dim = bckgResize(this.width, this.height);
				$(this).css({'left': $dim[0], 'top': $dim[1], 'width': $dim[2], 'height': $dim[3]});
				$(this).show();
			}
		);
	}

	function setImage($div, $img){
		var $w = getW();
		var $h = getH();
		var $stripeW = Math.round($w / $stripes);
		var $slider = $($div);
		var $i = 0;
		var $dim = new Array(4);
		$dim = bckgResize($picwid, $pichei);
		var $top = $h;
		for ($i = 0; $i<$stripes; $i++){
			var $left = $dim[0] - ($i * $stripeW);
			if ($i == ($stripes - 1)){
				$stripeW = $browWidth - (($stripes-1)*$stripeW);
			}
			var $image = $('<img/>').attr('src',$img).css({'position': 'relative','left': $left, 'top': $dim[1], 'width': $dim[2], 'height': $dim[3]}).load();
			if ($brow != 'msie') {
				var $strip = $('<div class="strip" id="strip'+$i+'"></div>').css({'left': $i*$stripeW, 'top': 0, 'position': 'absolute', 'overflow': 'hidden', 'width': 0, 'height': $h, 'z-index': 1}).load();
			} else {
				var $q = $({});
				$q.queue(
						function(){
							//putLoading();
							$(this).dequeue();
						}
						).pause(1000).queue(
								function(){
									var $strip = $('<div class="strip" id="strip'+$i+'"></div>').css({'left': $i*$stripeW, 'top': 0, 'position': 'absolute', 'overflow': 'hidden', 'width': $w, 'height': $h, 'z-index': 1}).hide().load();
									$(this).dequeue();
								}
								);
			}
			$slider.append($strip);
			$('#strip'+$i).append($image);
		}
	}
		
	$.fn.putImage = function($imgPath){
		var $dim = new Array(4);
		$dim = bckgResize($picwid, $pichei);
		var $image = $('<img/>').attr('src',$imgPath).attr('id', 'backImage').css({'position': 'relative','left': $dim[0], 'top': $dim[1], 'width': $dim[2], 'height': $dim[3]}).load();
		$('#slider').append($image);
		setOut();
		return true;
	};

	$.fn.animStrip = function($imgPath) { 
		setImage('#slider', $imgPath);
		var $transLen = 2000;
		var $w = getW();
		var $h = getH();
		if ($brow != 'explorer') {
			$('.strip').animate({width: $w}, $transLen);
		} else {
			$('.strip').css({width: $w});
		}
		return true;
	};
	
	$.fn.pause = function (n) {
    return this.queue(function () {
    var el = this;
    setTimeout(function () {
        return $(el).dequeue();
    }, n);
		});
	};


	function startImg(){
		var $firstImg = $('#sliderContent :first');
		$firstImg.addClass('active');
		var $imgPath = $firstImg.attr('src');
		var $q = $({});
		$q.queue(
			function(){
				$(this).animStrip($imgPath);
				$(this).dequeue();
			}
		).pause(2000).queue(
			function(){
				$(this).putImage($imgPath);
				$(this).dequeue();
				}
		).queue(
			function(){
				$('.loading').remove();
				$('.strip').hide().remove();
				$(this).dequeue();
			}
		).queue(
				function(){
					$('#content').fadeIn(1000);
					$('#menu').fadeIn(1000);
					$('#news').fadeIn(1000);
				}
				);
		
	}
	
	function setText(){
		var $totpic = $('#totpic').val();
		var $curpic = $('#curpic').val();
		var $text = $curpic + '|' + $totpic;
		if ($totpic > 1){
			$('#picNav > div').show();
			$('#picNavTxt').html($text);
			$('#picNav').height(23);
			$('#picNav').css({"padding-top": 10});
		} else {
			$('#picNav > div').hide();
			$('#picNav').height("5px");
			$('#picNav').css({"padding-top": 0});
		}
	}

	function nextImg(){
		var $activeImg = $('#sliderContent .active');
		var $next = $activeImg.next();
		
		if($next.length == 0){
			$next = $('#sliderContent img:first');
			$('#curpic').val('1');
		} else {
			$('#curpic').val(parseInt($('#curpic').val()) + 1);
		}
		setText();
		$activeImg.removeClass('active');
		$next.addClass('active');
		var $imgPath = $next.attr('src');
		setImage('#slider', $imgPath);
		var $q = $({});
		$q.queue(
			function(){
				$(this).animStrip($imgPath);
				$(this).dequeue();
			}
		).pause(2000).queue(
			function(){
				$("#backImage").remove();
				$(this).dequeue();
				}
		).queue(
		function(){
			$(this).putImage($imgPath);
			$(this).dequeue();
			}
		).queue(
		function(){
			$('.loading').remove();
			$('.strip').hide().remove();
			$(this).dequeue();
		}
		);
	}
	
	function prevImg(){
		var $activeImg = $('#sliderContent .active');
		var $prev = $activeImg.prev();
		if ($prev.length == 0){
			$prev = $('#sliderContent img:last');
			$('#curpic').val($('#totpic').val());
		} else {
			$('#curpic').val(parseInt($('#curpic').val()) - 1);
		}
		setText();
		$activeImg.removeClass('active');
		$prev.addClass('active');
		var $imgPath = $prev.attr('src');
		setImage('#slider', $imgPath);
		var $q = $({});
		$q.queue(
			function(){
				$(this).animStrip($imgPath);
				$(this).dequeue();
			}
		).pause(2000).queue(
			function(){
				$("#backImage").remove();
				$(this).dequeue();
				}
		).queue(
		function(){
			$(this).putImage($imgPath);
			$(this).dequeue();
			}
		).queue(
		function(){
			$('.loading').remove();
			$('.strip').hide().remove();
			$(this).dequeue();
		}
		);
	}
	
	function clearSliderContent(){
		$('#sliderContent img:not(.active)').detach();
	}
	
	function initPicNav(){
		
		//dodano za kursore
		$(document).keydown(function (e) {
		    if(!e) {
		        e = window.event;
		    }
		    switch(e.keyCode) {
		    case 37:
		        prevImg();
		        break;
		    case 39:
		        nextImg();
		        break;
		    }
		});
		//kraj dodanog za kursore
		
		$('#picNavRight').click(function() {
			nextImg();
		});

		$('#picNavLeft').click(function() {
			prevImg();
		});
	}
	
	function removeFirst(){
		$('#sliderContent img:first').detach();
	}
	
	function putDefPic(){
		clearSliderContent();
		$sliderCont = $('#sliderContent');
		$sliderCont.append('<img src="'+ $defPic +'"/>');
		nextImg();
		removeFirst();
	}
	
	function getAreaId($id){
		var $lenLang = $('#curlanguage').val().length;
		var $areaId = $id.substr($lenLang);
		return $areaId;
	}
	
	function initMenu(){
		
		$('.closeButV').click(function(){
				$('#artsummary').fadeOut(500);
		});
		
		$('.closeButM').click(function(){
			$('#artmore').hide();
			$('#more').show();
		});
		
		$('#more').click(
			function(){
				$('#more').hide();
				$('#artmore').show();
			}
		);
		
		
		$('.menuitem').click(function(){
			$("#news").hide();
			$('#content').hide();
			$('.kolumna').hide();
			$('.rightkolumna').hide();
			$('.rightkolumnaMap').hide();
			$('#content').hide();
			$('.cont_text').hide();
			$(".artmenu").hide();
			$('#artsummary').hide();
			$('#artsummarytxt').hide();
			$('#artmore').hide();
			$('#picNav').hide();
			$('#more').hide();
			
			$('.submenuitem').css("background-image", "");
			putDefPic();
			var $cont = $('#content');
			var $currentId = $(this).attr('id');
			var $subMenu = "#" + $currentId + 'submenu';
			var $subMenuSel = $($subMenu); 
			$('.menuitem').css("background-image", "");
			$(this).css("background-image", "url(/i/menubckg.gif)");
			$(this).css("background-position", "center bottom");
			
			if ( $subMenuSel.length ){
				var $left = $(this).position().left;
				var $top = $(this).position().top;
				var $height = $(this).position().height;
				$subMenuSel.css("left", $left);
				$subMenuSel.css("top", 66);
				$subMenuSel.show();
				$cont.show();
				$('#submenus').show();
			} else {
				putDefPic();
				$('#submenus').hide();
				var $areaid = getAreaId($currentId);
				var $lang = $('#curlanguage').val();
				$.get("/area.php", { lang: $lang, id: $areaid }, function(data){
					$cont.empty();
				    $cont.append(data);
				    $cont.show();
				});
			}
			bookmark(0, $currentId);
			return false;
		});
		
		$('.submenuitem').click(function(){
			$("#news").hide();
			$(".artmenu").hide();
			$('#artsummary').hide();
			$('#artsummarytxt').hide();
			$('#artmore').hide();
			$('#picNav').hide();
			$('#more').hide();
			$('#content').hide();
			$('.submenuitem').css("background-image", "");
			var $currentId = $(this).attr('id');
			var $subMenu = "#" + $currentId + 'artmenu';
			var $lastArt = $subMenu + " > div";
			$(this).css("background-image", "url(/i/mnbckg.gif)");
			$(this).css("background-repeat", "no-repeat");
			$(this).css("background-position", "center bottom");
			if ($($subMenu).length){
				var $off = $(this).offset();
				var $left = $off.left;
				var $lenmid = $(this).width() / 2;
				var $middle = $left + $lenmid;
				var $top = $off.top;
				$($subMenu).show();
				var $len = $($subMenu).width() / 2;
				var $pos = $($lastArt).last().width();
				$($subMenu).css("left", $left - 35 - $len + $lenmid);
				$($subMenu).css("top", $top+30);
			}
			bookmark(1, $currentId);
		});
		
		$('.artmenuitem').click(function(){
			$('#artsummarytxt').hide();
			$('#artsummary').hide();
			$('#artmore').hide();
			$('#more').hide();
			var $cont = $('#content');
			$cont.empty();
			$picNav = $('#picNav');
			$picNav.hide();
			var $currentId = $(this).attr('id');
			$('#curarticle').val($currentId);
			var $parPos = $(this).offset();
			var $parWid = $(this).outerWidth();
			var $lang = $('#curlanguage').val();
			clearSliderContent();
			$sliderCont = $('#sliderContent');
			$.getJSON('/article.php', { art_id: $currentId, lang: $lang }, function($data){
				var $pictures = $data.images;
				var $picno = 0;
				var $level = -1;
				$.each($pictures, function($key, $value){
					$picno = $picno + 1;
					$sliderCont.append('<img src="/i/album/'+ $value.name +'" alt="' + $value.alt + '"/>');
				});
				$('#curpic').val("0");
				
				$picNav.show();
				var $picNavWid = $picNav.width();
				if ($picno > 0) {
					var $left = $parPos.left;
					$('#totpic').val($picno);
					var $text = '1|' + $picno;
					$('#picNavTxt').html($text);
					$picNav.width($parWid);
					$picNav.css("left", $left);
					$picNav.css("top", $parPos.top + 25);	
				} else {
					$picNav.hide();
					putDefPic();
				}
				
				if ($data.summary.length > 6){
					$('#artsummarytxt').html($data.summary);
					$('#artsummarytxt').fadeIn(300);
					$('#artsummary').fadeIn(300);
				}
				if ($data.txt.length > 6) {
					$('#artmoretxt').html($data.txt);
					$('#more').show();
				}
				nextImg();
				removeFirst();
			});
			bookmark(2, $currentId);
		});
	}

	function setHashParams() {
	    var hashParams = {};
	    var e,
	        a = /\+/g,  // Regex for replacing addition symbol with a space
	        r = /([^&;=]+)=?([^&;]*)/g,
	        d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
	        q = window.location.hash.substring(1);
	        $allHash =  q.split(",");
	        for($one in $allHash){
	        	e = $allHash[$one].split("=");
	        	$("#"+e[1]).trigger("click");
	        }
	}
	
	function setOut(){
		var $sld = $("#slider");
		$sld.unbind();
		var $x = "";
		
		//dodano za lijevu i desnu stranu ekrana
		$sld.click(function(e){
		      var $mouseX = e.pageX;
		      var $mouseY = e.pageY;
		      var $w = getW();
		      var $h = getH();
		      if (($mouseX < ($w*0.2)) && ($mouseY > ($h*0.2)) && ($mouseY < ($h*0.8))) {
		    	  prevImg();
		    	  return false;
		      } else if (($mouseX > ($w*0.8)) && ($mouseY > ($h*0.2)) && ($mouseY < ($h*0.8))) {
		    	  nextImg();
		    	  return false;
		      } else {
		    	$x = $(".active").attr("alt");
		  		if ($x === undefined){
		  			return false;
		  		} else {
		  			if ($x.length > 4) {
		  				window.open("http://www.youtube.com/v/"+$x+"&rel=0&autoplay=1", "", "height=390, width=640, status=0, toolbar=0, location=0, menubar=0, resizable=0, scrollbars=0");	
		  			}
		  			return false;
		  		}
		      }
		   });
		//kraj dodanog za lijevu i desnu stranu ekrana
		
		
	}
	
$(window).load(function() {
	$('#more').hide();
	setDivs();
	setImages('#slider');
	startImg('#slider');
	initMenu();
	initPicNav();
	setHashParams();
});

$(window).bind("resize",
	function(){
		$browWidth = getW();
		$browHeight = getH();
		setDivs();
		setImages('#slider');
});