// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '300px', 'float' : 'left'});
$('div.content').css('display', 'block');
$('ul.noscript').addClass('script'); // adds new class name to maintain degradability, resets css needed for noscript
                        				
$(function(){

	//SCROLL
	//Get our elements for faster access and set overlay width
	var div = $('div.jq_scroll'),
		ul = $('ul.jq_scroll'),
		// unordered list's left padding, for calculation
        ulPadding = 10;
	
	//Get menu width
	var divWidth = div.width();

	//Remove scrollbars	
	div.css({overflow: 'hidden'});
	
	//Find last image container
	var lastLi = ul.find('li:last-child');
	
	//When user move mouse over menu
	div.mousemove(function(e){
		//As images are loaded ul width increases,
		//so we recalculate it each time
		// +20 for gap after last
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding + 20 ;	
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
		div.scrollLeft(left);
	});
	
	//GALLERIFFIC
    // Initialize Minimal Galleriffic Gallery
    $('#gallery').galleriffic('#thumbs', {
            imageContainerSel:      '#slideshow',
            controlsContainerSel:   '#controls',
            captionContainerSel:    '#caption',
			loadingContainerSel:    '#loading',
			numThumbs:              15,
            enableTopPager:         true,
            renderSSControls:          true,
            renderNavControls:         true,
            playLinkText:              'automatische vertoning',
            pauseLinkText:             'pauzeer vertoning',
            prevLinkText:              '‹ Vorig werk',
            nextLinkText:              'Volgend werk ›',
            nextPageLinkText:          'Volgende pagina ›',
            prevPageLinkText:          '‹ Vorige pagina',
            enableHistory:             true,
            preloadAhead:              10
    });
    
    // PageLoad function
    // This function is called when:
    // 1. after calling $.historyInit();
    // 2. after calling $.historyLoad();
    // 3. after pushing "Go Back" button of a browser
    function pageload(hash) {
            // alert("pageload: " + hash);
            // hash doesn't contain the first # character.
            if(hash) {
                    $.galleriffic.goto(hash);
            } else {
                    $.galleriffic.goto(0);
            }
    }

    // Initialize history plugin.
    // The callback is called at once by present location.hash. 
    $.historyInit(pageload, "advanced.html");

    // set onlick event for buttons using the jQuery 1.3 live method
    $("a[rel='history']").live('click', function() {
            var hash = this.href;
            hash = hash.replace(/^.*#/, '');

            // moves to a new page. 
            // pageload is called at once. 
            // hash don't contain "#", "?"
            $.historyLoad(hash);

            return false;
    });
});