var topZ = 1;
var startX;
var startY;
startX = 100;
startY = 100;
nextID = 1;

var tmpAllowMove;

tmpAllowMove = true;

function CreateDropdownWindow(caption, theWidth, theHeight, canMove, contentSource, theIcon, theIconText, bMinMax, bUpDown, bClose) {
    var newdiv;
    newdiv = document.createElement("div");
    newdiv.id = "dragTitle" + String(nextID);
    newdiv.className = "divDragTitle";
    newdiv.style.width = theWidth;
    newdiv.style.height = '20px';
    newdiv.style.overflow = 'hidden';
    newdiv.style.left = AddPx(startX);
    newdiv.style.top = AddPx(startY);
    newdiv.style.zIndex = topZ;
    
    // If canMove is false, don't register event handlers
    if (canMove) {
        // IE doesn't support addEventListener, so check for its presence
        if (newdiv.addEventListener) {
            // firefox, etc.
            newdiv.addEventListener("mousemove", function(e) { return mouseMove(e) }, true);
            newdiv.addEventListener("mousedown", function(e) { return mouseDown(e) }, true);
            newdiv.addEventListener("mouseup", function(e) { return mouseUp(e) }, true);
        }
        else {
            // IE
            newdiv.attachEvent("onmousemove", function(e) { return mouseMove(e) });
            newdiv.attachEvent("onmousedown", function(e) { return mouseDown(e) });
            newdiv.attachEvent("onmouseup", function(e) { return mouseUp(e) });
        }
    }

    var newdiv2;
    newdiv2 = document.createElement("div");
    newdiv2.id = "dragContent" + String(nextID);
    newdiv2.className = "divDragContent";
    newdiv2.style.width = theWidth;
    newdiv2.style.height = theHeight;
    newdiv2.style.overflow = 'auto';
    newdiv2.style.left = AddPx(startX);
    newdiv2.style.top = AddPx(startY + 20);
    newdiv2.style.zIndex = topZ;
    if (contentSource) {
        newdiv2.innerHTML = contentSource;
    }
    
    if (canMove) {
        if (newdiv2.addEventListener) {
            // firefox, etc.
            newdiv2.addEventListener("mousedown", function(e) { return contentMouseDown(e) }, true);
        }
        else {
            // IE
            newdiv2.attachEvent("onmousedown", function(e) { return contentMouseDown(e) });
        }
    }

	var newHTML;
	
	newHTML = '<table style="cursor: pointer;"><tr><td class="DialogTitleLeft"></td><td  class="DialogTitle">$1</td><td  class="DialogTitle" style="text-align:right">'
	
	if (bMinMax) { newHTML += '<img src="/images/buttonmax.gif" style="cursor: pointer;" width=16 height=16 class="divMaxMinButton" id="dragMaxMinButton$2" onmousedown="javascript:maxContentWin($2, \''+theWidth+'\', \''+theHeight+'\', \''+newdiv.style.top+'\', \''+newdiv.style.left+'\')" />'; }

	if (bUpDown) { newHTML += '<img src="/images/buttontop.gif" style="cursor: pointer;" width=16 height=16 class="divTitleButton" id="dragButton$2" onmousedown="javascript:toggleContentWin($2, \''+theIconText+'\', \''+theIcon+'\')" />'; }
	
	if (bClose) { newHTML += '<img style="cursor: pointer;" title="close" src="/images/close.gif" width=16 height=16 onclick="removeLayer(\'dragContent' + String(nextID)+'\'); removeLayer(\'dragTitle' + String(nextID)+'\');">'; }
	
	newHTML += '</td><td class="DialogTitleRight"></td></tr></table>';

	newdiv.innerHTML = jstrprintf(newHTML, caption, nextID);


	document.body.appendChild(newdiv);
    document.body.appendChild(newdiv2);
    
    // Save away the content DIV into the title DIV for 
    // later access, and vice versa
    newdiv.content = newdiv2;
    newdiv2.titlediv = newdiv;

    topZ += 1;
	
	if (startX > 600) {
	    startX = 25;
	} else
	{
	    startX += 25;
	}
	if (startY > 600) {
	    startY = 25;
	} else
	{
	    startY += 25;
	}

// If you want you can check when these two are greater than
    // a certain number and then rotate them back to 100,100...
	
	displayLayer("dragContent" + String(nextID));
	displayLayer("dragTitle" + String(nextID));

    
    nextID++;
	
	return nextID - 1;
}

