/*
	My drageable time shit
*/
Draggables = {
	observers: new Array(),
  addObserver: function(observer) {
    this.observers.push(observer);    
  },
  removeObserver: function(element) {  // element instead of obsever fixes mem leaks
    for(var i = 0; i < this.observers.length; i++)
      if(this.observers[i].element && (this.observers[i].element == element))
        this.observers.splice(i,1);
  },
  notify: function(eventName, draggable) {  // 'onStart', 'onEnd'
    for(var i = 0; i < this.observers.length; i++)
      this.observers[i][eventName](draggable);
  }
}


function DraggableTime(elementId) {
    this.element = document.getElementById(elementId);
    this.init();
}

DraggableTime.prototype = {
	init: function() {
		this.dragging = false;
		
		this.originalLeft = this.element.offsetLeft;
		this.originalTop = this.element.offsetTop;
		
		//this.element.style.position = "absolute";
		
		// reg events
		this.handleMouseDown = new EventHandler(this.element, 'mousedown', 'startDrag', this);
		this.handleMouseMove = new EventHandler(this.element, 'mousemove', 'move', this);
		
		EventManager.add(this.handleMouseDown);
		
		// register the resizing handles
		this.handleR = this.element.childNodes[1];
		this.handleL = this.element.childNodes[0];

		this.handleResizeRightMouseDown = new EventHandler(this.handleR, 'mousedown', 'startResizeRight', this);
		this.handleResizeLeftMouseDown = new EventHandler(this.handleL, 'mousedown', 'startResizeLeft', this);
		
		this.handleResizeMoveDoc = new EventHandler(document, 'mousemove', 'moveResize', this);

		// common for all
		this.handleMouseUpDoc = new EventHandler(document, 'mouseup', 'endDragResize', this);
		
		EventManager.add(this.handleResizeRightMouseDown);
		EventManager.add(this.handleResizeLeftMouseDown);
	},

	currentWidth: function() {
		return parseInt(this.element.style.width || '0');
	},
	currentLeft: function() {
		return parseInt(this.element.style.left || '0');
	},
	currentTop: function() {
		return parseInt(this.element.style.top || '0')
	},
  
	startDrag: function(event) {
		this.dragging = true;
		
		this.changingRows = false;
		//document.body.style.cursor = "move";
		
		this.diffX = event.clientX - _findPosX(this.element);
		this.diffY = event.clientY - _findPosY(this.element);
		
		//if (this.diffX <= 3)
		//	this.startResizeLeft(event);
		//else
		//{
			EventManager.add(this.handleMouseUpDoc);
			EventManager.add(this.handleMouseMove);
		//}
	},
	
	update: function(event) {
		var style = this.element.style;
		
		style.left = (event.clientX - this.diffX) - ( _findPosX(this.element) - this.currentLeft() ) + "px";
		style.top  = (event.clientY - this.diffY) - ( _findPosY(this.element) - this.currentTop() ) + "px";
	},
	
	move: function(event) {
		if (this.dragging) {
			this.update(event);
		}
	},
	
	endDragResize: function(event) {
		var X_SIZE = 7;
		var Y_SIZE = 5;

		if (this.dragging)
		{
			this.dragging = false;
			
			EventManager.remove(this.handleMouseMove);
			EventManager.remove(this.handleMouseUpDoc);
			
			// snap to grid
			var diff = this.currentLeft() % X_SIZE;
			if (diff <= 3)
				this.element.style.left = this.currentLeft() - diff - 1 + "px";
			else
				this.element.style.left = this.currentLeft() + (7 - diff) - 1 + "px";
		}
		else if (this.resizingRight || this.resizingLeft)
		{
			EventManager.remove(this.handleResizeMoveDoc);
			EventManager.remove(this.handleMouseUpDoc);
			
			// snap to grid
			if (this.resizingRight)
			{
				var w = event.clientX - _findPosX(this.element) - 1;
							
				if (w < 8)
					w = 8;
				
				var diff = w % X_SIZE;
			
				if (diff <= 3)
					w = (w - diff) + 1;
				else
					w = (w + (7 - diff)) + 1;
				
				this.element.style.width = w + "px";
			}

			this.resizingRight = false;
			this.resizingLeft = false;
		}

		document.body.style.cursor = "default";
	},
	
	// resize methods
	startResizeRight: function(event) {
		this.resizingRight = true;
		document.body.style.cursor = "e-resize";
		
		event.cancelBubble = true;
		if (event.stopPropagation) event.stopPropagation();
		
		EventManager.add(this.handleResizeMoveDoc);
		EventManager.add(this.handleMouseUpDoc);
	},
	
	startResizeLeft: function(event) {
		this.resizingLeft = true;
		
		event.cancelBubble = true;
		if (event.stopPropagation) event.stopPropagation();
		
		EventManager.add(this.handleResizeMoveDoc);
		EventManager.add(this.handleMouseUpDoc);
		
		this.diffX = event.clientX - _findPosX(this.element);
		this.diffY = event.clientY - _findPosY(this.element);
	},
	
	moveResize: function(event) {
		var style = this.element.style;
		
		if (this.resizingRight)
		{
			var w = event.clientX - _findPosX(this.element);
			
			if (w < 8)
				w = 8;
			
			style.width = w + "px";
		}
		else if (this.resizingLeft)
		{
			var newPos = (event.clientX - this.diffX) - ( _findPosX(this.element) - this.currentLeft() );
			var w = (this.currentLeft() - newPos) + this.currentWidth();
			if (w < 8)
				w = 8;
			else
			{
				style.left =  newPos + "px";
				style.width = w + "px";
			}

		}
	}
};