var w_drag_x=0;
var w_drag_y=0;
var w_drag_x_mouse=0;
var w_drag_y_mouse=0;
var obj_name='';
var obj_moved=0;
var m_zIndex=1;
var new_ids=0;   

function get_position(pos, elemId){
    var elem = document.getElementById(elemId);
    var w = elem.offsetWidth;
    var h = elem.offsetHeight;
    var l = 0;
    var t = 0;
    if(pos=='absolute'){   
        while (elem){             
            l += elem.offsetLeft;
            t += elem.offsetTop;
            elem = elem.offsetParent;
        }
    }else{
        if(navigator.userAgent.indexOf('Gecko') > -1){  
            t=elem.style.top;
            l=elem.style.left;
            t=Number(t.replace("px", ''));
            l=Number(l.replace("px", ''));    
        }else{
            t=Number(elem.style.pixelTop);
            l=Number(elem.style.pixelLeft);
        } 
    }
    
    return {'left':l, 'top':t, 'width': w, 'height':h};
}
   
function setElementPosition(elemId,left,top,width,height){
    var elem = document.getElementById(elemId);
    if(navigator.userAgent.indexOf('Gecko') > -1){
       elem.style.top=top+'px';
       elem.style.left=left+'px';   
       if(width>0) {elem.style.width=width+'px';}
       if(height>0) {elem.style.height=height+'px';}
   }else{
       elem.style.pixelTop=top;
       elem.style.pixelLeft=left;
       if(width>0) {elem.style.pixelWidth=width;}
       if(height>0) {elemelem.style.pixelHeight=height;}
   }
}

function mouse_coord(e){
    var x = 0, y = 0;
    if (!e) {e = window.event;}
    if (e.pageX || e.pageY){
        x = e.pageX;
        y = e.pageY;
    }else if (e.clientX || e.clientY){
        x = e.clientX;
        y = e.clientY;
    }
    return {'x':x, 'y':y};
}

function w_drag_down(ev){
    obj_name='';
    obj_moved=0;
	w_drag_x=0;
	w_drag_y=0;
	w_drag_x=0;
	w_drag_y=0;
	w_drag_x_mouse=0;
	w_drag_y_mouse=0;
    var el=(typeof event!=='undefined') ? event.srcElement : ev.target; 
    var id=el.id;
    var mCur = mouse_coord(ev);  
    obj_moved=1;
    obj_name=id;      
    if(document.getElementById(obj_name).style.position=='absolute'){// absolute 
        var pos=get_position('absolute', id);
        document.getElementById(obj_name).style.position='absolute';
        setElementPosition(obj_name,pos.left,pos.top,0,0);
        w_drag_x_mouse=mCur.x;
        w_drag_y_mouse=mCur.y;
        w_drag_x=pos.left;
        w_drag_y=pos.top;
    }else{// relative
        pos=get_position('relative',id);   
        document.getElementById(obj_name).style.position='relative';
        w_drag_x_mouse=mCur.x;
        w_drag_y_mouse=mCur.y;
        w_drag_x=pos.left;     
        w_drag_y=pos.top;           
    }      
    m_zIndex++;
    document.getElementById(obj_name).style.zIndex=m_zIndex;
    return false;
}

function w_drag_move(ev){
    var el=(typeof event!=='undefined')? event.srcElement : ev.target; 
    var id=el.id; 
    if(id=='') return false;   
    if(obj_moved==1){
        var mCur = mouse_coord(ev);
        if(document.getElementById(id).style.position=='absolute'){// absolute
            var moved_x=w_drag_x-(w_drag_x_mouse-mCur.x);
            var moved_y=w_drag_y-(w_drag_y_mouse-mCur.y);
        }else{// relative
            moved_x=w_drag_x-(w_drag_x_mouse-mCur.x);
            moved_y=w_drag_y-(w_drag_y_mouse-mCur.y); 
        }       
        setElementPosition(obj_name,moved_x,moved_y,0,0);
    }               
}

function w_drag_up(ev){   
    obj_name='';
    obj_moved=0;
	w_drag_x=0;
	w_drag_y=0;
	w_drag_x=0;
	w_drag_y=0;
	w_drag_x_mouse=0;
	w_drag_y_mouse=0;
}


function w_drag_add(id){      
                             
    document.getElementById(id).onmousedown=w_drag_down;
    document.getElementById(id).onmouseup=w_drag_up;
    document.getElementById(id).onmousemove=w_drag_move;
}


document.onmousemove = function(e) {
    e = e || event;
    var obj = e.target || e.srcElement;                  
    if(obj.getAttribute('alt')=='Plastic Element'){
        if(obj.id===''){
            new_ids++;
            obj.id="new_movable_id_"+new_ids; 
        } 
        if(obj.move_move!='yes_yes'){
            w_drag_add(obj.id);                                      
            obj.move_move='yes_yes';
        }                                                      
    }  
    return false;
};

/* 4 htmls */

function visible (elemId1) {
	var elem_02 = document.getElementById(elemId1);
	elem_02.style.visibility = 'visible';
	}

function ScreenWH() {
	
	var wwidth=(window.innerWidth)?window.innerWidth:
		((document.all)?document.body.offsetWidth:null);
	var wheight=(window.innerHeight)?window.innerHeight:
		((document.all)?document.body.offsetHeight:null); 
	
		var a =[1,2];
		a[1] = wwidth;
		a[2] = wheight;
	
		//alert('Function is Work '+ a[1]);
	return a;
	
}