+
+
Configuration Bouton
+
+
-
@@ -90,8 +140,8 @@
let editingIndex = null;
let tempFileData = null;
- // Données des boutons
- let btnData = JSON.parse(localStorage.getItem('sb_pro_data')) || Array(30).fill(null).map((_, i) => ({
+ // Données pour 64 boutons (Grille 8x8)
+ let btnData = JSON.parse(localStorage.getItem('sb_studio_data')) || Array(64).fill(null).map((_, i) => ({
id: i, name: "", file: null, loop: false, volume: 1
}));
@@ -104,7 +154,9 @@
const div = document.createElement('div');
div.className = `btn ${data.file ? 'active' : ''} ${data.loop ? 'has-loop' : ''}`;
div.id = `btn-${i}`;
- div.innerHTML = `
${data.name || (i+1)}`;
+ div.innerHTML = `
${i+1}
+
${data.name || "-"}
+
∞`;
div.onclick = () => handleBtnClick(i);
board.appendChild(div);
});
@@ -113,19 +165,16 @@
function toggleEditMode() {
isEditMode = !isEditMode;
document.body.classList.toggle('edit-mode', isEditMode);
- document.getElementById('status').innerText = isEditMode ? "MODE ÉDITION" : "MODE LECTURE";
- document.getElementById('toggleBtn').innerText = isEditMode ? "QUITTER" : "ÉDITER";
+ 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";
}
function handleBtnClick(i) {
- if (isEditMode) {
- openEdit(i);
- } else {
- playSound(i);
- }
+ if (isEditMode) openEdit(i);
+ else playSound(i);
}
- // --- LOGIQUE LECTURE ---
function playSound(i) {
const data = btnData[i];
if (!data.file) return;
@@ -144,7 +193,13 @@
}
}
- // --- LOGIQUE ÉDITION ---
+ function stopAll() {
+ Object.keys(players).forEach(key => {
+ players[key].pause(); players[key].currentTime = 0;
+ document.getElementById(`btn-${key}`).classList.remove('playing');
+ });
+ }
+
function openEdit(i) {
editingIndex = i;
const data = btnData[i];
@@ -152,10 +207,9 @@
document.getElementById('inputName').value = data.name;
document.getElementById('inputLoop').checked = data.loop;
document.getElementById('inputVolume').value = data.volume || 1;
- document.getElementById('fileNameLabel').innerText = data.file ? "Fichier chargé" : "Aucun fichier";
+ document.getElementById('fileNameLabel').innerText = data.file ? "Audio présent" : "Audio vide";
tempFileData = data.file;
-
- document.getElementById('editOverlay').classList.add('show');
+ document.getElementById('editOverlay').style.display = 'flex';
}
document.getElementById('fileInput').onchange = (e) => {
@@ -164,7 +218,7 @@
const reader = new FileReader();
reader.onload = (ev) => {
tempFileData = ev.target.result;
- document.getElementById('fileNameLabel').innerText = "Nouveau fichier : " + file.name;
+ document.getElementById('fileNameLabel').innerText = "Fichier : " + file.name;
};
reader.readAsDataURL(file);
}
@@ -175,16 +229,13 @@
btnData[editingIndex].loop = document.getElementById('inputLoop').checked;
btnData[editingIndex].volume = parseFloat(document.getElementById('inputVolume').value);
btnData[editingIndex].file = tempFileData;
-
- localStorage.setItem('sb_pro_data', JSON.stringify(btnData));
- if (players[editingIndex]) delete players[editingIndex]; // Reset audio pour appliquer changements
+ localStorage.setItem('sb_studio_data', JSON.stringify(btnData));
+ if (players[editingIndex]) delete players[editingIndex];
closeEdit();
init();
}
- function closeEdit() { document.getElementById('editOverlay').classList.remove('show'); }
- function closeEditIfOutside(e) { if(e.target.id === 'editOverlay') closeEdit(); }
-
+ function closeEdit() { document.getElementById('editOverlay').style.display = 'none'; }
init();
diff --git a/public/readme.md b/public/readme.md
new file mode 100644
index 0000000..74677d5
--- /dev/null
+++ b/public/readme.md
@@ -0,0 +1,3 @@
+
+Vous pouvez trouver des sons sur https://boardsounds.com/fr
+