﻿/*
* @author         Dennis Milandt
*/


var displayJsHelpBox = true;



/*************************/
/* User Interface        */
/*************************/
var UI =
{

    /*************************/
    /* Initialize            */
    /*************************/
    init: function ()
    {
        UI.TopNav.init();
        UI.SubNav.init();
        UI.Login.init();
        UI.SectionFrontPage.init();
        UI.Teasers.init();
        UI.Tables.init();
        UI.Accordion.init();
        UI.Boxes.init();

        UI.Forms.init();
        //		UI.FocusAreas.init();
        //		UI.Stories.init();
        //		UI.Lists.init();
        //		UI.ThumbLists.init();

        $(window).load(UI.Forms.init);
        $(window).load(UI.FocusAreas.init);
        $(window).load(UI.Stories.init);
        $(window).load(UI.Lists.init);
        $(window).load(UI.ThumbLists.init);
    },



    /*************************/
    /* Page                  */
    /*************************/
    Page:
	{
	    adjustHeight: function ()
	    {
	        $('#page').css('height', 'auto');
	        var pageHeight = $('#page').height();
	        var pageTop = Utils.getAbsTop($('#page'));
	        var windowHeight = $(window).height();

	        var newPageHeight = windowHeight - pageTop;

	        if (pageHeight < newPageHeight)
	            $('#page').css('height', (newPageHeight) + 'px');
	    }
	},



    /*************************/
    /* Page                  */
    /*************************/
    SectionFrontPage:
	{
	    init: function ()
	    {
	        var stories = $('.subStory');
	        if (stories.length >= 2)
	        {
	            if ($(stories[0]).height() > $(stories[1]).height())
	                $(stories[1]).css('height', $(stories[0]).height() + 'px');

	            if ($(stories[0]).height() < $(stories[1]).height())
	                $(stories[0]).css('height', $(stories[1]).height() + 'px');
	        }
	        if (stories.length >= 4)
	        {
	            if ($(stories[2]).height() > $(stories[3]).height())
	                $(stories[3]).css('height', $(stories[2]).height() + 'px');

	            if ($(stories[2]).height() < $(stories[3]).height())
	                $(stories[2]).css('height', $(stories[3]).height() + 'px');
	        }
	    }
	},



    /*************************/
    /* Boxes                 */
    /*************************/
    Boxes:
	{
	    // Initialize Boxes
	    init: function ()
	    {
	        $('.box').each(function ()
	        {
	            UI.Boxes.drawCorners($(this));
	        });
	    },

	    drawCorners: function (obj)
	    {
	        $(obj).prepend('<span class="corner upper-left"></span>');
	        $(obj).prepend('<span class="corner upper-right"></span>');
	        $(obj).prepend('<span class="corner lower-right"></span>');
	        $(obj).prepend('<span class="corner lower-left"></span>');
	    },

	    drawUpperCorners: function (obj)
	    {
	        $(obj).prepend('<span class="corner upper-left"></span>');
	        $(obj).prepend('<span class="corner upper-right"></span>');
	    },

	    drawRightCorners: function (obj)
	    {
	        $(obj).prepend('<span class="corner upper-right"></span>');
	        $(obj).prepend('<span class="corner lower-right"></span>');
	    },

	    drawLowerCorners: function (obj)
	    {
	        $(obj).prepend('<span class="corner lower-right"></span>');
	        $(obj).prepend('<span class="corner lower-left"></span>');
	    },

	    drawLeftCorners: function (obj)
	    {
	        $(obj).prepend('<span class="corner upper-left"></span>');
	        $(obj).prepend('<span class="corner lower-left"></span>');
	    }
	},



    /*************************/
    /* Accordion             */
    /*************************/
    Accordion:
	{
	    // Initialize Boxes
	    init: function ()
	    {
	        // Add Accordion logic
	        $('.accordion').each(function ()
	        {
	            if (!$(this).hasClass('disabled'))
	            {
	                $(this).accordion({
	                    autoHeight: false,
	                    animated: 'easeslide',
	                    clearStyle: true
	                });

	                $(this).find('.header').css('cursor', 'pointer');
	            }
	        });

	        // Remove bottom corners for accordion top
	        $('.accordionTop span.corner.lower-left, .accordionTop span.corner.lower-right,').each(function ()
	        {
	            $(this).remove();
	        });

	        // Remove corners for accordion headers
	        $('.accordion .header span.corner').each(function ()
	        {
	            $(this).remove();
	        });

	        // Draw corners for last accorion body
	        UI.Boxes.drawCorners($('.accordion .body'));

	        $('.accordion .header').click(function () { $(this).blur(); });
	    }
	},


    /*************************/
    /* Forms                 */
    /*************************/
    Forms:
	{
	    // Initialize Forms
	    init: function ()
	    {
	        $('input.txt').each(function ()
	        {
	            UI.Forms.replaceInlineLabels($(this));
	        });
	    },

	    // Replace inline labels for input text fields
	    replaceInlineLabels: function (input)
	    {
	        var id = $(input).attr('id');
	        var label = $('label.overlayLabel[for=' + id + ']');
	        if (label.length > 0)
	        {
	            label.addClass('jsEnabled');

	            var pos = $(input).position();
	            label.css('top', pos.top - 1 + 'px');
	            label.css('left', pos.left + 'px');

	            var labelText = label.text();
	            var currentText = input.val();

	            if (currentText != '')
	                label.hide();

	            input.blur();

	            input.unbind('focus');
	            input.focus(function ()
	            {
	                label.fadeOut(100);

	                if ($(this).hasClass("loginInputUsername"))
	                    $(".loginLabelPassword").fadeOut(100);
	            });

	            input.unbind('blur');
	            input.blur(function ()
	            {
	                if ($(this).val() == '')
	                    label.fadeIn(100);

	                if ($(this).val() != '' && $(this).hasClass("loginInputUsername"))
	                    $(".loginLabelPassword").fadeOut(100);
	            });
	        }
	    }
	},



    /*************************/
    /* Top-navigation        */
    /*************************/
    TopNav:
	{
	    // Initialize Top-navigation
	    init: function ()
	    {
	        // Preload Top Navigation images
	        $.preloadImages('/images/topnav/btn_arrangementer_hover.png', '/images/topnav/btn_foreningsnet_hover.png', '/images/topnav/btn_idraet_hover.png', '/images/topnav/btn_sundhed_hover.png');
	        $.preloadImages('/images/topnav/btn_arrangementer_inactive.png', '/images/topnav/btn_foreningsnet_inactive.png', '/images/topnav/btn_idraet_inactive.png', '/images/topnav/btn_sundhed_inactive.png');
	        $.preloadImages('/images/topnav/btn_arrangementer_active.png', '/images/topnav/btn_foreningsnet_active.png', '/images/topnav/btn_idraet_active.png', '/images/topnav/btn_sundhed_active.png');

	        // Top navigation hover effect
	        $('#topnav li:not(.active) img').hover(
			function ()
			{
			    var src = $(this).attr('src');
			    $(this).attr('src', src.replace('_inactive', '_hover'));
			},
			function ()
			{
			    var src = $(this).attr('src');
			    $(this).attr('src', src.replace('_hover', '_inactive'));
			});

	        // Init Top nav info text
	        $('#topnavInfo p').text($('#topnav li.active img').attr('longdesc'));

	        // Top nav info hover effects
	        $('#topnav img, a.btn-login img').hover(
			function ()
			{
			    $('#topnavInfo p').text($(this).attr('longdesc'));
			},
			function ()
			{
			    if ($('#topnav li.active img').attr('longdesc') != null)
			        $('#topnavInfo p').text($('#topnav li.active img').attr('longdesc'));
			    else
			        $('#topnavInfo p').text('');
			});
	    }
	},



    /*************************/
    /* Sub-navigation        */
    /*************************/
    SubNav:
	{
	    // Initialize Sub-navigation
	    init: function ()
	    {
	        UI.Boxes.drawCorners($('#subnav'));
	        UI.Boxes.drawCorners($('#subnav li:not(.seperator) a'));

	        $('#subnav li a').click(function () { this.blur(); });

	        $('#subnav li.folder > a').click(function ()
	        {
	            $(this).parent().find("ul").slideToggle();
	            return false;
	        });
	    }
	},



    /*************************/
    /* Stories               */
    /*************************/
    Stories:
	{
	    // Initialize Stories
	    init: function ()
	    {
	        $('.story.product').each(function ()
	        {
	            if ($(this).find('.storyImage').length == 0)
	                UI.Boxes.drawCorners($(this));
	            else
	                UI.Boxes.drawLowerCorners($(this));
	        });

	        $('.story').each(function ()
	        {
	            if ($(this).hasClass('subStory') && !$(this).hasClass('product'))
	                $(this).find('p:last').append("<span class=arrow onclick=\"window.location='" + $(this).find('a').attr('href') + "'\"></span>");
	        });

	        $('.story .storyImage').each(function ()
	        {
	            $(this).append('<span class="imageBorder bottom"></span>');
	            $(this).find('a').append('<span class="imageBorderHover"></span>');

	            // Set imageBorderHover width and height
	            var imageBorderHover = $(this).find('.imageBorderHover');
	            imageBorderHover.css('width', $(this).width() - 2 + 'px');
	            imageBorderHover.css('height', $(this).height() - 2 + 'px');
	        });
	    }
	},



    /*************************/
    /* Lists                 */
    /*************************/
    Lists:
	{
	    // Initialize Lists
	    init: function ()
	    {
	        $('.list:not(.personSearch) .listItemImage').each(function ()
	        {
	            if (!$(this).parents('.list').hasClass('border'))
	            {
	                $(this).append('<span class="imageBorder right"></span>');
	            }

	            $(this).find('a').append('<span class="imageBorderHover"></span>');

	            // Set imageBorderHover height and height
	            var imageBorderHover = $(this).find('.imageBorderHover');
	            imageBorderHover.css('width', $(this).width() - 2 + 'px');
	            imageBorderHover.css('height', $(this).height() - 2 + 'px');
	        });

	        $('.list.arrows .item .listItemContent').each(function ()
	        {
	            $(this).find('p:last').append('<span class="arrow"></span>');
	        });

	        $('.list .item').each(function ()
	        {
	            // List Item Header
	            UI.Boxes.drawUpperCorners($(this).find('.listItemHeader'));

	            // List Content
	            if (!$(this).parents('.list:not(.personSearch)').hasClass('border'))
	            {
	                if ($(this).find('.listItemImage').length > 0)
	                    UI.Boxes.drawRightCorners($(this));
	                else
	                    UI.Boxes.drawCorners($(this));
	            }
	            else if ($(this).find('.listItemHeader').length > 0)
	                UI.Boxes.drawLowerCorners($(this));
	            else
	                UI.Boxes.drawCorners($(this));

	            // List Extra
	            if ($(this).find('.listExtra').length > 0 || $(this).parents('.list').hasClass('border'))
	            {
	                UI.Boxes.drawLowerCorners($(this));
	            }
	        });
	    }
	},



    /*************************/
    /* Thumbnail Lists       */
    /*************************/
    ThumbLists:
	{
	    // Initialize ThumbLists
	    init: function ()
	    {
	        $('.thumbList .thumb').each(function ()
	        {
	            $(this).find('a').append('<span class="imageBorderHover"></span>');

	            // Set imageBorderHover height and height
	            var imageBorderHover = $(this).find('.imageBorderHover');
	            imageBorderHover.css('width', $(this).width() - 2 + 'px');
	            imageBorderHover.css('height', $(this).height() - 2 + 'px');
	        });
	    }
	},



    /*************************/
    /* Teasers               */
    /*************************/
    Teasers:
	{
	    // Initialize Sub-navigation
	    init: function ()
	    {
	        UI.Boxes.drawCorners($('#main .teaser:not(:has(.image))'));
	        UI.Boxes.drawLowerCorners($('#main .teaser:has(.image)'));
	        UI.Boxes.drawUpperCorners($('#main .teaser .image.border'));

	        UI.Boxes.drawUpperCorners($('#main .teaser:not(:has(.image)) .top'));
	        UI.Boxes.drawLowerCorners($('#main .teaser.factbox .top'));
	    }
	},



    /*************************/
    /* Tables                */
    /*************************/
    Tables:
	{
	    // Initialize Sub-navigation
	    init: function ()
	    {
	        $('table.textcols tr').each(function ()
	        {
	            $(this).find('td:last').addClass('last');
	        });
	    }
	},



    /*************************/
    /* FocusAreas            */
    /*************************/
    FocusAreas:
	{
	    // Initialize Sub-navigation
	    init: function ()
	    {
	        UI.Boxes.drawCorners($('#main .focusarea'));

	        $('#main .focusarea .focus').each(function ()
	        {
	            var boxHeight = $(this).parent().height();
	            var thisHeight = $(this).height();
	            if (thisHeight < boxHeight)
	                $(this).css('height', boxHeight + 'px');
	            else
	                $(this).parent().css('height', thisHeight + 'px');
	        });

	        // Add additional top, right and left border to story images in Focus Areas
	        $('#main .focusarea .story .storyImage').each(function ()
	        {
	            $(this).append('<span class="imageBorder top"></span>');
	            $(this).append('<span class="imageBorder right"></span>');
	            $(this).append('<span class="imageBorder left"></span>');
	        });
	    }
	},


    /*************************/
    /* Login                 */
    /*************************/
    Login:
	{
	    // Initialize Login
	    init: function ()
	    {
	        $('a.btn-login').toggle(
			function ()
			{
			    UI.Login.display();
			    $(this).blur();
			    return false;
			},
			function ()
			{
			    UI.Login.hide();
			    $(this).blur();
			    return false;
			});
	    },

	    // Display Login box
	    display: function ()
	    {
	        $('#login').fadeIn(400);
	        UI.Login.reset();
	    },

	    // Hide Login box
	    hide: function ()
	    {
	        $('#login').fadeOut(200);
	        UI.Login.reset();
	    },

	    // Reset Login box form fields
	    reset: function ()
	    {
	        $('#login input.txt').val('');
	        $('#login input.chk').attr('checked', '');

	        $('#login input.txt').each(function ()
	        {
	            UI.Forms.replaceInlineLabels($(this));
	        });
	    }
	},

    /*************************/
    /* Validation            */
    /*************************/
    Validation:
	{
	    DropdownRequiredValidator: function (sender, args)
	    {
	        if (args.Value != '-1')
	            args.IsValid = true;
	        else
	            args.IsValid = false;
	    },

	    DateFormatValidator: function (sender, args)
	    {
	        var d1 = Date.parseExact(args.Value, 'd-M-yyyy');

	        if (d1 != null)
	            args.IsValid = true;
	        else
	            args.IsValid = false;
	    }
	},

    /*************************/
    /* Help                  */
    /*************************/
    Help:
	{
	    init: function ()
	    {
	        $('input, select, div').each(function ()
	        {
	            if ($(this).attr('label') != undefined && $(this).attr('label') != '')
	            {
	                if (this.nodeName.toLowerCase() == 'input' || this.nodeName.toLowerCase() == 'select')
	                    UI.Help.add($(this).attr('label'), $(this).attr('id'));
	                else if (this.nodeName.toLowerCase() == 'div')
	                    UI.Help.add($(this).attr('label'), $(this).find('input').first().attr('id'));
	            }
	        });
	    },

	    add: function (msg, objId)
	    {
	        if (objId == undefined || objId == '')
	            return;

	        var obj = $('#' + objId);

	        $(obj).bind('focus', function ()
	        {
	            if (displayJsHelpBox)
	            {
	                var helpBox = $('#jsHelpBox');
	                if (helpBox.length == 0)
	                {
	                    $('body').append('<div id="jsHelpBox" style="display:none; border:1px solid black; z-index:2; text-align:left; position:absolute; width:150px; padding:6px 15px; background-color:#e8dd30;"></div>');
	                    helpBox = $('#jsHelpBox');
	                }

	                var left = Utils.getAbsLeft(obj);
	                var top = Utils.getAbsTop(obj);

	                helpBox.html(msg);
	                helpBox.fadeIn('fast');

	                var height = helpBox.height();

	                helpBox.css('left', left + 'px').css('top', (top - height - 40) + 'px');
	            }

	        });

	        $(obj).bind('blur', function ()
	        {
	            var helpBox = $('#jsHelpBox');
	            helpBox.hide();
	        });
	    }
	}
}