$.fn.preload = function()
{
    this.each(function()
    {
        $('<img/>')[0].src = this;
    });
}

// Images array to be loaded

$(['images/bg.png','images/dots.png','images/bar.png','images/sti.jpg','images/service.jpg','images/pregnancy.jpg','images/about.jpg','images/faq.jpg','images/footer.jpg','images/cross.jpg','images/contact.jpg','images/1.jpg','images/2.jpg','images/3.jpg','images/4.jpg','images/5.jpg','images/6.jpg','images/7.jpg','images/8.jpg','images/9.jpg','images/10.jpg','images/11.jpg','images/12.jpg','images/13.jpg','images/14.jpg','images/15.jpg','images/16.jpg','images/17.jpg','images/18.jpg','images/19.jpg','images/20.jpg','images/21.jpg','images/22.jpg','images/23.jpg','images/24.jpg','images/contact/1.jpg','images/contact/2.jpg','images/contact/3.jpg','images/contact/4.jpg','images/contact/5.jpg','images/contact/6.jpg','images/contact/7.jpg','images/contact/8.jpg','images/contact/9.jpg','images/contact/10.jpg','images/contact/11.jpg','images/contact/12.jpg','images/contact/13.jpg','images/contact/14.jpg','images/contact/15.jpg','images/contact/16.jpg','images/contact/17.jpg','images/contact/18.jpg','images/contact/19.jpg','images/contact/20.jpg','images/contact/21.jpg','images/contact/22.jpg','images/contact/23.jpg','images/contact/24.jpg','images/faq/1.jpg','images/faq/2.jpg','images/faq/3.jpg','images/faq/4.jpg','images/faq/5.jpg','images/faq/6.jpg','images/faq/7.jpg','images/faq/8.jpg','images/faq/9.jpg','images/faq/10.jpg','images/faq/11.jpg','images/faq/12.jpg','images/faq/13.jpg','images/faq/14.jpg','images/faq/15.jpg','images/faq/16.jpg','images/faq/17.jpg','images/faq/18.jpg','images/faq/19.jpg','images/faq/20.jpg','images/faq/21.jpg','images/faq/22.jpg','images/faq/23.jpg','images/faq/24.jpg','images/about/1.jpg','images/about/2.jpg','images/about/3.jpg','images/about/4.jpg','images/about/5.jpg','images/about/6.jpg','images/about/7.jpg','images/about/8.jpg','images/about/9.jpg','images/about/10.jpg','images/about/11.jpg','images/about/12.jpg','images/about/13.jpg','images/about/14.jpg','images/about/15.jpg','images/about/16.jpg','images/about/17.jpg','images/about/18.jpg','images/about/19.jpg','images/about/20.jpg','images/about/21.jpg','images/about/22.jpg','images/about/23.jpg','images/about/24.jpg','images/pregnancy/1.jpg','images/pregnancy/2.jpg','images/pregnancy/3.jpg','images/pregnancy/4.jpg','images/pregnancy/5.jpg','images/pregnancy/6.jpg','images/pregnancy/7.jpg','images/pregnancy/8.jpg','images/pregnancy/9.jpg','images/pregnancy/10.jpg','images/pregnancy/11.jpg','images/pregnancy/12.jpg','images/pregnancy/13.jpg','images/pregnancy/14.jpg','images/pregnancy/15.jpg','images/pregnancy/16.jpg','images/pregnancy/17.jpg','images/pregnancy/18.jpg','images/pregnancy/19.jpg','images/pregnancy/20.jpg','images/pregnancy/21.jpg','images/pregnancy/22.jpg','images/pregnancy/23.jpg','images/pregnancy/24.jpg','images/services/1.jpg','images/services/2.jpg','images/services/3.jpg','images/services/4.jpg','images/services/5.jpg','images/services/6.jpg','images/services/7.jpg','images/services/8.jpg','images/services/9.jpg','images/services/10.jpg','images/services/11.jpg','images/services/12.jpg','images/services/13.jpg','images/services/14.jpg','images/services/15.jpg','images/services/16.jpg','images/services/17.jpg','images/services/18.jpg','images/services/19.jpg','images/services/20.jpg','images/services/21.jpg','images/services/22.jpg','images/services/23.jpg','images/services/24.jpg','images/sti/1.jpg','images/sti/2.jpg','images/sti/3.jpg','images/sti/4.jpg','images/sti/5.jpg','images/sti/6.jpg','images/sti/7.jpg','images/sti/8.jpg','images/sti/9.jpg','images/sti/10.jpg','images/sti/11.jpg','images/sti/12.jpg','images/sti/13.jpg','images/sti/14.jpg','images/sti/15.jpg','images/sti/16.jpg','images/sti/17.jpg','images/sti/18.jpg','images/sti/19.jpg','images/sti/20.jpg','images/sti/21.jpg','images/sti/22.jpg','images/sti/23.jpg','images/sti/24.jpg']).preload();

$(function()
{
    // Copy the pages javascript sourcecode to the display block on the page for easy viewing...
    var sourcecodeDisplay = $('#sourcecode-display');
    if (sourcecodeDisplay.length)
    {
        sourcecodeDisplay.empty().append(
                $('<code />').append(
                        $('<pre />').html(
                                $('#sourcecode').html().replace(/\n\t\t\t/gm, '\n').replace('>', '&gt;').replace('<', '&lt;')
                        )
                )
        );
        $('#css-display').empty().append(
                $('<code />').append(
                        $('<pre />').html(
                                $('#page-css').html().replace(/\n\t\t\t/gm, '\n')
                        )
                )
        );
    }
});

