cedricAbonnel/soundboard_a5l
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

clic-deplacer uniquement en edit mode

Browse Source
This commit is contained in:
Cédric Abonnel
2026-03-27 07:54:52 +01:00
parent 2076034b37
commit 4c390c933d
3 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
public/script.js
View File

@@ -101,23 +101,24 @@
const div = document.createElement('div');
div.className = `btn ${data.file ? 'active' : ''} ${data.loop ? 'has-loop' : ''}`;
div.id = `btn-${i}`;
div.setAttribute('draggable', 'true'); // Rend le bouton draggable
// Le bouton n'est "draggable" que si le mode édition est actif
div.setAttribute('draggable', isEditMode ? 'true' : 'false');
div.innerHTML = `<span class="btn-num">${i+1}</span>
<span style="padding:10px">${data.name || "-"}</span>
<span class="loop-tag">∞</span>`;
// Clic pour lecture ou édition
div.onclick = () => handleBtnClick(i);
// Événements de Drag & Drop
// Les événements de Drag & Drop (ils ne se déclencheront que si draggable est true)
div.ondragstart = (e) => handleDragStart(e, i);
div.ondragover = (e) => handleDragOver(e);
div.ondragenter = (e) => div.classList.add('drag-over');
div.ondragenter = (e) => isEditMode && div.classList.add('drag-over');
div.ondragleave = (e) => div.classList.remove('drag-over');
div.ondrop = (e) => handleDrop(e, i);
div.ondragend = (e) => div.classList.remove('dragging');
board.appendChild(div);
});
}
@@ -125,9 +126,15 @@
function toggleEditMode() {
isEditMode = !isEditMode;
document.body.classList.toggle('edit-mode', isEditMode);
document.getElementById('toggleBtn').innerText = isEditMode ? "QUITTER L'ÉDITION" : "MODE ÉDITION";
document.getElementById('toggleBtn').style.background = isEditMode ? "var(--accent)" : "#444";
document.getElementById('toggleBtn').style.color = isEditMode ? "black" : "white";
// Mise à jour visuelle du bouton
const toggleBtn = document.getElementById('toggleBtn');
toggleBtn.innerText = isEditMode ? "QUITTER L'ÉDITION" : "MODE ÉDITION";
toggleBtn.style.background = isEditMode ? "var(--accent)" : "#444";
toggleBtn.style.color = isEditMode ? "black" : "white";
// On réinitialise la grille pour appliquer le changement de 'draggable'
init();
}
function handleBtnClick(i) {