﻿jQuery().ready( function(){
	$('#btn_more').click(function(e)
	{
	    e.preventDefault();
	    
		$('#project').hide('slide', { direction: 'left',easing:'easeInExpo' }, 400,function()
		{
		    $('#clients').show('slide', { direction: 'right',easing:'easeOutExpo' }, 1000).removeClass('busy');
		});
	});
    $("#AspForm").validate(
    {
        errorContainer: '#messageBox',
        errorLabelContainer: '#messageBox ul',
        errorElement: 'li',
        rules: 
        {
            txt_name: "required",
            txt_subject: "required",
            txt_msg: "required",
            txt_email: 
            {
                required: true,
                email: true
            }
       },
       messages: 
       {
            txt_name: "Please enter your name",
            txt_subject: "Please provide the subject of your message",
            txt_msg: "Please type a message",
            txt_email: 
            {
                required: "Please enter your email address",
                email: "Your email address must be in the format of name@domain.com"
            }
        }

    });
    $('#messageBox a').click(function(e){e.preventDefault();$('#messageBox').hide();});
    $('#clients a').bind('click', ajaxClick);
    if($.browser.msie) $('.txt').focus(function(){ $(this).addClass('focus'); }).blur(function(){ $(this).removeClass('focus'); });
});

function ajaxClick(e)
{
	var btn = e.target;
	e.preventDefault();
	e.stopPropagation();
	var href = $(this).attr('href');
	var rel = href.substr( href.indexOf('=') + 1 );
	if( $('#clients').hasClass('busy') ) return;
	$('#clients').addClass('busy');
	var img_load = new Image();
	$(img_load).load( function(){
		$(this).unbind('load');
		$(this).fadeIn(200);
		loadData(btn,rel);
	}).error( function(){
		$('#work').prepend('<span class="loading">Loading...</span>');
		loadData(btn,btn.rel);
	}).attr('src','img/loading.gif').addClass('loading').css('z-index',999).prependTo(btn);
}

function loadData(btn,rel)
{
	$.ajax({
		type: 'POST',
		url: 'Default.aspx/RequestProject',
		data: '{"id":"' + rel + '"}',
		contentType: 'application/json; charset=utf-8',
		dataType: 'json',
		error: function(){
			$('#clients').removeClass('busy');
			window.location = $(btn).attr('href'); 
		},
		success: function(msg){
			displayProject(msg);
		}
	});
}

function displayProject(project)
{
	$('#d-title').text(project.Title);
	$('#d-client').text(project.Client);
	$('#d-type').text(project.Type);
	$('#d-summ').text(project.Summary);
	$('#d-status').text(project.Status);
	$('.img').remove();
	(project.Url.length > 0) ? $('#btn_visit').attr('href',project.Url).show() : $('#btn_visit').hide();
	
	var newImg = new Image();
	$(newImg).one( 'load', function(){
		$(this).addClass('img');
		$('#work .loading').fadeOut( 200, function(){
			$('#work .loading').remove();
			$('#clients').hide('slide', { direction: 'right',easing:'easeInExpo' }, 400,function()
			{
			    $('#project').prepend($(newImg)).show('slide', { direction: 'left',easing:'easeOutExpo' }, 1200);
			});
		});
	}).error( function(){ window.location = '?project=' + project.ID; }).attr('src','img/projects/' + project.ID + '.jpg').attr('width','432').attr('height','378');
}
