jens/sheetmusictrainer
1
0
Fork 0
mirror of https://github.com/9x/sheetmusictrainer.git synced 2026-09-02 09:34:33 +02:00
Code Issues Packages Projects Releases Wiki Activity

"Good" animation

Browse Source
This commit is contained in:
Jens Mohrmann
2025-12-27 17:42:41 +01:00
parent 00a2de2bad
commit c12b561bc6
2 changed files with 6 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/App.tsx
View File

@@ -205,7 +205,8 @@ function App() {
// Common success handler // Common success handler
const handleMatchSuccess = useCallback(() => { const handleMatchSuccess = useCallback(() => {
// Success! // Success!
setFeedbackMessage("Good!"); const noteDetails = getNoteDetails(targetMidi);
setFeedbackMessage(`Good! ${noteDetails.name}`);
setRevealed(true); setRevealed(true);
setMatchStartTime(null); setMatchStartTime(null);
@@ -255,7 +256,7 @@ function App() {
if (playedMidi === targetMidi) { if (playedMidi === targetMidi) {
// Instant match // Instant match
if (feedbackMessage !== "Good!") { if (!feedbackMessage.startsWith("Good!")) {
handleMatchSuccess(); handleMatchSuccess();
} }
} }
@@ -270,7 +271,7 @@ function App() {
if (pitchData.midi === targetMidi) { if (pitchData.midi === targetMidi) {
// Prevent re-triggering success if we're already in a success state // Prevent re-triggering success if we're already in a success state
if (feedbackMessage === "Good!") return; if (feedbackMessage.startsWith("Good!")) return;
if (matchStartTime === null) { if (matchStartTime === null) {
setMatchStartTime(Date.now()); setMatchStartTime(Date.now());

7
src/components/SheetMusic.tsx
View File

@@ -157,11 +157,8 @@ export const SheetMusic: React.FC<SheetMusicProps> = ({
} }
if (type === 'played') { if (type === 'played') {
if (midi === targetMidi) { // Always use default style (text color), no green/red distinction
staveNote.setStyle({ fillStyle: "var(--color-success)", strokeStyle: "var(--color-success)" }); staveNote.setStyle({ fillStyle: "var(--color-text-main)", strokeStyle: "var(--color-text-main)" });
} else {
staveNote.setStyle({ fillStyle: "var(--color-error)", strokeStyle: "var(--color-error)" });
}
} }
return { note: staveNote, clef: noteClef }; return { note: staveNote, clef: noteClef };