var numberOfZones = 0;
var transparencyWhenDragging = true;
var newLayout;
var saveLayoutURL;
var autoScrollSpeed = 5;
var columnParentBox;
var PortletsObj;

var ajaxObjects = new Array();

var boxIndex = 0;
var autoScrollActive = false;
var PortletsArray = new Array();


var dragObject = false;
var dragObjectNextSibling = false;
var dragObjectParent = false;
var destinationObj = false;
var destinationObjLast = false;
var isMoved = false;
var IEBugFirstBlur = true;
var mouse_x;
var mouse_y;

var el_x;
var el_y;

var rectangleDiv;
var okToMove = true;
var saveWidth = false;
var saveHeight = false;
var saveBackground = false;
var saveBorder;
var savePosition;
var savedValues = false;

var documentHeight = false;
var documentScrollHeight = false;
var dragableAreaWidth = false;

var opera = navigator.userAgent.toLowerCase().indexOf('opera') >= 0 ? true : false;

var staticObjectArray = new Array();



function autoScroll(direction, yPos) {

    if (document.documentElement.scrollHeight > documentScrollHeight && direction > 0) return;
    if (opera) return;
    window.scrollBy(0, direction);
    if (!dragObject) return;

    if (direction < 0) {
        if (document.documentElement.scrollTop > 0) {
            dragObject.style.top = (el_y - mouse_y + yPos + document.documentElement.scrollTop) + 'px';
        } else {
            autoScrollActive = false;
        }
    } else {
        if (yPos > (documentHeight - 50)) {
            dragObject.style.top = (el_y - mouse_y + yPos + document.documentElement.scrollTop) + 'px';
        } else {
            autoScrollActive = false;
        }
    }
    if (autoScrollActive) setTimeout('autoScroll(' + direction + ',' + yPos + ')', 5);
}


function StartDrag(e) {
    var sourceSave;
    var tagName;
    if (document.all) e = event;

    isMoved = false;

    if (e.target) source = e.target;
    else if (e.srcElement) source = e.srcElement;
    if (source.nodeType == 3) //  Safari bug
        source = source.parentNode;

    sourceSave = source;
    dragObject = false;
    var continueSearch = true;

    while (continueSearch == true && dragObject == false && source.parentNode != null) {
        if (source.id > "" && source.id.indexOf("Portlet") == 0 && source.id.indexOf("PortletContent") != 0) {
            dragObject = source;
        } else {

            tagName = source.tagName;

            // no start drag on these tags
            if (tagName == "A" || tagName == "BUTTON" || tagName == "INPUT" || tagName == "TEXTAREA" || tagName == "SELECT" || tagName == "FORM") {
                continueSearch = false;
            } else {
                source = source.parentNode;
            }
        }
    }

    if (dragObject == false) {
        return;
    }

    mouse_x = e.clientX;
    mouse_y = e.clientY;
    var numericId = dragObject.id.replace(/[^0-9]/g, '');
    el_x = getLeftPos(dragObject.parentNode.parentNode) / 1;
    el_y = getTopPos(dragObject.parentNode.parentNode) / 1 - document.documentElement.scrollTop;


    documentScrollHeight = document.documentElement.scrollHeight + 100 + dragObject.offsetHeight;

    dragObjectParent = PortletsArray[numericId]['parentObj'];

    moveDragableElement(e);

    return true;
}


