/*
Box used to highlight a rectangle


Ralf Petersilka


Requires: 	xbDOM.js
			xbStyle.js
			primitives.js
*/


/*
	Creates a box on given Parent (which must be a 
	HTMLDivObject) with given color and linewidth (in pixel)
	All	positioning commands like moveTo() or centerTo() require
	absolute (document) coordinates. Acordingly getX() and getY()
	will return absolute (pixel) coordinates.
*/

function Box(parent, x, y, width, height, isVisible, color, lineWidth){
	if ( arguments.length > 0 ){
		this.init(parent, x, y, width, height, isVisible, color, lineWidth); 
	}
}

/*
	Initialise the box. Creates the necessary html code and the 
	style object used to manipulate the box.
*/
Box.prototype.init = function(parent, x, y, width, height, isVisible, color, lineWidth){
		this.color = "red";
		this.lineWidth = 2;	
		this.isVisible = true;
		if ( (typeof parent) == "string" ) this.parent = xbGetElementById(parent);
		else this.parent = parent;
		this._parentStyle = new xbStyle(this.parent);
		this.xorg = this._parentStyle.getLeft();
		this.yorg = this._parentStyle.getTop();
		if ( color ) this.color = color;
		if ( lineWidth ) this.lineWidth = lineWidth;
		var html = "";
		width =  Math.max(this.lineWidth*2,width);
		height =  Math.max(this.lineWidth*2,height);
		// Base ID of the newly generated div tags
		this.id = this.parent.id + "_"+Math.random();
		var ps = new xbStyle(this.parent);
		html = '<div id="'+this.id+
			   '" style="position:absolute; left: '+parseInt(x)+ 'px; '+
			   'top: '+ parseInt(y)+ 'px; '+
			   'height: '+height+ 'px; '+
 			   'width: '+width+ 'px; '+
 			   'overflow:' + this.getOverflow()+";"+
 			   'line-height:1px;' +
			   'border:'+this.lineWidth+'px solid ' + this.color+';">&nbsp;</div>';

		// Get existing HTML declaration
		html = html + this.parent.innerHTML;
		PSxbSetInnerHTML(this.parent, html);
		this._style = new xbStyle(xbGetElementById(this.id));
		this._style.moveAbove(ps);
		if ( this.isVisible == true ) this.show();
		else this.hide();		
	}
Box.prototype.getOverflow = function(){ return "hidden";}
Box.prototype.moveTo = function(x,y){ this._style.moveTo(x,y);}
Box.prototype.centerTo = function(x,y){ 
	x = x - this._style.getWidth()/2;
	y = y - this._style.getHeight()/2;
	this.moveTo(x,y);
}

Box.prototype.moveBy = function(x,y){ this._style.moveBy(x,y);}
Box.prototype.setWidth = function(w){ this._style.setWidth(w);}
Box.prototype.setHeight = function(h){ this._style.setHeight(h);}

Box.prototype.getWidth = function(w){ return this._style.getWidth();}
Box.prototype.getHeight = function(h){ return this._style.getHeight();}

Box.prototype.getX = function(h){ return this._style.getLeft();}
Box.prototype.getY = function(h){ return this._style.getTop();}
Box.prototype.show = function(){ return this._style.setVisibility('visible');}
Box.prototype.hide = function(){ return this._style.setVisibility('hidden');}
Box.prototype.hidden = function(){ return (this._style.getVisibility() == 'hidden');}
Box.prototype.getBounds = function() { return new Bounds(this.getX(), this.getY(), 
								   this.getWidth(), this.getHeight());}

function TextBox(parent, x, y, width, height, isVisible, color, lineWidth){
	if ( arguments.length > 0 ){
		this.init(parent, x, y, width, height, isVisible, color, lineWidth); 
	}
	this.setText("Ein Text");
}

TextBox.prototype = new Box();					

TextBox.prototype.setText = function(text){
	var node = document.createTextNode(text);
	var me = xbGetElementById(this.id);
	this._style.setColor("red");
	this._style.setBackgroundColor("yellow");	
	me.appendChild(node);
}			   

TextBox.prototype.getOverflow = function() {return "visible";}