OOUI/Elements/Draggable/fr

OOUI est livré avec deux mixins qui entourent l'API HTML5 Drag and Drop, ' et '. Ces implémentations OOUI rendent plus facile l'utilisation de l'API. Par défaut : Pour pouvoir fonctionner, un élément déplaçable doit être dans un conteneur qui est un élément de groupe déplaçable.
 * est un.
 * est un.

Un objet DraggableGroupElement va agréger les événements de déplacement (dragend, dragstart, et drop) en écoutant chaque fils, et en les réorganisant en conséquence.

Configuration
Un groupe d'éléments déplaçables peut avoir deux orientations : verticale et horizontale. Ces orientations contrôlent la position relative des éléments entre eux quand ils sont déplacés à l'intérieur du conteneur.

Il est possible de configurer quelle partie d'un élément déplaçable peut être déplacée. Par défaut, c'est l'élément entier qui est déplaçable.
 * Quand l'orientation est verticale, les éléments qui la composent sont des blocs positionnés en ligne et ordonnés verticalement, au dessus de la ligne suivante si cette ligne est remplie.
 * Quand l'orientation est horizontale, les éléments sont des blocs, empilés les uns sur les autres.

Événements
Un objet  émet ces événements de déplacement :


 * indique que l'utilisateur a relâché la souris après avoir déplacé un élément, ce qui met fin à l'opération de déplacement.
 * indique que l'utilisateur a cliqué sur un élément avec la souris et maintenu, et que cet élément est en train d'être déplacé.
 * indique que l'utilisateur a relâché l'élément pointé par la souris, sur une cible valide.

Un  émet les éléments de déplacement suivants :


 * indique que l'utilisateur est en train de déplacer un élément vers une nouvelle position et qu'il ne l'a pas encore relâché.
 * indique que l'état de déplacement a été modifié.

Exemples
L'exemple ci-dessous montre une opération de déplacement réalisée à l'intérieur d'un DraggableGroupElement à orientation verticale, avec des poignées. Ceci est disponible dans le démonstration de OOUI, dans laquelle vous pouvez intervenir.