$(document).ready(function() {

    jQuery.dom = jQuery(document);

    /* Menu System --------------------------------------------------------------------
    ---------------------------------------------------------------------------------*/
    function megaHoverOver() {
        $(this).find(".sub").stop().fadeTo('fast', 1, function() {
            if ($.browser.msie) { this.style.removeAttribute('filter'); }
            /* $(this).removeAttr("filter"); doesn't work on IE in this case and 
            *  this.style.removeAttribute('filter'); doesn't work in Firefox.
            *  IE browser detect wa the only option.
            */
        }).show();
    };

    function megaHoverOut() {
        $(this).find(".sub").stop().hide();
    };

    var config = {
        sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)    
        interval: 100, // number = milliseconds for onMouseOver polling interval    
        over: megaHoverOver, // function = onMouseOver callback (REQUIRED)    
        timeout: 250, // number = milliseconds delay before onMouseOut    
        out: megaHoverOut // function = onMouseOut callback (REQUIRED)    
    };

    jQuery.dom.find("ul#topnav li .sub").css({ 'opacity': '0' });
    jQuery.dom.find("ul#topnav li").hoverIntent(config);


    // *************************************
    //  Subnav / Treeview
    // *************************************
    jQuery.dom.find("#menu_sub").treeview({
        persist: "location",
        collapsed: true,
        unique: true
    });

    // *************************************
    //  News/Content Sliders - http://jquery.malsup.com/cycle/options.html
    // *************************************
    var $carousel = jQuery.dom.find('.carousel');
    var $mayorcarousel = jQuery.dom.find('.mayor-carousel');

    if ($mayorcarousel.length) {
        $mayorcarousel.cycle({
            fx: 'fade',
            fit: 1,
            speed: 300,
            timeout: 10000,
            pager: '#pager',
            pause: 1,
            cleartypeNoBg: true,
            
            // callback fn that creates a thumbnail to use as pager anchor 
            pagerAnchorBuilder: function(idx, slide) {
            
                /* 	Find your image inside the individual slide.
					In this case, I generate a scaled image on the server and store the path in an attribute */
                var slideImg = jQuery(slide).children(".summary").attr('thumbnail');
                
                /*  If there is no image associated with the story, use a standard thumbnail
					This is also handeled in our Kentico Transformation, so this is only a backup */
                if (slideImg == undefined) {
                    slideImg = "/App_Themes/coj/images/coj-vid.png";
                }; 
                
                /*	Our thumbnails are 50x50, but our image might not be square.
					Setting the image as the background lets the element crop the image
					
					slideImg path must be in '' to protect the path
					 */
                return '<li><a href="#"><span class="thumbnail" style="background-image:url(\''+ slideImg +'\');"></span></a></li>'; 
            }
        });
    } else if ($carousel.length) {
        $carousel.cycle({
            fx: 'fade',
            speed: 300,
            timeout: 10000,
            pager: '#pager',
            pause: 1,
            cleartypeNoBg: true
        });
    };

    var $colorbox = jQuery.dom.find('a.colorbox');
    if ($colorbox.length) {
        $colorbox.colorbox({ photo: 'true', maxHeight: '600px' });
    };


});