/**
 * nclud'ed behaviors
 *
 * js enhancements for nclud.com
 * dev by nclud LLC, hello@nclud.com
 */

// Global Funcs
var refreshCalendar = function(){
    $($('table.calendar tr.week').get(0)).addClass('first');
    $('table.calendar tr:last-child').addClass('last');
    $('#calendar h2').each(function(){FLIR.replace(this);});
    $('#calendar').animate({
        height: $('table.calendar:last').height()
    },250);
};
var enableLiveCommentPreview = function(){
    var $fields = $('#comment_form .hiddenFields input');
    var data = {
        ACT: $fields.filter('[name=ACT]').attr('value'),
        RET: $fields.filter('[name=RET]').attr('value'),
        URI: $fields.filter('[name=URI]').attr('value'),
        PRV: $fields.filter('[name=PRV]').attr('value'),
        XID: $fields.filter('[name=XID]').attr('value'),
        entry_id: $fields.filter('[name=entry_id]').attr('value'),
        site_id: $fields.filter('[name=site_id]').attr('value'),
        preview: "Preview"
    };
    $('#comment_form textarea').bind('keyup', function(){
        $.extend(data, {comment: $('#comment_text').attr('value')});
        if(data.comment){
        if(typeof(request)!='undefined'){request.abort();}
            request = $.post(window.location.href, data, function(data, textstatus){if(textstatus=='success'){
                if(!data.match('<title>')){
                    $('#comment_preview').html(data);
                }else{
                    $('#comment_preview').html('');
                }
            }});
        }
    });
};
var disableLiveCommentPreview = function(){
    $('#comment_form textarea').unbind('keyup');
};
var toggleLiveCommentPreview = function(){
    var $el = $('#live_preview_status strong');
    if($($el.get(0)).text() == 'on'){
        $($el.get(0)).text('off');
        $($el.get(1)).text('on');
        disableLiveCommentPreview();
    }else{
        $($el.get(0)).text('on');
        $($el.get(1)).text('off');
        enableLiveCommentPreview();
    }
    return false;
};

