3 files changed, 42 insertions, 27 deletions

diff --git a/frontends/php/js/common.js b/frontends/php/js/common.js
index 22580d4d..a8c8175b 100644
--- a/frontends/php/js/common.js
+++ b/frontends/php/js/common.js
@@ -84,7 +84,7 @@ function SDI(msg){
 		doc_body.appendChild(div_help);
 		
 		div_help.setAttribute('id','div_help');
-		div_help.setAttribute('style','position: absolute; left: 10px; top: 10px; border: 1px red solid; width: 800px; height: 400px; background-color: white; overflow: auto;');
+		div_help.setAttribute('style','position: absolute; left: 10px; top: 10px; border: 1px red solid; width: 800px; height: 400px; background-color: white; overflow: auto; z-index: 20;');
 	}
 	
 	div_help.appendChild(document.createTextNode("DEBUG INFO: "));
diff --git a/frontends/php/js/sbinit.js b/frontends/php/js/sbinit.js
index 348316c4..951cfafc 100644
--- a/frontends/php/js/sbinit.js
+++ b/frontends/php/js/sbinit.js
@@ -130,14 +130,13 @@ function graph_zoom_init(graph_id,stime,period,width,height){
 	A_SBOX[graph_id].sbox = sbox_init(stime,period);
 	A_SBOX[graph_id].sbox.sbox_id = graph_id;
 	
-	var igraph = $(graph_id);
-	var posxy = getPosition(igraph);
-	
+	var igraph = $(graph_id);	
 	var boxongraph = create_box_on_obj(igraph.parentNode);
 	
-	boxongraph.style.top = (posxy.top+A_SBOX[graph_id].shiftT)+'px';
-	boxongraph.style.left = (posxy.left+A_SBOX[graph_id].shiftL-1)+'px';
+	A_SBOX[graph_id].sbox.dom_obj = boxongraph;
 	
+	A_SBOX[graph_id].sbox.moveSBoxByObj(igraph);
+
 	width = width || 900;
 	height = height || 200;
 	
@@ -149,32 +148,24 @@ function graph_zoom_init(graph_id,stime,period,width,height){
 
 	boxongraph.style.height = A_SBOX[graph_id].sbox.obj.height+'px';
 	boxongraph.style.width = A_SBOX[graph_id].sbox.obj.width+'px';
-	
-	posxy = getPosition(boxongraph);	
-	
-	A_SBOX[graph_id].sbox.obj.left = parseInt(posxy.left);
-	A_SBOX[graph_id].sbox.obj.top = parseInt(posxy.top); 
-	
-	A_SBOX[graph_id].sbox.dom_obj = boxongraph;
 
+// Listeners
+	addListener(window,'resize',A_SBOX[graph_id].sbox.moveSBoxByObj.bindAsEventListener(A_SBOX[graph_id].sbox,igraph));
+	
 	if(IE){
-//		boxongraph.attachEvent('onmousedown',A_SBOX[graph_id].sbox.mousedown.bindAsEventListener(A_SBOX[graph_id].sbox));
 		igraph.attachEvent('onmousedown',A_SBOX[graph_id].sbox.mousedown.bindAsEventListener(A_SBOX[graph_id].sbox));
-//		boxongraph.attachEvent('onmousemove',A_SBOX[graph_id].sbox.mousemove.bindAsEventListener(A_SBOX[graph_id].sbox));
 		igraph.onmousemove = A_SBOX[graph_id].sbox.mousemove.bind(A_SBOX[graph_id].sbox);
-		document.attachEvent('onmouseup',A_SBOX[graph_id].sbox.mouseup.bindAsEventListener(A_SBOX[graph_id].sbox));
 	}
 	else if(OP){
 		boxongraph.addEventListener('mousedown',A_SBOX[graph_id].sbox.mousedown.bindAsEventListener(A_SBOX[graph_id].sbox),false);
 		boxongraph.onmousemove = A_SBOX[graph_id].sbox.mousemove.bind(A_SBOX[graph_id].sbox);
-		document.addEventListener('mouseup',A_SBOX[graph_id].sbox.mouseup.bindAsEventListener(A_SBOX[graph_id].sbox),true);
 	}
 	else{
-		boxongraph.addEventListener('mousedown',A_SBOX[graph_id].sbox.mousedown.bindAsEventListener(A_SBOX[graph_id].sbox),false);
-		boxongraph.onmousemove = A_SBOX[graph_id].sbox.mousemove.bind(A_SBOX[graph_id].sbox);
-		document.addEventListener('mouseup',A_SBOX[graph_id].sbox.mouseup.bindAsEventListener(A_SBOX[graph_id].sbox),true);
+		boxongraph.addEventListener('mousedown',A_SBOX[graph_id].sbox.mousedown.bindAsEventListener(A_SBOX[graph_id].sbox),false);		
+		boxongraph.addEventListener('mousemove',A_SBOX[graph_id].sbox.mousemove.bindAsEventListener(A_SBOX[graph_id].sbox),false);	
 	}
-
+	
+	addListener(document,'mouseup',A_SBOX[graph_id].sbox.mouseup.bindAsEventListener(A_SBOX[graph_id].sbox),true);
 	
 	A_SBOX[graph_id].sbox.sboxload = sboxload;
 }
diff --git a/frontends/php/js/sbox.js b/frontends/php/js/sbox.js
index 48094df6..8280ccea 100644
--- a/frontends/php/js/sbox.js
+++ b/frontends/php/js/sbox.js
@@ -96,6 +96,12 @@ mousedown: function(e){
 		this.optimize_event(e);
 
 		this.deselectall();
+		
+		if(IE){
+			var posxy = getPosition(this.dom_obj);
+			if((this.mouse_event.left < posxy.left) || (this.mouse_event.left > (posxy.left+this.dom_obj.offsetWidth))) return false;
+		}
+		
 		this.create_box();
 		this.mouse_event.mousedown = true;
 	}
@@ -154,11 +160,10 @@ create_box: function(){
 		this.box.height = height;
 	
 		if(IE){
-//			this.dom_box.attachEvent('onmousemove',S_BOX.mousemove.bindAsEventListener(S_BOX));
-			this.dom_box.onmousemove = A_SBOX[this.sbox_id].sbox.mousemove.bind(A_SBOX[this.sbox_id].sbox);
+			this.dom_box.onmousemove = this.mousemove.bind(this);
 		}
 		else{
-			this.dom_box.addEventListener('mousemove',A_SBOX[this.sbox_id].sbox.mousemove.bindAsEventListener(A_SBOX[this.sbox_id].sbox),true);
+			this.dom_box.addEventListener('mousemove',this.mousemove.bindAsEventListener(this),true);
 		}
 	
 		this.start_event.top = this.mouse_event.top;
@@ -238,6 +243,25 @@ validateH: function(h){
 return h;
 },
 
+moveSBoxByObj: function(){	
+
+	if(arguments.length < 1) return false;
+
+	var p_obj = arguments[arguments.length-1];
+	if('undefined' == typeof(p_obj.nodeName)) return false;
+
+	var posxy = getPosition(p_obj);
+	this.dom_obj.style.top = (posxy.top+A_SBOX[this.sbox_id].shiftT)+'px';
+	this.dom_obj.style.left = (posxy.left+A_SBOX[this.sbox_id].shiftL-1)+'px';	
+
+	posxy = getPosition(this.dom_obj);
+
+	this.obj.top = parseInt(posxy.top); 
+	this.obj.left = parseInt(posxy.left);
+},
+
+
+
 optimize_event: function(e){
 	if (e.pageX || e.pageY) {
 		this.mouse_event.left = e.pageX;
@@ -274,13 +298,13 @@ clear_params: function(){
 }
 
 function create_box_on_obj(obj_ref){
-	if((typeof(obj_ref) == 'undefined')) throw('Reference Object is not defined');
+	if((typeof(obj_ref) == 'undefined')) throw('Reference Object sent to SBOX is not defined');
 	
 	var div = document.createElement('div');
 	obj_ref.appendChild(div);
 	
-	div = $(div);
-	div.addClassName('box_on');
+	div = (div);
+	div.className = 'box_on';
 	
 return div;
 }
\ No newline at end of file