Skip to content

Commit

Permalink
feat: add guitar sounds using smplr soundfont
Browse files Browse the repository at this point in the history
  • Loading branch information
threedalpeng committed Feb 19, 2024
1 parent 0e25dd0 commit 7883bdf
Show file tree
Hide file tree
Showing 5 changed files with 44 additions and 8 deletions.
11 changes: 10 additions & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,8 @@
"@steeze-ui/heroicons": "^2.3.0",
"@steeze-ui/svelte-icon": "^1.5.0",
"idb": "^8.0.0",
"mini-svg-data-uri": "^1.4.4"
"mini-svg-data-uri": "^1.4.4",
"smplr": "^0.12.2"
},
"devDependencies": {
"@sveltejs/adapter-auto": "^3.1.0",
Expand Down
2 changes: 1 addition & 1 deletion src/lib/timer/tick.ts
Original file line number Diff line number Diff line change
Expand Up @@ -273,7 +273,7 @@ export class TempoTimer extends AudioClockTimer {
}
};
const onAudioTick: AudioTickCallback = (state) => {
if (currentTime + start >= state.time) {
if (currentTime + start <= state.time) {
audioCb(state);
this.removeAudioTick(onAudioTick);
}
Expand Down
1 change: 0 additions & 1 deletion src/routes/+layout.svelte
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
<script>
import '$/app.css';
// import { pwaInfo } from 'virtual:pwa-info';
// $: webManifestLink = pwaInfo ? pwaInfo.webManifest.linkTag : '';
</script>

Expand Down
35 changes: 31 additions & 4 deletions src/routes/tools/render-sample/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,10 @@
import RandomBoxOptions from '$/lib/practice/RandomBox/RandomBoxOptions.svelte';
import { getRandomBoxContext } from '$/lib/practice/RandomBox/context';
import type { PracticeBoard, PracticeScore } from '$/lib/practice/types';
import { getPitchFromFingerPosition } from '$/utils/music/pitch';
import { getPitchFromFingerPosition, numberingPitch } from '$/utils/music/pitch';
import { onDestroy, onMount } from 'svelte';
import { practice } from './data';
import { Soundfont, CacheStorage } from 'smplr';
const metronome = getMetronomeContext();
const randomBox = getRandomBoxContext<(typeof practice.scores)[number]>();
Expand All @@ -25,7 +26,16 @@
function replaceScore() {
let score = randomBox.open();
const schedule = () => {
scheduleScore(score);
if (!guitarSoundfont) {
guitarSoundfont = new Soundfont(timer.audioCtx!!, {
instrument: 'acoustic_guitar_steel',
storage: new CacheStorage()
});
}
// preload soundfont
guitarSoundfont.load.then(() => {
scheduleScore(score);
});
timer.removeTick(schedule);
};
timer.onTick(schedule);
Expand All @@ -46,6 +56,9 @@
};
}) as FingerInfo[];
let guitarSoundfont: Soundfont | null = null;
let previousTime = 0;
function scheduleScore(score: PracticeScore) {
/** Now scheduling */
Expand All @@ -57,7 +70,11 @@
currentActiveFingers.clear();
currentBoard = board;
},
({ audioCtx }) => {}
({ audioCtx }) => {
// guitarSoundfont!!.start({
// note: 50 + 12
// });
}
);
});
Expand All @@ -69,6 +86,7 @@
);
return { ...note, pitch };
});
for (let i = 0; i < notes.length; i++) {
const note = notes[i];
const nextThreeFingers = notes.slice(i + 1, i + 4).map((n) => n.position);
Expand All @@ -83,8 +101,17 @@
currentActiveFingers = currentActiveFingers;
};
},
({ audioCtx }) => {
({ audioCtx, time }) => {
// play audio with pitch
if (note.pitch) {
guitarSoundfont!!.start({
note: numberingPitch(note.pitch) + 12,
time: time,
duration: note.time.duration
? timer.convert(note.time.duration, 'note', 'second')
: note.time.duration
});
}
}
);
}
Expand Down

0 comments on commit 7883bdf

Please sign in to comment.