﻿// JScript File

jQuery.fn.tipbox = function(content, options)
{
    // Extend our default options with those provided. Note that the first arg 
    // to extend is an empty object - this is to keep from overriding our "defaults" object.
    var useOptions = $.extend({}, jQuery.fn.tipbox.defaults, options);

    jQuery.fn.tipbox.created.id = useOptions.id;
    jQuery.fn.tipbox.background.id = useOptions.id + "_bg";
    $(useOptions.container).append(jQuery.fn.tipbox.created).append(jQuery.fn.tipbox.background);

      var _tipBox = new TipBoxObject();

    function BoxObject(width, height) 
    {
        var boxLeft=0; var boxTop=0;

        if (useOptions.alignY == 'middle') boxTop -= (height / 2);
        else if (useOptions.alignY == 'bottom') boxTop -= height;
        boxTop += useOptions.alignYOffset;

        if (useOptions.alignX == 'middle') boxLeft -= (width / 2);
        else if (useOptions.alignX == 'right') boxLeft -= width;
        boxLeft += useOptions.alignXOffset;

        this.width=width; this.height=height;
        this.left=boxLeft; this.top=boxTop; 

        var windowInfo = getWindowInfo();
        this.maxLeft = windowInfo.left + windowInfo.width - width - 15;
        this.maxTop = windowInfo.top + windowInfo.height - height - 15;
    }
    function TipBoxObject()
    {
        var _front = $(jQuery.fn.tipbox.created).css({"z-index": 2});
        var _back = $(jQuery.fn.tipbox.background).css({"z-index": 1});
        var _all = _front.add(_back).hide().css({"position": "absolute"});
        var _box;

        var _isShowing = false;

        function Initialise()
        {
                if (useOptions.allowHtml) _front.html(content); else _front.text(content);
                _front.removeClass().addClass(useOptions.className);

            _front.css({"left": "-10000px"}).show();
              _box = new BoxObject(_front.outerWidth(), _front.outerHeight());
            _front.hide();

            _back.css({ 
                "background-color": useOptions.backgroundColour, 
                "opacity": useOptions.backgroundOpacity, 
                "width": _box.width, "height": _box.height-1 
            });
            window.status = useOptions.statusMessage;
        }
        
        this.Show = function(e) {
              if (!_isShowing) Initialise();

            _all.css({
                "top": Math.min(e.pageY + _box.top, _box.maxTop), 
                "left": Math.min(e.pageX + _box.left, _box.maxLeft)
            });
        
                if (!_isShowing)
                {
                    if (useOptions.transition == 'fadeIn')          _back.fadeIn(useOptions.transitionSpeed, function() { _front.fadeIn("fast"); });
                    else if (useOptions.transition == 'slideDown')  _back.slideDown(useOptions.transitionSpeed, function() { _front.fadeIn("fast"); });
                    else                                            _back.show(useOptions.transitionSpeed, function() { _front.fadeIn("fast"); });

                _isShowing = true;
                }
        };
        
        this.Hide = function() {
                _all.stop(false, true).hide();
                _isShowing = false;

            window.status = '';
        };
    }

      //events for each element
      return this.each(function()
    {
        var addTipBoxTo = $(this);

        if (useOptions.addHoverLink == true)
        {
            addTipBoxTo = $('<a tabindex="1000"><span>' + useOptions.hoverLinkText + '</span></a>')
                .insertBefore(this)
                .click(function(){ return false; });

            if (useOptions.hoverLinkClassName) addTipBoxTo.addClass(useOptions.hoverLinkClassName);
          }

          addTipBoxTo
              .mousemove(function(e){ _tipBox.Show(e); })
              .mouseout(function(){ _tipBox.Hide(); });
    });
};

//create the element (avoiding create multiple divisions for the tipBox)
jQuery.fn.tipbox.created = document.createElement("div");
jQuery.fn.tipbox.background = document.createElement("div");

//create the default properties for the tipBox
jQuery.fn.tipbox.defaults = {
    allowHtml: true,
    className: '',
    id: 'tipBox',
    container: 'body',
    alignY: 'top',      // 'top' (default), 'middle' or 'bottom'
    alignX: 'left',     // 'left' (default), 'middle' or 'right'
    alignYOffset: 16,
    alignXOffset: 20,
    transition: 'show',  // 'show' (default), 'fadeIn', or 'slideDown'
    transitionSpeed: '',  // '' (default), 'slow', 'normal', or 'fast'
    statusMessage: 'tipBox',
    addHoverLink: false,
    hoverLinkClassName: 'tipBoxHelp',
    hoverLinkText: 'Help',
    backgroundColour: '#ffffff',
    backgroundOpacity: 1
};

// ************************************************************************************************************************
// Routine to get the size and scroll position of the Window (regardless of browser)
// ************************************************************************************************************************
function getWindowInfo() { 
    var scrOfX = 0, scrOfY = 0, myWidth = 0, myHeight = 0; 

    if( typeof(window.pageYOffset) == 'number' ) 
    { 
        with (window) //Netscape compliant 
        {
            scrOfY = pageYOffset; 
            scrOfX = pageXOffset; 
            myWidth = innerWidth; 
            myHeight = innerHeight; 
        }
    } 
    else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop || document.documentElement.clientWidth || document.documentElement.clientHeight) ) 
    { 
        with (document.documentElement) //IE6 standards compliant mode
        {
            scrOfY = scrollTop; 
            scrOfX = scrollLeft; 
            myWidth = clientWidth; 
            myHeight = clientHeight; 
        }
    } 
    else if( document.body && ( document.body.scrollLeft || document.body.scrollTop || document.body.clientWidth || document.body.clientHeight) ) 
    { 
        with (document.body) //DOM compliant
        { 
            scrOfY = scrollTop; 
            scrOfX = scrollLeft; 
            myWidth = clientWidth; 
            myHeight = clientHeight; 
        }
    } 
    return {left:scrOfX, top:scrOfY, width:myWidth, height:myHeight};
}