function toggleContentWin(id, thisIconText, thisIcon) {
    var elem = document.getElementById("dragContent" + String(id));
    var elemtitle = document.getElementById("dragTitle" + String(id));
    var img = document.getElementById("dragButton" + String(id));

	var myIcon;
	
	myIcon = '<div style=" text-transform: capitalize; float: left; font-size: 10px; text-align: center; padding: 5px; width: 58px;"><img style="cursor: pointer;" onclick="toggleContentWin(\''+id+'\', \''+thisIconText+'\', \''+thisIcon+'\');" src="'+thisIcon+'" width=48 height=48><br>'+thisIconText+'</div>';

    if (elem.style.display == "none") {
        // hidden, so unhide
//        elem.style.display = "block";
//        elemtitle.style.display = "block";
		displayLayer("dragContent" + String(id));
		displayLayer("dragTitle" + String(id));

        document.getElementById('Temp').innerHTML = myIcon;
		
		document.getElementById('Desktop').innerHTML = document.getElementById('Desktop').innerHTML.replace(document.getElementById('Temp').innerHTML, '');
		
        // Change the button's image
        img.src = "/images/buttontop.gif";
}
    else {
        // showing, so hide
		removeLayer("dragContent" + String(id));
		removeLayer("dragTitle" + String(id));

//        elem.style.display = "none";
//        elemtitle.style.display = "none";
		document.getElementById('Desktop').innerHTML = document.getElementById('Desktop').innerHTML + myIcon;

        // Change the button's image
        img.src = "/images/buttonbottom.gif";
    }
}


function maxContentWin(id, thisWidth, thisHeight, thisTop, thisLeft, thisIcon) {
    var elem = document.getElementById("dragContent" + String(id));
    var elemTitle = document.getElementById("dragTitle" + String(id));
    var img = document.getElementById("dragMaxMinButton" + String(id));

    if (elem.style.width == "100%") {
        // Change the button's image
        img.src = "/images/buttonmax.gif";
        // hidden, so unhide
        elemTitle.style.width = thisWidth;
        elemTitle.style.top = thisTop;
        elemTitle.style.left = thisLeft;

		elem.style.width = thisWidth;
        elem.style.height = thisHeight;
        elem.style.top = RemovePx(thisTop) + 20;
        elem.style.left = thisLeft;
		
		addDocumentHandlers(true);

}
    else {
        // Change the button's image
        img.src = "/images/buttonmin.gif";
        // showing, so hide
        elem.style.width = "100%";
        elemTitle.style.width = "100%";
        elem.style.height = "100%";

        elem.style.top = "20px";
        elemTitle.style.top = "0px";
        elem.style.left = "0px";
        elemTitle.style.left = "0px";
		
		addDocumentHandlers(false);

    }
}


function writeDialog(thisID, thisHTML) {
	document.getElementById("dragContent" + thisID).innerHTML = thisHTML;
}


function closeDialog(thisID) {
	removeLayer("dragContent" + thisID);
	removeLayer("dragTitle" + thisID);
}

// Drag methods
var dragObjTitle = null;
var dragOffsetX = 0;
var dragOffsetY = 0;

function contentMouseDown(e) {
    // Move the window to the front
    // Use a handy trick for IE vs FF
    var dragContent = e.srcElement || e.currentTarget;
    if ( ! dragContent.id.match("dragContent")) {
        dragContent = findParentTagById(dragContent, "dragContent");
    }
    if (dragContent) {
        dragContent.style.zIndex = topZ;
        dragContent.titlediv.style.zIndex = topZ;
        topZ++;
    }
}

