// JavaScript Document
function roll(id, img_src){
   document.getElementById(id).src = img_src;
}

$(document).ready(function() {
 
    //get all link with class panel
    $('a.panel').click(function () {
 
        //reset and highlight the clicked link
        $('a.panel').removeClass('active');
        $(this).addClass('active');
         
        //grab the current item, to be used in resize function
        current = $(this);
         
        //scroll it to the destination
        $('#wrapper').scrollTo($(this).attr('href'), 800);     
         
        //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();
    });
     
});

function resizePanel() {
 
    //get the browser width and height
    width = $(window).width();
    height = $(window).height();
 
    //get the mask width: width * total of items
    mask_width = width * $('.item').length;
         
    //set the dimension
    $('#wrapper, .item').css({width: width, height: height});
    $('#mask').css({width: mask_width, height: height});
     
    //if the item is displayed incorrectly, set it to the corrent pos
    $('#wrapper').scrollTo($('a.selected').attr('href'), 0);
         
}

function deselect(id){
	document.getElementById(id).selected = false;	
}

function toggleDIV(id){
	if(document.getElementById(id).style.display == "none"){
		document.getElementById(id).style.display = "block";	
		document.getElementById('link').title = "Hide Text";	
		document.getElementById('toggle').src = "images/min.png";
		document.getElementById('toggle').alt = "Hide Text";
	}else{
		document.getElementById(id).style.display = "none";	
		document.getElementById('link').title = "Show Text";	
		document.getElementById('toggle').src = "images/plus.png";
		document.getElementById('toggle').alt = "Show Text";
	}
}