Effect.Rewrite = Class.create(Effect.Base, {
  initialize: function(element) {
		this.element = $(element);
		
    var options = Object.extend({}, arguments[1] || { });
		
		
		
		// this.text = text;
    this.start(Object.extend({ duration: 0 }, arguments[1] || { }));
  	// alert('hello'); 
  	  
  },
  update: function(position) {
  	this.element.firstChild.nodeValue = this.options.text;
  }

});

function Fader(HTMLElementId, size, interval) {
	// takes a list of elements and displays the first size amount, periodically refreshing
	this.HTMLElementId = HTMLElementId;
	this.HTMLElement = document.getElementById(HTMLElementId);
	this.size = size;
	this.interval = interval;
	
	// Read elements from HTMLElement
	this.elements = new Array();		
	var div_list = this.HTMLElement.getElementsByTagName('div');
	for (var counter = 0; counter < div_list.length; counter++) {
		this.elements.push(div_list[counter].firstChild.nodeValue);
	}
	
	// Set visibility of first size divs
	for (var counter = 0; counter < size; counter++) {
		div_list[counter].style.visibility = 'visible';
	}
}

function replace() {
	// Selects a displayed_element at random and replaces it with another element.
	// Choose an index to replace from 0 to size-1
	var replaced_index = Math.floor(Math.random() * this.size);
	
	// Choose an index to replace with from size to length(elements)
	var range = this.elements.length - this.size;
	var replacing_index = this.size + Math.floor(Math.random() * range);
	
	// Swap
	var buffer = this.elements[replaced_index];
	this.elements[replaced_index] = this.elements[replacing_index];
	this.elements[replacing_index] = buffer;
	
	// alert('swapping ' + replaced_index + ' with ' + replacing_index);
	// Update the HTML element
	var element_id = this.HTMLElementId + '_' + replaced_index;
	var duration = 2;
	// $(element_id).style.opacity = 0;
	// $(element_id).firstChild.nodeValue = this.elements[replaced_index];
	// new Effect.Opacity(element_id, { from: 0, to: 1.0, duration: duration } );
	
	new Effect.Opacity(element_id, {
		from: 1,
		to: 0,
		duration: 2,
		queue: { position: 'end', scope: element_id + 'scope' }
	});
	
	new Effect.Rewrite(element_id, {
		text: this.elements[replaced_index],
		queue: { position: 'end', scope: element_id + 'scope' }
	});	
	
	new Effect.Morph(element_id, {
		style: 'opacity: 1; color: #900;',
		duration: 2,
		queue: { position: 'end', scope: element_id + 'scope' }
	});
	
	new Effect.Morph(element_id, {
		style: 'opacity: 1; color: #900;',
		duration: 2,
		queue: { position: 'end', scope: element_id + 'scope' }
	});
	
	new Effect.Morph(element_id, {
		style: 'opacity: 1; color: #666;',
		duration: 1,
		queue: { position: 'end', scope: element_id + 'scope' }
	});
	
	
	return;						
}

function start_fader(fader) {
	// Starts looping Fader.replace actions if there are more elements in the fader than can be displayed
	alert(fader);
	if (fader.size < fader.elements.length) {
		fader.replace();
		// t = setTimeout("start_fader(fader)", fader.interval);	
	}
}

Fader.prototype.replace = replace;