function SlideshowControl(element, options) {
    this.element = $(element);
    this.active_id = null;
    this.stop = false;
    this.options = $.extend({
        active_class: 'active',
        effect_time: 3000,
        switch_delay: 10000,
        switch_action: 'click'
    }, options);
    this.elements_hash = new Array();

    this.init = function() {
        var slideshow = this;

        // create control elements hash
        var first_element_id = null;
        var previous_element_id = null;
        this.element.find('.control').each(function() {
            var id = $(this).attr('id');
            if (first_element_id == null) {
                first_element_id = id;
            }
            if (previous_element_id == null) {
                slideshow.elements_hash[id] = null;
            } else {
                slideshow.elements_hash[previous_element_id] = id;
            }
            previous_element_id = id;
        });
        this.elements_hash[previous_element_id] = first_element_id;

        // hide elements
        this.element.find('.content').hide();

        // bind switch action
        this.element.find('.control').bind(this.options.switch_action, function() {
            slideshow.activate($(this).attr('id'), 0);
            slideshow.stop = true;
        });

        this.element.bind('mouseout', function() {
            if (slideshow.stop) {
                slideshow.stop = false;
            }
        });

    };

    this.next = function() {
        var slideshow = this;
        if (!this.stop) {

            if (this.active_id == null) {
                var first_control = this.element.find('.control').first();
                this.activate(first_control.attr('id'), 0);
            } else {
                var next_id = this.elements_hash[this.active_id];
                this.activate(next_id, this.options.effect_time);
            }

            setTimeout(function() {
                slideshow.next()
            }, this.options.switch_delay);
        } else {
            setTimeout(function() {
                slideshow.next()
            }, 1000);
        }
    };

    this.activate = function(id, delay) {
        var active_element = $('#' + this.active_id);
        var next_element = $('#' + id);

        if (active_element.length > 0) {
            active_element.removeClass(this.options.active_class);
            $(active_element.attr('content')).fadeOut(delay);
        }

        next_element.addClass(this.options.active_class);
        $(next_element.attr('content')).fadeIn(delay);
        this.active_id = id;
    };

    this.init();
    this.next();
}

function Slideshow(element) {
    this.element = $(element);
    this.elements = new Array();
    this.current_position = 0;
    this.semaphore = true;
    var fading_in;
    var fading_out;

    this.init = function() {
        slideshow = this;
        this.element.addClass('slideshow');
        this.element.height(160);
        this.element.children('li').each(function() {
            $(this).hide();
            slideshow.elements.push($(this));
        });
        this.element.children('li:first').show();
    };

    this.start = function() {
        if (!this.semaphore) {
            return;
        }

        var slideshow = this;

        var current_element = this.elements[this.current_position];
        this.current_position ++;
        if (this.current_position == this.elements.length) {
            this.current_position = 0;
        }
        var next_element = this.elements[this.current_position];

        current_element.queue('slideshow_fq');
        next_element.queue('slideshow_fq');

        fading_out = current_element;
        fading_in = next_element;
        current_element.delay(5000).fadeOut(5000, function() {

        });
        next_element.delay(5000).fadeIn(5000, function() {
            slideshow.start();
        });
    };

    this.show = function(element) {
        for (var index in this.elements) {
            if (this.elements[index].attr('id') == $(element).attr('id')) {
                fading_in.stop(true, true);
                fading_out.stop(true, true);
                var slideshow = this;
                this.element.children('li:visible:first').fadeOut(2000);
                $(element).fadeIn(1000, function() {
                    slideshow.semaphore = false;
                });
            }
        }
    };

    this.init();
    this.start();
}