$(window).load(function() {

  //get all link with class panel
  $('a.panel').click(function () {

                //reset and highlight the clicked link
    $('a.panel').removeClass('selected');
    $(this).addClass('selected');
    
    //grab the current item, to be used in resize function
    current = $(this);
    
                //scroll it to the destination
    $('#wrapper').scrollTo($(this).attr('href'), 250);    
    
                //cancel the link default behavior
    return false;
    
  });
  
    //resize all the items according to the new browser size
  $(window).resize(function () {
    
    //call the resizePanel function
    resizePanel();
  });
  
});

$(window).load(function() {
    $('#slider').nivoSlider({
        effect:'random', //Specify sets like: 'fold,fade,sliceDown'
        slices:15,
        animSpeed:500, //Slide transition speed
        pauseTime:3000,
        startSlide:0, //Set starting Slide (0 index)
        directionNav:true, //Next & Prev
        directionNavHide:true, //Only show on hover
        controlNav:true, //1,2,3...
        controlNavThumbs:false, //Use thumbnails for Control Nav
        controlNavThumbsFromRel:false, //Use image rel for thumbs
        controlNavThumbsSearch: '.jpg', //Replace this with...
        controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image src
        keyboardNav:true, //Use left & right arrows
        pauseOnHover:true, //Stop animation while hovering
        manualAdvance:false, //Force manual transitions
        captionOpacity:0.8, //Universal caption opacity
        beforeChange: function(){},
        afterChange: function(){},
        slideshowEnd: function(){}, //Triggers after all slides have been shown
        lastSlide: function(){}, //Triggers when last slide is shown
        afterLoad: function(){} //Triggers when slider has loaded
    });
});

function resizePanel() {

  width = $(window).width();
  height = $(window).height();

  mask_width = width * $('.item').length;
    
  $('#debug').html(width  + ' ' + height + ' ' + mask_width);
    
  $('#wrapper, .item').css({width: width, height: height});
  $('#mask').css({width: mask_width, height: height});
  $('#wrapper').scrollTo($('a.selected').attr('href'), 0);
    
}