var BoxManager = {
	lastDropTargetSrc: null,
	lastDropTargetDirection: null,
	add: function(sectionid, boxid) {
		var xmlHttp= new Ajax.Request(nnph_ajax_root + "ajax/boxmanager/add/",
			{	method: "get",
				parameters: "sectionid="+sectionid+"&boxid="+boxid,
				onComplete: function(request){
					new Insertion.Top('leftBoxes', request.responseText);
				}
			}
		);
	},
	pushToolIcon: function(obj, cls, title) {
		var html = '<div class="tool">' +
						'<img src="'+nnph_image_root+'s.gif" class="'+cls+'" width="16" height="16" alt="'+title+'" title="'+title+'"/>'+
					'</div>';
		new Insertion.Top(obj, html);
		var ret = obj.firstChild;
		if (!obj.tool_icons) {
			obj.tool_icons = new Array();
		}
		obj.tool_icons.push(ret);
		return ret;
	},
	initalizeNode: function(id, isAdmin) {
		var o = $('box_h_'+id);
		this.isAdmin = isAdmin;
		o.hasInitalized = true;
		boxmanager = this;
		o.boxid = id;
		icons = Element.getElementsByClassName(o, 'icon');
		o.child_icon = icons[0];
		o.box_content = o.parentNode.parentNode.childNodes[1].firstChild;

		var html = '<div class="collapse"><img src="' + nnph_image_root + 's.gif" class="action-box-collapse" width="16" height="16" alt="Collapse" title="Collapse"/></div>';
		new Insertion.Top(o, html);
		o.child_collapse = o.firstChild;
		o.child_collapse.c_image = o.child_collapse.firstChild;

		if (isAdmin) {
			o.child_edit = this.pushToolIcon(o, 'action-box-edit', 'Edit');
			Event.observe(o.child_edit,'mousedown', function(event) {
				boxmanager.edit(event, o.boxid);
				},false
			);
			o.child_delete = this.pushToolIcon(o, 'action-box-delete', 'Delete');
			Event.observe(o.child_delete,'mousedown', function(event) {
				boxmanager.remove(o.boxid);
				},false
			);
			Event.observe(o,'mousedown', function(event){
				boxmanager.initiateDrag(event, id);
				},false
			);
		}
		Element.setStyle(o.child_icon, {display: 'none'});
		Event.observe(o.child_collapse,'mousedown', function(event){
			boxmanager.toggleContent(id);
			},false
		);
	},
	hover: function(event, id, isAdmin) {
		var o = $('box_h_'+id);
		if (!o.hasInitalized) {
			this.initalizeNode(id, isAdmin);
		} else {
			if (o.tool_icons) {
				for (i=0;i<o.tool_icons.length;i++) {
					Element.setStyle(o.tool_icons[i], {display: 'inline'});
				}
			}
			Element.setStyle(o.child_collapse, {display: 'inline'});
			Element.setStyle(o.child_icon, {display: 'none'});
		}
	},
	initiateDrag: function(event, id) {
		var o = intGetObjFromEvent(event);
		if (Element.hasClassName(o, 'action-box-expand')) {
			return false;
		}
		if (Element.hasClassName(o, 'action-box-collapse')) {
			return false;
		}
		if (Element.hasClassName(o.parentNode, 'tool')) {
			return false;
		}
		
		var boxmanager = this;
		this.dragingId = id;
		this.hideAdminTools(id);
		var srcbox = $('box_'+id);
		if(/MSIE/.test(navigator.userAgent) && !window.opera) {
			Element.setStyle(srcbox, {width: Element.getWidth(srcbox)+'px'});
			Element.setStyle(srcbox, {height: Element.getHeight(srcbox)+'px'});
		}
		this.dragObserver = Draggables.addObserver( {
			onStart: function(eventName, draggable, event) {
				draggable.element.setStyle({width: draggable.element.getWidth()+'px'});
				draggable.element.setStyle({height: draggable.element.getHeight()+'px'});
			},
			onEnd: function(eventName, draggable, event) {
				draggable.element.setStyle({width: 'auto'});
				draggable.element.setStyle({height: 'auto'});
				Draggables.removeObserver(boxmanager.dragObserver);
			}
		});
		
		new Draggable(srcbox, {zindex: 1000, ghosting: true, revert: function(element) {
			return !boxmanager.onEndDrag(element);
		}});
		this.leftBoxList = this.makeBoxDropTargets(srcbox, 'left');
		this.rightBoxList = this.makeBoxDropTargets(srcbox, 'right');
	},
	destroyBoxDropTargets: function() {
		for (i=0;i<this.dropTargets.length;i++) {
			Droppables.remove(this.dropTargets[i]);
		}
		this.dropTargets = Array();
	},
	makeBoxDropTargets: function(srcbox, zone) {
		if (!this.dropTargets) {
			this.dropTargets = Array();
		}
		var boxZone = $(zone+'Boxes');
		if (Element.getWidth(boxZone) < 10) {
			Element.setStyle(boxZone, {width: '200px' });
		}
		list = Element.getElementsByClassName(boxZone, 'newBox');
		for (i=0;i<list.length;i++) {
			this.makeBoxDropTarget(srcbox, list[i], zone);
		}
		this.dropTargets.push(boxZone);
		Droppables.add(boxZone, {
				accept: 'newBox',
				overlap: 'vertical',
				onHoverOut: function(target) {},
				onHover: function(src, target, cover, point)
				{
					boxmanager.onHoverItemDuringDrag(zone, 'background', src, target, cover, point);
				},
				onDrop: function(src, target) {}
			}
		);
		return list;
	},
	makeBoxDropTarget: function(src, box, zone) {
		if (box != src) {
			this.dropTargets.push(box);
			Droppables.add(box, {
					accept: 'newBox',
					overlap: 'vertical',
					lastTarget: null,
					onHoverOut: function(target) {},
					onHover: function(src, target, cover, point)
					{
						boxmanager.onHoverItemDuringDrag(zone, 'box', src, target, cover, point);
					},
					onDrop: function(src, target) {}
				}
			);
			var chld = Element.getElementsByClassName(box, 'newBoxHeaderContainer');
			this.dropTargets.push(chld[0]);
			Droppables.add(chld[0], {
					accept: 'newBox',
					overlap: 'vertical',
					lastTarget: null,
					onHoverOut: function(target) {},
					onHover: function(src, target, cover, point)
					{
						boxmanager.onHoverItemDuringDrag(zone, 'header', src, target, cover, point);
					},
					onDrop: function(src, target) {}
				}
			);
		}
	},
	onEndDrag: function(element) {
		this.destroyBoxDropTargets();
		var o = $('boxDropTarget');
		if (o&&this.lastDropTargetSrc) {
			var id = -1;
			if ((this.lastDropTargetSrc.id)&&(this.lastDropTargetSrc.id.length>4)&&(this.lastDropTargetSrc.id.substr(0,4) == 'box_')) {
				id = this.lastDropTargetSrc.id.substring(4);
			} else {
				id = this.lastDropTargetSrc; 
			}
			this.exchangeBox(this.lastDropTargetDirection, this.dragingId, id)
			this.hideAdminTools(this.dragingId);
			var html = '<div id="box_' + this.dragingId + '" class="newBox">' + element.innerHTML + '</div>';
			new Insertion.Before(o, html);
			Element.remove(o);
			Element.remove(element);
			this.initalizeNode(this.dragingId, this.isAdmin);
			return true;
		} else {
			return false;
		}
	},
	exchangeBox: function(mode, src, target) {
		var xmlHttp= new Ajax.Request(nnph_ajax_root + "ajax/boxmanager/swap/",
			{	method: "get",
				parameters: 'mode='+mode+'&src='+src+'&dst='+target,
				onComplete:function(request){
					//alert(request.responseText);
				}
			}
		);
	},
	onHoverItemDuringDrag: function(side, mode, src, target, cover, point) {
		if ((this.lastTarget != target)||(this.lastMode != mode)) {
			this.lastTarget = target;
			this.lastMode = mode;
			var o = $('boxDropTarget');
			var h = Element.getHeight(src);
			var html = '<div id="boxDropTarget" class="newBoxDropTarget" style="height: ' + h + 'px;">&nbsp;</div>';
			if (mode == 'header') {
				this.lastDropTargetSrc = target.parentNode;
				this.lastDropTargetDirection = 'before';
				new Insertion.Before(target.parentNode, html);
			} else if (mode == 'box') {
				this.lastDropTargetSrc = target;
				this.lastDropTargetDirection = 'after';
				new Insertion.After(target, html);
			} else if (mode == 'background') {
				var found = false;
				var list = null;
				if (side == 'left') {
					list = this.leftBoxList;
				} else {
					list = this.rightBoxList;
				}
				if (list.length == 0) {
					this.lastDropTargetSrc = side;
					this.lastDropTargetDirection = 'top';
					new Insertion.Top(target, html);
					found = true;
				}
				for (i=0;i<list.length;i++) {
					if (list[i].id == src.id) {
						continue;
					}
					lastBox = list[i];
					offset = Position.cumulativeOffset(list[i]);
					if (i==0 && point[1] < offset[1]) {
						this.lastDropTargetSrc = lastBox;
						this.lastDropTargetDirection = 'before';
						new Insertion.Before(lastBox, html);
						found = true;
						break;
					}
					if (point[1] < offset[1]+Element.getHeight(list[i])) {
						found = true;
						this.lastDropTargetSrc = list[i];
						this.lastDropTargetDirection = 'before';
						new Insertion.Before(list[i], html);
						break;
					}
				}
				if (!found) {
					this.lastDropTargetSrc = lastBox;
					this.lastDropTargetDirection = 'after';
					new Insertion.After(lastBox, html);
				}
			}
			if (o) {
				Element.remove(o);
			}
		}
	},
	toggleContent: function(id) {
		var h = $('box_h_'+id);
		var c = ('box_content_'+id);
		var v = Element.getStyle(c, 'display')=='block';
		Element.setStyle(c, {display: v?'none':'block'});
		Element.addClassName(h.child_collapse.c_image, v?'action-box-expand':'action-box-collapse');
		Element.removeClassName(h.child_collapse.c_image, v?'action-box-collapse':'action-box-expand');
		var xmlHttp= new Ajax.Request(nnph_ajax_root + 'ajax/boxmanager/collapse/',
			{	method: "get",
				parameters: 'boxid='+id,
				onComplete:function(request){
					var data = eval('('+request.responseText+')');
					if (!data) {
						alert('Could not toggle box...');
					}
				}
			}
		);


	},
	showContent: function(id) {
		var c = ('box_content_'+id);
		var v = Element.getStyle(c, 'display')=='block';
		if (!v) {
			this.toggleContent(id);
		}
	},
	hideAdminTools: function(id) {
		var o = $('box_h_'+id);
		if (o.hasInitalized) {
			Element.setStyle(o.child_icon, {display: 'inline'});
			Element.setStyle(o.child_collapse, {display: 'none'});
			if (o.tool_icons) {
				for (i=0;i<o.tool_icons.length;i++) {
					Element.setStyle(o.tool_icons[i], {display: 'none'});
				}
			}
		}
	},
	hoverOut: function(event, id) {
		var o = $('box_h_'+id);
		if (o.hasInitalized) {
			Element.setStyle(o.child_icon, {display: 'inline'});
			Element.setStyle(o.child_collapse, {display: 'none'});
			if (o.tool_icons) {
				for (i=0;i<o.tool_icons.length;i++) {
					Element.setStyle(o.tool_icons[i], {display: 'none'});
				}
			}
		}
	},
	remove: function(id) {
		makeLoading($('box_'+id));
		var xmlHttp= new Ajax.Request(nnph_ajax_root + "ajax/boxmanager/remove/",
			{	method: "get",
				parameters: 'id='+id,
				onComplete:function(request) {
					Element.remove('box_'+id);
				}
			}
		);
	},
	edit: function(event, id) {
		this.showContent(id);
		ajax_innerHtml('', $('box_content_'+id), nnph_ajax_root + 'ajax/boxmanager/configure/', 'id='+id);
	},
	cancelSave: function(id) {
		ajax_innerHtml('', $('box_content_'+id), nnph_ajax_root + 'ajax/boxmanager/cancel/', 'id='+id);
	},
	save: function(event, id) {
		var xmlHttp= new Ajax.Request(nnph_ajax_root + 'ajax/boxmanager/save/',
			{	method: "get",
				parameters: Form.serialize($('save_box_'+id))+'&id='+id,
				onComplete:function(request){
					var data = eval('('+request.responseText+')');
					var c = $('box_content_'+id);
					c.innerHTML = data.contents;
					var i = $('box_i_'+id);
					if (!data.icon) {
						data.icon = 'empty';
					}
					i.src = nnph_icon_root + data.icon + '.png';
					var t = $('box_t_'+id);
					if (data.link) {
						t.innerHTML = '<a href="' + data.link + '>'+data.title+'</a>';
					} else {
						t.innerHTML = data.title;
					}
				}
			}
		);


	}
}