///*******************************************
/// PopOut Message v1.1
/// 
///  Created On:  12/18/2006 by Rich Grimes
/// Modified On:  01/18/2007 by Rich Grimes
///               Added Left and Right side 
///               Popout
///*******************************************

/// Included on page <div id="PopOutContainer" style="visibility:hidden;position:absolute;"></div>
/// At end of page include <script type="text/javascript">AttachPopOut('lemonchiffon','images/Warning.gif','images/Close.gif')</script>

var PopOutTable = document.createElement("table");    
var PopOutTableBody = document.createElement("tbody");
var PopOutTableRow = document.createElement("tr");

var CallOutCell = document.createElement("td");
var CallOutTable = document.createElement("table");
var CallOutTableBody = document.createElement("tbody");
var CallOutTableRow = document.createElement("tr");
var CallOutArrowCell = document.createElement("td");

var CallOutCellRt = document.createElement("td");
var CallOutTableRt = document.createElement("table");
var CallOutTableBodyRt = document.createElement("tbody");
var CallOutTableRowRt = document.createElement("tr");
var CallOutArrowCellRt = document.createElement("td");

var IconCell = document.createElement("td");
var IconImage = document.createElement("img");

var CloseCell = document.createElement("td");
var CloseImage = document.createElement("img");

var MessageCell = document.createElement("td");
    
// PopOut Table
PopOutTable.id = "PopOut"
PopOutTable.cellPadding = 0;
PopOutTable.cellSpacing = 0;
PopOutTable.border = 0;
PopOutTable.width = "210px;";

// PopOut TableRow
PopOutTableRow.vAlign = 'top';
PopOutTableRow.style.height = "100%";

// CallOut Cell
CallOutCell.width = 20;
CallOutCell.align = "right";
CallOutCell.style.height = "100%";
CallOutCell.style.verticalAlign = "top";

// CallOut Table
CallOutTable.cellPadding = 0;
CallOutTable.cellSpacing = 0;
CallOutTable.border = 0;
CallOutTable.style.height = "100%";

// CallOut Arrow Cell
CallOutArrowCell.align = "right";
CallOutArrowCell.vAlign = "top";
CallOutArrowCell.style.fontSize = "1px";
CallOutArrowCell.style.paddingTop = "8px";

// Right CallOut Cell
CallOutCellRt.width = 20;
CallOutCellRt.align = "left";
CallOutCellRt.style.height = "100%";
CallOutCellRt.style.verticalAlign = "top";

// Right CallOut Table
CallOutTableRt.cellPadding = 0;
CallOutTableRt.cellSpacing = 0;
CallOutTableRt.border = 0;
CallOutTableRt.style.height = "100%";

// Right CallOut Arrow Cell
CallOutArrowCellRt.align = "left";
CallOutArrowCellRt.vAlign = "top";
CallOutArrowCellRt.style.fontSize = "1px";
CallOutArrowCellRt.style.paddingTop = "8px";

// Icon Cell
IconCell.width = 20;
IconCell.style.borderTop = "1px solid black";
IconCell.style.borderLeft = "1px solid black";
IconCell.style.borderBottom = "1px solid black";
IconCell.style.padding = "5px";
IconCell.style.backgroundColor = 'LemonChiffon';

// Icon Image
IconImage.border = 0;
IconImage.src = "images/Warning.gif";

// Message Cell
MessageCell.id = "tdErrMsg";
MessageCell.style.backgroundColor = 'LemonChiffon';
MessageCell.style.fontFamily = 'verdana';
MessageCell.style.fontSize = '10px';
MessageCell.style.padding = "5px";
MessageCell.style.borderTop = "1px solid black";
MessageCell.style.borderBottom = "1px solid black";
MessageCell.width = '100%';

// Close Cell
CloseCell.style.borderTop = "1px solid black";
CloseCell.style.borderRight = "1px solid black";
CloseCell.style.borderBottom = "1px solid black";
CloseCell.style.backgroundColor = 'lemonchiffon';
CloseCell.style.verticalAlign = 'top';
CloseCell.style.textAlign = 'right';
CloseCell.style.padding = '2px';

// Close Image
CloseImage.src = "images/Close.gif";
CloseImage.style.cursor = 'pointer';
CloseImage.onclick = ClosePopOut;

