(function() {
    
    var W = this, D = this.document;
    
    if(typeof W.ker == 'undefined') {
        W.ker = {};
    }
    
    var hasVisual, viewport, doc, page, pageH, pageW, pageTop, pageLeft, visual;
    var bgVisualTop = -106, bgVisualLeft = -148;
        
    var positionPage = function(end) {
        var top = 0, left = 0;
        pageTop = pageH < viewport.height ? (viewport.height - pageH) / 2 : 0;
        pageLeft = pageW < viewport.width ? (viewport.width - pageW) / 2 : 0;
        box.dom('#page').css({
            'top': pageTop + 'px',
            'left': pageLeft + 'px'
        });
    };
    
    var sizeVisual = function() {
        if(hasVisual) {
            var bgVisualPos = (pageLeft + bgVisualLeft) + 'px ' + (pageTop + bgVisualTop) + 'px';
            visual
                .height(Math.max(pageH, doc.height))
                .width(Math.max(pageW, viewport.width))
                .css('background-position', bgVisualPos);
            
            var bgBodyTop = 600 - (pageTop + bgVisualTop);
            box.dom(D.body).css('background-position', '0 -' + bgBodyTop + 'px');
        }
    };
    
    W.ker.addVisual = function(url, offsetTop, offsetLeft) {
        if(!isNaN(offsetTop)) {
            bgVisualTop = offsetTop;
        }
        if(!isNaN(offsetLeft)) {
            bgVisualLeft = offsetLeft;
        }
        hasVisual = true;
        
        box.dom(function() {
            var img = new Image();
            box.dom(img).load(function() {
                hasVisual = true;
                visual = box.dom('<div id="visual" style="display:none; background-image:url(' + url + ');"></div>').insertBefore('#page');
                sizeVisual();
                visual.fadeIn(800);
            }).attr('src', url);
        });
    };
	
	var displaySlide = function() {
		var currentLocation =  document.location.href;
		var contentSlide = new Array();
		var nbr;
		
		currentLocation = currentLocation.substring(currentLocation.lastIndexOf( "_" )+1);
		
		nbr = parseInt(currentLocation);
		
		$("#main").each(function(){
            var that = $(this);
            var slide = that.find('#slide');
			
			slide.each(function(i){
				contentSlide.push(slide[i]);
			});
		 });
		$(contentSlide[nbr-1]).css('display','block');
    };
    
    box.dom(function() {
        viewport = box.dom(W).getSize();
        doc = box.dom(D).getSize();
        page = box.dom('#page');
        pageH = page.get(0).scrollHeight;
        pageW = page.get(0).scrollWidth;
        positionPage();
    });
    
    box.dom(W).resize(function() {
        viewport = box.dom(W).getSize();
        doc = box.dom(D).getSize();
        positionPage();
        sizeVisual();
    });
	
	jQuery(document).ready(function($) {
		displaySlide();
	});
    
})();