dojo.addOnLoad(function(){
  Scroller.init( true );
});

var Scroller = {

  Speed: 50,       //millisecs
  Step: 1,		  //pixels


  //Don't change anything below
  headersOn: false,

  domNode: false,
  blocks: [ ],
  copiedHeadings: [ ],

  currentBlock: 0,

  init: function ( headersOn) {

    this.blocks = dojo.html.getElementsByClass('scroll-content');
    if(this.blocks.length === 1){
      var newNode = document.createElement( this.blocks[0].tagName );
      dojo.html.copyStyle(newNode,this.blocks[0]);
      newNode.innerHTML = this.blocks[0].innerHTML;
      this.blocks[1] = newNode;
    }

    if ( headersOn ) this.headersOn = true;

    this.domNode = dojo.byId('scroll-block');
    this.domNode.innerHTML = "";
    this.titleNode = dojo.byId('vmarqeeTitle');

    dojo.event.connect( this.domNode, "onmouseover", this.onMouseOver );
    dojo.event.connect( this.domNode, "onmouseout", this.onMouseOut );

    this.heightOffset = 0;

    if ( this.headersOn ) this.createHeadingContainer();

    for ( var i = 0; i < this.blocks.length; i++) {
      var block =  this.blocks[ i ];
      block.blockIndex = i;

      //move the block into the scrolled div
      this.domNode.appendChild( block );

      this.setupScrolledBlock( block );
      if ( this.headersOn ) this.setupBlockHeadings( block, i == 0 );	  // i == 0 means this is the first block
    }

	//Set title
	this.setTitle(this.copiedHeadings[0].title);

    //init the heading containers height
    if ( this.headersOn ) this.headingContainer.height = dojo.html.getMarginBox(this.headingContainer).height;
    setTimeout('Scroller.start()',1000);

  },

  doScroll: function( ) {
    dojo.lang.forEach(Scroller.blocks, function ( block ) {
	  //move the block up if it is not completely scrolled off screen
	  if ( block.realHeight > -block.topPos ) {
	    block.topPos -= Scroller.Step;
	    block.style.top = block.topPos + "px";

	    /* slide the header out of the way if the next block is starting to
	       overlap the current heading */
	    if ( Scroller.headersOn &&
	    		 Scroller.previousBlockIndex( block.blockIndex ) == Scroller.currentBlock &&
		 			 block.topPos < Scroller.headingContainer.height ) {
	      Scroller.headingContainer.topPos -= Scroller.Step;
	      Scroller.headingContainer.style.top = Scroller.headingContainer.topPos + "px";
	    }

	  // if off screen, move this block to the end of the blocks
	  } else {

	  	var prevBlock = Scroller.blocks[ Scroller.previousBlockIndex( block.blockIndex ) ];

	    block.topPos = prevBlock.topPos + dojo.html.getBorderBox( prevBlock ).height;
	    block.style.top = block.topPos + "px";
	    block.cumalativeHeight = block.topPos;

	    if ( Scroller.headersOn ) Scroller.changeHeadings( );

	    Scroller.incrementBlock();
	  }

    } );

  },

  nextBlockIndex: function( optionalNum ) {
    var num = this.currentBlock + 1;

    if ( optionalNum !== undefined )
    	num = optionalNum + 1;

    if ( num >= this.blocks.length ) num -= this.blocks.length;
    return num;
  },

  previousBlockIndex: function( optionalNum ) {
    var num = this.currentBlock - 1;

    if ( optionalNum !== undefined )
    	num = optionalNum - 1;

    if ( num < 0 ) num += this.blocks.length;
    return num;
  },

  incrementBlock: function() {

    Scroller.currentBlock = this.nextBlockIndex();

  },


  setupScrolledBlock: function ( block ) {
      //initalize scrolling styles and paramaters
      block.style.position = 'absolute';
      block.topPos = this.heightOffset;
      block.realHeight = dojo.html.getMarginBox(block).height;
      block.cumalativeHeight = dojo.html.getMarginBox(block).height;
      block.style.top = block.topPos + "px";
      this.heightOffset += dojo.html.getMarginBox(block).height;
  },

  setupBlockHeadings: function ( block, firstBlock ) {

      var headings = dojo.html.getElementsByClass( 'scroll-header' , block );
      if ( headings.length > 0 ) {
	block.heading = headings[0];  //only use the first heading

	//make a copy of the heading
	block.headingCopy = document.createElement( block.heading.tagName );
    dojo.html.copyStyle(block.headingCopy,block.heading);
	block.headingCopy.innerHTML = block.heading.innerHTML;
	block.headingCopy.title = block.heading.title;
	block.heading.title = null;
	this.copiedHeadings.push( block.headingCopy );

	/* put the heading inside the heading container and only make  the
	   first heading visible */
	if ( !firstBlock )  block.headingCopy.style.display = 'none';
	this.headingContainer.appendChild( block.headingCopy );

      } else {
	/* place an empty entry into the headings array if this block doesn't
	   have a heading */
	this.copiedHeadings.push ( false );

      }
  },

  createHeadingContainer: function () {
    this.headingContainer = document.createElement( 'div' );
    this.headingContainer.id= 'scroll-heading-container';
    with(this.headingContainer.style){
      position = 'absolute';
      top = '0px';
      zIndex = 50;
      width = dojo.html.getBorderBox(this.domNode).width + 'px';
      backgroundColor = dojo.html.getStyle(this.domNode,'background-color');
      backgroundImage = dojo.html.getStyle(this.domNode,'background-image');
      backgroundRepeat = dojo.html.getStyle(this.domNode,'background-repeat');
      backgroundAttachment = dojo.html.getStyle(this.domNode,'background-attachment');
    }
    this.domNode.appendChild( this.headingContainer );
    this.headingContainer.topPos = 0;
  },

  changeHeadings: function( ) {
    //change the headings
    var currentHeading = Scroller.copiedHeadings[ Scroller.currentBlock ];
    var nextHeading = Scroller.copiedHeadings[ Scroller.nextBlockIndex() ];

    //if there is heading for the next block
    if ( nextHeading ) {
      nextHeading.style.display = 'block';
    }
    currentHeading.style.display = 'none';

    Scroller.headingContainer.topPos = 0;
    Scroller.headingContainer.style.top = '0px';

    Scroller.headingContainer.height = dojo.html.getMarginBox(Scroller.headingContainer).height;

	/* set title */
	if(nextHeading.title.length){
		Scroller.setTitle(nextHeading.title);
	}


  },
  
  setTitle: function ( text ) {
  	Scroller.titleNode.innerHTML = text;
  },

  onMouseOver: function ( event ) {
    Scroller.stop();
  },

  onMouseOut: function ( event ) {
    Scroller.start();
  },

  start: function () {
    this.stop();
    this.timer = setInterval( function( ) { Scroller.doScroll( Scroller ); }, this.Speed );
  },

  stop: function () {
    clearInterval( this.timer );
    this.timer = false;
  }
};