$(document).ready(function () {

    //Check if element is present on the current page
    if ($('#radialList').length > 0) {


        //Hide all the definitions
        $('#radialList dd').hide();


        //Style the dd's
        $('#radialList dd').addClass('styledDD');

        //Create the center ring
        $('<div id="bullseye"><img src="CSS/images/radial/bigRing.png" id="center" alt="" /></div>').insertBefore('#radialList');
        //$('<div id="bullseye"><img src="CSS/images/radial/bigRing.png" id="center" alt="" /></div>').insertAfter('#radialListWrap');

        //Move the H1 into the center ring
        $('#radialHead').hide();
        $('#radialHead').clone().appendTo('#bullseye').addClass('centerHead').show();

        //Give the rings some size
        //$('#radialList dt').addClass('ringSize');

        //OR give the rings anchors some size
        $('#radialList dt').addClass('ringSize');

        //Wrap the contents of the dt with a span for
        //positioning
        $('#radialList dt').wrapInner('<span class="ddPositioner" />');

        //Wrap the dt in an anchor
        //$('#radialList dt').wrap('<a href="" class="radialLink" />')
        $('#radialList dt a').addClass('radialLink');

        //Give the ring titles a class for css positioning
        $('#radialList dt').eq(0).addClass('ring0');
        $('#radialList dt').eq(1).addClass('ring1');
        $('#radialList dt').eq(2).addClass('ring2');
        $('#radialList dt').eq(3).addClass('ring3');
        $('#radialList dt').eq(4).addClass('ring4');


        //Scale up an image on click

        $(".radialLink").mouseenter(function (e) {
            $("#bullseye").stop().animate({
                width: '180px', /* Set new width */
                height: '180px', /* Set new height */
                top: '109px'
            }, 200);
            //move all the balls out
            $('#radialList dt').eq(0).stop().animate({ top: '-10px' }, 200);
            $('#radialList dt').eq(1).stop().animate({ left: '271px' }, 200);
            $('#radialList dt').eq(2).stop().animate({ left: '214px', top: '249' }, 200);
            $('#radialList dt').eq(3).stop().animate({ left: '39px', top: '249' }, 200);
            $('#radialList dt').eq(4).stop().animate({ left: '-10px' }, 200);
        });



        $(".radialLink").mouseleave(function (e) {
            $("#bullseye").stop().animate({
                width: "128px",
                height: "128px",
                top: '132px'
            }, 100);
            //move all the balls in
            $('#radialList dt').eq(0).stop().animate({ top: '0px' }, 200);
            $('#radialList dt').eq(1).stop().animate({ left: '258px' }, 200);
            $('#radialList dt').eq(2).stop().animate({ left: '204px', top: '239' }, 200);
            $('#radialList dt').eq(3).stop().animate({ left: '49px', top: '239' }, 200);
            $('#radialList dt').eq(4).stop().animate({ left: '0px' }, 200);
        });

        //Hide/Show the heading in the center ring

        $(".radialLink").mouseenter(function (e) {
            $('.centerHead').hide();
        });
        $(".radialLink").mouseleave(function (e) {
            $('.centerHead').fadeTo('slow', 1, function () { });
        });


        //Position all the dd's into the center
        $('#radialList dt').addClass('centerDD');

        //Make an array of the dd's
        var dds = $('#radialList dd');

        //Then show/hide when hovered
        //And swap out dt class - background image

        //0
        $('#radialList dt').eq(0).mouseenter(function (e) {
            $(this).addClass('dt0Bg');
            $(dds).eq(0).fadeTo('slow', 1, function () { });
        });

        $('#radialList dt').eq(0).mouseleave(function (e) {
            $(this).removeClass('dt0Bg');
            $(dds).eq(0).hide();
        });

        //1
        $('#radialList dt').eq(1).mouseenter(function (e) {
            $(this).addClass('dt1Bg');
            $(dds).eq(1).fadeTo('slow', 1, function () { });
        });

        $('#radialList dt').eq(1).mouseleave(function (e) {
            $(this).removeClass('dt1Bg');
            $(dds).eq(1).hide();
        });

        //2
        $('#radialList dt').eq(2).mouseenter(function (e) {
            $(this).addClass('dt2Bg');
            $(dds).eq(2).fadeTo('slow', 1, function () { });
        });

        $('#radialList dt').eq(2).mouseleave(function (e) {
            $(this).removeClass('dt2Bg');
            $(dds).eq(2).hide();
        });

        //3
        $('#radialList dt').eq(3).mouseenter(function (e) {
            $(this).addClass('dt3Bg');
            $(dds).eq(3).fadeTo('slow', 1, function () { });
        });

        $('#radialList dt').eq(3).mouseleave(function (e) {
            $(this).removeClass('dt3Bg');
            $(dds).eq(3).hide();
        });

        //4
        $('#radialList dt').eq(4).mouseenter(function (e) {
            $(this).addClass('dt4Bg');
            $(dds).eq(4).fadeTo('slow', 1, function () { });
        });

        $('#radialList dt').eq(4).mouseleave(function (e) {
            $(this).removeClass('dt4Bg');
            $(dds).eq(4).hide();
        });


    }
});  // End document ready