///////////////////////////////////////////////////////////////////
// Generic Drag Script- © Dynamic Drive (www.dynamicdrive.com)
// For full source code and terms of usage,
// visit http://www.dynamicdrive.com
//
// Converted (almost completely) by Toby Mansell
// This script allows drag and drop as well as multiple inserts
// which are currently implemented on the export basket page.
///////////////////////////////////////////////////////////////////
var ie=document.all
var ns6=document.getElementById && !document.all

var dragapproved=false
var moved=false
var dragTag
var startX
var startY

var eventY=0
var movedY=0
var scrollY=0
var scrollPos=0
var scrollOn=false
var targetTag=null
var scrollSpeed=5
var scrollDelay=1

var prevY=0
var state=0
var direction='nowhere'
var rowHeight=44

// store available drag options
var option_descriptions = new Array(0);
var option_values       = new Array(0);

// determine how many pixels of the page have scrolled off the top of the screen.
// adapted from the example at http://www.quirksmode.org/viewport/compatibility.html
function getScrollTop()
{
    if (self.pageYOffset)
    {
        // all browsers except Explorer
	return self.pageYOffset;
    }
    else if (document.documentElement && document.documentElement.scrollTop)
    {
	// Explorer 6 Strict
	return document.documentElement.scrollTop;
    }
    else if (document.body)
    {
        // all other Explorers
	return document.body.scrollTop;
    }
}

//
// find parent starting at obj, with specified classname and tagname
//
function findParent(obj, classname, tagname)
{
    // This allows you to drag elements contained within a drag tag
    while (obj.tagName!="DIV" && obj.className!="drag")
    {
        obj = ns6? obj.parentNode : obj.parentElement
    }
    return obj;
}


function moveSelectedOptions()
{    
    var container = document.getElementById("drop_zone");
    
    var num_options = option_descriptions.length;
        
    // only draw those options that arnt selected
    
    var dropContainerDiv = document.getElementById('drop_zone_div');
    var startContainer = document.getElementById('start_zone');
    setMaxContainerHeight(startContainer, dropContainerDiv);
    
    
    var grouping_field = 0;

    for (var i=0; i < num_options;i++)
    {
        var grouping_tag   = document.getElementById("grouping_" + i);
        
        if (grouping_tag)
        {   
            if (grouping_tag.value != 0 && grouping_tag.value != "-")
            {
                var drag_parent = document.getElementById("parent_drag_" + grouping_tag.value);
                var drag_tag = document.getElementById("drag_" + grouping_tag.value);
                
                var removed     = drag_parent.removeChild(drag_tag);                
                
                if (removed)
                {                      
                    var added = dropContainerDiv.appendChild(removed);
                    var inner_tag = document.getElementById(added.id + "_options");
                    
                    // get top, total and combine saved hidden tags
                    
                    var top      = document.getElementById("grouping_" + i + "_top").value;
                    var total    = document.getElementById("grouping_" + i + "_total").value == "yes";
                    var combine  = document.getElementById("grouping_" + i + "_combine").value;

                    // get top, total and combine tags
                    
                    var top_tag       = document.getElementById("planit_top_" + grouping_tag.value);
                    var total_tag     = document.getElementById("planit_total_" + grouping_tag.value);
                    var combine_tag   = document.getElementById("planit_combine_" + grouping_tag.value);

                    // now set top, total and combine values
                    
                    setTopField(top_tag, top);
                    setCheckedField(total_tag, total);
                    setSelectField(combine_tag, combine)
                    
                    // set field visible
                    inner_tag.style.display="inline";
                    inner_tag.style.visibility="visible"; 

                    // display field attributes
                    selectGroup(grouping_tag.value + "_attributes", false);

                    // display attribute expand / collapse arrows
                    selectGroup(grouping_tag.value + "_arrows", true);
                }                
            }
        }       
    }
}    


// var tag = findTagInBounds(dropContainerDiv, xpos, ypos+getScrollTop())
function findTagInBounds(obj, xpos, ypos)
{
    // Find the tag at the give xpos,ypos co-ordinates within the document structure

    // is object valid and does it have any child nodes?

    if (obj && obj.hasChildNodes())
    {
        // get childnodes of this node
        var childNodes = obj.childNodes;
        var lastTag = null;
        var firstTag = null;

        for (i=0;i < childNodes.length;i++)
        {
            var tag = childNodes.item(i);

            // set current field tag as last tag
            // if not set yet, set current field as first tag
            if (tag.className == 'drag')
            {
                lastTag = tag;
                if (!firstTag)
                    firstTag = tag;
            }

            if (dragTag.id != tag.id)
            {
                if(ypos >= tag.offsetTop &&
                        ypos < (tag.offsetTop + tag.offsetHeight))
                {

                    // got our drop tag
                    return tag;
                }
            }
        }

        // if we haven't returned a tag yet and the dragged tag is below the last tag,
        // drop tag should be 'drag_blank' (the dummy tag)
        if (lastTag && ypos > (lastTag.offsetTop + lastTag.offsetHeight))
            return document.getElementById('drag_blank');

        // if we haven't returned a tag yet and the dragged tag is above the first tag,
        // drop tag should be the first tag
        if (firstTag && ypos < firstTag.offsetTop)
            return firstTag;
    }

    return null;
}

