﻿//*********************** Tool Tip Vertical Placement Enum ***************************
var PlacementTypeY = {
    'ABOVE': 0,
    'CENTER': 1,
    'BELOW': 2,
    'TOP_JUSTIFIED' : 3,
    'MOUSE': 4
};

//*********************** Tool Tip Horizontal Placement Enum ***************************
var PlacementTypeX = {
    'LEFT': 0,
    'CENTER': 1,
    'RIGHT': 2,
    'MOUSE': 3
};

//*********************** Tool Tip Subscriber Attributes ***************************
var ToolTipSubscriberAttribute = {
    'HEADER': 'tooltip_header_text',
    'ACTION': 'tooltip-action',
    'CONTENT': 'tooltip_content_text'
};

//*********************** Tool Tip Properties Data Class ***************************
function ToolTipProperties(className, containerId, headerId, messageId, placementY, placementX, marginY, marginX) {
    this.m_ClassName = className;
    this.m_ContainerId = containerId;
    this.m_HeaderId = headerId;
    this.m_MessageId = messageId;
    this.m_PlacementY = placementY;
    this.m_PlacementX = placementX;
    this.m_MarginX = marginX;
    this.m_MarginY = marginY;
    this.m_SelectedElement = null;
    this.m_Timer = null;
}

//*********************** Tool Tip Handler Control ***************************
function ToolTipHandler() {
    this.m_ToolTipPropertiesCollection = new Array();
    this.m_ToolTipPropertiesEnumeration = new Array(); 
}

ToolTipHandler.prototype.AddToolTip = function(tooltipProperties) {
    this.m_ToolTipPropertiesCollection[tooltipProperties.m_ClassName] = tooltipProperties;
    this.m_ToolTipPropertiesEnumeration.push(tooltipProperties.m_ClassName);
    this.RegisterElements(tooltipProperties.m_ClassName);
    this.RegisterToolTip(tooltipProperties.m_ContainerId);
};

ToolTipHandler.prototype.Display = function(e) {
    e = e || window.event;
    var element = e.srcElement || e.target;
    var elementClass = this.GetClassName(element);

    if (this.m_ToolTipPropertiesCollection[elementClass].m_HeaderId != null) {
        document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_HeaderId).innerHTML = element.getAttribute(ToolTipSubscriberAttribute.HEADER);
    }

    if (this.m_ToolTipPropertiesCollection[elementClass].m_MessageId != null) {
        var tooltipTextElement = document.createElement('p');

        if (element.getAttribute('tooltip-action') != null) {
            var tooltipAction = document.createElement('a');
            tooltipAction.setAttribute('href', 'javascript:void(0);');
            tooltipAction.innerHTML = element.getAttribute(ToolTipSubscriberAttribute.CONTENT);

            tooltipAction.setAttribute('item-id', element.getAttribute('item-id'));
            tooltipAction.setAttribute('item-name-obj', element.getAttribute('item-name-obj'));
            tooltipAction.setAttribute('item-title', element.getAttribute('item-title'));
            tooltipAction.setAttribute('tooltip-container', this.m_ToolTipPropertiesCollection[elementClass].m_MessageId);
            tooltipAction.setAttribute('rel', 'rl-add');

            AddHandler(tooltipAction, 'click', eval(element.getAttribute(ToolTipSubscriberAttribute.ACTION)))

            tooltipTextElement.appendChild(tooltipAction);
        }
        else {
            tooltipTextElement.innerHTML = element.getAttribute(ToolTipSubscriberAttribute.CONTENT);
        }

        document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_MessageId).innerHTML = '';
        document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_MessageId).appendChild(tooltipTextElement);
    }

    document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_ContainerId).style.display = "block";

    this.SetVerticalPosition(element, e);
    this.SetHorizontalPosition(element, e);
};

ToolTipHandler.prototype.ElementOnLeaveHandler = function(e) {
    e = e || window.event;

    this.m_SelectedElement = e.srcElement || e.target;
    this.m_Timer = setTimeout(CreateDelegate(this, this.Hide), 500);
};