// Attach PopOut to "PopOutContainer"
function AttachPopOut(BgColor,IconSrc,CloseImgSrc)
{

    // Create the DOM tree
    var pCont = document.getElementById("PopOutContainer")
    pCont.appendChild(PopOutTable)
                
    PopOutTable.appendChild(PopOutTableBody);
    PopOutTableBody.appendChild(PopOutTableRow);
    PopOutTableRow.appendChild(CallOutCell);
    CallOutCell.appendChild(CallOutTable);
    CallOutTable.appendChild(CallOutTableBody);
    CallOutTableBody.appendChild(CallOutTableRow);
    CallOutTableRow.appendChild(CallOutArrowCell);
    PopOutTableRow.appendChild(IconCell);
    IconCell.appendChild(IconImage);
    PopOutTableRow.appendChild(MessageCell);
    PopOutTableRow.appendChild(CloseCell);
    CloseCell.appendChild(CloseImage);
    
    // Popout Arrow on Right Side
    PopOutTableRow.appendChild(CallOutCellRt);
    CallOutCellRt.appendChild(CallOutTableRt);
    CallOutTableRt.appendChild(CallOutTableBodyRt);
    CallOutTableBodyRt.appendChild(CallOutTableRowRt);
    CallOutTableRowRt.appendChild(CallOutArrowCellRt);
        
    // Assign Style
    IconCell.style.backgroundColor = BgColor;
    MessageCell.style.backgroundColor = BgColor;
    CloseCell.style.backgroundColor = BgColor;
    IconImage.src = IconSrc;
    CloseImage.src = CloseImgSrc;
    
}

function ShowPopOut_Left(objectID,message)
{

    CallOutArrowCellRt.innerHTML = ""

    // Create CallOut Arrow
    var div = document.createElement("div");
    div.style.fontSize = "1px";
    div.style.position = "relative";
    div.style.right = "1px";
    div.style.borderTop = "1px solid black";
    div.style.width = "15px";
    
    CallOutArrowCellRt.appendChild(div);        

    for(var i = 14; i > 0; i--)
    {
        var line = document.createElement("div");
            line.style.width = i.toString() + "px";
            line.style.height = "1px";
            line.style.overflow = "hidden";
            line.style.borderRight = "1px solid black";
            line.style.backgroundColor = 'lemonchiffon';
            div.appendChild(line);
    }
    
    var p = document.getElementById(objectID);
    var pCont = document.getElementById('PopOutContainer');
            
    var top  = null;
    var right = null;
        
    top = p.offsetTop;
    left = p.offsetLeft - 212
              
    while (p = p.offsetParent) {
	    top += p.offsetTop;
	    left += p.offsetLeft;
    }
        
    pCont.style.position   = "absolute";
    pCont.style.top        = top + 'px';
    pCont.style.left       = left + 'px';
    pCont.style.visibility = "visible";
    
    MessageCell.innerHTML = message;
                
}


// Show PopOut Right    
function ShowPopOut_Right(objectID,message)
{

    CallOutArrowCell.innerHTML = ""

    // Create CallOut Arrow
    var div = document.createElement("div");
    div.style.fontSize = "1px";
    div.style.position = "relative";
    div.style.left = "1px";
    div.style.borderTop = "1px solid black";
    div.style.width = "15px";
    
    CallOutArrowCell.appendChild(div);        

    for(var i = 14; i > 0; i--)
    {
        var line = document.createElement("div");
            line.style.width = i.toString() + "px";
            line.style.height = "1px";
            line.style.overflow = "hidden";
            line.style.borderLeft = "1px solid black";
            line.style.backgroundColor = 'lemonchiffon';
            div.appendChild(line);
    }
    
    var p = document.getElementById(objectID);
    var pCont = document.getElementById('PopOutContainer');
            
    var top  = null;
    var right = null;
        
    top = p.offsetTop;
    left = p.offsetLeft + p.offsetWidth + 2;
              
    while (p = p.offsetParent) {
	    top += p.offsetTop;
	    left += p.offsetLeft;
    }
        
    pCont.style.position   = "absolute";
    pCont.style.top        = top + 'px';
    pCont.style.left       = left + 'px';
    pCont.style.visibility = "visible";
    
    MessageCell.innerHTML = message;
                
}

// Hide PopOut form object onBlur has a length    
function ClearPopOut(objectID){
    
    var pCont = document.getElementById('PopOutContainer');
    var obj = document.getElementById(objectID);
    var objValue = TrimLeftRight(obj.value);
        
    if (objValue.length > 0){ pCont.style.visibility = "hidden";}
        
}
    
// Hide PopOut
function ClosePopOut(){
    var pCont = document.getElementById('PopOutContainer');
    pCont.style.visibility = "hidden";
}
    
// Trim left and right of string
function TrimLeftRight(sString) 
{
    while (sString.substring(0,1) == ' ')
    {
        sString = sString.substring(1, sString.length);
    }
        
    while (sString.substring(sString.length-1, sString.length) == ' ')
    {
        sString = sString.substring(0,sString.length-1);
    }
        
    return sString;
    
}