function moveDragableElement(e) {
    if (document.all) e = event;

    if (dragObject == false)
        return;

    if (document.all && e.button != 1 && !opera) {
        stop_dragDropElement();
        return;
    }

    if (!document.all && e.which != 1) {
        stop_dragDropElement();
        return;
    }


    if (document.body != dragObject.parentNode) {


        saveHeight = dragObject.style.height;
        saveWidth = dragObject.style.width;
        saveBackground = dragObject.style.background;
        savePosition = dragObject.style.position;
        saveBorder = dragObject.style.border;
        savedValues = true;

        rectangleDiv.style.width = dragObject.scrollWidth + "px";
        rectangleDiv.style.height = dragObject.scrollHeight + "px";


        dragObject.style.width = dragObject.scrollWidth + "px";
        dragObject.style.height = dragObject.scrollHeight + "px";

        dragObject.style.position = 'absolute';
        //dragObject.style.textAlign = 'left';
        if (transparencyWhenDragging) {
            dragObject.style.filter = 'alpha(opacity=70)';
            dragObject.style.opacity = '0.7';
        }
        dragObject.parentNode.insertBefore(rectangleDiv, dragObject);
        dragObject.style.border = '2px dashed #D3D3D3';
        rectangleDiv.style.display = 'block';
        rectangleDiv.style.border = '3px dashed Yellow';
        document.body.appendChild(dragObject);


        isMoved = true;


    }

    if (e.clientY < 50 || e.clientY > (documentHeight - 50)) {
        if (e.clientY < 50 && !autoScrollActive) {
            autoScrollActive = true;
            autoScroll((autoScrollSpeed * -1), e.clientY);
        }

        if (e.clientY > (documentHeight - 50) && document.documentElement.scrollHeight <= documentScrollHeight && !autoScrollActive) {
            autoScrollActive = true;
            autoScroll(autoScrollSpeed, e.clientY);
        }
    } else {
        autoScrollActive = false;
    }


    var leftPos = e.clientX;
    var topPos = e.clientY + document.documentElement.scrollTop;


    dragObject.style.left = leftPos + "px";
    dragObject.style.top = topPos + "px";

    //if(!okToMove)return;
    okToMove = false;

    destinationObj = false;
    rectangleDiv.style.display = 'none';

    var objFound = false;
    var tmpParentArray = new Array();

    if (!objFound) {
        for (var no = 1; no < PortletsArray.length; no++) {
            if (PortletsArray[no]['obj'] == dragObject) continue;
            tmpParentArray[PortletsArray[no]['obj'].parentNode.id] = true;
            if (!objFound) {
                var tmpX = getLeftPos(PortletsArray[no]['obj']);
                var tmpY = getTopPos(PortletsArray[no]['obj']);

                if (leftPos > tmpX && leftPos < (tmpX + PortletsArray[no]['obj'].offsetWidth) && topPos > (tmpY - 20) && topPos < (tmpY + (PortletsArray[no]['obj'].offsetHeight / 2))) {
                    destinationObj = PortletsArray[no]['obj'];
                    destinationObj.parentNode.insertBefore(rectangleDiv, PortletsArray[no]['obj']);
                    rectangleDiv.style.display = 'block';
                    objFound = true;
                    break;

                }

                if (leftPos > tmpX && leftPos < (tmpX + PortletsArray[no]['obj'].offsetWidth) && topPos >= (tmpY + (PortletsArray[no]['obj'].offsetHeight / 2)) && topPos < (tmpY + PortletsArray[no]['obj'].offsetHeight)) {
                    objFound = true;
                    if (PortletsArray[no]['obj'].nextSibling) {

                        destinationObj = PortletsArray[no]['obj'].nextSibling;
                        if (!destinationObj.tagName) destinationObj = destinationObj.nextSibling;
                        if (destinationObj != rectangleDiv) destinationObj.parentNode.insertBefore(rectangleDiv, destinationObj);
                    } else {
                        destinationObj = PortletsArray[no]['obj'].parentNode;
                        PortletsArray[no]['obj'].parentNode.appendChild(rectangleDiv);
                    }
                    rectangleDiv.style.display = 'block';
                    break;
                }


                if (!PortletsArray[no]['obj'].nextSibling && leftPos > tmpX && leftPos < (tmpX + PortletsArray[no]['obj'].offsetWidth)
					&& topPos > topPos > (tmpY + (PortletsArray[no]['obj'].offsetHeight))) {
                    destinationObj = PortletsArray[no]['obj'].parentNode;
                    PortletsArray[no]['obj'].parentNode.appendChild(rectangleDiv);
                    rectangleDiv.style.display = 'block';
                    objFound = true;

                }
            }

        }

    }

    if (!objFound) {

        for (var no = numberOfZones; no > 0; no--) {
            if (!objFound) {
                var obj = document.getElementById('Zone' + no);

                var left = getLeftPos(obj) / 1;
                var top = getTopPos(obj) / 1;
                var width = obj.offsetWidth;

                if (topPos > top && leftPos > left && leftPos < (left + width)) {
                    destinationObj = obj;

                    if (obj.lastChild.lastChild.tagName == 'HR') {
                        //							         if(obj.lastChild.lastChild.style.width == "")
                        //							                obj.lastChild.lastChild.style.width = obj.scrollWidth + "px";
                        obj.insertBefore(rectangleDiv, obj.lastChild);
                    } else {
                        obj.appendChild(rectangleDiv);
                    }

                    rectangleDiv.style.display = 'block';
                    objFound = true;

                }

            }
        }

    }

    if (!objFound) {
        rectangleDiv.style.display = 'block';
    } else {
        destinationObjLast = destinationObj;
    }


}

