/* Author: apd
*/
//docready
$(document).ready(function() {
	$("#container").animate({
		'opacity':1
	},500);
	$("img.loading").remove();
	
	//sprites
	$('#brasgauchenorm').sprite({fps: 12, no_of_frames: 5, start_at_frame: 1});
	$('#brasgauchepointe').sprite({fps: 0, no_of_frames: 5, start_at_frame: 1,on_first_frame: function(obj) {
        obj.spState(2); // change to state 1 (first row) on frame 1
    }, play_frames:4
	});
	
	$('#brasdroitnorm').sprite({fps: 12, no_of_frames: 5, start_at_frame: 1});
	$('#brasdroitpointe').sprite({fps: 0, no_of_frames: 5, start_at_frame: 1,on_first_frame: function(obj) {
        obj.spState(2); // change to state 1 (first row) on frame 1
    }, play_frames:4
	});
	
	
	$('#tete').sprite({fps: 12, no_of_frames: 5, start_at_frame: 1});
	$('#corps').sprite({fps: 12, no_of_frames: 4, start_at_frame: 1});
	$('#porte1').sprite({fps: 7, no_of_frames: 3, start_at_frame: 1});
	$('#porte2').sprite({fps: 6, no_of_frames: 3, start_at_frame: 3});
	
	$('#crobars_typo').sprite({fps: 20, no_of_frames: 3, start_at_frame: 1});
	$('#design_typo').sprite({fps: 20, no_of_frames: 3, start_at_frame: 1});

	
	$('#porte1').hover(
		function(){
			//$(this).spStop();
			$(this).fps(14);
			$('#fdporte1,#crobars_typo').css({
				'opacity':1
			});
			$('#tete').spState(2);
			$('#brasgauchenorm').css({
				'opacity':0
			});
			$('#brasgauchepointe').css({
				'opacity':1
			});
			$('#brasgauchepointe').spStart();
			
		},
		function(){
			//$(this).spStart();
			$(this).fps(7);
			$('#fdporte1,#crobars_typo').css({
				'opacity':0
			});
			$('#tete').spState(1);
			$('#brasgauchenorm').css({
				'opacity':1
			});
			$('#brasgauchepointe').css({
				'opacity':0
			});
			$('#brasgauchepointe').destroy();
			$('#brasgauchepointe').sprite({fps: 0, no_of_frames: 5, start_at_frame: 1,on_first_frame: function(obj) {
				obj.spState(2); // change to state 1 (first row) on frame 1
			}, play_frames:4
			});
		}
	).click(function () { 
      
	  window.location = "http://crobars.petrovski-darmon.com";
	  
    });

	
	$('#porte2').hover(
		function(){
			//$(this).spStop();
			$(this).fps(14);
			$('#fdporte2,#design_typo').css({
				'opacity':1
			});
			$('#tete').spState(3);
			$('#brasdroitnorm').css({
				'opacity':0
			});
			$('#brasdroitpointe').css({
				'opacity':1
			});
			$('#brasdroitpointe').spStart();
		},
		function(){
			//$(this).spStart();
			$(this).fps(6);
			$('#fdporte2,#design_typo').css({
				'opacity':0
			});
			$('#tete').spState(1);
			$('#brasdroitnorm').css({
				'opacity':1
			});
			$('#brasdroitpointe').css({
				'opacity':0
			});
			$('#brasdroitpointe').destroy();
			$('#brasdroitpointe').sprite({fps: 0, no_of_frames: 5, start_at_frame: 1,on_first_frame: function(obj) {
				obj.spState(2); // change to state 1 (first row) on frame 1
			}, play_frames:4
			});
		}
	).click(function () { 
      
	  window.location = "http://design.petrovski-darmon.com";
	  
    });;
	/*
	$('#my_sprite').sprite({fps: 9, no_of_frames: 3, play_frames: 30});
	$('#my_sprite').spState(1); change row
	
$('#my_sprite').sprite({
    fps: 9, 
    no_of_frames: 24, 
    on_first_frame: function(obj) {
        obj.spState(1); // change to state 1 (first row) on frame 1
    }, 
    on_last_frame: function(obj) {
        obj.spStop(); // stop the animation on the last frame
    },
    on_frame: { // note - on_frame is an object not a function
        8: function(obj) { // called on frame 8
            obj.spState(2); // change to state 2 (row 2) on frame 8
        },
        16: function(obj) { // called on frame 16
            obj.spState(3); // change to state 3 (row 3) on frame 16
        }
	}
});
	*/
	
	
	//centering du contenant
	centerElt($("#container"),$(window));
	
/*	posSprites($('#porte1'),34,60,$("#container"));
	posSprites($('#porte2'),296,60,$("#container"));*/
	
	
	
	
	//
	$(window).resize(function(){
			centerElt($("#container"),$(window));
			/*posSprites($('#porte1'),34,60,$("#container"));
			posSprites($('#porte2'),296,60,$("#container"));*/
			
			
			
	});
	
	
});

//fns


function centerElt(Elt,ref){
	leftBlk=((ref.width()-Elt.width())/2);
	topBlk=((ref.height()-Elt.height())/2);

	Elt.css({
		'left':leftBlk+'px',
		'top':topBlk+'px'
	});
}

function posSprites(Sprite,xrel,yrel,refObj){
	var refPos = refObj.offset();
	var newleft=refPos.left+xrel;
	var newtop=refPos.top+yrel;
	
	Sprite.css({
		'left':xrel+'px',
		'top':yrel+'px'
	});
}