correccion direccion

public/js/piscina.js

@@ -315,8 +315,26 @@ tipoPiscinaSelect.addEventListener('change', async () => {
   if (i !== -1) {
     formacionActual[i].x = newX;
     formacionActual[i].y = newY;
+
+    // Si hay dirección, recalcular puntos
+    if (formacionActual[i].direccion && atletasKonva[atleta.idPersonalizado].flecha) {
+      const dir = formacionActual[i].direccion;
+      const dx = dir.x2 - dir.x1;
+      const dy = dir.y2 - dir.y1;
+
+      // Actualizar punto de partida y final relativo a nueva posición
+      dir.x1 = newX;
+      dir.y1 = newY;
+      dir.x2 = newX + dx;
+      dir.y2 = newY + dy;
+
+      atletasKonva[atleta.idPersonalizado].flecha.points([
+        dir.x1, dir.y1, dir.x2, dir.y2
+      ]);
+    }
   }
 
+  // Actualiza visualmente los textos
   const nuevosMetros = convertirAMetros(newX, newY);
   coordText.text(`${nuevosMetros.metrosX}m, ${nuevosMetros.metrosY}m`);
   coordText.x(newX - 35);
@@ -328,16 +346,10 @@ tipoPiscinaSelect.addEventListener('change', async () => {
   figuraText.x(newX - 25);
   figuraText.y(newY + 18);
 
-    if (flecha) {
-      // Actualiza flecha si existe
-      const dx = atleta.direccion.x2 - atleta.direccion.x1;
-      const dy = atleta.direccion.y2 - atleta.direccion.y1;
-      flecha.points([newX, newY, newX + dx, newY + dy]);
-    }
-
   layer.batchDraw();
 });
 
+
   layer.add(circle);
   layer.add(text);
   layer.add(figuraText);
@@ -368,6 +380,7 @@ tipoPiscinaSelect.addEventListener('change', async () => {
 
   const start = stage.getPointerPosition();
   const atleta = formacionActual[indexAtletaDireccion];
+
   const linea = new Konva.Arrow({
     points: [start.x, start.y, start.x, start.y],
     stroke: 'black',
@@ -394,6 +407,12 @@ const linea = new Konva.Arrow({
       x2: end.x,
       y2: end.y
     };
+
+    // Asignar la flecha al atleta visual
+    if (atletasKonva[atleta.idPersonalizado]) {
+      atletasKonva[atleta.idPersonalizado].flecha = linea;
+    }
+
     modoDireccion = false;
     indexAtletaDireccion = null;
     stage.off('mousemove.direccion');
@@ -401,6 +420,10 @@ const linea = new Konva.Arrow({
   });
 });
 
+
+
+ 
+
   function showPopover(x, y, contentHTML) {
     document.getElementById('popoverAtleta')?.remove();
 
@@ -456,6 +479,30 @@ function animarTransicion(nuevaFormacion) {
       alert('Agrega nombre de formación y al menos un atleta');
       return;
     }
+    formacionActual = formacionActual.map(a => {
+  const obj = atletasKonva[a.idPersonalizado];
+  if (!obj) return a;
+
+  const x = obj.circle.x();
+  const y = obj.circle.y();
+
+  // Actualizar posición
+  a.x = x;
+  a.y = y;
+
+  // Si hay flecha, actualiza dirección
+  if (a.direccion && obj.flecha) {
+    const points = obj.flecha.points();
+    a.direccion = {
+      x1: points[0],
+      y1: points[1],
+      x2: points[2],
+      y2: points[3]
+    };
+  }
+
+  return a;
+});
 
     const body = {
       nombreColoquial: nombre,