/* Copyright (c) 2006 N2N Consulting Pte Ltd. All rights reserved. */

/**
* @author Antonius Ng
* 
* $Id: Box.js,v 1.1 2007/05/30 09:10:42 antonius Exp $
*/

/**
* @class A Box object. This box can be configured to be draggable. 
* It may have a title bar and the close box button.
* Need Prototype library.
*
* Usage:
* var box = new n2n.Box("box_id");
*
* // set the properties of the box
* box.titleBar = true;
* box.isDraggable = false;
*
* // draw the box
* box.paint();
*/

dojo.provide("n2n.Box");
dojo.provide("n2n.FormBox");
dojo.require("dojo.lang.*");
dojo.require("n2n.Div");
dojo.require("n2n.Table");
dojo.require("n2n.AJAXForm");

n2n.Box = Class.create();

n2n.Box.prototype= {
	
	
	initialize: function(id, container) {
		this.hasTitleBar = true;
		this.isDraggable = true; // Applicable only when there is a title bar
		this.closeButton = true; // Applicable only when there is a title bar
		this.titleBarBackground = "/images/defaultTitleBackground.gif"; //Applicable only when there is a title bar
		this.titleBarCloseButton = "/images/defaultTitleCloseButton.gif"; //Applicable only when there is a close button
		this.content= "";
		this.container = document;
		this.title = "";
		
		this.id = id;
		if (container)
			this.container = container;
		if (this.isDraggable){
			this.dragId  = id+"_drag_id"; //Applicable if the box is draggable
		}
		this.box = new n2n.Div(this.id, this.container);
		if (this.hasTitleBar) {
			this.titleBar = new n2n.Div(this.id+"_title",this.box);
			this.titleContent = new n2n.Table(this.id+"_title_table",this.titleBar);
		}
		this.contentBody = new n2n.Div(this.id+"_body",this.box);
	},
	
	paint: function(hide) {
		this.box.paint();
		if (this.hasTitleBar) {
			this.titleBar.paint();
			
			this.titleContent.paint();
			this.titleContent.HTMLObject.cellPadding="0";
			this.titleContent.HTMLObject.cellSpacing="0";
			
			var row = this.titleContent.HTMLObject.insertRow(0);
			var cell1 = row.insertCell(0);
			cell1.innerHTML =  this.title;
			cell1.align= "center";
			cell1.style.width= "100%";			
			cell1.style.background = "url("+this.titleBarBackground+")";
			
			if (this.isDraggable) {
				cell1.id=this.dragId;
				cell1.style.cursor="move";
						
				var dd = new ygDDOnTop(this.id);
				dd.setHandleElId(this.dragId);
			}
			
			if (this.closeButton) {
				var cell2 = row.insertCell(1);
				cell2.innerHTML="<a href=\"javascript: document.getElementById(\'"+this.id+"\').box.hide()\"><img src=\""+this.titleBarCloseButton+"\" border=\"0\"></a>";
				document.getElementById(this.id).box = this;
			}
			
		}
		this.contentBody.paint();
		this.contentBody.write(this.content);
		if (hide) {
			this.box.getDiv().style.display='none';
		}
	},
	
	hide: function() {
		this.box.getDiv().style.display='none';
	},
	show: function() {
		this.box.getDiv().style.display='';
	},
	setContent: function(s) {
		
		this.content = s;
		this.contentBody.clear();
		this.contentBody.write(s);
	}
}

/**
* @class A FormBox object. 
*
* Usage:
* var box = new n2n.FormBox("box_id", "/submit");
*
* // set the properties of the box
* box.addField('text','username',20,true,'required,duplicate');
* box.addField('password',''password',20,true);
*
* // draw the box
* box.paint();
*/
n2n.FormBox = Class.create();
//Object.extend(n2n.FormBox, n2n.Box);
n2n.FormBox.prototype = {
	
	initialize: function(id, url, rpcMethod, container) {
		
		this.hasTitleBar = true;
		this.isDraggable = true; // Applicable only when there is a title bar
		this.closeButton = true; // Applicable only when there is a title bar
		this.titleBarBackground = "/images/defaultTitleBackground.gif"; //Applicable only when there is a title bar
		this.titleBarCloseButton = "/images/defaultTitleCloseButton.gif"; //Applicable only when there is a close button
		this.content= "";
		this.container = document;
		this.title = "";
		
		this.id = id;
		if (container)
			this.container = container;
		if (this.isDraggable){
			this.dragId  = id+"_drag_id"; //Applicable if the box is draggable
		}
		
		this.box = new n2n.Div(this.id, this.container);
		if (this.hasTitleBar) {
			this.titleBar = new n2n.Div(this.id+"_title",this.box);
			this.titleContent = new n2n.Table(this.id+"_title_table",this.titleBar);
		}
		this.contentBody = new n2n.Div(this.id+"_body",this.box);
		
		this.form = new n2n.AJAXForm(id, url,rpcMethod, this.contentBody);
	},
	
	addField: function(type, name, label, size, validate, rule) {
		return this.form.addField(type,name, label, size, validate, rule);
	},
	setValue: function(name, value) {
		return this.form.setValue(name,value);
	},
	submit: function(synchronous) {
		this.form.submit(synchronous, false);
	},
	
	paint: function(hide) {
		
		this.box.paint();
		if (this.hasTitleBar) {
			this.titleBar.paint();
			this.titleContent.paint();
			this.titleContent.HTMLObject.cellPadding="0";
			this.titleContent.HTMLObject.cellSpacing="0";
			var row = this.titleContent.HTMLObject.insertRow(0);
			var cell1 = row.insertCell(0);
			cell1.innerHTML =  this.title;
			cell1.align= "center";
			cell1.style.width= "100%";			
			cell1.style.background = "url("+this.titleBarBackground+")";
			
			if (this.isDraggable) {
				cell1.id=this.dragId;
				cell1.style.cursor="move";
						
				var dd = new ygDDOnTop(this.id);
				dd.setHandleElId(this.dragId);
			}
			
			if (this.closeButton) {
				var cell2 = row.insertCell(1);
				cell2.innerHTML="<a href=\"javascript: document.getElementById(\'"+this.id+"\').box.hide()\"><img src=\""+this.titleBarCloseButton+"\" border=\"0\"></a>";
				document.getElementById(this.id).box = this;
			}
			
		}
		this.contentBody.paint();
		
		this.form.paint();
			
		if (hide) {
			this.box.HTMLObject.style.display='none';
		}
	},
	
	reset: function() {
		this.contentBody.clear();
		this.form.paint();
	},
	
	hide: function() {
		this.box.HTMLObject.style.display='none';
	},
	show: function() {
		this.box.HTMLObject.style.display='';
	}	
};