Front/Back emparejados en el editor de racks — la trasera es la espalda del mismo aparato (v1.80.0)

User value

En el editor de racks, cada equipo se puede montar visto por delante (Front) y por detrás (Back). Antes, si arrastrabas una trasera sobre el hueco genérico de un frontal, el sistema no la reconocía como la trasera de ese aparato: se quedaba donde caía, “sumándose” al hueco en vez de sustituirlo, y frontal y trasera vivían como dos objetos sueltos que había que mover y borrar por separado. Desde la v1.80.0, soltar una trasera sobre el placeholder genérico la adopta: hereda la posición, altura y columna exactas del frontal y pasa a ser su par. A partir de ahí se comportan como un único aparato — se mueven juntos y se borran juntos (con Undo recuperando ambos). Y si nombras tus stencils en pareja (“Cisco X Front” / “Cisco X Rear”), al insertar el frontal la trasera se coloca sola, con un aviso que lo confirma.

Cómo usarla

1. En la vista Back del editor, arrastra un stencil de trasera sobre el hueco gris genérico que proyecta un frontal ya montado → el stencil se ajusta solo a su U/altura/columna y queda emparejado (toast “Rear panel attached to the front device”).
2. Alternativa por nomenclatura: nombra el stencil trasero en la librería igual que el frontal más el sufijo “Rear” o “Back” (p. ej. “Cisco C9200CX-8P-2X2G Front” y ”… Rear”). Al soltar el frontal en la vista Front, la trasera aparece sola en la vista Back.
3. Si el frontal no tiene pareja en la librería y su nombre termina en “Front”, un aviso puntual (una vez por sesión) recuerda la convención de nombres.
4. Mover el frontal (drag) mueve la trasera emparejada si su hueco de destino está libre; si no, la trasera se queda donde está (desemparejada visualmente hasta que se resuelva el hueco).
5. Borrar el frontal borra también su trasera gemela exacta; el Undo recupera ambos.

Ayuda de usuario: sección nueva “The Back view” en crearack--racks--dispositivos (mismo ciclo).

Implementación

Todo el cambio vive en static/js/editor/devices.js (Konva.js, sin cambios de backend/modelo):

• rearDeviceAt(frontDev) (antes rearDeviceCovers, ahora devuelve el objeto en vez de boolean) — busca una trasera real que solape la U/columna de un frontal.
• exactRearTwin(frontDev) — el par exacto (misma U, altura y columna): solo ese par se mueve/borra junto; una trasera con solape parcial no se arrastra con el frontal.
• findRearStencilFor(frontName) — resuelve el stencil trasero por convención de nombres (FRONT_SUFFIX/REAR_SUFFIX regex) buscando en el DOM de la librería (#stencil-library .stencil-item).
• autoPlaceRearFor(frontDev, stencilName) — coloca automáticamente la trasera emparejada por nombre tras insertar un frontal, con el aviso de convención (rearTipShown, una vez por sesión) cuando no hay pareja.
• initCanvasDropListener() — en la vista Back, si el drop cae sobre el placeholder genérico de un frontal depth='full' sin trasera real (rearDeviceAt), reescribe la posición/slot/half_width del ítem soltado a los del frontal (adopción).
• addDeviceToRack() — al mover un frontal en drag-end, busca su exactRearTwin antes de actualizar la posición y, si el hueco trasero está libre (checkCollision), mueve también la trasera; siempre llama applyViewMode() para refrescar proyecciones (antes solo se refrescaba en algunos casos, dejando genéricas obsoletas visibles).
• deleteDevice() — busca la exactRearTwin antes de destruir el nodo; si existe, la destruye también y avisa con toast.

Fix de fondo: la u_position de un dispositivo recién soltado nacía a 0 hasta el primer auto-save (~1,5 s), dejando ciego tanto al placeholder genérico como al emparejado durante ese margen. Ahora se fija en el propio evento de drop, antes de cualquier lógica de emparejado.

Modelo de datos sin cambios — usa los campos existentes de [[entity—racks—model—device]] (u_position, u_height, slot, face, zero_u, half_width) y la relación con [[entity—racks—model—stencil]] vía el catálogo de la librería.

Commits relacionados

• 68762d858bb5cab22bbff188a34e61a01e797552 (2026-08-21) — feat(editor): Front/Back emparejados, v1.80.0, PR #414.

Véase también

• [[entity—racks—model—device]]
• [[entity—racks—model—stencil]]
• [[entity—racks—model—rack]]
• [[concept—racks—editor]]
• [[crearack-tech—backend—rack-editor]]
• [[crearack—racks—dispositivos]]
• [[feature—racks—stencil-toggle-row-view]]