3dtours/SonicForgeStudio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: SF3 conversion + SpessaSynth client player

Browse Source 
Server:
- soundfont_converter.py: Python SF2->SF3 via ffmpeg Ogg compression
- batch_convert_all runs on startup (daemon thread)
- GET /soundfonts/download/{sf_id} serves SF3 with SF2 fallback
- Dockerfile: add fluidsynth, vorbis-tools

Client:
- soundfontStorage.js: IndexedDB cache for SF3 buffers
- soundfontPlayer.js: dual-mode (SpessaSynth + oscillator fallback)
- app.jsx: init SpessaSynth, loadSF on instrument select
- index.html: SpessaSynth CDN import + storage script tag

Compression: DSK 11M->1.1M (90%), SGM 529M->18M (97%)
This commit is contained in:
3dtours
2026-07-26 17:51:37 +07:00
parent 44e0a6d736
commit e51b7fd355
8 changed files with 426 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/static/js/services/soundfontPlayer.js
+126 -25
View File
@@ -1,10 +1,8 @@
// SonicForge Studio SoundFont Player Service
(function () {
'use strict';
const activeOscillators = {};
// Use the shared AudioContext from the main app (lazy init)
let __gainNode = null;
const getCtx = () => {
if (typeof getAudioContext === 'function') {
@@ -30,15 +28,70 @@
return window.__sharedAudioCtx;
};
// ── Per-channel MIDI state (16 GM channels) ──
const _channels = Array.from({ length: 16 }, () => ({ bank: 0, program: 0, isPercussion: false }));
let _nextMelodicChannel = 0;
// ── SpessaSynth integration state ──
let _synthInstance = null;
let _initialized = false;
let _currentSfId = null;
const SonicSF = {
loadedFonts: {},
// ── SpessaSynth init ──
init: async function (audioContext) {
if (_initialized) return;
if (!window.SpessaSynthClass) {
console.warn("[SonicSF] SpessaSynth not loaded. Using oscillator fallback.");
return;
}
try {
_synthInstance = new window.SpessaSynthClass(audioContext.destination);
_initialized = true;
console.log("[SonicSF] SpessaSynth initialized.");
} catch (e) {
console.error("[SonicSF] SpessaSynth init failed:", e);
}
},
// ── Load SF3 from IndexedDB cache or server ──
loadSoundFont: async function (sfId) {
if (!_initialized || !_synthInstance) return;
if (_currentSfId === sfId) return;
console.log("[SonicSF] Loading SoundFont:", sfId);
let buffer = null;
if (window.SonicSFStorage) {
buffer = await window.SonicSFStorage.getBuffer(sfId);
}
if (!buffer) {
try {
const resp = await fetch("/api/v1/plugins/soundfonts/download/" + encodeURIComponent(sfId));
if (!resp.ok) throw new Error("Download failed: " + resp.status);
buffer = await resp.arrayBuffer();
if (window.SonicSFStorage) {
await window.SonicSFStorage.saveBuffer(sfId, buffer);
}
} catch (e) {
console.error("[SonicSF] Failed to load SoundFont:", sfId, e);
return;
}
}
try {
await _synthInstance.soundFontManager.addSoundFont(buffer);
_currentSfId = sfId;
console.log("[SonicSF] SoundFont loaded:", sfId);
} catch (e) {
console.error("[SonicSF] Error parsing SF3:", e);
}
},
controllerChange: function (channel, controller, value) {
if (channel < 0 || channel > 15) return;
if (_initialized && _synthInstance) {
try { _synthInstance.controllerChange(channel, controller, value); } catch (e) {}
}
if (controller === 0) {
_channels[channel].bank = value;
_channels[channel].isPercussion = (value === 128);
@@ -47,6 +100,9 @@
programChange: function (channel, program) {
if (channel < 0 || channel > 15) return;
if (_initialized && _synthInstance) {
try { _synthInstance.programChange(channel, program); } catch (e) {}
}
_channels[channel].program = program;
},
@@ -65,6 +121,9 @@
const channel = this.allocateChannel(bank);
this.controllerChange(channel, 0, bank);
this.programChange(channel, program);
if (_initialized && synthEngine && synthEngine.soundfont_id) {
this.loadSoundFont(synthEngine.soundfont_id);
}
return channel;
},
@@ -73,8 +132,7 @@
return { ..._channels[channel] };
},
// Load SoundFont from URL → ArrayBuffer → store in memory
loadSoundFont: async function (url) {
loadSoundFontLegacy: async function (url) {
if (this.loadedFonts[url]) return this.loadedFonts[url];
const resp = await fetch(url);
if (!resp.ok) throw new Error('Failed to load SoundFont: ' + url);
@@ -84,11 +142,52 @@
},
playNote: function (note, velocity, durationMs, startTime, program, destinationNode, channel, synthEngine) {
// SpessaSynth path
if (_initialized && _synthInstance && _currentSfId) {
return this._playNoteSpessa(note, velocity, durationMs, startTime, program, destinationNode, channel, synthEngine);
}
// Fallback oscillator path
return this._playNoteOsc(note, velocity, durationMs, startTime, program, destinationNode, channel, synthEngine);
},
_playNoteSpessa: function (note, velocity, durationMs, startTime, program, destinationNode, channel, synthEngine) {
const ctx = getCtx();
const midiPitch = Math.min(127, Math.max(0, parseInt(note) || 60));
const midiVel = Math.min(127, Math.max(1, Math.floor((typeof velocity === 'number' ? (velocity > 1 ? velocity : velocity * 127) : 100))));
if (synthEngine) {
const ch = channel !== undefined ? channel : (synthEngine.soundfont_bank === 128 ? 9 : 0);
this.controllerChange(ch, 0, synthEngine.soundfont_bank || 0);
this.programChange(ch, synthEngine.soundfont_program || 0);
if (channel === undefined) channel = ch;
}
if (channel === undefined) channel = 0;
const durSec = durationMs / 1000;
const now = ctx.currentTime;
const scheduledTime = (typeof startTime === 'number' && startTime > now) ? (startTime - now) : 0;
if (scheduledTime > 0) {
setTimeout(() => {
if (!_synthInstance) return;
try {
_synthInstance.noteOn(channel, midiPitch, midiVel);
setTimeout(() => { try { _synthInstance.noteOff(channel, midiPitch); } catch (e) {} }, durSec * 1000);
} catch (e) {}
}, scheduledTime * 1000);
} else {
try {
_synthInstance.noteOn(channel, midiPitch, midiVel);
setTimeout(() => { try { _synthInstance.noteOff(channel, midiPitch); } catch (e) {} }, durSec * 1000);
} catch (e) {}
}
},
_playNoteOsc: function (note, velocity, durationMs, startTime, program, destinationNode, channel, synthEngine) {
const ctx = getCtx();
const freq = 440 * Math.pow(2, (note - 69) / 12);
if (freq <= 0 || isNaN(freq)) return null;
// Apply synth_engine state if provided
if (synthEngine) {
const ch = channel !== undefined ? channel : (synthEngine.soundfont_bank === 128 ? 9 : 0);
this.controllerChange(ch, 0, synthEngine.soundfont_bank || 0);
@@ -100,7 +199,6 @@
const osc = ctx.createOscillator();
const noteGain = ctx.createGain();
// Default settings
let oscType = 'triangle';
let attackTime = 0.03;
let decayTime = 0.1;
@@ -113,63 +211,63 @@
const chState = _channels[channel];
prog = chState.program || prog;
}
if (prog >= 0 && prog <= 7) { // Pianos
if (prog >= 0 && prog <= 7) {
oscType = 'sine';
decayTime = 0.3;
sustainLevel = 0.1;
releaseTime = 0.2;
} else if (prog >= 8 && prog <= 15) { // Chromatic Perc
} else if (prog >= 8 && prog <= 15) {
oscType = 'sine';
decayTime = 0.1;
sustainLevel = 0.0;
releaseTime = 0.1;
} else if (prog >= 16 && prog <= 23) { // Organs
} else if (prog >= 16 && prog <= 23) {
oscType = 'sine';
attackTime = 0.05;
sustainLevel = 0.8;
releaseTime = 0.1;
} else if (prog >= 24 && prog <= 31) { // Guitars
} else if (prog >= 24 && prog <= 31) {
oscType = 'triangle';
decayTime = 0.4;
sustainLevel = 0.2;
releaseTime = 0.3;
} else if (prog >= 32 && prog <= 39) { // Basses
} else if (prog >= 32 && prog <= 39) {
oscType = 'triangle';
attackTime = 0.02;
decayTime = 0.2;
sustainLevel = 0.6;
releaseTime = 0.2;
} else if (prog >= 40 && prog <= 47) { // Strings
} else if (prog >= 40 && prog <= 47) {
oscType = 'sawtooth';
attackTime = 0.15;
sustainLevel = 0.8;
releaseTime = 0.5;
volFactor = 0.15;
} else if (prog >= 48 && prog <= 55) { // Ensemble / Choir
} else if (prog >= 48 && prog <= 55) {
oscType = 'sawtooth';
attackTime = 0.2;
sustainLevel = 0.8;
releaseTime = 0.6;
volFactor = 0.12;
} else if (prog >= 56 && prog <= 63) { // Brass
} else if (prog >= 56 && prog <= 63) {
oscType = 'sawtooth';
attackTime = 0.08;
sustainLevel = 0.7;
releaseTime = 0.3;
volFactor = 0.15;
} else if (prog >= 64 && prog <= 71) { // Reed
} else if (prog >= 64 && prog <= 71) {
oscType = 'square';
attackTime = 0.05;
sustainLevel = 0.6;
releaseTime = 0.2;
volFactor = 0.15;
} else if (prog >= 72 && prog <= 79) { // Pipe
} else if (prog >= 72 && prog <= 79) {
oscType = 'sine';
attackTime = 0.1;
sustainLevel = 0.7;
releaseTime = 0.3;
volFactor = 0.2;
} else if (prog >= 80 && prog <= 119) { // Synth Lead/Pad/FX
} else if (prog >= 80 && prog <= 119) {
oscType = 'sawtooth';
attackTime = 0.05;
sustainLevel = 0.6;
@@ -186,29 +284,27 @@
const vel = typeof velocity === 'number' ? (velocity > 1 ? velocity / 127 : velocity) : 0.8;
const targetGain = vel * volFactor;
// ADSR Envelope
noteGain.gain.setValueAtTime(0, startAt);
noteGain.gain.linearRampToValueAtTime(targetGain, startAt + attackTime);
noteGain.gain.linearRampToValueAtTime(targetGain * sustainLevel, startAt + attackTime + decayTime);
const releaseStart = startAt + Math.max(attackTime + decayTime, durSec);
noteGain.gain.linearRampToValueAtTime(targetGain * sustainLevel, releaseStart);
noteGain.gain.linearRampToValueAtTime(0, releaseStart + releaseTime);
osc.connect(noteGain);
const dest = destinationNode || __gainNode || ctx.destination;
noteGain.connect(dest);
osc.start(startAt);
const stopAt = releaseStart + releaseTime + 0.02;
osc.stop(stopAt);
const oscId = `${note}_${Date.now()}_${Math.random()}`;
activeOscillators[oscId] = { osc, gain: noteGain };
// Clean up active oscillator reference after it stops
setTimeout(() => {
delete activeOscillators[oscId];
}, (stopAt - ctx.currentTime) * 1000 + 100);
@@ -217,6 +313,13 @@
},
stopAll: function () {
if (_initialized && _synthInstance) {
try {
for (let ch = 0; ch < 16; ch++) {
_synthInstance.allNotesOff(ch);
}
} catch (e) {}
}
const ctx = getCtx();
const now = ctx.currentTime;
Object.values(activeOscillators).forEach(entry => {
@@ -233,14 +336,12 @@
Object.keys(activeOscillators).forEach(k => delete activeOscillators[k]);
},
// Save user SoundFont to IndexedDB via window.SonicStorage
saveToIndexedDB: async function (name, arrayBuffer) {
if (window.SonicStorage && window.SonicStorage.saveToIndexedDB) {
await window.SonicStorage.saveToIndexedDB('soundfont_' + name, arrayBuffer);
}
},
// Load user SoundFont from IndexedDB
loadFromIndexedDB: async function (name) {
if (window.SonicStorage && window.SonicStorage.loadFromIndexedDB) {
return await window.SonicStorage.loadFromIndexedDB('soundfont_' + name);
app/static/js/services/soundfontStorage.js
+56
View File
@@ -0,0 +1,56 @@
(function () {
'use strict';
class SoundFontStorage {
constructor() {
this.dbName = "DAW_SoundFont_Cache";
this.storeName = "sf3_buffers";
}
async openDB() {
return new Promise((resolve, reject) => {
const request = indexedDB.open(this.dbName, 1);
request.onupgradeneeded = (e) => {
const db = e.target.result;
if (!db.objectStoreNames.contains(this.storeName)) {
db.createObjectStore(this.storeName);
}
};
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(request.error);
});
}
async getBuffer(sfId) {
try {
const db = await this.openDB();
return await new Promise((resolve) => {
const tx = db.transaction(this.storeName, "readonly");
const store = tx.objectStore(this.storeName);
const req = store.get(sfId);
req.onsuccess = () => resolve(req.result || null);
req.onerror = () => resolve(null);
});
} catch (e) {
return null;
}
}
async saveBuffer(sfId, arrayBuffer) {
try {
const db = await this.openDB();
return await new Promise((resolve, reject) => {
const tx = db.transaction(this.storeName, "readwrite");
const store = tx.objectStore(this.storeName);
const req = store.put(arrayBuffer, sfId);
req.onsuccess = () => resolve(true);
req.onerror = () => reject(req.error);
});
} catch (e) {
return false;
}
}
}
window.SonicSFStorage = new SoundFontStorage();
})();