// Copyright 2008 ProjectWizards GmbH. All rights reserved.

//console.log("SplitView.js");

var SplitView = Base.extend({
	constructor: function(container, splitterPosition, sensitiveWidth, splitterWidth, minWidth, maxWidth, collapsible){	
		this.enableInteraction = true;
		this.container	= container;
		this.sensitiveWidth = parseInt(sensitiveWidth);
		this.splitterWidth = splitterWidth;
		this.maxWidth = maxWidth;
		this.minWidth = minWidth;
		this.collapsible = collapsible;
		if(maxWidth && splitterPosition > maxWidth)
			splitterPosition = maxWidth;
		if(minWidth && splitterPosition < minWidth){
			splitterPosition = collapsible ? 0 : minWidth;			
		}
		this.splitterPosition = splitterPosition;
		this.firstDiv	= null;
		this.secondDiv	= null;
		var children	= this.container.childNodes;
		var childCount	= children.length;
		for(var i=0; i<childCount; i++){
			if(String(children[i].tagName).toLowerCase() == "div"){
				if(!this.firstDiv)
					this.firstDiv = children[i];
				else if(!this.secondDiv)
					this.secondDiv = children[i];
			}
		}
		this.splitterOffset = sensitiveWidth/2;
		this.splitter = $(document.createElement("div"));
		this.splitter.className = "splitter"
		this.splitter.style.top = "0px";
		this.splitter.style.left = (this.splitterPosition-this.splitterOffset) + "px";
		this.splitter.style.width = this.sensitiveWidth + "px";
		this.splitter.style.bottom = "0px";
		this.splitter.style.position = "absolute";
		if(Prototype.Browser.IE){
			this.splitter.style.backgroundColor = "white";	// IE Fix - sonst wird nicht der richtige Cursor angezeigt
			this.splitter.style.opacity = ".01"; 
			this.splitter.style.filter = "alpha(opacity='01')";
		}else
			this.splitter.style.backgroundColor = "transparent";
		this.splitter.style.cursor = "col-resize";			
		this.container.removeChild(this.firstDiv);
		this.container.removeChild(this.secondDiv);
		this.container.appendChild(this.firstDiv);
		this.container.appendChild(this.secondDiv);
		this.container.appendChild(this.splitter);

		this.mouseDownActionEventListener = this.mouseDownAction.bindAsEventListener(this);
		this.windowResizedActionEventListener = this.windowResizedAction.bindAsEventListener(this);
		PWUtils.observe(this.splitter, "mousedown", this.mouseDownActionEventListener, true);
		PWUtils.observe(window, "resize", this.windowResizedActionEventListener, true);

		this.updateContent();
	},

	updateContent: function() {
		var splitterLeft = parseInt(this.splitter.style.left);
		var s = this.splitterWidth/2;
		var left = splitterLeft+this.splitterOffset;
		this.firstDiv.style.width = Math.max((left-s), 0)+"px";
		this.secondDiv.style.left = s+left+"px";
	},

	setDelegate: function(delegate) {
		this.delegate = delegate;
	},

	handleDrag: function(event) {
		var newLeft = event.clientX - this.deltaX;
		if(this.collapsible && (newLeft < -this.splitterOffset+(this.minDragWidth/2)))
			newLeft = -this.splitterWidth-1;
		else if(newLeft < -this.splitterOffset+this.minDragWidth)
			newLeft = -this.splitterOffset+this.minDragWidth;
		if(newLeft > this.maxDragWidth+this.splitterOffset+1)
			newLeft = this.maxDragWidth+this.splitterOffset+1;
		this.splitter.style.left = newLeft + "px";
		this.updateContent();
		Event.stop(event);
		if(this.delegate && this.delegate.moveSplitterAction)
			this.delegate.moveSplitterAction(this);
	},

	handleStartDrag: function(event, startX, startY) {
		this.container.style.cursor = "col-resize";
		this.startX	= startX;
		this.origX	= this.splitter.offsetLeft;
		this.deltaX	= this.startX - this.origX;
		this.maxDragWidth = (this.maxWidth ? this.maxWidth : this.container.offsetWidth) - this.sensitiveWidth;
		this.minDragWidth = this.minWidth ? this.minWidth : 0;
		if(this.delegate && this.delegate.willMoveSplitterAction)
			this.delegate.willMoveSplitterAction(this);
		Event.stop(event);
	},

	handleEndDrag: function(event) {
		this.container.style.cursor = "default";
		if(parseInt(this.splitter.style.left) > (this.maxDragWidth - 20 + this.sensitiveWidth + this.splitterOffset + 1)){
			this.splitter.style.left = (this.maxDragWidth+this.splitterOffset+1) + "px";
			this.updateContent();
		}	
		this.ratio = parseInt(this.splitter.style.left) / this.maxDragWidth;
		if(this.delegate && this.delegate.splitterChangedAction)
			this.delegate.splitterChangedAction(this);
		Event.stop(event);
	},

	mouseDownAction: function(event) {
		if(!this.enableInteraction)
			return;
		PWUtils.dispatchMouseDownEvent(event, this, null, this.handleDrag, this.handleStartDrag, this.handleEndDrag);
		Event.stop(event);
	},

	isVisible: function(){
		var node = this.container;
		do{
			if(node.style && node.style.display == "none")
				return false;
		}while(node = node.parentNode);
		return true;
	},

	windowResizedAction: function(event) {
		if(!this.isVisible() || !this.enableInteraction)
			return;	
		if(parseInt(this.splitter.style.left) > 0){
			var maxWidth = (this.maxWidth ? this.maxWidth : this.container.offsetWidth) - this.sensitiveWidth;
			if(!this.ratio)
				this.ratio = parseInt(this.splitter.style.left) / maxWidth;
			this.splitter.style.left = Math.ceil(this.ratio * maxWidth) + "px";			
			this.updateContent();
			if(this.delegate && this.delegate.splitterChangedAction)
				this.delegate.splitterChangedAction(this);
		}
	},
	
	setSplitterPosition: function(pos){
		this.splitterPosition = pos;
		this.splitter.style.left = this.splitterPosition+"px";
		this.updateContent();
	},
	
	setEnableInteraction: function(enable){
		this.enableInteraction = enable;
	},

	isFirstViewVisible: function(){
		return parseInt(this.splitter.style.left) > 0;
	},

	showFirstView: function() {
		this.splitter.style.left = this.lastSplitterLeft ? this.lastSplitterLeft : (this.splitterPosition-this.splitterOffset) + "px";	
		this.updateContent();
		if(this.delegate && this.delegate.splitterChangedAction)
			this.delegate.splitterChangedAction(this);		
	},

	hideFirstView: function() {
		this.lastSplitterLeft = this.splitter.style.left;
		this.splitter.style.left = (-this.splitterWidth-1) + "px";	
		this.updateContent();	
		if(this.delegate && this.delegate.splitterChangedAction)
			this.delegate.splitterChangedAction(this);		
	},
	
	toogleFirstView: function() {
		if(parseInt(this.splitter.style.left) < 0)
			this.showFirstView();
		else
			this.hideFirstView();
	},
	
	position: function() {
 		return parseInt(this.splitter.style.left);
	}

});