
// DOM Loaded
$(function(){
    
    //init js styles



    // 'structural' form labels
    $('#search_form input.textfield').focus(function(){
        $(this).prev('label.inset').addClass('alt');
    }).blur(function(){
        $(this).attr('value') != '' || $(this).prev('label.inset').removeClass('alt');
    }).each(function(){
        $(this).attr('value') == '' || $(this).prev('label.inset').addClass('alt');
    });
    
    // homepage cycles
    $('#work_widget .project').wrapAll('<div class="projects">').parents('#work_widget').prepend('<ul class="menu" id="work_widget_pager">').cycle({
        fx:         'nclud',
        speed:      250,
        speedIn:    300,
        speedOut:   400,
        easeIn: 'swing',
        easeOut: 'swing',
        inDelay:    250,
        drop:       40,
        timeout:    8000,
        pause:      true,
        slideExpr: '.project',
        pager:      '#work_widget_pager',
        pagerAnchorBuilder: function(idx, slide) { 
            myClass = (idx==0)?' class="current"':'';
            return '<li'+myClass+'><a href="#">'+slide.title+'</a></li>'; 
        }
    });
    $('#work_widget .project .samples li').mouseover(function(evt){
        $(this).addClass('click-target');
        $els = $(this).parents('.samples').find('li');
        $($els.get(2)).css('marginRight','-100%');
        $els.each(function(idx, el){
            $(this).stop(true, true);
            if($(this).is('.tertiary')){
                var fromClass = 'tertiary';
            }else if($(this).is('.secondary')){
                var fromClass = 'secondary';
            }else{
                var fromClass = 'primary';
            }
            if($(this).is('.click-target')){
                var toClass = 'primary';
                $(this).addClass('front');
                $(this).removeClass('back').removeClass('middle');
            }else if(($(this).prev('li').is('.click-target')) || ($(this).next('li').is('.click-target'))){
                var toClass = 'secondary';
                $(this).addClass('middle');
                $(this).removeClass('back').removeClass('front');
            }else{
                var toClass = 'tertiary';
                $(this).addClass('back');
                $(this).removeClass('front').removeClass('middle');
            }
            if(((toClass=='tertiary'||toClass=='primary')&&(idx==0||idx==2))||(toClass=='secondary' && idx==1)){
                var margins = '-66px';
            }else{
                var margins = '-85px';
            }
            if(idx==0) {
                margins='0px';
            }
            if(fromClass != toClass){
                if(toClass == 'primary') 
                    $(this).animate({width:'240px',marginTop:'4px',marginLeft:margins}, 400, 'swing', function(){$(this).addClass('primary').removeClass('secondary').removeClass('tertiary')});
                if(toClass == 'secondary')
                    $(this).animate({width:'200px',marginTop:'50px',marginLeft:margins}, 400, 'swing', function(){$(this).addClass('secondary').removeClass('primary').removeClass('tertiary')});
                if(toClass == 'tertiary')
                    $(this).animate({width:'164px',marginTop:'90px',marginLeft:margins}, 400, 'swing', function(){$(this).addClass('tertiary').removeClass('secondary').removeClass('primary')});
            }
        });
        $(this).removeClass('click-target');
        return false;
    });
    
});