$(document).ready(function(){
    // Add pseudoclasses to lists
    $("li:last-child").addClass("last");
    $("li:first-child").addClass("first");
    // Center images inside slides
    setTimeout(function(){
        $.each($("#banner .slide img"), function(){
            var hidden = false;
            if ($(this).parent().css('display') == 'none') hidden = true;
            $(this).parent().css({
                display: 'block'
            });
            $(this).css({
                left: (925 - $(this).width()) / 2 + 'px'
            });
            if (hidden) $(this).parent().css({
                display: 'none'
            });
        });
        $.each($("#banner .slide img"), function(){
            $(this).bind('load', function(){
                var hidden = false;
                if ($(this).parent().css('display') == 'none') hidden = true;
                $(this).parent().css({
                    display: 'block'
                });
                $(this).css({
                    left: (925 - $(this).width()) / 2 + 'px'
                });
                if (hidden) $(this).parent().css({
                    display: 'none'
                });
            });
        });
    }, 100);
    // Center button containers
    $.each($(".button-container"), function(){
        $(this).css({
            left: ($(this).offsetParent().width() - $(this).width()) / 2 + 'px'
        });
    });
    // Prepare slider
    //    var slides = $('.slide');
    //    var active_slide = 0;
    //    $('#banner-next').bind('click', function(){
    //        var next_slide = active_slide + 1;
    //        if (next_slide >= slides.length) next_slide = 0;
    //        $(slides[active_slide]).fadeOut();
    //        $(slides[next_slide]).fadeIn();
    //        active_slide = next_slide;
    //        return false;
    //    });
    //    $('#banner-prev').bind('click', function(){
    //        var next_slide = active_slide - 1;
    //        if (next_slide < 0) next_slide = slides.length - 1;
    //        $(slides[active_slide]).fadeOut();
    //        $(slides[next_slide]).fadeIn();
    //        active_slide = next_slide;
    //        return false;
    //    });
    // Init jflow
    $('#slides-controller').jFlow({
        slides: "#banner-slides-container",
        width: "1051px",
        height: "273px",
        duration: 1000
    });
    // Init testimonials change
    var nextSlide = parseInt(Math.random() * ($("#testimonial div").length - 1));
    $($("#testimonial div")[nextSlide]).fadeIn();
    setInterval(function(){
        $($("#testimonial div")[nextSlide]).fadeOut(function(){
            var tmp = parseInt(Math.random() * ($("#testimonial div").length - 1));
            if (tmp == nextSlide) nextSlide = Math.abs(($("#testimonial div").length - 1) - tmp);
            else nextSlide = tmp;
            $($("#testimonial div")[nextSlide]).fadeIn();
        });
    }, 10000);
    // Stratch #content so that no glitch of too small page appear and footer touches the bottom
    if (Math.max(500, $(window).height() - 485) - $('#content-heading').height() > $('#content').height()) {
        $('#content').height(Math.max(500, $(window).height() - 485) - $('#content-heading').height());
    }
    // prepare subscribe form
    $('#subscribe-form #subscribe-submit').click(function() {
        // validate
        var error = false;
        $('#subscribe-form :input').each(function() {
            if ($(this).attr('name') == 'email') {
                if (! /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*$/.test($(this).val())) {
                    $(this).addClass('error');
                    $(this).bind('change', function(){
                        $(this).removeClass('error')
                    });
                    error = true;
                }
            }
        });
        // Stop propogation if error acquired
        if (error) {
            return false;
        }
        // submit the form
        $('#subscribe-form').ajaxSubmit({
            success: function(responseValue) {
                $('#subscribe-form').fadeOut(300, function(){
                    if (/.*ERROR.*/.test(responseValue)) {
                        $('#subscribe-error').fadeIn(300);
                    } else {
                        $('#subscribe-success').fadeIn(300);
                    }
                });
            }
        });
        // return false to prevent normal browser submit and page navigation
        return false;
    });
    
    howItWorks.init();
});

var howItWorks = {
    slides: '',
    controls: '',
    activeSlide: '',
    executor: '',
    transitionTime: 300,
    slideChangeTime: 7000,
    
    init: function() {
        this.slides = $("#how-it-works .slides .slide");
        this.controls = $("#how-it-works .controls .control");
        $(this.slides).hide();
        $(this.slides[0]).show();
        $(this.controls[0]).addClass('active');
        this.activeSlide = 0;
        
        var self = this;
        
        this.controls.each(function(i){
            $(this).click(function(){
                self.changeSlide(i);
                self.stopExecutor();
                return false;
            });
        });
        
        this.startExecutor();
    },
    
    changeSlide: function(nextSlide) {
        if (nextSlide == this.activeSlide) return true;
        $(this.slides[this.activeSlide]).fadeOut(this.transitionTime);
        $(this.slides[nextSlide]).fadeIn(this.transitionTime);
        $(this.controls[this.activeSlide]).removeClass('active');
        $(this.controls[nextSlide]).addClass('active');
        this.activeSlide = nextSlide;
    },
    
    startExecutor: function(){
        var self = this;
        this.executor = setInterval(function(){
            self.changeSlide((self.activeSlide + 1) % self.slides.length);
        }, this.slideChangeTime);
    },
    
    stopExecutor: function(){
        clearInterval(this.executor);
    }
}
