<!--

$(function () {
	
	$('.bottom').hide();
	
	// Scrolla överst till sidan när "Tillbaka till top" neders på sidan klickas
	$('.toTop').click(function () {
		$.scrollTo('#global', 800 );
		
		return false;
	});
	
	// Göm alla beskrivningar till webportfolion
	$('.web_description').fadeTo("fast", 0);
	
	
	$('.website').hover(function () {
		$('.web_description', this).stop().fadeTo("slow", 0.95);
	},
	function () {
		$('.web_description', this).stop().fadeTo("slow", 0);
	});
	
	
	// Göm alla sidor
	// (För att de senare ska fade'a in vid klick)
	$('.page').hide();

	// Aktivera menyn
    $('.bubbleInfo').each(function () {
        var distance = 10;
        var time = 250;
        var hideDelay = 500;

        var hideDelayTimer = null;

        var beingShown = false;
        var shown = false;
        var trigger = $('.trigger', this);
        var info = $('.popup', this).css('opacity', 0);

		// När något klickas i menyn
		$(this).click(function() {
			// Ta bort eventuella tidigare element med klassen "selected" (se nedan)
			$(".selected").remove();
			
			// Skapa ett bildelement med klassen selected.
			// Det här elementet läggs till för att visa vilket menyval man har klickat på
			$(this).append('<img class="selected" src="images/clicked.png" alt="" style="position: relative; left: 18px; top: -25px;" />');
						
			// Spara det id-attribut det klickade menyvalet har i variabeln id
			var id = $(this).attr('id');
			
			$('.bottom').show();
			
			// Fadea ut eventuella sidor
			$('.page').fadeOut("fast", function () {
				// Fadea in div-element som har värdet i id som klassnamn
				$('.'+id).fadeIn("slow", function() {
					// När div-elementet har fadeat fram scrollas allt ned tills man ser content
					$.scrollTo( 'div.'+id, 800 );
				});		
			});
			
			return false;
		});


        $([trigger.get(0), info.get(0)]).mouseover(function () {
            if (hideDelayTimer) clearTimeout(hideDelayTimer);
            if (beingShown || shown) {
                // don't trigger the animation again
                return;
            } else {
                // reset position of info box
                beingShown = true;

                info.css({
                    top: 210,
                    left: 11,
                    display: 'block'
                }).animate({
                    top: '-=' + distance + 'px',
                    opacity: 1
                }, time, 'swing', function() {
                    beingShown = false;
                    shown = true;
                });
            }

            return false;
        }).mouseout(function () {
            if (hideDelayTimer) clearTimeout(hideDelayTimer);
            hideDelayTimer = setTimeout(function () {
                hideDelayTimer = null;
                info.animate({
                    top: '-=' + distance + 'px',
                    opacity: 0
                }, time, 'swing', function () {
                    shown = false;
                    info.css('display', 'none');
                });

            }, hideDelay);

            return false;
       	});
    });
});

//-->