function TemplateClass()
{
    this.templateAreaID = null;
    this.hiddenFieldTemplateDimensionsID = null;
    this.width = "100%";
    this.height = "100%";
    this.showTabIndexTimerID = 0;
    this.contentType = "View";
}

TemplateClass.prototype.Initialize = function(templateAreaID, hiddenFieldTemplateDimensionsID, contentType)
{
	this.templateAreaID = templateAreaID;
	this.hiddenFieldTemplateDimensionsID = hiddenFieldTemplateDimensionsID;
	var dimensions = document.getElementById(hiddenFieldTemplateDimensionsID).value.split("|");
	this.contentType = contentType;
	this.width = dimensions[0];
	this.height = dimensions[1];
	this.GetContainer().ondrop = function(event) { handleCustomContent(event); }
	this.GetContainer().ondragover = function(event) { handleCustomContent(event); }
	this.GetContainer().ondragenter = function(event) { handleCustomContent(event); }
}

TemplateClass.prototype.GetContentType = function()
{
	return this.contentType;
}

TemplateClass.prototype.GetContainer = function()
{
	if (this.templateAreaID)
		return document.getElementById(this.templateAreaID);

	return null;
}

TemplateClass.prototype.GetControls = function()
{
	var controls = new Array();
	var control = null;
	var elements = this.GetContainer().childNodes;
	for (var i = 0; i < elements.length; i++)
	{
		if (elements.item(i).id != "")
		{
			try
			{
				control = eval("_" + elements.item(i).id);
				controls.push(control);
			}
			catch (err) { }
		}
	}

	return controls;
}

TemplateClass.prototype.SetTemplateAreaWidth = function(value)
{
    document.getElementById(this.templateAreaID).style["width"] = value;
    this.width = value;
    
    document.getElementById(this.hiddenFieldTemplateDimensionsID).value = this.width + "|" + this.height;
    EventManager.Notify(EventManager.CreateEvent("EVENT_TEMPLATESIZECHANGED", [this.width, this.height], null, null));    
}

TemplateClass.prototype.SetTemplateAreaHeight = function(value)
{
    document.getElementById(this.templateAreaID).style["height"] = value;
    this.height = value;
    
    document.getElementById(this.hiddenFieldTemplateDimensionsID).value = this.width + "|" + this.height;
    
    EventManager.Notify(EventManager.CreateEvent("EVENT_TEMPLATESIZECHANGED", [this.width, this.height], null, null));
}

TemplateClass.prototype.GetTemplateAreaWidth = function()
{
    return this.width;
}

TemplateClass.prototype.GetTemplateAreaHeight = function()
{
    return this.height;
}

TemplateClass.prototype.HideControlOrder = function(element)
{
	if (element != null)
	{
		this.showTabIndexTimerID = 0;
		ClearChildElements(element);
	}
}

TemplateClass.prototype.FindControl = function(controlID)
{
	controlID = parseInt(controlID); //ensure that we have a number
	if (controlID > 0)
	{
		var controls = Template.GetContainer().childNodes;
		var control = null;
		for (var i = 0; i < controls.length; i++)
		{
			if (controls.item(i).id != "")
			{
				try
				{
					control = eval("_" + controls.item(i).id);
					if (controlID == control.GetControlID())
						return control;
				}
				catch (err)
				{
				}
			}
		}
	}
	return null;
}

TemplateClass.prototype.DeleteControl = function(controlID)
{
	var control = this.FindControl(controlID);
	if (control != null)
	{
		this.GetContainer().removeChild(control.GetControlObject());
		control = null;
	}
}

TemplateClass.prototype.ShowControlOrder = function(element)
{
    if (element != null)
    {
        clearTimeout(this.showTabIndexTimerID);
        ClearChildElements(element);
        var container = document.createElement("div");
        container.setAttribute(classAttribute, "TemplateControlOrderContainer");

        var templateContainer = this.GetContainer();
        var tabIndex = 0;
        for (var i = 0; i < templateContainer.childNodes.length; i++)
        {
            var templateControl = templateContainer.childNodes.item(i);
            if (templateControl.id != null && templateControl.id != "" && templateControl.style["display"] != "none")
            {
                var item = document.createElement("div");
                item.setAttribute(classAttribute, "TemplateControlOrderItem");
                item.innerText = ++tabIndex;
                item.style["top"] = templateControl.style["top"];
                item.style["left"] = templateControl.style["left"];
                container.appendChild(item);
            }
        }
        element.appendChild(container);
        this.showTabIndexTimerID = setTimeout("Template.HideControlOrder($get('" + element.id + "'));", 3000);
    }
}

var Template = new TemplateClass();

function handleCustomContent(oEvent)
{
    oEvent = GetEvent(oEvent);
 
    switch (oEvent.type)
    {
        case "dragenter":
            oEvent.dataTransfer.dropEffect = "move";
            oEvent.returnValue = false;
            break;

        case "dragover":
            oEvent.dataTransfer.dropEffect = "move";
            oEvent.returnValue = false;
            break;
        case "drop":
            oEvent.returnValue = false;

    }
}