function mouseDown(e) {
    // These first two lines are written to handle both FF and IE
		var curElem = e.srcElement || e.target;
		var dragTitle = e.currentTarget || findParentDiv(curElem);
		if (dragTitle) {
			if (dragTitle.className != 'divDragTitle') {
				return;
			}
		}
		
		// Start the drag, but first make sure neither is null
		if (curElem && dragTitle) {
			// Attach the document handlers. We don't want these running all the time.
			addDocumentHandlers(true);
		
			// Move this window to the front.
			dragTitle.style.zIndex = topZ;
			dragTitle.content.style.zIndex = topZ;
			topZ++;
		
			// Check if it's the button. If so, don't drag.
			if (curElem.className != "divTitleButton") {
				
				// Save away the two objects
				dragObjTitle = dragTitle;
				
				// Calculate the offset
				dragOffsetX = e.clientX - 
					dragTitle.offsetLeft;
				dragOffsetY = e.clientY - 
					dragTitle.offsetTop;
					
				// Don't let the default actions take place
				if (e.preventDefault) {
					e.preventDefault();
				}
				else {
					document.onselectstart = function () { return false; };
					e.cancelBubble = true;
					return false;
				}
			}
		}
}

function mouseMove(e) {
    // If not null, then we're in a drag
    if (dragObjTitle) {
    
        if (!e.preventDefault) {
            // This is the IE version for handling a strange
            // problem when you quickly move the mouse
            // out of the window and let go of the button.
            if (e.button == 0) {
                finishDrag(e);
                return;
            }
        }
    
        dragObjTitle.style.left = AddPx(e.clientX - dragOffsetX);
        dragObjTitle.style.top = AddPx(e.clientY - dragOffsetY);
        dragObjTitle.content.style.left = AddPx(e.clientX - dragOffsetX);
        dragObjTitle.content.style.top = AddPx(e.clientY - dragOffsetY + 20);
        if (e.preventDefault) {
            e.preventDefault();
        }
        else {
            e.cancelBubble = true;
            return false;
        }
    }
}

function mouseUp(e) {
    if (dragObjTitle) {
		finishDrag(e);
    }
}

function finishDrag(e) {
    var finalX = e.clientX - dragOffsetX;
    var finalY = e.clientY - dragOffsetY;
    if (finalX < 0) { finalX = 0 };
    if (finalY < 0) { finalY = 0 };

    dragObjTitle.style.left = AddPx(finalX);
    dragObjTitle.style.top = AddPx(finalY);
    dragObjTitle.content.style.left = AddPx(finalX);
    dragObjTitle.content.style.top = AddPx(finalY + 20);
    
    // Done, so reset to null
    dragObjTitle = null;
    addDocumentHandlers(false);
    if (e.preventDefault) {
        e.preventDefault();
    }
    else {
        document.onselectstart = null;
        e.cancelBubble = true;
        return false;
    }
}

function addDocumentHandlers(addOrRemove) {
    if (addOrRemove) {
        if (document.body.addEventListener) {
            // firefox, etc.
            document.addEventListener("mousedown", function(e) { return mouseDown(e) }, true);
            document.addEventListener("mousemove", function(e) { return mouseMove(e) }, true);
            document.addEventListener("mouseup", function(e) { return mouseUp(e) }, true);
        }
        else {
            // IE
            document.onmousedown = function() { mouseDown(window.event) } ;
            document.onmousemove = function() { mouseMove(window.event) } ;
            document.onmouseup = function() { mouseUp(window.event) } ;
        }
    }
    else {
        if (document.body.addEventListener) {
            // firefox, etc.
            remove.addEventListener("mousedown", function(e) { return mouseDown(e) }, true);
            remove.addEventListener("mousemove", function(e) { return mouseMove(e) }, true);
            remove.addEventListener("mouseup", function(e) { return mouseUp(e) }, true);
        }
        else {
            // IE
            // Be careful here. If you have other code that sets these events,
            // you'll want this code here to restore the values to your other handlers,
            // rather than just clear them out.
            document.onmousedown = null;
            document.onmousemove = null;
            document.onmouseup = null;
        }
    }
}