﻿/****************************************
** Helper functions ** BEGIN ***
*****************************************/
function add_event(oObject, eEvent, eFunction){
	if (oObject.attachEvent){
		oObject.attachEvent('on'+eEvent, eFunction);
	}
	else{
		oObject.addEventListener(eEvent, eFunction, false);
	}	
}
/****************************************
** Helper functions ** END ***
*****************************************/

/****************************************
** Floating Panel ** BEGIN ***
*****************************************/
var imageDir = 'images/IM_framework/';

var showFloatingPanel_panel_ids = [];

function showFloatingPanel(panel_id, panel_title, width, heigth, panel_type){
	var oPanel;
	var found = 0;
	for(var i in showFloatingPanel_panel_ids){
		if(showFloatingPanel_panel_ids[i] == panel_id){
			var oPanel = document.getElementById(panel_id);
			found = 1;
			break;
		}
	}
	
	if(found == 1){
		// just show pannel
		oPanel.style.display = 'block';
		return oPanel;
	}
	else{
		// create new pannel
		oPanel = createFloatingPanel(panel_id, panel_title);
		showFloatingPanel_panel_ids[showFloatingPanel_panel_ids.length] = panel_id;
		oPanel.style.width = width+'px';
		oPanel.style.height = heigth+'px';
		return oPanel;
	}
}

function createFloatingPanel(panel_id, title_text){
	var oBody = document.getElementsByTagName('body');
	var oPanel = document.createElement('div');
	oBody[0].appendChild(oPanel);
	oPanel.id = panel_id;
	oPanel.className = 'im_FloatingPanel';
	oPanel.style.width = '100px';
	oPanel.style.height = '100px';
	oPanel.style.top = '100px';
	oPanel.style.left = '100px';
	// title
	var oH1 = document.createElement('h1');
	oH1.appendChild(document.createTextNode(title_text));
	oH1.setAttribute('my_parent', panel_id);
	add_event(oH1, 'mousedown', start_move);
	oPanel.appendChild(oH1);
	// resize corner
	var oA = document.createElement('a');
	oA.className = 'im_Resize';
	oA.setAttribute('my_parent', panel_id);
	add_event(oA, 'mousedown', start_resize);
	oPanel.appendChild(oA);
	
	return oPanel;
}
/****************************************
** Floating Panel ** END **
*****************************************/



/**********************************************
** Resize/Move functionality ** BEGIN ***
***********************************************/
function resizeMoveMeObject() {
	this.me = null;
	this.mouse_x = 0;
	this.mouse_y = 0;
}
var theResizeMoveMeObject = null;

function mouseCoords(ev){
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	return {
		x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY + document.body.scrollTop  - document.body.clientTop
	};
}

function resize_in_action(e){
	if (!e) var e = window.event;
	var mousePos = mouseCoords(e);
	if(theResizeMoveMeObject == null) return;
	var me = theResizeMoveMeObject.me;
	var oParent = document.getElementById(me.getAttribute('my_parent'));
	var deltaX = mousePos['x'] - theResizeMoveMeObject.mouse_x;
	var deltaY = mousePos['y'] - theResizeMoveMeObject.mouse_y;
	var parentWidth;
	var parentHeight;
	if(oParent.style.width) { parentWidth = parseInt(oParent.style.width); }
	else { parentWidth = parseInt(oParent.offsetWidth); }
	if(oParent.style.height) { parentHeight = parseInt(oParent.style.height); }
	else { parentHeight = parseInt(oParent.offsetHeight); }
	var newWidth = parentWidth + deltaX;
	var newHeight = parentHeight + deltaY;
	document.getElementById('test_input').value = newWidth + ' x '+ newHeight; // DEBUG
	if(newWidth > 100) oParent.style.width = newWidth+'px';
	if(newHeight > 20) oParent.style.height = newHeight+'px';
	theResizeMoveMeObject.mouse_x = mousePos['x'];
	theResizeMoveMeObject.mouse_y = mousePos['y'];
}

function move_in_action(e){
	if (!e) var e = window.event;
	var mousePos = mouseCoords(e);
	if(theResizeMoveMeObject == null) return;
	var me = theResizeMoveMeObject.me;
	var oParent = document.getElementById(me.getAttribute('my_parent'));
	var deltaX = mousePos['x'] - theResizeMoveMeObject.mouse_x;
	var deltaY = mousePos['y'] - theResizeMoveMeObject.mouse_y;
	var parentPosX;
	var parentPosY;
	
	if(oParent.style.left) { parentPosX = parseInt(oParent.style.left); }
	else { parentPosX = parseInt(oParent.offsetWidth); }
	
	if(oParent.style.top) { parentPosY = parseInt(oParent.style.top); }
	else { parentPosY = parseInt(oParent.offsetHeight); }
	
	var newPosX = parentPosX + deltaX;
	var newPosY = parentPosY + deltaY;
	document.getElementById('test_input').value = newPosX + ' x '+ newPosY; // DEBUG
	if(newPosX > 0) oParent.style.left = newPosX+'px';
	if(newPosY > 0) oParent.style.top = newPosY+'px';
	theResizeMoveMeObject.mouse_x = mousePos['x'];
	theResizeMoveMeObject.mouse_y = mousePos['y'];
	
}

function start_resize(e){
	if (!e) var e = window.event;
	var mousePos = mouseCoords(e); 
	theResizeMoveMeObject = new resizeMoveMeObject();
	if(e.srcElement != undefined){
		theResizeMoveMeObject.me = e.srcElement;
	}
	else{
		theResizeMoveMeObject.me = this;
	}
	theResizeMoveMeObject.mouse_x = mousePos['x'];
	theResizeMoveMeObject.mouse_y = mousePos['y'];
	// attach new mousemove event
	document.onmousemove = resize_in_action;
}

function start_move(e){
	if(!e) var e = window.event;
	var mousePos = mouseCoords(e);
	theResizeMoveMeObject = new resizeMoveMeObject();
	if(e.srcElement != undefined){
		theResizeMoveMeObject.me = e.srcElement;
	}
	else{
		theResizeMoveMeObject.me = this;
	}
	theResizeMoveMeObject.mouse_x = mousePos['x'];
	theResizeMoveMeObject.mouse_y = mousePos['y'];	
	// attach new mousemove event
	document.onmousemove = move_in_action;
}

function end_resize_move(e){
	if (!e) var e = window.event;
	document.onmousemove = null;
	theResizeMoveMeObject = null;
}

function init_resize_move(){
	if (document.attachEvent){
		document.attachEvent("onmouseup", end_resize_move);
	}
	else{
		document.addEventListener("mouseup", end_resize_move, false);
	}
}

if (window.attachEvent){
	window.attachEvent("onload", init_resize_move);
}
else{
	window.addEventListener("load", init_resize_move, false);
}
/**********************************************
** Resize/Move functionality ** END ***
***********************************************/




