Léger bug sur mon script de défilement de vignettes

Par Ahy, il y a 9 ans

Javascript

Bonjour :)

Dans le cadre de mon travail de fin d'année, un portfolio afin de trouver un stage l'année prochaine, j'ai réalisé un petit script pour tester la faisabilité d'une de mes idées pour présenter mes projets scolaires de cette année.

http://codepen.io/ahy/full/MewwPO/

De base, les projets vont de gauche à droite. On peut les déplacer avec un drag & drop ce qui change leur direction dans celle voulue, ce qui est plutôt cool.

Celui-ci fonctionne bien sauf que j'ai un très léger bug que je n'arrive pas à régler.

En effet, parfois, quand on drag vers la gauche alors que les éléments sont sensés continuer leur chemin à gauche après le drop, ils continuent vers la droite ... (je vous invite à essayer de drag & drop plusieurs fois vers la gauche, vous comprendrez où je veux en venir)
Ca ne se produit que dans cette direction. Ils ne partent jamais à gauche si on les drag vers la droite.
Ca se produit environ une fois sur cinq. J'aimerais que ça soit parfait pour ma présentation de TFA dans deux semaines et j'ai pas envie qu'un prof me fasse la remarque du "ça bug, ça craint" :D

Merci :)

4 réponses

MaximaxouSlider, il y a 9 ans

Salut,

Je n'ai pas réussi à tester mais il me semble que l'erreur se situe ici : MewwPO.js ligne 149 :

if(posX < oldX){
speed = speed - (speed 2); //à remplacer par speed = -element.speed;
velocity = posX - (posX 2); //à remplacer par velocity = -posX (ça ne change rien ça simplifie juste l'écriture)
}else if(posX > oldX){
speed = element.speed;
velocity = posX;
}

Le problème est qu'avec ce que tu as fait, quand on drag vers la gauche, à chaque fois que l'évènement mouseMouse survient, or il survient plusieurs fois lors d'un même glissé, le sens de speed s'inverse. Donc, une fois le glissé terminé, on ne sait pas quel va être le sens de speed. En revanche, pendant le glissé, la variable velocity intervient au niveau du déplacement. Elle est bien négative à tous les coups, et plus puissante que speed, donc pendant le glissé les éléments se déplacent bien uniquement vers la gauche.

Par contre je ne vois pas pourquoi après le glissé ça se déplacerait plus souvent vers la gauche que vers la droite, dans la logique ça devrait être 50/50.

Ahy, il y a 9 ans

Merci d'avoir prêté attention à mon code :)

Effectivement, je n'avais pas pensé au fait que le changement de signe s'applique à chaque itération de mousemove. Du coup je vais modifier afin que la direction finale des cases soit établies quand mouseup est appelé.

En ce qui concerne le calcul pour changer de signe, j'avais fais comme ça car il ne voulait pas prendre la bonne valeur en faisant "-posX" par exemple. Je viens de retester et maintenant ça marche. Mystère.

Je modifie et je reviens si jamais.

EDIT : j'ai réglé le problème ! j'ai ajouté une condition en plus qui vérifie si speed est positif (donc si il va à droite) afin d'éliminer les cas où il va déjà à gauche ceci pour ne pas qu'il y ait un rechangement de signe.

MaximaxouSlider, il y a 9 ans

element.speed est une constante et on sait qu'elle est forcément positive. Donc si tu mets simplement speed = -element.speed comme je te l'ai conseillé, speed sera forcément négatif lors du mousemove vers la gauche.
Ceci dit, content que ton problème soit résolu.

Ahy, il y a 9 ans

Ah oui, mais comme j'ai expliqué mes changements de signes ne voulaient yypas fonctionner quand j'ai fais ce script. Dorénavant ça marche en faisant comme ça aussi. ^^