Move tables

JavaScript

//alert("123");
width = 640;
height = 480;
paper = Raphael(0,0, width, height);
//paper.rect(0,0, 100, 100);


		function shape(x, y, width, height, a)
		   {
		    var that = this;
		    that.rect = paper.rect(x, y, width, height).attr(a);
		    that.rect.angle = 0;
		    that.rect.left = x;
		    that.rect.right = x + width;
		    that.rect.up = y;
		    that.rect.down = y + height;
		    that.rect.dx = 0;
		    that.rect.dy = 0;

		    that.rect.dblclick(function() {
		        var angle = 90;
		        if(that.rect.angle == 0){
		            that.rect.angle = -90;
		            angle = -90;
		        }    
		        else that.rect.angle = 0;
		        var w2 = (that.rect.left + that.rect.right)/2,
		        h2 = (that.rect.up + that.rect.down)/2,
		        w1 = (that.rect.right - that.rect.left)/2,
		        h1 = (that.rect.down - that.rect.up)/2;
		        that.rect.left  = w2 - h1;
		        that.rect.right = w2 + h1;
		        that.rect.up    = h2 - w1; 
		        that.rect.down  = h2 + w1;
		        		        
		        that.rect.stop().animate({
		            transform: "...R" + angle
		        }, 1000, "<>");
		    });
		    return that;
		}
		
		var ox = 0;
		var oy = 0;
		var angle = 0;
		width -= 4;
		height -= 4;
		paper.rect(0,0, width, height);
	   
	    shape1 = new shape(100, 100, 300, 50,{
	        fill: "red",
	        stroke: "none"
	    });

		shape2 = new shape(200, 200, 200, 50,{
		        fill: "green",
		        stroke: "none"
		    });
		shape3 = new shape(300, 300, 100, 100,{
		        fill: "blue",
		        stroke: "none"
		    });
		shape4 = new shape(400, 400, 100, 50,{
		        fill: "black",
		        stroke: "none"
		    });
		allShapes = [shape1.rect,shape2.rect,shape3.rect,shape4.rect];
		var text = paper.text(300,10,"left:"+allShapes[1].left+"; right:"+allShapes[1].right+"; up:"+allShapes[1].up+"; down:"+allShapes[1].down);    

		var start = function() {
			ox = 0;
		    oy = 0;
		},
		move = function(dx, dy) {
		    var...