// DOM Loaded
$(function(){
    
    //init js styles
    $('body').addClass('hasJS');
    
    //calendar
    refreshCalendar();

    // 'structural' form labels
    $('#search_form input.textfield').focus(function(){
        $(this).prev('label.inset').addClass('alt');
    }).blur(function(){
        if ($(this).attr('value') !== ''){ $(this).prev('label.inset').removeClass('alt');}
    }).each(function(){
        if($(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);
            var fromClass= '';
            if($(this).is('.tertiary')){
                fromClass = 'tertiary';
            }else if($(this).is('.secondary')){
                fromClass = 'secondary';
            }else{
                fromClass = 'primary';
            }
            var toClass='';
            if($(this).is('.click-target')){
                toClass = 'primary';
                $(this).addClass('front');
                $(this).removeClass('back').removeClass('middle');
            }else if(($(this).prev('li').is('.click-target')) || ($(this).next('li').is('.click-target'))){
                toClass = 'secondary';
                $(this).addClass('middle');
                $(this).removeClass('back').removeClass('front');
            }else{
                toClass = 'tertiary';
                $(this).addClass('back');
                $(this).removeClass('front').removeClass('middle');
            }
            var margins='';
            if(((toClass==='tertiary'||toClass==='primary')&&(idx===0||idx===2))||(toClass=='secondary' && idx==1)){
                margins = '-66px';
            }else{
                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;
    });
    
    //sketchbook recent comments cycle
    $('#recent_comments ol').cycle({
        timeout: 8000,
        pause: true,
        next: 'blockquote'
    });
    
    //sketchbook calendar ajax
    $calendar = $('#calendar');
    $calendar.prepend('<div class="calendar-month-links" id="calendar_paging"><a class="prev" href="#">Previous month</a><a class="next" href="#">Next month</a></div>');
    $('#calendar_paging a').bind('click', function(){
        $cursor = $(this);
        $cursor.css('cursor','wait');
        var fwd = $(this).is('.next');
        var url=$('table.calendar .calendar-month-links a.'+$(this).attr('className')).attr('href');
        $.get(url, function(data, textStatus){
            if(textStatus=='success'){
                var cal_trans = ($.support.opacity)?'drop':'slide';
                var cal_dir_in = (fwd) ? 'right' : 'left';
                var cal_dir_out = (fwd) ? 'left' : 'right';
                $calendar.find('table.calendar').stop().hide(cal_trans, {direction:cal_dir_out}, 'slow', function(){$(this).remove();});
                $cal_in = $calendar.append(data).find('table.calendar:last');
                refreshCalendar();
                $cal_in.hide().stop().show(cal_trans, {direction:cal_dir_in}, 'slow', function(){$cursor.css('cursor','pointer');});
            }else{return false;}
        });
        return false;
    });
    
    //case study cycle
    $('#work #screenshots ol').before('<ol id="pager" class="clear">').cycle({
        timeout:0,
        speed:1000,
        pager: '#pager',
        containerResize: true,
        pause: true,
        pagerAnchorBuilder: function(idx, slide){
            myClass = (idx===0)?' class="current"':'';
            return '<li'+myClass+'><a href="#">'+(idx+1)+'</a></li>';
        }
    });
    
    //logo cycle
    $('li#identity > ul').before('<div id="identity_pager" class="paging"><a id="identity_prev" class="prev" href="#">&lt;</a><a id="identity_next" class="next" href="#">&gt;</a></div>').cycle({
        fx: 'scrollHorz',
        timeout:0,
        speed:600,
        easing: 'easeInOutCirc',
        next: '#identity_next',
        prev: '#identity_prev',
        containerResize:false
    });

    //comment preview
    enableLiveCommentPreview();
    $('#live_preview_status a').click(toggleLiveCommentPreview);
    //paging links
    $('.paging a').each(function(){
        var txt = $(this).text();
        if(txt.match('<')){
            $(this).addClass('prev');
        }else if(txt.match('>')){
            $(this).addClass('next');
        }else if(txt.match('First')){
            $(this).addClass('first');
        }else if(txt.match('Last')) {
            $(this).addClass('last');
        }
    });
    
    //budget widget
    $('#project_budget').change(function(){
        var $selected = $(this).find('option:selected');
        if($selected.val() == 'less than'){
            $(this).parents('li').after('<li id="budget_more"><p>We work with clients large and small, but we do need a better sense of your budget for this particular engagement to ensure we are a proper fit. Please enter your budget expectations, even if just a ballpark.</p><div class="warning"><label for="budget_more_field" class="required-field">Project Budget</label> <input id="budget_more_field" name="required[]" type="text" class="required textfield alert" /></div></li>')
                .next().hide().fadeTo(0,0).slideDown(150, function(){$(this).fadeTo(1000, 1);});
                $('#contact_form').validate();
                $('#budget_more_field').focus();
        }else{
            $('#budget_more').fadeTo(250, 0).slideUp(250, function(){$(this).remove();});
            $('#contact_form').validate();
        }
    });
    
    //browse widget
    $('.page-title div.all').hide();
    $('#all_trigger').click(function(){
        if($(this).hasClass('on')){
            $(this).removeClass('on').next('div.all').fadeTo(250,0).slideUp(200);
        }else{
            $(this).addClass('on').next('div.all').fadeTo(0,0).slideDown(200).fadeTo(1000,1);
        }
        return false;
    });
    
    //about pg logos
    if($.support.opacity){
        $('#about_elsewhere li a:has(img)').css('opacity', 0.5).hover(function(){
            $(this).css('opacity', 1);
        }, function(){
            $(this).css('opacity', 0.5);
        });
    }
    
    //insert flir spans
    $('.flir-image').each(function(){
        $(this).after('<span class="h-alt">'+$(this).attr('alt')+'</span>');
    });
    
    //validate forms
    $('#contact_form').validate();
    
    // add back button for iphone
    var iphone = (ua.indexOf("iphone")>=0 || ua.indexOf("ipod")>=0 || ua.indexOf("android")>=0) ? true : false;
    if(iphone) {
       $('#footer').after('<div style="font-size:40px; padding:10px 0 50px; background:#003042;"><a href="/?toggle_site">Back to Mobile Site</a></div>');
    }
    
    // this makes alex's screen pretty
    // if (navigator.appVersion.indexOf("Mac")!=-1){
    //     $('body').addClass('mac');
    // }
});

/* Window load event (things that need to wait for images to finish loading) */
//equal heights
$(window).bind('load', function(){
    $('#main_content, #aside').not('body#hello #main_content, body#hello #aside').equalHeights().css('overflow','visible');
});

// sry ie6
ua = navigator.userAgent.toLowerCase();
var IE6 = (ua.indexOf("msie 6")>=0 || ua.indexOf("msie 5")>=0/* || screen.width<=800*/) ? true : false;
if(IE6) {
   window.location.href="http://v1.nclud.com";
}