ToolTipHandler.prototype.Hide = function(e) {
    if (this.m_SelectedElement == null) { return; }

    e = e || window.event;
    if (e) {
        var relatedElement = e.toElement || e.relatedTarget;
        if (relatedElement == undefined) { return; }
        if (relatedElement.tagName == 'A' || relatedElement.tagName == 'P') { return; }
    }

    var elementClass = this.GetClassName(this.m_SelectedElement);
    this.m_SelectedElement = null;
    document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_ContainerId).style.display = "none";
};

ToolTipHandler.prototype.StopTimer = function() {
    clearTimeout(this.m_Timer);
    this.m_Timer = null;
};

ToolTipHandler.prototype.GetAbsoluteLeft = function(targetElement, stopAtAbsParent) {
    var retVal = 0;

    for (var ele = targetElement; ele; ele = ele.offsetParent) {
        // If a parent is absolute positioning, 
        // then our absolute position is relative to that parent, go figure...
        if (stopAtAbsParent == true &&
         (ele.style.position.toLowerCase() == 'absolute' ||
          ele.style.position.toLowerCase() == 'fixed')) {
            break;
        }

        retVal += ele.offsetLeft;
    }

    return retVal;
};

ToolTipHandler.prototype.GetAbsoluteTop = function(targetElement, stopAtAbsParent) {
    var retVal = 0;

    for (var ele = targetElement; ele; ele = ele.offsetParent) {
        // If a parent is absolute positioning, 
        // then our absolute position is relative to that parent, go figure...
        if (stopAtAbsParent == true &&
       (ele.style.position.toLowerCase() == 'absolute' ||
        ele.style.position.toLowerCase() == 'fixed')) {
            break;
        }

        retVal += ele.offsetTop;
    }

    return retVal;
};


ToolTipHandler.prototype.SetVerticalPosition = function(targetElement, eventArgs) {
    var elementClass = this.GetClassName(targetElement);
    var tooltipContainer = document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_ContainerId);

    var tipHeight = 0;
    if (tooltipContainer.currentStyle) { tipHeight = tooltipContainer.currentStyle.pixelHeight; }
    else { tipHeight = parseInt(document.defaultView.getComputedStyle(tooltipContainer, '').height); }
    if (isNaN(tipHeight)) { tipHeight = tooltipContainer.offsetHeight; }

    var targetHeight = 0;
    if (targetElement.currentStyle) { targetHeight = targetElement.currentStyle.pixelHeight; }
    else { targetHeight = parseInt(document.defaultView.getComputedStyle(targetElement, '').height); }
    if (isNaN(targetHeight)) { targetHeight = targetElement.offsetHeight; }

    var yOffset = 0;
    switch (this.m_ToolTipPropertiesCollection[elementClass].m_PlacementY) {
        case PlacementTypeY.ABOVE:
            yOffset = this.GetAbsoluteTop(targetElement) - tipHeight - this.m_ToolTipPropertiesCollection[elementClass].m_MarginY;
            break;
        case PlacementTypeY.CENTER:
            yOffset = (this.GetAbsoluteTop(targetElement) + targetHeight / 2) - (tipHeight / 2);
            break;
        case PlacementTypeY.BELOW:
            yOffset = this.GetAbsoluteTop(targetElement) + targetHeight + this.m_ToolTipPropertiesCollection[elementClass].m_MarginY;
            break;
        case PlacementTypeY.TOP_JUSTIFIED:
            yOffset = this.GetAbsoluteTop(targetElement) + this.m_ToolTipPropertiesCollection[elementClass].m_MarginY;
            break;
        case PlacementTypeY.MOUSE:
            yOffset = eventArgs.clientY + document.body.scrollTop + this.m_ToolTipPropertiesCollection[elementClass].m_MarginY;
            break;
    }

    tooltipContainer.style.top = yOffset + "px";
};

