11492 sujets

JavaScript, DOM et API Web HTML5

Bonjour à Tous,
je suis en train de mettre en place un petit jeu qui figurera sur une page web (non, vraiment !?)

Pour cela j'utilise le drag and drop de jquery

grosso modo,
on a une voiture,
on lui drop dessus un type de capteur et un outil,
ensuite on déplace la voiture sur un circuit,
et on lance l'animation.

En fonction du capteur et de l'outil, le scénario sera différent.
Là, pour le moment, je fais bouger cette voiture par des directives pré-programmées :
	    	
// scenario 1
if ($("#voiture").hasClass("capteur1") && $("#voiture").hasClass("outils1") != $( "#voiture" ).hasClass("capteur2") != $( "#voiture" ).hasClass( "outils2" )) {
		 		$('#voiture').animate({left: '0px',top: '300px'}, 1000)
				    .delay(100)
				    .animate({rotate:'-90deg', left:'50px', top:'330px'}, 1000)         
				    .delay(100)
				    .animate({left:'300px'}, 1000) 
				    .delay(100)
				    .animate({rotate:'-180deg', left:'350px', top:'300px'}, 1000)         
				    .delay(100)
				    .animate({left:'350px',top:'0px'}, 500, 
				    function(){
			            $('#voiture .outils1').animate({
			                rotate:'90deg',
			                left:'0px',
			                top:'0px'
			            }, 300)
			        }) 
				   .delay(900)
				   .animate({rotate:'-270deg', left:'320px', top:'0px'}, 1000)   
				   .delay(100)
				   .animate({left:'0px', top:'0px'}, 1000)  
				   .delay(100)
				   .animate({left:'0px', rotate:'-360deg', top:'40px'}, 1000, 
					   function(){
				            $('#voiture .outils1').animate({
				                rotate:'0deg',
				                left:'25px',
				                top:'25px'
				            }, 300);  
				    	}
				    );
			    $('#voiture .outils1').mouseover(function(e){
			        $(this).animate({
			            rotate: '360deg'  
			        });
			    });
			    $('#voiture .outils1').mouseout(function(e){
			        $(this).animate({
			            rotate: '0deg'
			        });
				});
			};   


Mais je me rends compte que j'aimerai d'avantage faire en sorte que "ma voiture" se dirige seul vers des div en particulier, sans avoir à prédéfinir l'itinéraire.
Comme ça, il me suffira de dire : avec tel capteur et tel outil, la voiture se dirige vers la div1, ensuite la div2, ensuite la div7...
Ce qui me rendra bien plus simple la mise en place des différents parcours.

Auriez-vous une idée à me suggérer ?
Merci beaucoup
Modifié par Guim (19 Jun 2015 - 16:06)