Moebius effect

gistfile1.js

Element.addMethods({
  /*
  remove IDs from element + all children
  returns element
  */
  anonymize: function(element){
    var element = $(element);
    element.writeAttribute('id',null).childElements().invoke('writeAttribute', 'id', null);
    return element;
  },
  /*
  sets up an animation sliding a child element and all of its contents
  duplicates the first element at the end to make an infinite scroll
  options: 
    direction - 'horizontal' or 'vertical', default: 'vertical'
    interval - decimal integer, default: 5 (seconds) time between frames
    duration - decimal integer, default: 0.4 (seconds) duration of animated wipe
  requires:
    a DIV, which contains an absolutely positioned child DIV, which
    in turn contains any number of equally-sized child divs.
  returns element
  */
  moebius: function(element, options){
    var options = $H(arguments[1]) || $H();
    var offset = 0;
    var slider = $(element).down();
    var interval = (options.get('interval')) ? options.get('interval') : 5;
    var dur = (options.get('duration')) ? options.get('duration') : 0.4;
    switch(options.get('direction')){
      case 'horizontal':
        var measure = 'width', adjust = 'left';
        break;
      default:
        var measure = 'height', adjust = 'top';
    }
    var firstElement = slider.down();
    var step = firstElement.getLayout().get(measure);
    var limit = (slider.getLayout().get(measure) * -1) + step; 
    var dupe = firstElement.clone(true).anonymize();
    slider.setStyle(measure + ': ' + (slider.getLayout().get(measure) + step) + 'px');
    slider.insert(dupe);
    new PeriodicalExecuter(function(){
      if(offset > limit){
        offset -= step;
        slider.morph(adjust + ': ' + offset + 'px', {
          duration: dur
        });
      }else{
        offset -= step;
        slider.morph(adjust + ': ' + offset + 'px', {
          duration: dur, afterFinish: function(){
            slider.setStyle(adjust + ':0');
            offset = 0;
          }
        });
      }
    }, interval);
    return element;
  }
});
$('item2').moebius();
$('item2a').moebius({direction:'horizontal', interval:1});