(function($) {
    var MIN_BLACK_HEIGHT = 150;
    var BLACK_HEIGHT = 1/3;
    
    var $window, $document;
    var $black, $white;
    var $slider, $slider_li, current_li = 0;
    var $sections, current_section = 0;
    var $nav_bottom, $nav_top, $nav_left, $nav_right, $nav;
    var $footer, footer_height, $footer_close;
    var $header;
    
    //PRELOAD
    var DURATION = 2000;
    var $c;
    var $p;
    var $counter;
    var $message;
    
    var messages = [
        "Hi! We are ROLL!",
        "We're working on our website. Seriously.",
        "Until it is ready enjoy our latest works.",
        ""
    ];

    var current_message = 0;

    var w = 0;
    var interval = false;
    
    var delay = (function () {
        var timers = {};
        return function (callback, ms, uniqueId) {
            if (!uniqueId) {
                uniqueId = "ops";
            }
            if (timers[uniqueId]) {
                clearTimeout (timers[uniqueId]);
            }
            timers[uniqueId] = setTimeout(callback, ms);
        };
    })();
    
    function set_body() {
        var window_height = $window.height();
        var margin = window_height - (100 + 20 + 440); 
        $slider.css('height', window_height);
        
        var w = get_black_height();
        
        $white.find('ul.scroll').css('width', 3000*$sections.length)
        
        $black.css('height', w);
        $white.find('.description').css('marginTop', w);
        
        $slider_li.each(function() {
            var $$  = $(this);
            
            var i = $$.parent().children().index(this);
            
            if (i == 0) 
                $$.css('marginTop', 100);
            else
                $$.css('marginTop', margin);
        });
        
        set_nav();
    }
    
    function set_nav() {
        var l = $sections.eq(current_section).find('.slider li').length;
        switch (l) {
            case 0:
            case 1:
            $nav_top.addClass('disabled');
            $nav_bottom.addClass('disabled');
            break;
            default:
            $nav_top.addClass('disabled');
            $nav_bottom.removeClass('disabled');
            break;
        }
    }
    
    function set_footer() {
        footer_height = $window.height() - get_black_height();
        
        $footer.css('height', footer_height);
        $footer.find('.inner').css('height', footer_height);
        
        if (!$footer.is('.open')) {
            $footer.css('bottom', -footer_height);            
        }    
    }
    
    function toggle_footer() {
        if ($footer.css('bottom') != '0px') {
            $footer.addClass('open').animate({
                'bottom': 0
            }, 1000, function() {
                $footer_close.fadeIn('slow');
            });
            $white.fadeOut('fast');
            $nav.fadeOut('fast');
        } else {
            $footer_close.fadeOut('slow');
            $footer.removeClass('open').animate({
                'bottom': -footer_height
            }, 1000);
            $white.fadeIn('fast');
            $nav.fadeIn('fast');
        }
    }
    
        
    function scroll_to_current_li() {
        var c = get_current_slider();
        var e = c.find('li');

        var $next = e.eq(current_li);
        
        c.scrollTo($next, 1000, {
            offset: -100
        });
    }
    
    function scroll_to_li(next) {
        var c = get_current_slider();
        var e = c.find('li');
        
        var t = current_li;

        if (next) {    
            if (++t == e.length - 1) {
                t = e.length -1;
                $nav_bottom.addClass('disabled');
                $nav_top.removeClass('disabled');
            } else if (t > e.length - 1) {
                t = e.length -1;
                $nav_bottom.addClass('disabled');   
            } else {
                $nav_top.removeClass('disabled');
            }
        } else {
            if (--t == 0) {
                t = 0;
                $nav_top.addClass('disabled');
                $nav_bottom.removeClass('disabled');                
            } else if (t < 0) {
                t = 0;
                $nav_top.addClass('disabled');
            } else {
                $nav_bottom.removeClass('disabled');
            }
        }

        var $next = e.eq(t);
        
        c.scrollTo($next, 1000, {
            offset: -100,
            onAfter: function() {
                current_li = t;
            }
        });
    }
    
    function scroll_to_one_section(section) {
      if(section==0) {
        section++;
        current_section = section;
        scroll_to_section();
      } else {
        section--;
        current_section = section;
        scroll_to_section(true);
        return;
      }
    }
    
    function scroll_to_section(next) {
        $nav.fadeOut('fast');
        var t = current_section;

        if (next) {            
            if (++t >= $sections.length - 1) {
                t = $sections.length -1;
                $nav_right.addClass('disabled');
            } else {
                $nav_left.removeClass('disabled');
            }
        } else {
            if (--t <= 0) {
                $nav_left.addClass('disabled');
                t = 0;
            } else {
                $nav_right.removeClass('disabled');
            }
        }
        
        var $next = $sections.eq(t);

        $white.scrollTo($next, 1000, {
            onAfter: function() {
                current_li = 0;
                current_section = t;
                set_nav();
                $nav.fadeIn('fast');
                get_current_slider().scrollTo(0, 500);
                window.location.hash = "#"+$next.attr("id");
            }
        });
    }
    
    function setup() {
        set_body();
        set_footer();
    }
    
    function get_current_slider() {
        return $sections.eq(current_section).find('.slider');
    }
    
    function done() {
        var window_height = $window.height();
        var w = get_black_height();
        
        $message.fadeOut(DURATION/2);
        $p.fadeOut(DURATION*1.8);
        $c.children().not($black).hide();
         
        $c.show();
        $black.css('top', w).animate({
            height: w,
            top: 0
        }, DURATION, function() {
            current_section = 0;
            current_li = 0;
            $white.scrollTo(0);
            $slider.scrollTo(0);
            $c.children().fadeIn(DURATION);
            $nav.fadeIn(DURATION);
    				//deep linking
    				if(window.location.hash) {
              var section = $sections.index($(window.location.hash));
              scroll_to_one_section(section);
            }
        });        
    }

    function change_message() {
        var $p = $('<p>');
        
        $p.clone().text(messages[current_message++]).appendTo($message);
    }

    function increaseCounter() {
        if (current_message < messages.length && w % 50 == 0) {
            change_message();
        }

        w += 1;

        $counter.css('width', w/2+'%');

        if (w >= 200) {
            window.clearInterval(interval);
            return done();
        }
    }
    
    function get_black_height() {
        var window_height = $window.height();
        var w = window_height*BLACK_HEIGHT;
        
        return (w < MIN_BLACK_HEIGHT) ? MIN_BLACK_HEIGHT : w;
    }
    
    function move_to_first() {
        $white.scrollTo(0, 1000);
        $slider.scrollTo(0, 1000);
        current_section = 0;
        current_li = 0;

        if ($footer.is('.open')) toggle_footer();

        return false;
    }
    
    $(function() {
        $window = $(window);
        $header = $('#header');
        $footer = $('#footer');
        $footer_close = $footer.find('.close').hide();
        $white = $('#white');
        $sections = $white.find('ul.scroll > li');
        $black = $('#black');
        
        $slider = $white.find('.slider');
        $slider_li = $slider.find('li');
        
        $nav = $('#nav').hide();
        $nav_bottom = $('#nav_bottom');
        $nav_top = $('#nav_top');
        $nav_left = $('#nav_prev');
        $nav_right = $('#nav_next');
        
        $document = $(document);
                
        setup();
        
        $c = $('#container');
        $p = $('#preloading');
        $counter = $('#counter');
        $message = $('#message');

        $black.css('height', 0);

        $header.click(move_to_first);

        var w = get_black_height();

        $counter.css({
            width: '0px',
            top: w - 1
        });        

        $message.css('top', w + 5);
        $c.hide();

        interval = window.setInterval(function() {
            increaseCounter();
        }, 20);

        $window.resize(function() {
            setup();
            delay(scroll_to_current_li, 200, "scrollToCurrent");    
        });
        
        $footer.find('a.about').click(toggle_footer);
        
        $nav_bottom.click(function() {
            scroll_to_li(true);
            return false;            
        });
        
        $nav_top.click(function() {
            scroll_to_li();
            return false;            
        });
        
        $nav_right.click(function() {
            scroll_to_section(true);
            return false;            
        });
        
        $nav_left.click(function() {
            scroll_to_section();
            return false;            
        });
        
        $document.keydown(function(e){
            
            switch (e.keyCode) {
                case 38:
                    scroll_to_li();
                    return false;
                case 40:
                    scroll_to_li(true);
                    return false;
                case 39:
                    scroll_to_section(true);
                    return false;
                case 37:
                    scroll_to_section();
                    return false;
            }
        });
				$('a.external, area.external, a.spip_out').attr('target', '_blank');
    });
		
})(jQuery);