// JavaScript Document
/*<div id="demo" style="overflow:hidden;height:20px;width:100%;margin:0px;">
<table align="left" cellpadding="0" cellspace="0" border="0" style="width:200%;"><tr>
<td id="demo1" nowrap="nowrap">{content}</td><td id="demo2" nowrap="nowrap"></td></tr></table>
</div>
*/
var oMarqueeObject = function(key, direction, speed){
    var _key = key;
	var _direction = direction;
	var _speed = speed;
	this.pobj = null;
	this.cobj1 = null;
	this.cobj2 = null;
	this.varInterval = 0;
	this.marquee = function(){
		switch(_direction){
			case "up":
				if(this.pobj.scrollTop >= this.cobj1.offsetHeight) this.pobj.scrollTop = 0;
				else this.pobj.scrollTop++;
				break;
			default: //"left"
			  if(this.cobj2.offsetWidth - this.pobj.scrollLeft<=0) this.pobj.scrollLeft = 0;
			  else this.pobj.scrollLeft ++;
			  break;
		}
	}
	this.play = function(){
		this.varInterval = setInterval("oMarquee.keys['"+_key+"'].marquee();", _speed);
	}
	this.stop = function(){
		clearInterval(this.varInterval);
	}
	this.init = function(){
	    this.cobj2.innerHTML = this.cobj1.innerHTML;
	    this.play();
	}
}

var oMarquee = {
	keys:[],
	add:function(key, direction, speed){
		if(arguments.length<1)return;
		if(arguments.length<2)direction="left";
		if(arguments.length<3)speed=30;
		var obj = new oMarqueeObject(key, direction, speed);
		obj.pobj = document.getElementById(key);
		obj.cobj1 = document.getElementById(key+"1");
		obj.cobj2 = document.getElementById(key+"2");
		obj.pobj.onmouseover = function(){
			oMarquee.keys[key].stop();
		}
		obj.pobj.onmouseout = function(){
			oMarquee.keys[key].play();
		}
		oMarquee.keys[key]=obj;
		oMarquee.keys[key].init();
	}
}