RedCrea24

Como músico, sé cuánto tiempo y esfuerzo se invierte en perfeccionar una pasión. He dedicado innumerables horas y mucha perseverancia para desarrollar esta aplicación, Editor de Acordes 🎵, una herramienta nacida de mi experiencia personal y de las necesidades que, hasta ahora, no había logrado encontrar cubiertas de manera tan intuitiva y funcional.

La meta siempre fue clara: facilitar la vida a músicos y compositores, ofreciendo una plataforma que combine precisión técnica con simplicidad de uso. Cada acorde, cada funcionalidad y cada detalle fueron diseñados meticulosamente, pensando en ustedes, quienes comparten esta misma pasión por la música. 🎼✨

Confío en que Editor de Acordes marcará un antes y un después, ayudándolos a explorar su creatividad musical de maneras nuevas y emocionantes, tal como a mí me ha ayudado en este camino. Gracias por acompañarme en esta travesía llena de notas, compases y sueños. 🙌🎶

Editor de Acordes

${currentSongName}

${printContent.innerHTML}
RedCrea24
`); printWindow.document.close(); printWindow.focus(); printWindow.print(); }; // Save and load functionality const saveSong = (name) => { const songData = { name: name || currentSongName, lyrics, chordLines, fontColor, chordColor, fontSize }; // Check if a song with this name already exists const existingIndex = savedSongs.findIndex(song => song.name === name); let newSavedSongs; if (existingIndex >= 0) { // Update existing song newSavedSongs = [...savedSongs]; newSavedSongs[existingIndex] = songData; } else { // Add new song newSavedSongs = [...savedSongs, songData]; } setSavedSongs(newSavedSongs); localStorage.setItem('savedSongs', JSON.stringify(newSavedSongs)); setCurrentSongName(name); setShowSaveDialog(false); }; const loadSong = (index) => { const song = savedSongs[index]; if (song) { setLyrics(song.lyrics); setChordLines(song.chordLines); setCurrentSongName(song.name); setFontColor(song.fontColor || '#000000'); setChordColor(song.chordColor || '#0000ff'); setFontSize(song.fontSize || 16); } setShowLoadDialog(false); }; const deleteSong = (index) => { if (confirm('¿Estás seguro de que quieres eliminar esta canción?')) { const newSavedSongs = [...savedSongs]; newSavedSongs.splice(index, 1); setSavedSongs(newSavedSongs); localStorage.setItem('savedSongs', JSON.stringify(newSavedSongs)); } }; const newSong = () => { if (lyrics.trim() !== '' || chordLines.some(line => line.trim() !== '')) { if (confirm('¿Iniciar una nueva canción? Se perderán los cambios no guardados.')) { setLyrics(''); setChordLines(['']); setCurrentSongName('Canción sin título'); } } else { setLyrics(''); setChordLines(['']); setCurrentSongName('Canción sin título'); } }; // Add event listener to prevent context menu useEffect(() => { const preventContextMenu = (e) => { if (e.target.closest('.chord-line')) { e.preventDefault(); } }; document.addEventListener('contextmenu', preventContextMenu); return () => { document.removeEventListener('contextmenu', preventContextMenu); }; }, []); // New functions for editing chords const deleteChord = () => { if (selectedChord.lineIndex >= 0) { const line = chordLines[selectedChord.lineIndex]; const newLine = line.substring(0, selectedChord.start) + ' '.repeat(selectedChord.end - selectedChord.start) + line.substring(selectedChord.end); const newChordLines = [...chordLines]; newChordLines[selectedChord.lineIndex] = newLine; setChordLines(newChordLines); setShowChordEditMenu(false); } }; const replaceChord = () => { setActiveLineIndex(selectedChord.lineIndex); setActivePosition(selectedChord.start); setShowChordEditMenu(false); setShowChordDropdown(true); }; const moveChordLeft = () => { if (selectedChord.lineIndex >= 0 && selectedChord.start > 0) { const line = chordLines[selectedChord.lineIndex]; const chordText = selectedChord.text; // Remove chord from current position let newLine = line.substring(0, selectedChord.start) + ' '.repeat(selectedChord.end - selectedChord.start) + line.substring(selectedChord.end); // Insert chord one position to the left const newStart = Math.max(0, selectedChord.start - 1); newLine = newLine.substring(0, newStart) + chordText + newLine.substring(newStart + chordText.length); const newChordLines = [...chordLines]; newChordLines[selectedChord.lineIndex] = newLine; setChordLines(newChordLines); setShowChordEditMenu(false); } }; const moveChordRight = () => { if (selectedChord.lineIndex >= 0) { const line = chordLines[selectedChord.lineIndex]; const chordText = selectedChord.text; // Remove chord from current position let newLine = line.substring(0, selectedChord.start) + ' '.repeat(selectedChord.end - selectedChord.start) + line.substring(selectedChord.end); // Insert chord one position to the right const newStart = selectedChord.start + 1; // Ensure there's enough space while (newLine.length < newStart + chordText.length) { newLine += ' '; } newLine = newLine.substring(0, newStart) + chordText + newLine.substring(newStart + chordText.length); const newChordLines = [...chordLines]; newChordLines[selectedChord.lineIndex] = newLine; setChordLines(newChordLines); setShowChordEditMenu(false); } }; return (

Editor de Acordes y Letras

RedCrea24
{/* Instructions - moved up */}

Instrucciones:

  1. Ingresa la letra de la canción en el área de texto
  2. Haz clic en el espacio vacío sobre una línea de texto donde quieras añadir un acorde
  3. Selecciona un acorde del menú desplegable
  4. El acorde se insertará en la posición donde hiciste clic
  5. Para editar un acorde, haz clic derecho sobre él y selecciona una acción
  6. Guarda tu trabajo usando el botón Guardar
  7. Personaliza la apariencia con las Opciones de Estilo
{/* Top controls */}
{currentSongName}