function stop_dragDropElement(e) {

    if (document.all) {
        e = event;
        if (e.type == "blur" && dragObject != false && IEBugFirstBlur == true) {
            IEBugFirstBlur = false; //IE bug: first blur is invalid; ignore
            return;
        }
            
    }
    if (dragObject == false)
        return;

    if (isMoved == false) {
        dragObject = false;
        return;
    }

    isMoved = false;

    if (transparencyWhenDragging) {
        dragObject.style.filter = null;
        dragObject.style.opacity = null;
    }


    dragObject.style.position = 'static';

    if (savedValues == true) {
        dragObject.style.width = saveWidth;
        dragObject.style.height = saveHeight;
        dragObject.style.border = saveBorder;
    }

    destinationObj = destinationObjLast;

    var numericId = dragObject.id.replace(/[^0-9]/g, '');
    if (destinationObj && destinationObj.id != dragObject.id) {

        if (destinationObj.id > "" && destinationObj.id.indexOf('Zone') >= 0) {


            if (destinationObj.lastChild.lastChild.tagName == 'HR') {
                destinationObj.insertBefore(dragObject, destinationObj.lastChild);
            } else {
                destinationObj.appendChild(dragObject);
            }

            PortletsArray[numericId]['parentObj'] = destinationObj;
        } else {
            destinationObj.parentNode.insertBefore(dragObject, destinationObj);
            PortletsArray[numericId]['parentObj'] = destinationObj.parentNode;
        }
    } else {
        if (dragObjectNextSibling) {
            dragObjectParent.insertBefore(dragObject, dragObjectNextSibling);
        } else {
            dragObjectParent.appendChild(dragObject);
        }


    }


    autoScrollActive = false;
    rectangleDiv.style.display = 'none';
    dragObject = false;
    dragObjectNextSibling = false;
    destinationObj = false;

    setTimeout('saveLayout()', 100);

    documentHeight = document.documentElement.clientHeight;
}

function saveLayoutFinished() {
    var statusDiv = document.getElementById("SaveLayoutStatus");
    statusDiv.style.display = "none";
}

function saveLayout() {
    newlayout = "";
    var position = 0;

    var bDim = getBrowserDimensions();
    var statusDiv = document.getElementById("SaveLayoutStatus");
    statusDiv.style.top = (10 + document.documentElement.scrollTop) + "px";
    statusDiv.style.left = (bDim.width - 200) / 2 + "px";


    statusDiv.style.position = "absolute";
    statusDiv.style.display = "block";



    for (var no = 1; no <= numberOfZones; no++) {
        var parentObj = document.getElementById('Zone' + no);

        var items = parentObj.getElementsByTagName('DIV');
        if (items.length == 0) continue;

        var item = items[0];

        var tmpItemArray = new Array();
        position = 0;
        while (item) {
            if (item.id > "" && item.id.indexOf("Portlet") == 0) {
                var boxIndex = item.id.replace(/[^0-9]/g, '');
                var PageItemId = document.getElementById('Portlet' + boxIndex).attributes["PageItemId"].nodeValue;
                position++;
                newlayout += no + "," + position + "," + PageItemId + ";";
            }
            item = item.nextSibling;
        }

        var columnIndex = no;

    }

    http('POST', saveLayoutURL, saveLayoutFinished, "layout=" + newlayout);
}