ToolTipHandler.prototype.SetHorizontalPosition = function(targetElement, eventArgs) {
    var elementClass = this.GetClassName(targetElement);
    var tooltipContainer = document.getElementById(this.m_ToolTipPropertiesCollection[elementClass].m_ContainerId);

    var tipWidth = 0;
    if (tooltipContainer.currentStyle) { tipWidth = parseInt(tooltipContainer.currentStyle.width); }
    else { tipWidth = parseInt(document.defaultView.getComputedStyle(tooltipContainer, '').width); }
    if (isNaN(tipWidth)) { tipWidth = tooltipContainer.offsetWidth; }

    var targetWidth = 0;
    if (targetElement.currentStyle) { targetWidth = parseInt(targetElement.currentStyle.width); }
    else { targetWidth = parseInt(document.defaultView.getComputedStyle(targetElement, '').width); }
    if (isNaN(targetWidth)) { targetWidth = targetElement.offsetWidth; }

    var xOffset = 0;
    switch (this.m_ToolTipPropertiesCollection[elementClass].m_PlacementX) {
        case PlacementTypeX.LEFT:
            xOffset = this.GetAbsoluteLeft(targetElement) - tipWidth - this.m_ToolTipPropertiesCollection[elementClass].m_MarginX;
            break;
        case PlacementTypeX.CENTER:
            xOffset = (this.GetAbsoluteLeft(targetElement) + targetWidth / 2) - (tipWidth / 2);
            break;
        case PlacementTypeX.RIGHT:
            xOffset = this.GetAbsoluteLeft(targetElement) + targetWidth + this.m_ToolTipPropertiesCollection[elementClass].m_MarginX;
            break;
        case PlacementTypeX.MOUSE:
            xOffset = eventArgs.clientX + document.body.scrollLeft + this.m_ToolTipPropertiesCollection[elementClass].m_MarginX;
            break;
    }

    tooltipContainer.style.left = xOffset + "px";
};


ToolTipHandler.prototype.GetClassName = function(element) {
    var elementClassName = element.className;
    for (index = 0; index < this.m_ToolTipPropertiesEnumeration.length; index++) {
        var tooltipClassName = this.m_ToolTipPropertiesCollection[this.m_ToolTipPropertiesEnumeration[index]].m_ClassName;
        if (elementClassName.indexOf(tooltipClassName) > -1) {
            return tooltipClassName;
        }
    }

    return null;
};


ToolTipHandler.prototype.RegisterElements = function(className) {
    var pageElements = document.getElementsByTagName('*');
    for (index = 0; index < pageElements.length; index++) {
        var pageElement = pageElements[index];
        if (pageElement.className.indexOf(className, 0) > -1) {
            AddHandler(pageElement, 'mouseover', CreateDelegate(this, this.Display));
            AddHandler(pageElement, 'mouseout', CreateDelegate(this, this.ElementOnLeaveHandler));
        }
    }
};

ToolTipHandler.prototype.RegisterToolTip = function(tooltipId) {
    var tooltipElement = document.getElementById(tooltipId);
    AddHandler(tooltipElement, 'mouseover', CreateDelegate(this, this.StopTimer));
    AddHandler(tooltipElement, 'mouseout', CreateDelegate(this, this.Hide));
};


////*********************** Add page load event to instantiate Tool Tip Manager Controls ***************************
//AddHandler(window, "load", InitializeItcToolTipManager);

////*********************** Instantiate Tool Tip Manager Controls ***************************
//var toolTipManager1 = null;
//function InitializeItcToolTipManager() {
//    toolTipManager1 = new ToolTipHandler();
//    toolTipManager1.AddToolTip(new ToolTipProperties('itc-tooltip1-subscriber', 'ToolTip1Container', null, 'ToolTip1Content', PlacementTypeY.TOP_JUSTIFIED, PlacementTypeX.RIGHT, 0, 3));
//    toolTipManager1.AddToolTip(new ToolTipProperties('itc-tooltip2-subscriber', 'ToolTip2Container', null, 'ToolTip2Content', PlacementTypeY.ABOVE, PlacementTypeX.CENTER, 19, 3));
//}



