/*This document is a property of Imad Mousa June 2010 */
/* Please be free to use it for your own purpose */ 




$(document).ready(function() {
$('.contact').css('top','-430px');
$('#top_header').css('opacity','0.3');
$('#side_header').css('opacity','0.2');
$('.contact_form, .contact_lower_image,  .show img, .hide img').css('opacity','0.7');
 


//IE6 Message 

 
if ($.browser.msie && $.browser.version <= 6 )  
   {
   $('.footer_bg').hide();
    
  $('.ie_message').css('z-index','9999');
  $('.ie_message_blackout').css('z-index','999');

 
 
$('.ie_message').animate({top:'120px'}, 1300); 
$('#ie_message_blackout').fadeTo(10,0.8);
$('.top_part h1, .slide,  .bottom_content .para_side, #footer_bottom').fadeTo(10, 0.2);
   }
   
 if ($.browser.msie && $.browser.version > 6 )  // to hide it completely from versions above IE6
   {$('.ie_message').hide();}  
   
   
$('.close_banner').click(function() {
$('.ie_message, #ie_message_blackout').hide();
$('.top_part h1, .slide, .bottom_content .para_side, #footer_bottom').fadeTo(200, 1.0);
});

$('a.hide').css('display','none');



$('.show, .show2 ').click(function(){
	
								  
	if ($.browser.msie && $.browser.version <= 8 )
 {		
    $('.top_part h1').css('z-index','99999');					  
	$('.contact').animate({top:'0px'}, {queue:false, duration: 500});
	$('.show, .show2').hide();
 
	$('.hide').show();
	$('#slider #slide_container .slide, .bottom_content .para_side img').fadeTo(100, 0.1);
								  }
								  
						else 
					{
						 
						$('.contact').animate({top:'0px'}, {queue:false, duration: 500});
						$('.show, .show2').hide();
						$('.hide').show();
						$('#slider, .para_side').fadeTo(100, 0.1);
						
					}
					 
 
});
								   
 
$('.hide').click(function() {
						  
			 if($.browser.msie && $.browser.version <= 8)
		{
		$('.contact').animate({top:'-430px'}, {queue:false, duration: 500});
		$('.show, .show2').show();
		$('.hide').hide();
		$('#slider #slide_container .slide, .para_side img').fadeTo(400, 1.0);
		  }
				
				else 
				{
					$('.contact').animate({top:'-430px'}, {queue:false, duration: 500});
				   $('.show, .show2').show();
				  $('.hide').hide();
				   $('#slider, .para_side ').fadeTo(400, 1.0);
						  }
    }); 
 



  $(':input').blur(function() {
   if($(this).val().length == 0) {
    $(this)
	.css({'background-color':'#ffcc99', 'border':'#666 solid 1px'})
	.after('<span class="error">&nbsp;&nbsp;&nbsp;&nbsp; Field required</span>');
	 }
	});
   $(':input').focus(function() {
    $(this) 
	 .css({'background-color': '#000', 'border' : '#fff 1px solid'}) 
	.removeClass('error') 
	.next('span')
	.remove();  
	   });
	 
     $('.btn').css({'color':'#fff', 'cursor':'pointer'});
	 $('input:reset').click(function() {
	  $('span.error').removeClass();
	  $(':input').css({'background':'#000' ,'border':'#666 solid 1px'});
	   
	 });

//top part (header text)	 
	 
	$('.show, .show2').click(function() {
   
  
   
   $('.top_part h1').animate({left:'530px'}, {queue:true, duration:300});
 
   $('.top_part .stewie').animate({left:'110px', opacity:'0.2'}, {queue:true, duration:200});
   $('#top_header').animate({top: '0px' , height: '100%' });
    $('.para').fadeTo(50,0.1);
    
  
   $('.top_part h1 a, .top_part h1 a img').fadeIn(500);
 
	 });
	 $('.hide').click(function() {
	 

	 $('.top_part h1').animate({left:'450px'}, {queue:true, duration:650});
	 $('.top_part .stewie').animate({left:'-260px', opacity:'1.0'}, {queue:true, duration:200});
	   $('.para').fadeTo(50,0.3);
	 
	 
	 //check browsers
	 if ($.browser.msie && $.browser.version <= 6 ) {
	  $('#top_header').animate({top: '225px',  height: '230px'});
	  }
	  else {
	   $('#top_header').animate({top: '220px',  height: '230px'});
	  }
	   
	  
	$('.top_part h1 a, ').fadeOut(300);
 
	 });
	 
//top part appearing text 

  $('.portfolio_app, .about_app, .hire_app, .site_app').css('display', 'none');
  
   if ($.browser.msie && $.browser.version <= 6 ) 
   
   {
      //no action required for IE 6, showing hidden text is not necessary 
   }
   
   else 
   
   {
   $('.menu_item:eq(0)').hover(function() {
  $('.portfolio_app').fadeIn(200);
   }, function() {
   $('.portfolio_app').hide();
   
	}); 
   
   $('.menu_item:eq(1)').hover(function() {
  $('.about_app').fadeIn(200);
   }, function() {
   $('.about_app').hide();
   
	});
	
	$('.menu_item:eq(2)').hover(function() {
  $('.hire_app').fadeIn(200);
   }, function() {
   $('.hire_app').hide( );
   
	});
	$('.menu_item:eq(3)').hover(function() {
  $('.site_app').fadeIn(200);
   }, function() {
   $('.site_app').hide();
   
	});
	}  
	 //hyper link animation
	  
	 $('.top_part a').hover(function() {
	 $(this).animate({left: '10px'});
	 }, function() {
	 $(this).animate({left: '0px'});
	 
	 
	 
	 });
	
	
	
	
	
	 //slider 
	 var currentPosition = 0;
  var slideWidth = 490;
  var slides = $('.slide');
  var numberOfSlides = slides.length;

  // Remove scrollbar in JS
  $('#slide_container').css('overflow', 'hidden');

  // Wrap all .slides with #slideInner div
  slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);

  // Insert controls in the DOM
  $('#slider')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');

  // Hide left arrow control on first load
  manageControls(currentPosition);

  // Create event listeners for .controls clicks
  $('.control')
    .bind('click', function(){
    // Determine new position
	currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
	 
    
	// Hide / show controls
    manageControls(currentPosition);
    // Move slideInner using margin-left
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });

  // manageControls: Hides and Shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
	if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
	// Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }	
});