if( typeof namespace == 'undefined' ){
	namespace = {};
}

$(document).ready(function() {
	namespace.popup.init();
});

namespace.popup =
{

    /////////////////////////////////////////////
    // Define the properties of the class
    /////////////////////////////////////////////
    popupId: 'popup',
    popupLinkClass: 'popupLink',
    examplePublicProperty: null,

    /////////////////////////////////////////////
    // Function - namespace.popup.init
    /////////////////////////////////////////////
    init: function() {

        if ($('.' + this.popupLinkClass).size() != 0) {
            this.createDOM();
            this.setActions();
        }
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.createDOM
    /////////////////////////////////////////////
    createDOM: function() {
        var DOM = '<div class="container"><div class="title"><div class="left"></div><div class="mid"><div><h2 id="popupTitle"></h2></div></div><div class="right"></div></div><div class="body"><ul><li class="content"><div id="popupContent"></div></li><li class="bottom"><div class="bottom"><div class="left"></div><div class="mid"><div></div></div><div class="right"></div></div></li></ul></div></div>';

        document.getElementById('popup').innerHTML = DOM;

    },

    /////////////////////////////////////////////
    // Function - namespace.popup.setActions
    /////////////////////////////////////////////
    setActions: function() {
        $('.' + this.popupLinkClass).each(function() {
            $(this).mouseover(function() {
                namespace.popup.setContent($(this));
                namespace.popup.setSize();
                namespace.popup.setPosition($(this));
                namespace.popup.show();
                $('#footer').css('z-index', '-2');
            });

            $(this).mouseout(function() {
                namespace.popup.hideAndReset();
                $('#footer').css('z-index', '2');
            });

            $(this).click(function() {
                return false;
            });
        });
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.setContent
    /////////////////////////////////////////////
    setContent: function(e) {
        $('#' + namespace.popup.popupId + ' #popupTitle').html(e.attr('popupTitle'));

        $('#' + namespace.popup.popupId + ' #popupContent').html($('#' + e.attr('popupContentId')).html());
        $('#' + namespace.popup.popupId + ' #popupContent').css("margin", "0px !important");
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.setSize
    /////////////////////////////////////////////
    setSize: function(e) {
        var columns = $('#' + namespace.popup.popupId + ' #popupContent ul li').size() - $('#' + namespace.popup.popupId + ' #popupContent ul li ul li').size();

        $('#' + namespace.popup.popupId + ' .container').css('width', 100 + 160 * columns);
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.setPosition
    /////////////////////////////////////////////
    setPosition: function(e) {
        var left = 0;
        if (document.location.href.toLowerCase().indexOf("class") >= 0) {
            left = e.parent().width() + parseInt($('#' + namespace.popup.popupId + ' .container').css('width')) + 100;
        }
        else {
            left = e.offset().left - $('#wrapper').offset().left - 20 - parseInt($('#' + namespace.popup.popupId + ' .container').css('width'));
        }
        var top = e.offset().top - 95;
        $('#' + namespace.popup.popupId).css('top', top );
        $('#' + namespace.popup.popupId).css('left', left);
        
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.show
    /////////////////////////////////////////////
    show: function() {
        $('#' + namespace.popup.popupId).show();

    },

    /////////////////////////////////////////////
    // Function - namespace.popup.hideAndReset
    /////////////////////////////////////////////
    hideAndReset: function() {
        $('#' + this.popupId).hide();
        $('#' + this.popupId + ' #popupTitle').html('');
        $('#' + this.popupId + ' #popupContent').html('');
    },

    /////////////////////////////////////////////
    // Function - namespace.popup.temp
    /////////////////////////////////////////////
    temp: function(element) {

    }
};