/*
 * Apply sliding effects on all images in a DIV.
 *
 * It's assumed that there are 8 images in 2 columns of 4 images each.
 * Eccess images are hidden and after a certain time are swapped in over
 * the existing images. If there are less than 8 images an empty
 * placeholder is used instead.
 */
 
if (it === undefined) {
  var it = {tfd: {}};
}
 
(function($) {
  it.tfd.slider = {
    init: function(container, options) {
            this.container = container;
            this.options = $.extend({
              interval: 5000,
              effect:   'blind',
              speed:    500
            }, options);

            setTimeout($.proxy(this.hide, this), this.options.interval);
          },
	
    hide: function() {
            var hideElement = $('div:first', this.container);
            hideElement.hide(this.options.effect, {}, this.options.speed, $.proxy(this.cycle, this));
          },
	
    cycle: function() {
             var moveElement = $('div:first', this.container);
             moveElement.detach().appendTo(this.container).show();
             setTimeout($.proxy(this.hide, this), this.options.interval);
           }
  };
})(jQuery);

