$(document).ready(function(){
    
    $('a.new-window').click(function(){
        window.open(this.href);
        return false;
    });
    
    $(".dophotos").click(function(){
        photos();
        return false; 
    });
    
    slide("#sliding-navigation", 25, 15, 150, .8);
    
    $(function() {
            $('#topmenu ul.hover_block li').hover(function(){
                $(this).find('img').animate({top:'-26px'},{queue:false,duration:350});
            }, function(){
                $(this).find('img').animate({top:'0px'},{queue:false,duration:350});
            });
            
            $("#submenu ul.hover_block li a").hover(function(){
                var px = $(this).attr('rel');
                $('#slider').animate({left:'-'+px+'px'},{queue:false,duration:350}); 
            }, function(){
                $('#slider').animate({left:'0px'},{queue:false,duration:350}); 
            });
        });
        
    $("ul.sidenav li").hover(function() {
        $(this).find("div").stop()
        .animate({left: "210", opacity:1}, "fast")
        .css("display","block")

    }, function() {
        $(this).find("div").stop()
        .animate({left: "0", opacity: 0}, "fast")
    });

});


function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
    // creates the target paths
    var list_elements = navigation_id + " li.sliding-element";
    var link_elements = list_elements + " a";
    
    // initiates the timer used for the sliding animation
    var timer = 0;
    
    // creates the hover-slide effect for all link elements         
    $(link_elements).each(function(i)
    {
        $(this).hover(
        function()
        {
            $(this).prepend("<img src='/wp-content/themes/sal/images/arrow.png' alt='selection arrow' class='arrow' />");
            $(this).animate({ paddingLeft: pad_out }, 150);
        },        
        function()
        {
            $(this).children(".arrow").remove();
            $(this).animate({ paddingLeft: pad_in }, 150);
        });
    });
}

function photos(){
    $("#content").fadeOut(250);
    $("#submenu").fadeOut(250);
    $("#slider img").fadeOut(250);
    setTimeout("animate_photos()",250);
}

function animate_photos(){
    $("#header_main").animate({ height: "550" }, 400);   
    setTimeout("animate_photos2()",400);
}

function animate_photos2(){
    $("#photos").fadeIn(300);
    start_gallery();
}

function start_gallery(){
    // Start the query for the photos
    $.ajax({
         type: "GET",
         url: "/wp-content/themes/sal/pics.php",
         dataType: "json",
         success: function(data) {
             var x = 0;
             $.each(data.photoset.photos, function(i,item){
                $("#thumbs").append('<a number="'+x+'" rel="'+item.id+'" href="http://farm'+item.farm+'.static.flickr.com/'+item.server+'/'+item.id+'_'+item.secret+'.jpg" title="'+item.title+'"><img src="http://farm'+item.farm+'.static.flickr.com/'+item.server+'/'+item.id+'_'+item.secret+'_s.jpg" alt="'+item.title+'" /></a>'); 
                x = x+1;
             });
             var totalnum = x;
             
             // Start the first image on the stage
             $("#stage").html('<img number="0" src="http://farm'+data.photoset.photos[0].farm+'.static.flickr.com/'+data.photoset.photos[0].server+'/'+data.photoset.photos[0].id+'_'+data.photoset.photos[0].secret+'.jpg" alt="'+data.photoset.photos[0].title+'" />');
             $("#meta").html('<img src="/wp-content/themes/sal/images/favicon_flickr.png" alt="View on Flickr" /> <a href="http://flickr.com/photos/abecks/'+data.photoset.photos[0].id+'/">View on Flickr</a>');
             
             // Preload the second image
             $("#loader").html('<img src="http://farm'+data.photoset.photos[1].farm+'.static.flickr.com/'+data.photoset.photos[1].server+'/'+data.photoset.photos[1].id+'_'+data.photoset.photos[1].secret+'.jpg" alt="'+data.photoset.photos[1].title+'" />');
             
             // Enable thumbs
             $("#thumbs a").click(function(){
                var img = $(this);
                 $("#meta").fadeOut(200);
                 $("#stage").fadeOut(200,function(){
                     // Load this image
                    $("#loader").html('<img src="'+$(img).attr("href")+'" alt="Loading image..." />');
                    
                    $("#loader img").load(function(){
                        $("#stage").html('<img number="'+$(img).attr('number')+'" src="'+$(img).attr('href')+'" alt="'+$(img).attr('title')+'" />');
                        $("#stage").fadeIn(200);
                        
                        $("#meta").html('<img src="/wp-content/themes/sal/images/favicon_flickr.png" alt="View on Flickr" /> <a href="http://flickr.com/photos/abecks/'+$(img).attr('rel')+'/">View on Flickr</a>');
                        $("#meta").fadeIn(200);
                    });
                 });   
                return false; 
             });
             
             // Enable stage clicks
             $("#stage").click(function(){
                // Whats the current image? 
                 var num = Number($("#stage img").attr('number'));
                 
                 num = num+1;
                 // Get the next image
                 var img = $("#thumbs a:eq("+num+")");
                 if(num < totalnum){
                     $("#meta").fadeOut(200);
                     $("#stage").fadeOut(200,function(){
                         // Load this image
                        $("#loader").html('<img src="'+$(img).attr('href')+'" alt="Loading image..." />');
                        
                        $("#loader img").load(function(){
                            $("#stage").html('<img number="'+$(img).attr('number')+'" src="'+$(img).attr('href')+'" alt="'+$(img).attr('title')+'" />');
                            $("#stage").fadeIn(200);
                            
                            $("#meta").html('<img src="/wp-content/themes/sal/images/favicon_flickr.png" alt="View on Flickr" /> <a href="http://flickr.com/photos/abecks/'+$(img).attr('rel')+'/">View on Flickr</a>');
                            $("#meta").fadeIn(200);
                        });
                     });  
                 } 
                 
             });
         }
     });
     
     
     $("#thumbs_top").hover(function(){
         moveInt = setInterval("scrollThumbsUp()", 15);
     },function(){
         clearInterval(moveInt);
     });
     
     $("#thumbs_bottom").hover(function(){
         moveInt = setInterval("scrollThumbsDown()", 15);
     },function(){
         clearInterval(moveInt);
     });

}

function scrollThumbsUp(){
    var top = $("#thumbs").css("top");
    top = top.replace("px","");
    top = Number(top);
    top = top + 2;
    if(top >= 0)
        top = 0;
    $("#thumbs").css("top", ""+top+"px");
}

function scrollThumbsDown(){
    var top = $("#thumbs").css("top");
    top = top.replace("px","");
    top = Number(top);
    top = top - 2;
    if(top <= ((Number($("#thumbs").height())/2) * -1))
        top = (Number($("#thumbs").height())/2) * -1;
    $("#thumbs").css("top", ""+top+"px");
}