$(document).ready(function () {

    $.getJSON(
        '/Home/GetBalloonInformation',
        function (data) {
            if (data != null) {
                var defaultBubble;
                var defaultId;
                var resetBubble = true;
                var yellowHeading = data["Yellow"]["Heading"];
                var yellowDescription = data["Yellow"]["Description"];
                var redHeading = data["Red"]["Heading"];
                var redDescription = data["Red"]["Description"];
                var blueHeading = data["Blue"]["Heading"];
                var blueDescription = data["Blue"]["Description"];
                var greenHeading = data["Green"]["Heading"];
                var greenDescription = data["Green"]["Description"];
                var grayHeading = data["Gray"]["Heading"];
                var grayDescription = data["Gray"]["Description"];

                $('#balloonPopOutYellow').hover(
                    function () {
                        if (resetBubble)
                            ResetBubble();

                        stopTimer = true;
                        // The animation is causing IE7 to not display the bubbles, so it needs to be removed.
                        //$('#balloonPopOutYellow:hover').css("opacity", 0).stop().animate({ "opacity": 1 }, 'slow');
                        $('#balloonPopOutYellow').html(yellowHeading + yellowDescription);
                        Cufon.refresh();
                    },
                    function () {
                        stopTimer = false;
                        $('#balloonPopOutYellow').html('');
                    }
                );

                $('#balloonPopOutRed').hover(
                    function () {
                        if (resetBubble)
                            ResetBubble();

                        stopTimer = true;
                        // The animation is causing IE7 to not display the bubbles, so it needs to be removed.
                        //$('#balloonPopOutRed:hover').css("opacity", 0).stop().animate({ "opacity": 1 }, 'slow');
                        $('#balloonPopOutRed').html(redHeading + redDescription);
                        Cufon.refresh();
                    },
                    function () {
                        stopTimer = false;
                        $('#balloonPopOutRed').html('');
                    }
                );

                $('#balloonPopOutBlue').hover(
                    function () {
                        if (resetBubble)
                            ResetBubble();

                        stopTimer = true;
                        // The animation is causing IE7 to not display the bubbles, so it needs to be removed.
                        //$('#balloonPopOutBlue:hover').css("opacity", 0).stop().animate({ "opacity": 1 }, 'slow');
                        $('#balloonPopOutBlue').html(blueHeading + blueDescription);
                        Cufon.refresh();
                    },
                    function () {
                        stopTimer = false;
                        $('#balloonPopOutBlue').html('');
                    }
                );

                $('#balloonPopOutGreen').hover(
                    function () {
                        if (resetBubble)
                            ResetBubble();

                        stopTimer = true;
                        // The animation is causing IE7 to not display the bubbles, so it needs to be removed.
                        //$('#balloonPopOutGreen:hover').css("opacity", 0).stop().animate({ "opacity": 1 }, 'slow');
                        $('#balloonPopOutGreen').html(greenHeading + greenDescription);
                        Cufon.refresh();
                    },
                    function () {
                        stopTimer = false;
                        $('#balloonPopOutGreen').html('');
                    }
                );

                $('#balloonPopOutGray').hover(
                    function () {
                        if (resetBubble)
                            ResetBubble();

                        stopTimer = true;
                        // The animation is causing IE7 to not display the bubbles, so it needs to be removed.
                        //$('#balloonPopOutGray:hover').css("opacity", 0).stop().animate({ "opacity": 1 }, 'slow');
                        $('#balloonPopOutGray').html(grayHeading + grayDescription);
                        Cufon.refresh();
                    },
                    function () {
                        stopTimer = false;
                        $('#balloonPopOutGray').html('');
                    }
                );

                // Randomize a popout to be the default popout 
                switch (Math.floor(Math.random() * 5) + 1) {
                    // Yellow                 
                    case 1:
                        defaultBubble = 'balloonPopOutYellow';
                        defaultId = '#balloonPopOutYellowDefaultSelected';
                        $('#balloonPopOutYellow').attr('id', 'balloonPopOutYellowDefaultSelected').show().html(yellowHeading + yellowDescription);
                        Cufon.refresh();
                        break;
                    // Red                 
                    case 2:
                        defaultBubble = 'balloonPopOutRed';
                        defaultId = '#balloonPopOutRedDefaultSelected';
                        $('#balloonPopOutRed').attr('id', 'balloonPopOutRedDefaultSelected').html(redHeading + redDescription);
                        Cufon.refresh();
                        break;
                    // Blue                 
                    case 3:
                        defaultBubble = 'balloonPopOutBlue';
                        defaultId = '#balloonPopOutBlueDefaultSelected';
                        $('#balloonPopOutBlue').attr('id', 'balloonPopOutBlueDefaultSelected').html(blueHeading + blueDescription);
                        Cufon.refresh();
                        break;
                    // Green                 
                    case 4:
                        defaultBubble = 'balloonPopOutGreen';
                        defaultId = '#balloonPopOutGreenDefaultSelected';
                        $('#balloonPopOutGreen').attr('id', 'balloonPopOutGreenDefaultSelected').html(greenHeading + greenDescription);
                        Cufon.refresh();
                        break;
                    // Gray                 
                    case 5:
                        defaultBubble = 'balloonPopOutGray';
                        defaultId = '#balloonPopOutGrayDefaultSelected';
                        $('#balloonPopOutGray').attr('id', 'balloonPopOutGrayDefaultSelected').html(grayHeading + grayDescription);
                        Cufon.refresh();
                        break;
                }

                function ResetBubble() {
                    resetBubble = false;
                    $(defaultId).attr('id', defaultBubble).html('');
                }
            }
        }
    );
});