

(function ($) {

    $.fn.notificationBar = function () {
        $this = $(this);
        $this.css({ "visibility": 'hidden' });
        $this.css({ "margin-top": $("#NotificationBarContent").height() + 'px' });
        //alert("Blah");
    }

    //----------------------------------------------------------------------

    var timeout;
    $.fn.notificationBar.showMessage = function (params) {
        if (!document.getElementById("NotificationBar")) {
            $.fn.notificationBar.createNotificationBar();
        }

        var msgHTML = new String();

        // Create the title HTML
        var titleIcon = new String();

        if (params.TitleIcon) {
            titleIcon = params.TitleIcon;
        } else {
            titleIcon = $.fn.notificationBar.defaults.titleIcon;
        }

        // Create the title HTML
        var MsgTitle = new String();

        if (params.MsgTitle) {
            MsgTitle = params.MsgTitle;
        } else {
            MsgTitle = $.fn.notificationBar.defaults.msgTitle;
        }



        var titleHTML = '<h5 class="Icon EmbeddedLeft CentreVertically Title ' + titleIcon + '">' + MsgTitle + '</h5>';
        msgHTML += titleHTML;

        // Create the message HTML
        for (var i = 0; i < params.MsgList.length; i++) {
            var thisIcon = new String();
            var thisMsg = new String();

            if (params.MsgList[i].Icon) {
                thisIcon = params.MsgList[i].Icon
            } else if (params.DefaultIcon) {
                thisIcon = params.DefaultIcon;
            } else {
                thisIcon = "";
            }

            if (params.MsgList[i].Msg) {
                thisMsg = params.MsgList[i].Msg
            }
            msgHTML += '<p class="Icon EmbeddedLeft ' + thisIcon + '">' + thisMsg + '</p>';
        }


        $("#NotificationBarContent").html(msgHTML);
        var barHeight = $("#NotificationBarContent").height();


        // Set the length of time the message will be displayed for
        var displayTime;

        if (params.Time) {
            displayTime = params.Time;
        } else {
            displayTime = $.fn.notificationBar.defaults.time;
        }

        // If notifiacation bar is closed..
        if ($this.css('visibility') == 'hidden') {
            $this.css({ "margin-top": -barHeight });
            $this.css({ "visibility": 'visible' });

            // Open notifiacation bar and start a timer to close it after a certain time
            $this.animate({ marginTop: "0px" }, 500, function () {
                timeout = setTimeout('$.fn.notificationBar.hideMessage()', displayTime);
            });

        // else If notifiacation bar is open..
        } else {
            clearTimeout(timeout);
            $this.clearQueue();
            $this.stop();

            $this.animate({ marginTop: "0px" }, 500, function () {
                timeout = setTimeout('$.fn.notificationBar.hideMessage()', displayTime);
            });
            // Close the notification bar
            /*$this.animate({ marginTop: -barHeight }, 500, function () {
                $this.css({ "visibility": 'hidden' });
            });*/
        }
    };

    //----------------------------------------------------------------------

    $.fn.notificationBar.createNotificationBar = function () {
        var barHTML = new String();

        barHTML += '<div id="NotificationBar">';
        barHTML += '<div class="CenteredContainer">';
        barHTML += '<div id="NotificationBarContent"></div>';
        barHTML += '</div></div>';

        $('body').prepend(barHTML);
        $("#NotificationBar").notificationBar({});

    };
    //----------------------------------------------------------------------

    $.fn.notificationBar.hideMessage = function () {
        clearTimeout(timeout);
        var barHeight = $("#NotificationBarContent").height();
        $this.animate({ marginTop: -barHeight }, 500, function () {
            $this.css({ "visibility": 'hidden' });
        });
    };

    //----------------------------------------------------------------------

    $.fn.notificationBar.defaults = {
        time: 5000,
        titleIcon: 'AddNew',
        msgTitle: 'Default message title'
    };

    //----------------------------------------------------------------------

    $.fn.notificationBar.highlightValidatedAreas = function (_validatedObjects) {
        // Remove any pre existing highlight areas
        if (validationAreas.length) {
            $.fn.notificationBar.removeAllHighlights();
        }

        for (var i = 0; i < _validatedObjects.length; i++) {
            var newHighlight = $.fn.notificationBar.createNewHighlightArea($(_validatedObjects[i]));
            validationAreas.push(newHighlight);
        }
    };

    //----------------------------------------------------------------------

    $.fn.notificationBar.validationIconExists = function (_id) {
        if ($("#" + _id).attr("id")) {
            return true;
        }
        return false;
    };

    //----------------------------------------------------------------------

    var validationAreas = [];
    var highlightClass = "ValidationHighlightArea";

    // Create an event handler to reposition the highlights when the document resizes
    jQuery(document).resize(repositionHighlights)

    $.fn.notificationBar.createNewHighlightArea = function (_validatedObject) {

        // Create a new id prefix for this highlight
        var highlightID = _validatedObject.attr('id') + "_Highlight";


        // If this element is not already 'highlighted' then create new highlight
        if (!$.fn.notificationBar.validationIconExists(highlightID + "Top")) {
            /*var padding = 5;
            var highlightBorderWidth = 1;
            var highlightWidth = _validatedObject.outerWidth() - (highlightBorderWidth * 2);
            var highlightHeight = _validatedObject.outerHeight() - (highlightBorderWidth * 2);
            var highlightPosition = _validatedObject.offset();
            */
            var params = $.fn.notificationBar.initHighlightParams(_validatedObject);

            var highlightArea = new String();

            // Top border
            highlightArea += '<div';
            highlightArea += ' id="' + highlightID + 'Top"';
            highlightArea += ' class="' + highlightClass + '"';
            highlightArea += ' style="float:left; position:absolute; z-index:9999;';
            highlightArea += ' left: ' + params.highlightPosition.left + 'px;';
            highlightArea += ' top: ' + params.highlightPosition.top + 'px;';
            highlightArea += ' width: ' + params.highlightWidth + 'px;';
            highlightArea += ' height:' + params.highlightBorderWidth + 'px;">';
            highlightArea += '</div>';

            // Bottom border
            highlightArea += '<div';
            highlightArea += ' id="' + highlightID + 'Bottom"';
            highlightArea += ' class="' + highlightClass + '"';
            highlightArea += ' style="float:left; position:absolute; z-index:9999;';
            highlightArea += ' left: ' + params.highlightPosition.left + 'px;';
            highlightArea += ' top: ' + (params.highlightPosition.top + params.highlightHeight) + 'px;';
            highlightArea += ' width: ' + params.highlightWidth + 'px;';
            highlightArea += ' height:' + params.highlightBorderWidth + 'px;">';
            highlightArea += '</div>';

            // Left border
            highlightArea += '<div';
            highlightArea += ' id="' + highlightID + 'Left"';
            highlightArea += ' class="' + highlightClass + '"';
            highlightArea += ' style="float:left; position:absolute; z-index:9999;';
            highlightArea += ' left: ' + params.highlightPosition.left + 'px;';
            highlightArea += ' top: ' + params.highlightPosition.top + 'px;';
            highlightArea += ' width: ' + params.highlightBorderWidth + 'px;';
            highlightArea += ' height:' + params.highlightHeight + 'px;">';
            highlightArea += '</div>';

            // Right border
            highlightArea += '<div';
            highlightArea += ' id="' + highlightID + 'Right"';
            highlightArea += ' class="' + highlightClass + '"';
            highlightArea += ' style="float:left; position:absolute; z-index:9999;';
            highlightArea += ' left: ' + (params.highlightPosition.left + params.highlightWidth) + 'px;';
            highlightArea += ' top: ' + params.highlightPosition.top + 'px;';
            highlightArea += ' width: ' + params.highlightBorderWidth + 'px;';
            highlightArea += ' height:' + params.highlightHeight + 'px;">';
            highlightArea += '</div>';

            //alert(highlightArea);
            $('body').prepend(highlightArea);

            var newHighlight = [document.getElementById(highlightID + "Top"),
                                document.getElementById(highlightID + "Right"),
                                document.getElementById(highlightID + "Bottom"),
                                document.getElementById(highlightID + "Left"),
								_validatedObject];

            $(_validatedObject).bind('click', function () {
                for (var i = 0; i < newHighlight.length - 1; i++) {
                    $(newHighlight[i]).remove();
                }
            });

            return newHighlight;
        }
    }

    //----------------------------------------------------------------------

    $.fn.notificationBar.removeAllHighlights = function () {
        for (var i = 0; i < validationAreas.length; i++) {
            for (var j = 0; j < validationAreas[i].length - 1; j++) {
                $(validationAreas[i][j]).remove();
            }
            validationAreas[i].splice(i, 1);
        }
    };

    //----------------------------------------------------------------------

    $.fn.notificationBar.initHighlightParams = function (_validatedObject) {
        //var validatedObject = validationAreas[validationAreas[i].length-1];
        var padding = 5;
        var highlightBorderWidth = 1;
        var highlightWidth = _validatedObject.outerWidth() - (highlightBorderWidth * 2);
        var highlightHeight = _validatedObject.outerHeight() - (highlightBorderWidth * 2);
        var highlightPosition = _validatedObject.offset();

        return { padding: padding, highlightBorderWidth: highlightBorderWidth, highlightWidth: highlightWidth, highlightHeight: highlightHeight, highlightPosition: highlightPosition }
    };

    //----------------------------------------------------------------------

    function repositionHighlights() {
        for (var i = 0; i < validationAreas.length; i++) {

            var validatedObject = validationAreas[i][validationAreas[i].length - 1];

            var params = $.fn.notificationBar.initHighlightParams(validatedObject);
            var newCoords = [];
            //Top
            newCoords.push({ left: params.highlightPosition.left, top: params.highlightPosition.top });
            //Right
            newCoords.push({ left: (params.highlightPosition.left + params.highlightWidth), top: params.highlightPosition.top });
            //Bottom
            newCoords.push({ left: params.highlightPosition.left, top: (params.highlightPosition.top + params.highlightHeight) });
            //Left
            newCoords.push({ left: params.highlightPosition.left, top: params.highlightPosition.top });

            //alert(newCoords[j].left+"  :  "+newCoords[j].top);
            for (var j = 0; j < validationAreas[i].length - 1; j++) {
                // $(validationAreas[i][j]).remove();
                $(validationAreas[i][j]).css('left', newCoords[j].left);
                $(validationAreas[i][j]).css('top', newCoords[j].top);
            }
        }
    };


})(jQuery);
