$(document).ready(function() {
    var $tabs, index;
    /*** Tabs ***/
    $tabs = $("body > div#bottom > div#tabs");
    $tabs.tabs({
        fx: { opacity: 'toggle' },
        cache: false,
        select: function(event, ui) {
            var id = ui.panel.id;
            // TODO: Once you have the new background top images, uncomment the following
            //$('#top_bak img#top_bak_img').attr('src', 'images/'+id+'_top.png');
            if( id == 'contact' || id == 'employers' || id == 'services' ) {
                $('div#top_bak').css('background', 'transparent url(images/back1_'+id+'.jpg) repeat-x scroll 0 0');
            } else {
                $('#top_bak').css('background', '');
            }
            if(id === 'home') {
                $('#bottom_bak img#bottom_bak_img').attr('src', '');
            }
            $('#top').removeClass().addClass(id);

            // Open popup for akken login
            if(id === 'log_in') {
                popup($(ui.tab).attr('popuphref'));
                return false;
            }
            document.location.hash = ui.panel.id;
        },

        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
            }
        }
    }).show(); // #tabs are hidden in CSS before loading the widget

    $("ul.ui-tabs-nav li", $tabs).removeClass("ui-corner-top").addClass("ui-corner-bottom"); // css fixes of tabs()
    // Logo click
    $('body > div#top > div#top_back > img#logo').click(function() {
        $tabs.tabs("option", "selected", 0);
    });

    /*** our_team ***/
        var $our_team, $team_pics;
        $our_team = $("body > div#bottom > div#tabs div#our_team");
        $team_pics = $("div#our_team_pics .team_pic", $our_team);
        $team_pics.hoverIntent({
            sensitivity: 3,
            interval: 100,
            out: function() { return; },
            over: function() {
                $(this).fadeTo("fast", 1, function() {
                    $team_pics.not(this).fadeTo("slow", 0.5);
                });
                var id = $(this).attr('id').replace(/_pic/, ''); // get id for desc
                if($("> #"+id, $our_team).is(":hidden")) {
                    $our_team.children('div.our_team_desc').not("#"+id).hide(); // hide other's desc
                    $("> #"+id, $our_team).slideDown(); // show desc for current hover over
                    if($("> div#our_team_contact", $our_team).is(":hidden")) $("> div#our_team_contact", $our_team).show();
                    var t = parseInt($(this).position().left); // pos of current hover
                    var f = parseInt($('.team_pic:first').position().left); // offset of first img in list
                    var x = t - f;
                    $("> div#our_team_contact #contact_pic", $our_team).animate( { left: x+'px' });
                    $("> div#our_team_contact > a#mailto", $our_team).attr('href', "mailto:"+id+"@marecruit.com");
                }
            }
        });

    /*** footerNav ***/
    $("body div#footerNavContainer div#footerNav div#footerNav_links > ul > li > a").click(function() {
        var target = $(this).attr('href');
        $("> ul > li > a[href='"+target+"']", $tabs).click();
    });

    /*** jobseekers popup ***/
    $('select#job_seekers_menu', $tabs).live('change', function() {
        var href = $('option:selected', this).attr('value');
        popup(href);
        return false;
    });

});

function popup(href) {
    window.open(href, '', 'width=800, height=600, scrollbars=yes');
}