/*
 the following libs and css must be included
 <script type="text/javascript" language="JavaScript1.2" src="/js/jquery.min.js"></script>
 <script src="/js/pipingCallout/simpleCallout.js"></script>
 <link rel="stylesheet" type="text/css" href="/js/pipingCallout/pipingCallout.css"/>

 usage:
 assign simpleCalloutMouseOver(event, headerName, mainText) and simpleCalloutMouseMove(event) for

 example:
 <img... onmouseover="simpleCalloutMouseOver(event, "", "Mouse Over Text");" onmousemove="simpleCalloutMouseMove(event);"/>

 */
var SIMPLE_CALLOUT_DIV = "simpleCalloutDiv";
var j$ = jQuery.noConflict();
var currentElementSimpleCallout;
var timeAfterClose = 0;
var mousePosSimpleCallout = {posX:0, posY:0};
var closeTimeoutSimpleCallout;

function simpleCalloutMouseMove(e) {
  e = e || window.event;
  if (e.pageX || e.pageX) {
    mousePosSimpleCallout.posX = e.pageX;
    mousePosSimpleCallout.posY = e.pageY;
  }
  if (e.clientX || e.clientY) {
    mousePosSimpleCallout.posX = e.clientX + document.body.scrollLeft
        + document.documentElement.scrollLeft;
    mousePosSimpleCallout.posY = e.clientY + document.body.scrollTop
        + document.documentElement.scrollTop;
  }
}
function simpleCalloutMouseOverByObject(e, obj){
  e = e || window.event;
  var divObject = document.getElementById("div"+obj.id);
  if(divObject!=null)
    simpleCalloutMouseOver(e, "", divObject.innerHTML);
  divObject = null;
}
function simpleCalloutMouseOver(e, headerName, mainText) {
  e = e || window.event;
  var currentTime = new Date().getTime();
  if ((currentTime - timeAfterClose) < 200)
    return;
  var div = j$("#" + SIMPLE_CALLOUT_DIV);
  var currentTarget = (e.target || e.srcElement);
  if (div != null && div.is(':visible') && currentElementSimpleCallout == currentTarget)
    return;
  currentElementSimpleCallout = currentTarget;
  var calloutHeaderName = (headerName == null ? "" : headerName);
  var calloutMainText = (mainText == null ? "" : mainText);
  if (div == null || div.length == 0) {
    initPipingCalloutDialog();
  }
  showSimpleCallout(calloutHeaderName, calloutMainText);
  currentTime = div = currentTarget = calloutHeaderName = calloutMainText = null;
}

function showSimpleCallout(headerName, mainText) {
  showCalloutTimeout(headerName, mainText);
}

function setData(headerName, mainText) {
  j$("#calloutHeaderSpan").html(headerName);
  j$("#calloutTextDiv").html(mainText);
}

function showCalloutTimeout(headerName, mainText) {
  setTimeout(function () {showCalloutNearCursor(headerName, mainText)}, 500);
}
function  showCalloutNearCursor(headerName, mainText) {
  setData(headerName, mainText);
  var tPosX = mousePosSimpleCallout.posX + "px";
  var tPosY = (mousePosSimpleCallout.posY + 20) + "px";
  j$('#' + SIMPLE_CALLOUT_DIV).css({top: tPosY, left: tPosX}).show();
  closeSimpleCallOutDivTimeOut();
  tPosX = tPosY = null;
}

function initPipingCalloutDialog() {
  appendPipingCalloutDiv();
}

function appendPipingCalloutDiv() {
  j$("body").append('' +
                   '<div style="border: 1px gray solid; display: none; z-index: 900; position: absolute;" id="' + SIMPLE_CALLOUT_DIV +
                   '" class="flora ui-dialog-content calloutMainDiv">' +
                   '<table cellpadding="3" cellspacing="0" bgcolor="white" >' +
                   '<tbody>' +
                   '<tr class="calloutHeaderTr">' +
                   '<td align="left">' +
                   '<span id="calloutHeaderSpan" style="padding-left:3px;"></span>' +
                   '</td>' +
                   '<td align="right">' +
                   '<a id="pipingCalloutCloseElement" onclick="closeSimpleCallOutDiv();" class="pipingCalloutCloseA">X</a>' +
                   '</td>' +
                   '</tr>' +
                   '<tr>' +
                   '<td colspan="2">' +
                   '<div id="calloutTextDiv" class="calloutTextDiv"></div>' +
                   '</td>' +
                   '</tr>' +
                   '</tbody>' +
                   '</table>' +
                   '</div>');
}

function closeSimpleCallOutDiv() {
  timeAfterClose = new Date().getTime();
  j$('#' + SIMPLE_CALLOUT_DIV).hide();
}

function closeSimpleCallOutDivTimeOut() {
  if (closeTimeoutSimpleCallout != null) clearTimeout(closeTimeoutSimpleCallout);
  closeTimeoutSimpleCallout = setTimeout(function () {closeSimpleCallOutDiv()}, 2000);
}
