Par quoi remplacer un clic droit sur une tablette ?

[L'Omniscient]

Pour le design, en fait j'ai 300 lignes de JS qui ajustent le design, (plus des petites bribes dans des codes). Et puis je ne sais pas quelle taille de height je dois associer à quelle taille de width. Du coup faut vraiment que je m'y plonge de très longues heures, je ne veux vraiment pas prendre le temps pour ça maintenant. Mais c'est sûr que je le changerai entièrement, c'est ni pratique pour coder, ni optimisé, mais faut que je me look plusieurs jours dessus, et c'est un truc qui affecte très peu les utilisateurs.

En vrai hier soir j'avais des soucis d'internet, du coup j'ai vite écris, j'ai même pas ouvert le tuto xD Mais j'ai du mal avec les tutos, je pige jamais (Et encore pire en anglais =) )

Pour ton code, je ne comprends pas. Soit ça n'a pas les mêmes effets que le miens, soit ya un truc que je cerne pas.

Toi tu cliques un objet pour lui attribuer display none ou display block ? C'est comme ça que j'ai compris le code. Mais je ne comprends pas bien ça :
document.getElementById('.menu')

Moi je clique un objet pour attribuer à un autre objet lié un display none ou display block.
En gros j'ai :

<div id="inventaire">
<div id="objetX">Image de l'objet</div>µ
<div id="objetX2>Menu</div>
</div>

Grosso modo je recupère l'id du parent de l'image (objetX), je lui ajoute 2 et je le display block ou none.
Ce sont deux if qui permettent à 100 objets différents et 50 recettes différentes de fonctionner.
J'ai mis un document.oncontext global pour supprimer le clic droit basique du jeu, parce que je ne voulais pas qu'on puisse faire un clic droit.
Et du coup j'ai mêlé ça en disant que si on est dans l'inventaire ça s'active de telle façon, et si on est dans les recettes, ça s'active de telle façon.
Mais si par exemple je veux que le clic droit sur la barre de menu fasse apparaître un vaisseau qui traverse l'écran j'ajouterais un autre if, mais ce serait un code complètement différent !

[Xenos]

Nope, moi, je place un eventListener sur un objet HTML, et lorsque l'event est appelé, j'ajoute ou je supprime des classes CSS sur d'autres éléments HTML. Ensuite, le CSS se charge de faire les display none ou autres mises en formes adaptées. Cela me permet de ne pas avoir de CSS au milieu du JS (et donc, de pouvoir utiliser des plugins navigateur comme "CSS reloader" qui permettent de voir les changements appliqués au CSS sans recharger la page) et d'autre part, cela me permet de séparer le listener de chaque objet HTML (au lieu d'un énorme listener qui sera imbitable avec 50 if, j'ai 50 listener, chacun en charge d'un truc, chacun écoutant [par définition] les évènements d'un seul élément HTML [ici, l'évènement "contextmenu"]).

Jouer avec des "le noeud parent de gnagna", encore plus avec "le deuxième frère du noeud bidule", c'est prendre le risque de figer totalement ton HTML (si un noeud s'ajoute au milieu, patatras!). Là, dans mon exemple, c'est un querySelector qui se charge de trouver l'autre noeud auquel appliquer le styling. Ok, si cet autre noeud change de classe, patatras, mais là, c'est logique (tu changes le noeud ciblé, ça casse ce qui cible le noeud; précédemment, tu ajoutais des trucs ailleurs et cela pouvait casser le ciblage du noeud).

Après, si tu as 50 noeuds HTML sur lesquels poser le même listener, tu peux parfaitement stocker ton listener dans une variable (var listener = function (e) { ... }) puis appliquer ce même listener à tous tes objets (en JS moderne: [].forEach.call(document.querySelectorAll('.mesciblesaecouter'), node => node.addEventListener(listener)) sinon, pour faire plus compatible, tu peux passer par une boucle for [ou mettre ce for dans une fonction utilitaire, vu que c'est du path pour palier au fait que tous les navigateurs n'ont pas encore implémenté les dernières spec JS).
Après, tu peux faire 70 if qui s'enchainent, mais je te garantis que cela ne va vraiment pas être pratique...

(et heu, les jeux "ouais je veux pas du clic droit basique", c'est juste... lol... non... http://www.commitstrip.com/fr/2016/06/03...t-allowed/ Enfin, après, tu fais comme tu le sens, je te propose juste de bonnes habitudes qui te seront profitables à terme [encore plus si tu veux t'orienter vers une carrière informatique] )

[L'Omniscient]

Alors ok je comprends l'ajout de l'event à l'élément HTML.

Mais comment tu sélectionnes objetX2 du coup ? Et puis ça fonctionne comment ton appel byId avec une classe à l'intérieur ?
Parce que chez moi, tous les "objetX2" ont la classe .menu
Moi je veux bien une autre manière de trouver mon objetX2 mais je vois pas comment tu le trouves dans ton code (alors j'aurais éventuellement pu mettre l'ID sur l'image, effectivement dans ce cas j'aurais juste pu récupérer l'ID et lui ajouter 2 sans passer par un parentNode, je sais pas pourquoi je ne l'ai pas fais, je n'y ai peut-être pas pensé, où alors ya eu un autre soucis à ce niveau là).

(J'ai fais le addClass / Removeclass sur un autre code, c'est super pratique, je connaissais pas, ça va me changer la vie :p )

Le clic droit c'est juste pour une affaire d'esthétique et d'ergonomie hein ^^ Ils peuvent looker mon code si ils veulent

[Xenos]

Le querySelector permet de sélectionner un noeud HTML à partir d'un sélecteur CSS https://developer.mozilla.org/en-US/docs...rySelector avec quelques subtilités à ne pas rater (un x.querySelector('y') prendra tous les sous-noeuds de x et regardera s'ils matchent le sélecteur CSS "y", même si "y" fait appel à des noeuds parents de x).

Si tu veux que le node HTML X3 fasse référence au noeud HTML Y3, alors il te faut simplement procéder comme les labels HTML: appliquer un ID à Y3 et utiliser un attribut sur X3 qui y fait référence. Sémantiquement et sur le long terme, cela structurera ton code et t'éviteras de finir comme Eclerd v0 ("ouais, ça tourne, mais tout a figé parce que si je touche au moindre truc, tout pète / je n'arrive pas à me relire").

L'une des conséquences de ton oncontextmenu sur le document est justement que les utilisateurs se verront bloquer ce clic droit partout. L'application d'un listener par élément HTML (outre le fait que le listener foutra le camp si l'élement HTML est supprimé ce qui est parfois pratique) t'évites ce genre de soucis. Là, tu vas devoir patcher le truc que ta méthode a cassé. C'est pas nécessaire catastrophique, mais c'est une très très mauvaise habitude à prendre (t'imagines pas le merdier de certains sites qui passent ainsi le temps à patcher le patcher du patch qui tentait de réparer ce qu'un autre truc avait cassé).

[L'Omniscient]

Aaaah, sympa le querySelector ! :O Alors effectivement, ton code est beaucoup plus simple = D
Je l'essaierai quand j'en aurai besoin. Effectivement ça change la vie xD

J'avoue que je suis aussi dans le cas où je fais super attention à mes codes quand je les retouche parce que j'ai peur de tout faire péter xD Globalement je me relis, mais parfois ya des détails qui tuent si je modifie : par exemple si je retouche le height d'un élément HTML avec une fonction JS, si mon height est dans une class ça marche plus. Alors si je met le height dans la class, ça marche plus >.<

Ou alors des variables que je réinitialise parce que sinon elles viennent interférer dans les codes, des fois je me dis "Pourquoi je déclare cette variable comme ça ici ? Ca sert à rien" Puis je supprime, et tout pète xD Du coup maintenant je retouche très minutieusement, j'étudie l'ensemble de mon code, quand je vois un truc suspect je cherche toutes les variables, les ID, les class similaires dans tous mes fichiers pour voir où ça a une influence, je commente, je teste avec / sans... Et ça va je m'en sors. C'est de la chirurgie esthétique mais je m'en sors :p Faut juste que je prenne la bonne parcelle de code =)

Oui non mais je comprends tout à fait le coup de si la structure HTML change ça fait foirer, c'est juste que je ne connaissais pas le fonctionnement de querySelector, effectivement c'est beaucoup plus propre. (Bon par contre, je vais peut-être pas modifier ça maintenant aussi, parce qu'à tous les coups j'en ai aussi pour quelques heures, vu que ya toujours plein de petits détails adaptés aux autres morceaux de codes).