$(window).load(function(){
	var contactForm = new contact("div#formulaireDiv", ".contact a", "div#arrierePlan", "div.menuLeft");
        var pano = new article();
});

var article = function(){
    $(".pano").hover(function(){
            var action = this;
            action.width = $(this).find("img").width();

            //largeur de l'écran
            action.screenWidth = $(window).width();

            //position du document
            action.offset = $(this).offset()
            

                $(this).animate({width : action.screenWidth-50, left : -(action.offset.left-50)},{duration : 400, queue : false});

                $(this).find("a")
                    .animate({left : -(action.width - (action.screenWidth))}, {duration : 15000, queue : true})
                    .animate({left : 0}, {duration : 10000, queue : true});        

        },
    function(){

        $(this).animate({width : 490, left : 0},{duration : 400, queue : false});    
    });   
}

//mise en place et animation du module pour les images
var contact = function(div, bouton, background, divMenu){
	var self = this;
	this.div = $(div);
        this.divMenu = $(divMenu);
	this.bouton = $(bouton);
	this.formulaire = $(div).find('.formulaire');
	this.background = $(div).find(background);
	this.bouton.click(function(){
		self.background.css('width', $(document).width() + 'px');
		self.background.css('height', $(document).height() + 'px');	
		self.div.css('display', 'block');

		self.formulaire.css('left', ($(document).width() - self.formulaire.width())/2 + 'px'); //placement du formulaire
		$('.formulaire').css({
			opacity : 0,
			top : $(document).scrollTop() + 60
		});
		$('.formulaire').animate({
			opacity : 1,
			top : $(document).scrollTop() + 20
		}, 500);

		return false;
	});
	
	//fermeture du formulaire
	this.background.click(function(){
		self.div.css('display', 'none');
	});
	
	//ajustement du formulaire durant le scroll
	$(document).scroll(function(){
		window.setTimeout(function(){
			$('.formulaire').animate({top: $(window).scrollTop()+20}, {queue:false, duration:500});
		}, 100);
	});
	
	//effacer le formulaire
	this.formulaire.find('input').click(function(){
		$(this).parent().css('backgroundPosition', '-475px -122px');
		if( $(this).attr('value') == "Votre adresse Mail"){
			$(this).attr('value', '');
		}
		if( $(this).attr('value') == "Sujet"){
			$(this).attr('value', '');
		}	});

	//animation de l'affichage du formulaire
	$('.formulaire').animate({
		opacity : 1,
		top : 40
	}, 500);
	
	//verification du formulaire avant envoie
	this.formulaire.find('.btnEnvoyer').click(function(){
		verif = this;
		this.status = true;
		self.formulaire.find("input").each(function(){

			if($(this).attr("value")=='' || $(this).attr("value")=='Votre adresse Mail' || $(this).attr("value")=='Sujet'){
				$(this).parent().css('backgroundPosition', '-475px -88px');
				verif.status = false;
			}
			
		});
		return verif.status;
	});
        
//animation de scrolling du menu concerné        
    $(window).scroll(function(){
            window.setTimeout(function(){
                            self.divMenu.animate({top: $(window).scrollTop()+150}, {queue:false, duration:500});
            }, 100);
    });        
    
//animation lors des hovers des divs
    self.divMenu.find("div").hover(function(){
        $(this).animate({width : "110%"}, {queue : false, duration : 300});
    }, 
    
    function(){
        $(this).animate({width: "100%"}, {queue : false, duration : 300});        
    });
}