function move(e)
{
     if (dragapproved)
     {
        var obj  = ns6 ? e.target  : event.srcElement
        var xpos = ns6 ? e.clientX : event.clientX
        var ypos = ns6 ? e.clientY : event.clientY

        moved = true
        
        dragTag.style.left = '' + (temp1 + (xpos - startX)) + 'px';
        
        if (!scrollOn)
            dragTag.style.top  = '' + ((temp2 + (ypos - startY)) + movedY + scrollY) + 'px';

        
        eventY = ypos

        return false
    }
}



function selfMove(container)
{
    // needs to move outside the bounds of this container

    //alert(startY >= container.offsetTop );
    //alert(startY <= container.offsetTop + container.offsetHeight);

    if (startX >= container.offsetLeft &&
        startX <= container.offsetLeft + container.offsetWidth &&
        startY >= container.offsetTop &&
        startY <= container.offsetTop + container.offsetHeight)
    {
        return true;
    }
    else
    {                
        return false;
    }    

}

function orderTags(container, srcTag, destTag)
{
    // add before srcTag
    container.insertBefore(srcTag, destTag);
   
}

function setMaxContainerHeight(start_container, drop_container)
{
    // Iterate over options, and calcuate height of dropzone container
    // This is so the offsetHeight gets set correct
    var num_options = option_descriptions.length;
    
    if (num_options)
    {        
        var tag = document.getElementById("drag_" + option_values[0]);
        offset_height = tag.offsetHeight;
        
        if (!offset_height) offset_height=60; // default hardcoded :)
        
        var height=100;
        for (i=0;i<num_options;i++)
        {
            height+=offset_height;
        }
        
        
        drop_container.style.height=(height + "px");
    }        
}

function inContainer(container, xpos, ypos)
{
   
/*    return (xpos >= container.offsetLeft &&
            xpos <= container.offsetLeft + container.offsetWidth &&
            ypos >= container.offsetTop &&
            ypos <= container.offsetTop + container.offsetHeight);
*/

     return (xpos >= container.offsetLeft &&
             xpos <= container.offsetLeft + container.offsetWidth);

}

