function isMSIE() {
  return '\v' == 'v';
}
function addSlider() {
	if(document.getElementById("logos")) {
		$("#logos").before("<div class='slider-wrapper'><div id='slider'></div></div>");
		$("#slider").slider({
			value: 90,
			min: 90,
			max: 450,
			step: 90,
			slide: function(event, ui) {
				$("ul#logos li").css("width", ui.value + "px");
				$("ul#logos li").css("height", ui.value + "px");
				$("ul#logos li img").css("top", 0-((450-ui.value)/90)*450 + "px");
			}
		});
	}
}

var logos = null;
var current = null;
var related = null;

function addAnchors() {
	if(document.getElementById("logos")) {
		$("#logos img").wrap("<a href='#'></a>");
		logos = document.getElementById("logos").getElementsByTagName("a");
	} else if(document.getElementById("other")) {
		$("#other img").wrap("<a href='#'></a>");
		logos = document.getElementById("other").getElementsByTagName("a");
	}
	total_logos = logos.length;
	for(var i=0; i<total_logos; i++) {
		var trigger = logos[i];
		trigger.setAttribute("rel", i);
	}
	if(document.getElementById("logos")) {
		$("#logos li a").click(function() {
			addCanvas(this);
			$(this).addClass("selected");
			return false;
		});
		if(!isMSIE()) {
			$("#logos li img").css("opacity", 0.16);
			$("#logos li img").mouseover(function() {
				$(this).animate({"opacity": 1}, 400);
			});
			$("#logos li img").mouseout(function() {
				$(this).animate({"opacity": 0.16}, 400);
			});
		}
		/*
		$("#logos li img").css("opacity", 0.16);
		$("#logos li img").mouseover(function() {
			$(this).animate({"opacity": 1}, 400);
		});
		$("#logos li img").mouseout(function() {
			$(this).animate({"opacity": 0.16}, 400);
		});
		*/
		$("#loading").css("display", "none");
		$("#logos").css("display", "block");
		
	} else if(document.getElementById("other")) {
		$("#other li a").click(function() {
			addCanvas(this);
			$(this).addClass("selected");
			return false;
		});
		if(!isMSIE()) {
			$("#other li img").css("opacity", 0.16);
			$("#other li img").mouseover(function() {
				$(this).animate({"opacity": 1}, 400);
			});
			$("#other li img").mouseout(function() {
				$(this).animate({"opacity": 0.16}, 400);
			});
		}
		/*
		$("#other li img").css("opacity", 0.16);
		$("#other li img").mouseover(function() {
			$(this).animate({"opacity": 1}, 400);
		});
		$("#other li img").mouseout(function() {
			$(this).animate({"opacity": 0.16}, 400);
		});
		*/
		$("#loading").css("display", "none");
		$("#other").css("display", "block");
	}
	
}

function addCanvas(o) {
	current = o.rel;
	related = Number(o.firstChild.className.substring(o.firstChild.className.lastIndexOf("-")+1, o.firstChild.className.length));
	if(document.getElementById("logos")) {
		$("#logos").hide();
		//$(".slider-wrapper").hide();
		$("#logos").after("<div id='display'></div>");
		var tempImg = $(o).html();
		tempImg = tempImg.replace("-thumb", "");
		$("#display").append("<div id='canvas'>"+tempImg+"</div>");
	} else if(document.getElementById("other")) {
		$("#other").hide();
		$("#other").after("<div id='display' class='other'></div>");
		var tempImg = $(o).html();
		tempImg = tempImg.replace("-thumb", "");
		$("#display").append("<div id='canvas'>"+tempImg+"</div>");
	}
	//$("#display").append("<div id='canvas'>"+$(o).html()+"</div>");
	$("#display").append($(o).next().html());
	if(!isMSIE()) {
		$("#display img").css("opacity", 1);
	}
	addControls(o);
}

function addControls(o) {
	if($("html").attr("lang") == "bg") {
		$("#display").append("<a id='close' href='#'>Затвори</a>");
	} else {
		$("#display").append("<a id='close' href='#'>Close</a>");
	}
	
	$("#close").click(function() {
		if(document.getElementById("logos")) {
			$("#logos").show();
			//$(".slider-wrapper").show();
		} else if(document.getElementById("other")) {
			$("#other").show();
		}
		$("#display").remove();
		document.onkeydown = null;
		return false;
	});
	
	if($("html").attr("lang") == "bg") {
		$("#display").append("<ul id='pages'><li class='first-child'><a id='prev' href='#'>Предишно</a></li><li><a id='next' href='#'>Следващо</a></li></ul>");
	} else {
		$("#display").append("<ul id='pages'><li class='first-child'><a id='prev' href='#'>Previous</a></li><li><a id='next' href='#'>Next</a></li></ul>");
	}
	/*
	$("#first").click(function() {
		display_logo("first");
		return false;
	});
	*/
	$("#prev").click(function() {
		display_logo("prev");
		return false;
	});
	$("#next").click(function() {
		display_logo("next");
		return false;
	});
	/*
	$("#last").click(function() {
		display_logo("last");
		return false;
	});
	*/
	
	if(related > 1) {
		var relatedHTML = "<ul id='related'>";
		for(var i=related; i>0; i--) {
			if(i==1) {
				relatedHTML += "<li class='first-child'><a href='#' class='selected'>"+i+"</a></li>";
			} else {
				relatedHTML += "<li><a href='#'>"+i+"</a></li>";
			}
		}
		relatedHTML += "</ul>";
		$("#canvas").after(relatedHTML);
		$("#related").css("width", 24*related + "px");
		$("#related").css("margin-left", -24*related/2 -5 + "px");
		$("#related a").click(function() {
			display_related(this);
			return false;
		});
	}
	
	document.onkeydown = NavigateThrough;
}

function display_logo(which) {
	if(which == "prev") {
		if(current > 0) {
			current--;
		} else {
			current = logos.length-1;
		}
	} else if(which == "next") {
		if(current < logos.length-1) {
			current++;
		} else {
			current = 0;
		}
	} else if(which == "first") {
		current = 0;
	} else if(which == "last") {
		current = logos.length-1;
	}
	
	$("#display").remove();
	addCanvas(logos[current])
}

function display_related(o) {
	var src = $("#canvas img").attr("src");
	var prefix = src.substring(0, src.lastIndexOf("-")+1);
	var sufix = src.substring(src.lastIndexOf("."), src.length);
	var newsrc = prefix + $(o).html() + sufix;
	$("#canvas img").attr("src", newsrc);
	$("#related a").removeClass("selected");
	$(o).addClass("selected");
}

function NavigateThrough (event) {
    if (!document.getElementById) return;

    if (window.event) event = window.event;

  //  if (event.ctrlKey) {
        var link = null;
        var href = null;
        
        switch (event.keyCode ? event.keyCode : event.which ? event.which : null) {
        
            case 37:
                link = document.getElementById ("prev");
                display_logo("prev");
                break;
            case 39:
                link = document.getElementById ("next");
                display_logo("next");
                break;
            case 38:
                link = document.getElementById ("first");
                display_logo("first");
                break;
            case 40:
                link = document.getElementById ("last");
                display_logo("last");
                break;
        }
        
        //if (link && link.href) document.location = link.href;
        //if (href) document.location = href;
  //  }            
}
$(document).ready(function () {
	
});
window.onload = init;
function init() {
	//addSlider();
	addAnchors();
}