function getBrowserDimensions() {
    var intH = 0;
    var intW = 0;

    if (typeof window.innerWidth == 'number') {
        intH = window.innerHeight;
        intW = window.innerWidth;
    }
    else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
        intH = document.documentElement.clientHeight;
        intW = document.documentElement.clientWidth;
    }
    else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        intH = document.body.clientHeight;
        intW = document.body.clientWidth;
    }

    return { width: parseInt(intW), height: parseInt(intH) };
}


function getTopPos(inputObj) {
    var returnValue = inputObj.offsetTop;
    while ((inputObj = inputObj.offsetParent) != null) {
        if (inputObj.tagName != 'HTML') returnValue += inputObj.offsetTop;
    }
    return returnValue;
}

function getLeftPos(inputObj) {
    var returnValue = inputObj.offsetLeft;
    while ((inputObj = inputObj.offsetParent) != null) {
        if (inputObj.tagName != 'HTML') returnValue += inputObj.offsetLeft;
    }
    return returnValue;
}


function createZones(newZones) {
    numberOfZones = newZones;
    for (var no = 0; no < numberOfZones; no++) {
        var div = document.getElementById('Zone' + (no + 1));
        //			div.style.cssText = div.style.cssText + ';float:left;padding:0px;margin:0px;';
        //			div.style.height='100%';
        //			div.style.styleFloat='left';			
        //			div.style.padding = '0px';
        //			div.style.margin = '0px';	
        //          div.style.layout = 'inline';

        var endDiv = document.createElement('DIV');

        var placeHolderObj = document.createElement('HR');
        placeHolderObj.style.clear = 'both';
        //placeHolderObj.style.width = div.scrollWidth + "px";		
        placeHolderObj.style.visibility = 'hidden';
        endDiv.appendChild(placeHolderObj);
        div.style.width = "100%"
        div.appendChild(endDiv);

    }

}



function initPortlets(numberOfPortlets) {
    var i;
    for (i = 1; i <= numberOfPortlets; i++) {
        addPortlet("Portlet" + i);
    }
}


function addPortlet(uniqueIdentifier, heightOfBox) {
    boxIndex++;

    var maindiv = document.getElementById(uniqueIdentifier);

    maindiv.onmousedown = StartDrag;
    maindiv.style.cursor = 'move';

    PortletsArray[boxIndex] = new Array();
    PortletsArray[boxIndex]['obj'] = maindiv;
    PortletsArray[boxIndex]['parentObj'] = maindiv.parentNode;
    PortletsArray[boxIndex]['uniqueIdentifier'] = uniqueIdentifier;
    PortletsArray[boxIndex]['heightOfBox'] = heightOfBox;
    PortletsArray[boxIndex]['boxState'] = 1; // Expanded

    staticObjectArray[uniqueIdentifier] = boxIndex;

    return boxIndex;

}




function createHelpObjects() {
    /* Creating rectangle div */
    rectangleDiv = document.createElement('DIV');
    rectangleDiv.id = 'rectangleDiv';
    rectangleDiv.style.display = 'none';
    document.body.appendChild(rectangleDiv);
}

function cancelSelectionEvent(e) {
    if (document.all) e = event;

    if (e.target) source = e.target;
    else if (e.srcElement) source = e.srcElement;
    if (source.nodeType == 3) // defeat Safari bug
        source = source.parentNode;
    if (source.tagName.toLowerCase() == 'input') return true;

    return false;

}

function cancelEvent() {
    return false;
}

function initEvents() {
    document.body.onmousemove = moveDragableElement;
    document.body.onmouseup = stop_dragDropElement;
    document.body.onselectstart = cancelSelectionEvent;
    document.body.ondragstart = cancelEvent;
    window.onblur = stop_dragDropElement;
    
    documentHeight = document.documentElement.clientHeight;

}






function initPortal(zones) {
    createZones(zones); // Always the first line of this function
    createHelpObjects(); // Always the second line of this function
    initEvents(); // Always the third line of this function



}