function dropped(e)
{   
    if (dragapproved)
    {        
        var obj = ns6 ? e.target  : event.srcElement

        eventY = 0
        movedY = 0
        scrollOn = false
        dragapproved = false

        dragTag.style.zIndex = 100;
        dragTag.className = 'drag';

        // ok a valid drop zone IF it is in a drop_container

        var xpos = ns6 ? e.clientX : event.clientX
        var ypos = ns6 ? e.clientY : event.clientY

        var dropContainer = document.getElementById('drop_zone');
        var dropContainerDiv = document.getElementById('drop_zone_div');
        var startContainer = document.getElementById('start_zone');

        var validDrop = false;

        if (dropContainer != null && startContainer != null && dropContainerDiv != null)
        {
            //alert("inContainer(dropContainer, xpos, ypos) = "+inContainer(dropContainer, xpos, ypos));
            if (inContainer(dropContainer, xpos, ypos))
            {
                if (selfMove(dropContainer))
                {
                    // set ordering
                    var tag = findTagInBounds(dropContainerDiv, xpos, ypos+getScrollTop());

                    if (tag)
                    {
                        orderTags(dropContainerDiv, dragTag, tag);
                        setHiddenFormVars();
                    }
                }
                else
                {
                    var drag_parent = document.getElementById("parent_" + dragTag.id);
                    var removed     = drag_parent.removeChild(dragTag);

                    if (removed)
                    {
                        var added = dropContainerDiv.appendChild(removed);

                        // reset top / left
                        added.style.left='';
                        added.style.top='';

                        // set background colour
                        added.style.backgroundColor = 'transparent';
                        // set top / total options visible
                        var inner_tag = document.getElementById(added.id + "_options");
                        inner_tag.style.display="inline";
                        inner_tag.style.visibility="visible";

                        // need to convert drag_fieldname to just fieldname
                        var fieldname = added.id.substr(5, added.id.length);

                        // display attribute expand / collapse arrows
                        selectGroup(fieldname + "_arrows", true);

                        // successful drop/field selection
                        validDrop = true;

                        // move to just before blank tag
                        var blankTag = document.getElementById('drag_blank');

                        if (blankTag)
                        {
                            orderTags(dropContainerDiv, dragTag, blankTag);
                            setHiddenFormVars();
                        }
                    }
                }
            }
            else
            {                
                if (inContainer(startContainer, xpos, ypos))
                {   
                    
                    if (selfMove(startContainer))
                    {   
                        // ordering not important if not selected ...
                    }                        
                    else
                    {                                                                
                        var removed = dropContainerDiv.removeChild(dragTag);       
                        
                        var drag_parent = document.getElementById("parent_" + dragTag.id);
                   
                        if (removed)
                        {
                            var next = findNextChild(drag_parent, removed);
                            var added;
                            
                            if (next)
                            {
                                added = drag_parent.insertBefore(removed, next);
                            }
                            else
                            {
                                // append as last element
                                added = drag_parent.appendChild(removed);
                            }                                
                           
                            // reset top / left
                            added.style.left='';
                            added.style.top='';
                           
                            // set background colour
                            added.style.backgroundColor = 'transparent'
                           
                            // hide field attributes
                            var inner_tag = document.getElementById(added.id + "_options");
                            inner_tag.style.visibility="hidden";
                            inner_tag.style.display="none";
                            
                            // need to convert drag_fieldname to just fieldname
                            var fieldname = added.id.substr(5, added.id.length);
                        
                            // hide attribute expand / collapse arrows
                            selectGroup(fieldname + "_arrows", false);
                        }
            
                        validDrop = true;
                    }
                }                    
            }
        }       
    }

    

    
    if (validDrop)
    {
        // set hidden form vars
        setHiddenFormVars();
    }
    else
    {
        // reset
        if (dragTag)
        {
            dragTag.style.left = 0
            dragTag.style.top  = 0
            dragTag.style.backgroundColor = 'transparent'
        }            
    }        
    
}

function findNextChild(container, new_child)
{
    var child_name = new_child.id.substr(5);
    var child_desc = valueToDescription(child_name);    
    var previous_child = null;    
    
    var selectedNodes = container.childNodes;
        
    var current_tag = null;        
    for (i=0;i < selectedNodes.length;i++)
    {
        var tag = selectedNodes.item(i);
        if (tag.className != 'drag')
        {
            continue;
        }
        if (child_desc < document.getElementById('planit_name_'+tag.id.substr(5)).innerHTML)
        {
            previous_child = tag;
            break;
        }
    }

    
    return previous_child;
}

function valueToDescription(val)
{
    for(i=0;i < option_values.length;i++)
    {
        if (option_values[i] == val)
        {
            return option_descriptions[i];        
        }
    }
    
    return null;
}

function descriptionTovalue(desc)
{
    for(i=0;i < option_descriptions.length;i++)
    {
        if (option_descriptions[i] == desc)
        {
            return option_values[i];
        }
    }
    
    return null;
}


function hasSelectedOption()
{
    var drop_container = document.getElementById("drop_zone_div");
        
    // get childnodes of this node 
    var selectedNodes = drop_container.childNodes;
        
    for (i=0;i < selectedNodes.length;i++)
    {
        var tag = selectedNodes.item(i);
            
        // valid tag
        if (tag && tag.className=="drag")
        {                
            return true;
        }
    }
    
    return false;
}


function setHiddenFormVars()
{
    // get hidden tag container
    var hidden_container = document.getElementById("hidden_fields");

    // get child nodes - these will be our hidden fields
    if (hidden_container && hidden_container.hasChildNodes())
    {
        // get childnodes of this node 
        var nodes = hidden_container.childNodes;
            
        for (i=0;i < nodes.length;i++)
        {
            var tag = nodes.item(i);
            // valid tag
            if (tag && tag.name)
            {
                // reset
                tag.value="-";
            }
        }

        var drop_container = document.getElementById("drop_zone_div");
        
        // get childnodes of this node 
        var selectedNodes = drop_container.childNodes;
        
        var grouping_index = 0;

        for (i=0;i < selectedNodes.length;i++)
        {
            var tag = selectedNodes.item(i);
            
            // valid tag
            if (tag && tag.className=="drag")
            {                
                // remove "drag_" from tag id to get fieldname
                var field_name = tag.id.substr(5);
                
                
                // get grouping_i field
                
                var grouping_tag = document.getElementById("grouping_" + grouping_index);
                var grouping_tag_top = document.getElementById("grouping_" + grouping_index + "_top");
                var grouping_tag_total = document.getElementById("grouping_" + grouping_index + "_total");
                var grouping_tag_combine = document.getElementById("grouping_" + grouping_index + "_combine");
                
                // set grouping
                grouping_tag.value=field_name;

                // real values
                var real_grouping_tag_combine = document.getElementById("planit_combine_" + field_name);
                var real_grouping_tag_total = document.getElementById("planit_total_" + field_name);
                var real_grouping_tag_top = document.getElementById("planit_top_" + field_name);
                
                
                // set hidden values
                grouping_tag_top.value   = real_grouping_tag_top.options[real_grouping_tag_top.selectedIndex].value;
                
                if (real_grouping_tag_total.checked)
                    grouping_tag_total.value = "yes";
                else
                    grouping_tag_total.value = "";

                grouping_tag_combine.value = real_grouping_tag_combine.options[real_grouping_tag_combine.selectedIndex].value;

                grouping_index++;
            }
        }
    }        
}

