﻿$(function() {
    var image_A_index = 1;
    var IMAGECHANGERS = new Array();
    var IMAGECHANGERSLENGTHS = new Array();
    var IMAGECHANGERSPOSITION = new Array();
    IMAGECHANGERS[0] = "image_A";
    IMAGECHANGERSLENGTHS[0] = 4;
    IMAGECHANGERSPOSITION[0] = 1;
    IMAGECHANGERS[1] = "image_B";
    IMAGECHANGERSLENGTHS[1] = 3;
    IMAGECHANGERSPOSITION[1] = 1;
    IMAGECHANGERS[2] = "image_C";
    IMAGECHANGERSLENGTHS[2] = 5;
    IMAGECHANGERSPOSITION[2] = 1;
    var NUMIMAGECHANGERS = 3;
    var $current_button = null;
    var LOGOTEXTPOSITION = 1;
    var $selected_section = null;
   
    // Set-up menu
    $.getJSON('./data/Mainmenu_stories.txt', function(data) 
    {
	$('#menu').empty();
        var first = true;
        $.each(data, function(entryIndex, entry) 
        {
            var ident = entry['ident'];
            var text = entry['text'];
            var left = entry['left'];
            var HTML = '<div class="menuheader" id="' + ident + '" style="left: ' + left + ';">';
            HTML += '<div class="menuoverimage"></div>';
            HTML += '<div class="menuselimage"></div>';
            HTML += '<div class="menutext">' + text + '</div>';
            HTML += '</div>';
            $('#menu').append(HTML);
            if (first)
            {
               $selected_section = $('#' + ident);
               first = false;
            }
        });

        $('.menubox').fadeOut(0);
        $('.menuoverimage').fadeOut(0);
        $('.menuselimage').fadeOut(0);
        $selected_section.children('.menuselimage').fadeIn(0);
        $selected_section.children('.menutext').css('color', 'White');
        var section_id = $selected_section.attr('id');
        LoadSection(section_id);
    });
    
    setInterval(DoImageChanges, 5000);
    
    // Menu rollovers
    $('.menuheader').live("mouseenter", function()
    {
        $(this).children('.menuoverimage').fadeIn(200);
    });

    $('.menuheader').live("mouseleave", function()
    {
        $(this).children('.menuoverimage').fadeOut(200);
    });
     
    $('.menuheader').live("click", function()
    {
        SetSelectedSection($(this));
    });
   
    // Side item actions
    $('.storyitem').live("mouseenter", function()
    {
        $(this).children('.storyitemoverimage').fadeIn(200);
    });
    $('.storyitem').live("mouseleave", function()
    {
        $(this).children('.storyitemoverimage').fadeOut(200);
    })
    
    $('.storyitem').live("click", function()
    {
        SetSelectedStory($(this));
    });

    $('.CMS_rollover_box').live("mouseenter", function()
    {
        var classes = $(this).attr('class');
        $(this).removeClass(classes);
        classes = classes.replace("_normal", "_over");
        $(this).addClass(classes);
    });

    $('.CMS_rollover_box').live("mouseleave", function()
    {
        var classes = $(this).attr('class');
        $(this).removeClass(classes);
        classes = classes.replace("_over", "_normal");
        $(this).addClass(classes);
    });

    $('a').live("click", function(event)
    {
        var target = $(this).attr('href');
        NavigateTo(event, target);
    });
 
    $('.CMS_click_through').live("click", function(event)
    {
        var target = $(this).attr('title');
        NavigateTo(event, target);
    });
    
    function DoImageChanges()
    {
        for (var index = 0; index < NUMIMAGECHANGERS; index++)
        { 
            if (IMAGECHANGERSPOSITION[index] == 1) $('#' + IMAGECHANGERS[index]).children().fadeIn(0);
            if (IMAGECHANGERSPOSITION[index] < IMAGECHANGERSLENGTHS[index])
            {
                $('#' + IMAGECHANGERS[index] + "_" + IMAGECHANGERSPOSITION[index]).fadeOut(1000);
                IMAGECHANGERSPOSITION[index] = IMAGECHANGERSPOSITION[index] + 1;
            }
            else
            {               
                $('#' + IMAGECHANGERS[index] + '_1').fadeIn(1000);
                IMAGECHANGERSPOSITION[index] = 1;
            }
        }
        
        $('#logotext' + LOGOTEXTPOSITION).animate({width: '0px'}, 500, function()
        {
            LOGOTEXTPOSITION = LOGOTEXTPOSITION + 1;
            if (LOGOTEXTPOSITION == 4) LOGOTEXTPOSITION = 1;
            $('#logotext' + LOGOTEXTPOSITION).animate({width: '189px'}, 500);
        });

    }

    function SetSelectedSection($sectionheader)
    {
        var section_id = $sectionheader.attr('id');

        if ($selected_section != null)
        {
            if (section_id == $selected_section.attr('id')) return;
            $selected_section.children('.menuselimage').fadeOut(200);
            $selected_section.children('.menutext').css('color', '#193366');
        }
        $selected_section = $sectionheader;
        $selected_section.children('.menuselimage').fadeIn(200);
        $selected_section.children('.menutext').css('color', 'White');
        LoadSection(section_id);
    }

    function SetSelectedStory($storyitem)
    {
        // change selection of items
        $current_button.children('.storyitemselimage').fadeOut(200);
        $current_button = $storyitem;
        $current_button.children('.storyitemselimage').fadeIn(200);
        
        var ypos = $('#storylist').position().top;
        if ($current_button.position() != null) ypos += $current_button.position().top;
        
        // Move arrow
        $('#storyarea').fadeOut(500);
        $('#barmarker').animate({ top: ypos }, 500, function()
	{
		show_story();
	});         
    }
    
    function show_story()
    {
        var storyident = $current_button.attr('id');
        load_story(storyident);
    }

    function load_story(storyident)
    {
        $.get('./data/' + storyident + ".txt", function(data) 
        {
            $('#storyarea').html(data);
            $('.product').cluetip(
            {
              cluetipClass: 'jtip', 
              arrows: true, 
              dropShadow: true,
              hoverIntent: false,
              sticky: true,
              mouseOutClose: true,
              closePosition: 'title',
              closeText: '<img src="images/cross.png" alt="close" />'
            });
            $('.terminology').cluetip(
            {
              cluetipClass: 'jtip2', 
              arrows: true, 
              dropShadow: true,
              hoverIntent: false
            });
            $('#cluetip-outer').css('opacity', '0.95');
        });
        $('#storyarea').fadeIn(200);
    }

    function NavigateTo(event, target)
    {
        var handled = false;

        var split = target.lastIndexOf("_");
        if (split > 0)
        {
            var section = target.substring(0, split);
            var story = target.substring(split+1, 255);
            var $header = $('#' + section);
            if ($header.length > 0)
            {
               SetSelectedSection($header);
               var $storyitem = $('#' + section + "_" + story);
               SetSelectedStory($storyitem);
               event.preventDefault();
               handled = true;
            }
        }
        if (handled == false)
        {
           if (target.indexOf("mailto:") == -1)
           {
              window.open(target);
              event.preventDefault();
           }
        }
    }

    
    function LoadSection(SectionName)
    {
        $.getJSON('./data/' + SectionName + '_stories.txt', function(data) 
        {
            $('#storylist').empty();
            var first = true;
            $.each(data, function(entryIndex, entry) 
            {
                var ident = entry['ident'];
                var text = entry['text'];
                var HTML = '<div class="storyitem" id="' + ident + '"><div class="storyitemoverimage"></div>';
                HTML += '<div class="storyitemselimage"></div><div class="storyitemtext">' + text + '</div></div>';
                $('#storylist').append(HTML);
                
                if (first)
                {
                    $current_button = $('#' + ident);
                    first = false;
                }
            });
            $('.storyitemoverimage').fadeOut(0);
            $('.storyitemselimage').fadeOut(0);
            $current_button.children('.storyitemselimage').fadeIn(0);
            var ypos = $current_button.position().top + $('#storylist').position().top;
            $('#barmarker').animate({ top: ypos }, 500);
            show_story();
        });
    }

});
