jQuery(document).ready(function($){



    /*

     * main menu select boxes

     */

    $("form.main_nav select#tests").change( function() {

        $("form.main_nav select#tests option:selected").each(function () {

            document.location = $(this).val();

        });

    });



    $("form.main_nav select#conditions_diseases").change( function() {

        $("form.main_nav select#conditions_diseases option:selected").each(function () {

            document.location = $(this).val();

        });

    });



    $("form.main_nav select#screening").change( function() {

        $("form.main_nav select#screening option:selected").each(function () {

            document.location = $(this).val();

        });

    });



    /*

     * lightbox (shadowbox)

     */

    Shadowbox.init();



    // Useful outerHTML function to get HTML of whole element, not just innerHTML, like html() in jQuery

    jQuery.fn.outerHTML = function() {

        return $('<div>').append( this.eq(0).clone() ).html();

    };



    // TABLES and ZOOMER



    // set up the zomtablem and click and add the zoomer

    var zoomcount = 0;

    var zoomtitle = new Array();

    var zoomwindow = new Array();



    // common across all tables...

    var zoomclose = "<a class='table-toggle' href='#' rel='unzoom'>Minimize Table / Close</a>";

    var zoomfooter = "<p class='zoomed-footer'>&copy;  2001 - 2009 by American Association for Clinical Chemistry</p>";



    $('table.zoomable').each( function() {



        $(this).attr('rel', zoomcount);



        // get the table's html (outerHTML)

        zoomtable = $(this).outerHTML();



        // get the table header and add the close button

        zoomtitletext = $(this).prev('.table-headline').html();

        if (!zoomtitletext) {

            zoomtitletext = "Table";

        }

        zoomheader = "<h3 class='table-headline'>";

        zoomheader += zoomclose;

        zoomheader += zoomtitletext;

        zoomheader += '<' + '/h3>';



        zoomwindow[zoomcount] = "<div class='zoomed-table'>" + zoomheader + zoomtable + zoomfooter + "<" + "/div>";

        zoomtitle[zoomcount] = zoomtitletext;



        // set up the zoomer

        zoomer = "<a class='table-toggle' href='#' rel='" + zoomcount + "'>Expand Table</a>";



        // add the zoomer if there is a headline, if not, add a headline

        if ( $(this).prev('.table-headline').html() ) {

            $(this).prev('.table-headline').prepend(zoomer);

        }

        else {

            zoomheader = "<h3 class='table-headline'>";

            zoomheader += zoomer;

            zoomheader += zoomtitletext;

            zoomheader += '<' + '/h3>';

            $(this).before(zoomheader);

        }



        // increment zoomcount

        zoomcount++;



    });



    // add 'live' click handlers for the zoomer/zoomclose

    $('a.table-toggle').live( 'click', function(){

        var localcount = $(this).attr('rel');

        if(localcount == 'unzoom'){

            Shadowbox.close();

        }

        else{

            Shadowbox.open({

                player:     'html',

                title:      zoomtitle[localcount],

                content:    zoomwindow[localcount],

                width:      2000,                    //arbitrary large number

                height:     2000,                    //arbitrary large number

                options:    {viewportPadding:40}     //default is 20

            });

        }

        return false;

    });

    // add 'live' click handlers for the popup notes

    $('a.popup-note').live( 'click', function(){

        var J = $(this);

        Shadowbox.open({

            el: this

          , title: J.attr('title')||''

          , player: 'iframe'

          , options: {}

          , content: J.attr('href')

          , width: 500

          , height: 450

          });

        return false;

    });



});





/*

 * override the optionsdisplay() function

 */



function optionsdisplay(url) {

    Shadowbox.open({

        content:    url,

        player:     "iframe",

        height:     450,

        width:      500

    });

}