function setTopField(obj, value)
{
    if (obj)
    {
        for (i=0;i<obj.options.length;i++)
        {
            if (obj.options[i].value == value)
            {
                // set selected
                obj.options[i].selected = true;
                break;
            }
        }
    }
}

function setSelectField(obj, value)
{
    // find the index of the option to be selected
    var foundIndex = 0;
    for (var i = 0; i < obj.options.length; ++i)
    {
        if (obj.options[i].value == value)
        {
            foundIndex = i;
        }
    }

    // select it
    obj.selectedIndex = foundIndex;
}

function setCheckedField(obj, checkedval)
{
    // find value of attribute field (total etc)
    if (obj)
    {   
        obj.checked=checkedval;
    }
}



function drags(e)
{
    if ((!ie && !ns6) || (ie && !event.srcElement))
        return

    var obj        = ns6 ? e.target  : event.srcElement;
    var xpos       = ns6 ? e.clientX : event.clientX;
    var ypos       = ns6 ? e.clientY : event.clientY;
    var topelement = ns6 ? "HTML" : "BODY";

    var st = document.getElementById("start_zone");

    if (obj == null || obj.tagName == null || obj.className == null)
        return true;
    
    // This allows you to drag elements contained within a drag tag
    while ( obj != null 
            && obj.tagName!=topelement 
            && (obj.tagName!="DIV" || obj.className!="drag") 
            && obj.tagName != "SELECT" 
            && obj.tagName != "INPUT")
    {
        obj = ns6? obj.parentNode : obj.parentElement;
    }

    if (!obj)
        return false;
    
    if (obj.tagName == "SELECT" || obj.tagName == "INPUT")
    {
        return true;
    }
    
    if (obj != null && obj.className=="drag")
    {        
        dragapproved=true;
        dragTag=obj;
        dragTag.style.backgroundColor = '#efefef';
        dragTag.style.zIndex = 999;
        dragTag.className = 'drag planit_selected_borders';

        temp1=parseInt(dragTag.style.left+0);
        temp2=parseInt(dragTag.style.top+0);
        
        startX=xpos;
        startY=ypos;

        scrollPos=getScrollTop();

        return false;
    }
}


function scrolls(e)
{
    if (dragapproved && !scrollOn)
    {
        var newScroll = getScrollTop()

        if (newScroll > scrollPos)
            scrollY += (newScroll-scrollY)
        else
            scrollY -= (newScroll-scrollY)
    }
}


function window_onload()
{
    // make sure 'blank' field div is at the bottom of the list
    // of fields that have been selected (necessary when
    // editing a PlanIT)
    var dropContainerDiv = document.getElementById("drop_zone_div");
    if (dropContainerDiv)
    {
        var childNodes = dropContainerDiv.childNodes;
        var blankTag = document.getElementById("drag_blank");
        for (i=0;i < childNodes.length;i++)
        {
            var tag = childNodes.item(i);
            if (tag.className == "drag" && tag != blankTag)
            {
                orderTags(dropContainerDiv, tag, blankTag);
                setHiddenFormVars();
            }
        }
    }

    // This to get rid of Opera selecting text as you drag.
    if ((this+"").substr(8,1)!="O")
        return;

    var divs=document.getElementsByTagName("div");
    for (var i=0;i<divs.length;i++)
    {
        if (divs[i].className=="drag")
        {
            divs[i].onmousedown=opa;
            divs[i].onmouseover=opa;
        }
    }

    function opa()
    {
        document.getElementById("opera").focus()
    }
}

if (typeof window.onload == 'function')
{
    var old_onload = window.onload;
    window.onload = function()
    {
        old_onload();
        window_onload();
    }
} else
{
    window.onload = window_onload;
}

document.onmousedown=drags
document.onmousemove=move
document.onmouseup=dropped
// dont use until working properly -- window.onscroll=scrolls