function mySideChange(front)
{
    if (front)
    {
        $(this).parent().find('div.front').show();
        $(this).parent().find('div.back').hide();

    } else
    {
        $(this).parent().find('div.front').hide();
        $(this).parent().find('div.back').show();
    }
}

// Fliping animations
function myTransition()
{
    //1st column will flip
    $('#nav li#box1').find('div').stop().rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //2nd column will flip after some delay
    $('#nav li#box2').find('div').stop().delay(200).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box7').find('div').stop().delay(200).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //3rd column will flip after some delay
    $('#nav li#box3').find('div').stop().delay(400).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box8').find('div').stop().delay(400).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box13').find('div').stop().delay(400).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //4th column will flip after some more delay
    $('#nav li#box4').find('div').stop().delay(600).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box9').find('div').stop().delay(600).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box14').find('div').stop().delay(600).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box19').find('div').stop().delay(600).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //5th column will flip after some more delay
    $('#nav li#box5').find('div').stop().delay(800).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box10').find('div').stop().delay(800).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box15').find('div').stop().delay(800).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box20').find('div').stop().delay(800).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //6th column will flip after some more delay
    $('#nav li#box6').find('div').stop().delay(1000).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box11').find('div').stop().delay(1000).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box16').find('div').stop().delay(1000).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box21').find('div').stop().delay(1000).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //7th column will flip after some more delay
    $('#nav li#box12').find('div').stop().delay(1200).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box17').find('div').stop().delay(1200).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box22').find('div').stop().delay(1200).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //9th column will flip after some more delay
    $('#nav li#box18').find('div').stop().delay(1400).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    $('#nav li#box23').find('div').stop().delay(1400).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
    //9th column will flip after some more delay
    $('#nav li#box24').find('div').stop().delay(1600).rotate3Di('flip', 500, {direction: 'clockwise', sideChange: mySideChange});
}

function ieTransition()
{
    //1st transition
    $('#nav li#box1 .front').animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 50, 'linear', function()
    {
        $('#nav li#box1 .back').delay(50).show(400);
    });
    //2nd transition
    $('#nav li#box2 .front').delay(100).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 100, 'linear', function()
    {
        $('#nav li#box2 .back').delay(150).show(400);
    });

    $('#nav li#box7 .front').delay(100).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 100, 'linear', function()
    {
        $('#nav li#box7 .back').delay(150).show(400);
    });


    //3rd transition
    $('#nav li#box3 .front').delay(150).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 150, 'linear', function()
    {
        $('#nav li#box3 .back').delay(200).show(400);
    });

    $('#nav li#box8 .front').delay(150).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 150, 'linear', function()
    {
        $('#nav li#box8 .back').delay(200).show(400);
    });
    $('#nav li#box13 .front').delay(150).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 150, 'linear', function()
    {
        $('#nav li#box13 .back').delay(200).show(400);
    });

    //4th transition
    $('#nav li#box4 .front').delay(200).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 200, 'linear', function()
    {
        $('#nav li#box4 .back').delay(250).show(400);
    });

    $('#nav li#box9 .front').delay(200).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 200, 'linear', function()
    {
        $('#nav li#box9 .back').delay(250).show(400);
    });
    $('#nav li#box14 .front').delay(200).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 200, 'linear', function()
    {
        $('#nav li#box14 .back').delay(250).show(400);
    });
    $('#nav li#box19 .front').delay(200).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 200, 'linear', function()
    {
        $('#nav li#box19 .back').delay(250).show(400);
    });

    //5th transition
    $('#nav li#box5 .front').delay(250).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 250, 'linear', function()
    {
        $('#nav li#box5 .back').delay(300).show(400);
    });

    $('#nav li#box10 .front').delay(250).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 250, 'linear', function()
    {
        $('#nav li#box10 .back').delay(300).show(400);
    });
    $('#nav li#box15 .front').delay(250).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 250, 'linear', function()
    {
        $('#nav li#box15 .back').delay(300).show(400);
    });
    $('#nav li#box20 .front').delay(250).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 250, 'linear', function()
    {
        $('#nav li#box20 .back').delay(300).show(400);
    });

    //6th transition
    $('#nav li#box6 .front').delay(300).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 300, 'linear', function()
    {
        $('#nav li#box6 .back').delay(350).show(400);
    });

    $('#nav li#box11 .front').delay(300).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 300, 'linear', function()
    {
        $('#nav li#box11 .back').delay(350).show(400);
    });
    $('#nav li#box16 .front').delay(300).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 300, 'linear', function()
    {
        $('#nav li#box16 .back').delay(350).show(400);
    });
    $('#nav li#box21 .front').delay(300).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 300, 'linear', function()
    {
        $('#nav li#box21 .back').delay(350).show(400);
    });

    //7th transition
    $('#nav li#box12 .front').delay(350).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 350, 'linear', function()
    {
        $('#nav li#box12 .back').delay(400).show(400);
    });
    $('#nav li#box17 .front').delay(350).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 350, 'linear', function()
    {
        $('#nav li#box17 .back').delay(400).show(400);
    });
    $('#nav li#box22 .front').delay(350).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 350, 'linear', function()
    {
        $('#nav li#box22 .back').delay(400).show(400);
    });

    //8th transition
    $('#nav li#box18 .front').delay(400).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 400, 'linear', function()
    {
        $('#nav li#box18 .back').delay(450).show(400);
    });
    $('#nav li#box23 .front').delay(400).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 400, 'linear', function()
    {
        $('#nav li#box23 .back').delay(450).show(400);
    });

    //9th transition
    $('#nav li#box24 .front').delay(450).animate({ width: ['toggle', 'swing'], height: ['toggle', 'swing'],opacity: 'toggle' }, 450, 'linear', function()
    {
        $('#nav li#box24 .back').delay(500).show(400);
    });


}