// Functions for click and drag <div> elements 

//mouse event callback
document.onmousemove = mouseMove;
document.onmouseup = mouseUp;

//click and drag variables
var dragObject = null;
var mouseOffset = null;

//function for getting the position of the object
function getObjectPosition(object) {
    var left = 0;
    var top = 0;
    while (object.offsetParent) {
        left += object.offsetLeft;
        top += object.offsetTop;
        object = object.offsetParent;
    }
    left += object.offsetLeft;
    top += object.offsetTop;
    return { x: left, y: top };
}

//function for getting mouse position
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 for getting mouse position relative to the object
function getMouseOffset(object, ev) {
    ev = ev || window.event;
    var objPos = getObjectPosition(object);
    var mousePos = mouseCoords(ev);
    return { x: mousePos.x - objPos.x, y: mousePos.y - objPos.y };
}

//function to make object draggable
function makeDraggable(object) {
    if (!object) return;
    object.onmousedown = function(ev) {
        dragObject = this;
        mouseOffset = getMouseOffset(this, ev);
        return false;
    }
}

//function to move dragged object
function mouseMove(ev) {
    ev = ev || window.event;
    var mousePos = mouseCoords(ev);

    if (dragObject) {
        dragObject.style.position = 'absolute';
        dragObject.style.top = (mousePos.y - mouseOffset.y) + 'px';
        dragObject.style.left = (mousePos.x - mouseOffset.x) + 'px';
        mouse_curr_x = mousePos.x;
        mouse_curr_y = mousePos.y;
        return false;
    }
}

// function to release dragged object
function mouseUp() {
    dragObject = null;
}