JeuWeb Créez votre jeu par navigateur !

php_addict · 30-07-2013, 12:01 AM

Bonjour

une petite question pour savoir comment VOUS, vous faites pour gérer tout les onclick (JS) qui fleurissent dans vos script javascript,

en effet je comment a avoir tout un tas de:



$(document).ready(function() {

	$("stypid_div").live('click', function() {



	// do something really very nice in JavaScript



	});

});

ne serait il pas judiceux de faire une sorte de contrôleur qui détecte chaque click et qui actionne tel ou tel script JS (function ou classe)?

le hic c'est que je n'ai aucune idée de comment faire ni aucun exemple de code...

une idée?

merci de m'avoir lu

**Sephi-Chan** · (Modification du message : 30-07-2013, 09:08 AM par Sephi-Chan.)

De mon côté c'est souvent séparé en de nombreux fichiers.

J'utilise souvent la notation déléguée de jQuery (bind, live et delegate sont maintenant fusionnée en on) car j'interviens souvent sur des éléments qui vont et viennent dans le DOM (modifié en Ajax ou autre).



$(document).on('click', '.map .territory', callback)

Ensuite, j'utilise souvent des events personnalisés, car ça a souvent plus de sens qu'un clic (ou autre) seul. Donc mes listeners font souvent un simple travail de forwarding.



$(document).on('click', '.map .territory', function(event){

  var someAdditionalData = {};

  $(event.target).trigger('territoryelected', someAdditionalData);

})



$(document).on('territoryelected', callback);

Et enfin, pour éviter d'avoir une tonne de listeners définis inutilement, il m'arrive souvent de définir des variables Javascript via le code d'une page et de définir certains listeners seulement quand certaines variables sont crées.



<html>

  <head>

    <!-- Inclusion des CSS. -->

  </head>

  <body>

    <!-- Contenu du document. -->

    window.pageRoles = [ 'map', 'playerPicker' ];

    <!-- Inclusion du Javascript. -->

  </body>

</html>

Et ensuite :



if(window.roles.indexOf('map') != -1){

  $(document).on(...);

}

Comme ça, les events listeners dédiés à la map ne sont exécutés que quand c'est nécessaire. C'est l'un des maigres désavantages à utiliser des scripts packagés : ils sont compactés et compressés en peu de fichiers Javascript et on ne peut donc plus les charger seulement quand on en a besoin).

Comme j'utilise du CoffeeScript, c'est un peu plus esthétique :



return unless 'map' in window.roles

$(document).on(...)

Ça marche parce que CoffeeScript emballe chaque script qu'il concaténe dans une fonction anonyme, qu'on peut donc interrompre dès le début plutôt que de tout englober dans un if. CoffeeScript fournit également l'abstraction du in.

php_addict · 30-07-2013, 09:47 AM

salut

ok, ok ,... donc tu lance tes listeners quand tu detecte certaines variables, c'est bien ca?

**Sephi-Chan** · 30-07-2013, 10:33 AM

Ben, tu vois bien le code. ^^



if(window.roles.indexOf('map') != -1){

  $(document).on(...);

}

php_addict · 30-07-2013, 03:14 PM

oui effectivement et je t'en remercie...il est temps pour moi de réorganiser mon code JS, et je vais même l'encapsuler dans des classes tant qu'à faire ...

Sujets apparemment similaires…
Sujet		Auteur	Réponses	Affichages	Dernier message
	Récupérer un event sur onclick="maFonction()"	niahoo	2	2 019	15-05-2014, 11:32 AM Dernier message: niahoo
	unbind un event précis en jquery?	Argorate	6	3 385	19-05-2011, 11:29 AM Dernier message: niahoo