tuneframes 0.1.1 → 0.2.0

package/examples/example-ai-dj.html

@@ -0,0 +1,167 @@
+<script src="https://unpkg.com/tone@14.7.77/build/Tone.js"></script>
+<script>
+// ─── AI DJ — mood-parameterized Tone.js composition ────────────────────────
+// Renders different music based on ?mood= query param or window.MOOD
+// Supported moods: chill | energetic | dark | happy
+// ──────────────────────────────────────────────────────────────────────────
+
+const MOOD = (() => {
+  const p = new URLSearchParams(window.location.search).get('mood');
+  return ['chill', 'energetic', 'dark', 'happy'].includes(p) ? p : 'chill';
+})();
+
+const CONFIG = {
+  chill: {
+    bpm: 72, duration: '12s',
+    scale: ['D3', 'F3', 'A3', 'C4'],
+    chords: [['D3','F3','A3'],['C3','E3','G3'],['D3','F3','A3'],['Bb2','D3','F3']],
+    leadNotes: ['D4','F4','A4','C5','D4','Bb3'],
+    leadRhythm: ['4n','4n','4n','4n','4n','4n'],
+    filterFreq: 800, reverbWet: 0.85, delayWet: 0.4, delayTime: '8n.',
+    kickTimes: [0, 2, 4, 6, 8, 10],
+    hatTimes: [1, 3, 5, 7, 9, 11],
+    snareTimes: [2, 6, 10],
+  },
+  energetic: {
+    bpm: 140, duration: '8s',
+    scale: ['C4', 'E4', 'G4', 'A4'],
+    chords: [['C4','E4','G4'],['A3','C4','E4'],['F3','A3','C4'],['G3','B3','D4']],
+    leadNotes: ['C5','E5','G5','C5','D5','E5'],
+    leadRhythm: ['8n','8n','8n','8n','8n','8n'],
+    filterFreq: 4000, reverbWet: 0.2, delayWet: 0.1, delayTime: '16n',
+    kickTimes: [0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5, 5.5, 6, 6.5, 7, 7.5],
+    hatTimes: [0, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 2.25, 2.5, 2.75, 3, 3.25, 3.5, 3.75, 4, 4.25, 4.5, 4.75, 5, 5.25, 5.5, 5.75, 6, 6.25, 6.5, 6.75, 7, 7.25, 7.5, 7.75],
+    snareTimes: [1, 3, 5, 7],
+  },
+  dark: {
+    bpm: 80, duration: '10s',
+    scale: ['A2', 'C3', 'E3', 'G3'],
+    chords: [['A2','C3','E3'],['E2','G2','B2'],['A2','C3','E3'],['D2','F2','A2']],
+    leadNotes: ['A3','G3','E3','C3','A3','E3'],
+    leadRhythm: ['2n','2n','2n','2n','2n','2n'],
+    filterFreq: 600, reverbWet: 0.9, delayWet: 0.5, delayTime: '4n',
+    kickTimes: [0, 3, 6, 9],
+    hatTimes: [1.5, 4.5, 7.5],
+    snareTimes: [1.5, 5.5, 9.5],
+  },
+  happy: {
+    bpm: 120, duration: '8s',
+    scale: ['C4', 'E4', 'G4', 'A4'],
+    chords: [['C4','E4','G4'],['F3','A3','C4'],['G3','B3','D4'],['C4','E4','G4']],
+    leadNotes: ['C5','E5','G5','E5','D5','C5'],
+    leadRhythm: ['8n.','8n.','8n.','8n.','8n.','8n.'],
+    filterFreq: 5000, reverbWet: 0.3, delayWet: 0.2, delayTime: '8n',
+    kickTimes: [0, 1, 2, 3, 4, 5, 6, 7],
+    hatTimes: [0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5, 5.5, 6, 6.5, 7, 7.5],
+    snareTimes: [0.5, 2.5, 4.5, 6.5],
+  },
+};
+
+const cfg = CONFIG[MOOD];
+
+async function main() {
+  await Tone.start();
+
+  const pad = new Tone.PolySynth(Tone.Synth, {
+    oscillator: { type: 'sine' },
+    envelope: { attack: 2.0, decay: 1, sustain: 0.8, release: 3 },
+    volume: -6,
+  }).toDestination();
+
+  const lead = new Tone.Synth({
+    oscillator: { type: MOOD === 'dark' ? 'sawtooth' : MOOD === 'energetic' ? 'square' : 'triangle' },
+    envelope: { attack: 0.02, decay: 0.1, sustain: 0.3, release: 0.5 },
+    volume: -4,
+  }).toDestination();
+
+  const bass = new Tone.MonoSynth({
+    oscillator: { type: 'sawtooth' },
+    filter: { Q: 2, type: 'lowpass', frequency: cfg.filterFreq },
+    envelope: { attack: 0.01, decay: 0.3, sustain: 0.4, release: 0.4 },
+    volume: -8,
+  }).toDestination();
+
+  const reverb = new Tone.Reverb({ decay: 4.5, wet: cfg.reverbWet }).toDestination();
+  const delay  = new Tone.FeedbackDelay({ delayTime: cfg.delayTime, feedback: 0.3, wet: cfg.delayWet }).toDestination();
+  pad.connect(reverb);
+  lead.connect(delay);
+  delay.toDestination();
+
+  // Chord pads
+  new Tone.Sequence((time, chord) => {
+    pad.triggerAttackRelease(chord, '2n', time);
+  }, cfg.chords, 0).start(0);
+
+  // Lead melody
+  new Tone.Sequence((time, note) => {
+    lead.triggerAttackRelease(note, '8n.', time);
+  }, cfg.leadNotes, 0).start(0);
+
+  // Bass
+  new Tone.Sequence((time, note) => {
+    bass.triggerAttackRelease(note, '4n', time);
+  }, cfg.chords.map(c => c[0]), 0).start(0);
+
+  // Kick
+  const kick = new Tone.MembraneSynth({
+    pitchDecay: 0.05, octaves: 6,
+    envelope: { attack: 0.001, decay: 0.4, sustain: 0, release: 0.1 },
+    volume: MOOD === 'chill' ? -12 : MOOD === 'dark' ? -14 : -6,
+  }).toDestination();
+  cfg.kickTimes.forEach(t => {
+    Tone.Transport.scheduleOnce((time) => {
+      kick.triggerAttackRelease('C1', '8n', time);
+    }, t);
+  });
+
+  // Hi-hat
+  const hihat = new Tone.NoiseSynth({
+    noise: { type: 'white' },
+    envelope: { attack: 0.001, decay: 0.05, sustain: 0, release: 0.01 },
+    volume: MOOD === 'chill' ? -18 : -10,
+  }).toDestination();
+  cfg.hatTimes.forEach(t => {
+    Tone.Transport.scheduleOnce((time) => {
+      hihat.triggerAttackRelease('16n', time);
+    }, t);
+  });
+
+  // Snare
+  const snare = new Tone.NoiseSynth({
+    noise: { type: 'pink' },
+    envelope: { attack: 0.001, decay: 0.15, sustain: 0, release: 0.1 },
+    volume: MOOD === 'chill' ? -16 : MOOD === 'dark' ? -14 : -8,
+  }).toDestination();
+  cfg.snareTimes.forEach(t => {
+    Tone.Transport.scheduleOnce((time) => {
+      snare.triggerAttackRelease('8n', time);
+    }, t);
+  });
+
+  Tone.Transport.bpm.value = cfg.bpm;
+  Tone.Transport.start();
+}
+
+window.renderComposition = async function(wavPath) {
+  let attempts = 0;
+  while (typeof Tone === 'undefined' && attempts < 50) {
+    await new Promise(r => setTimeout(r, 100));
+    attempts++;
+  }
+  if (typeof Tone === 'undefined') throw new Error('Tone not loaded');
+
+  const durationSec = Math.max(Tone.Time(cfg.duration).toSeconds() + 0.5, 2);
+
+  const buffer = await Tone.Offline(async () => { await main(); }, durationSec, 1, 44100, cfg.bpm);
+  const wav = audioBufferToWav(buffer);
+  window.writeFile(wavPath, Array.from(new Uint8Array(wav)));
+  return wav.byteLength;
+};
+</script>
+
+<!-- Metadata driven by JS so each mood gets correct BPM + duration -->
+<script>
+  document.open();
+  document.write(`<div id="tuneframes" style="display:none">{"bpm":${cfg.bpm},"duration":"${cfg.duration}"}</div>`);
+  document.close();
+</script>

package/examples/example-ambient.html

@@ -1,63 +1,63 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>TuneFrames — Ambient</title>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
-</head>
-<body>
-  <div id="tuneframes" style="display:none">{"bpm":60,"duration":"16s"}</div>
-  <script>
-    async function main() {
-      await Tone.start();
-      
-      const verb = new Tone.Reverb({ decay: 8, wet: 0.8 }).toDestination();
-      const delay = new Tone.PingPongDelay('4n', 0.3).toDestination();
-      
-      // Warm pad
-      const pad = new Tone.PolySynth(Tone.Synth, {
-        oscillator: { type: 'sine' },
-        envelope: { attack: 3, decay: 1, sustain: 0.8, release: 4 }
-      }).connect(verb);
-      pad.volume.value = -8;
-
-      // Crystal high texture
-      const crystal = new Tone.PolySynth(Tone.Synth, {
-        oscillator: { type: 'sine' },
-        envelope: { attack: 4, decay: 0.5, sustain: 1, release: 3 }
-      }).connect(delay);
-      crystal.volume.value = -18;
-
-      // D minor progression — hypnotic and spacious
-      const chords = [
-        ['D3', 'F3', 'A3'],       // Dm
-        ['C3', 'E3', 'G3'],       // C
-        ['Bb2', 'D3', 'F3'],      // Bb
-        ['A2', 'C3', 'E3'],       // Am
-      ];
-      
-      const beat = Tone.Time('1n').toSeconds();
-      
-      chords.forEach((chord, i) => {
-        pad.triggerAttackRelease(chord, '1n', i * beat);
-        // Add crystal shimmer an octave up, delayed
-        crystal.triggerAttackRelease(
-          chord.map(n => {
-            const octave = parseInt(n.match(/\d/)[0]);
-            return n.replace(/\d/, octave + 1);
-          }),
-          '2n', i * beat + 0.05
-        );
-      });
-
-      // Slow bass drone
-      const drone = new Tone.MonoSynth({
-        oscillator: { type: 'sine' },
-        envelope: { attack: 2, decay: 0, sustain: 1, release: 3 }
-      }).toDestination();
-      drone.volume.value = -20;
-      drone.triggerAttackRelease('D1', '1n', 0);
-      drone.triggerAttackRelease('D1', '1n', beat * 2);
-    }
-  </script>
-</body>
-</html>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TuneFrames — Ambient</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
+</head>
+<body>
+  <div id="tuneframes" style="display:none">{"bpm":60,"duration":"16s"}</div>
+  <script>
+    async function main() {
+      await Tone.start();
+      
+      const verb = new Tone.Reverb({ decay: 8, wet: 0.8 }).toDestination();
+      const delay = new Tone.PingPongDelay('4n', 0.3).toDestination();
+      
+      // Warm pad
+      const pad = new Tone.PolySynth(Tone.Synth, {
+        oscillator: { type: 'sine' },
+        envelope: { attack: 3, decay: 1, sustain: 0.8, release: 4 }
+      }).connect(verb);
+      pad.volume.value = -8;
+
+      // Crystal high texture
+      const crystal = new Tone.PolySynth(Tone.Synth, {
+        oscillator: { type: 'sine' },
+        envelope: { attack: 4, decay: 0.5, sustain: 1, release: 3 }
+      }).connect(delay);
+      crystal.volume.value = -18;
+
+      // D minor progression — hypnotic and spacious
+      const chords = [
+        ['D3', 'F3', 'A3'],       // Dm
+        ['C3', 'E3', 'G3'],       // C
+        ['Bb2', 'D3', 'F3'],      // Bb
+        ['A2', 'C3', 'E3'],       // Am
+      ];
+      
+      const beat = Tone.Time('1n').toSeconds();
+      
+      chords.forEach((chord, i) => {
+        pad.triggerAttackRelease(chord, '1n', i * beat);
+        // Add crystal shimmer an octave up, delayed
+        crystal.triggerAttackRelease(
+          chord.map(n => {
+            const octave = parseInt(n.match(/\d/)[0]);
+            return n.replace(/\d/, octave + 1);
+          }),
+          '2n', i * beat + 0.05
+        );
+      });
+
+      // Slow bass drone
+      const drone = new Tone.MonoSynth({
+        oscillator: { type: 'sine' },
+        envelope: { attack: 2, decay: 0, sustain: 1, release: 3 }
+      }).toDestination();
+      drone.volume.value = -20;
+      drone.triggerAttackRelease('D1', '1n', 0);
+      drone.triggerAttackRelease('D1', '1n', beat * 2);
+    }
+  </script>
+</body>
+</html>

package/examples/example-bass.html

@@ -1,48 +1,48 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>TuneFrames — Bass</title>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
-</head>
-<body>
-  <div id="tuneframes" style="display:none">{"bpm":120,"duration":"4s"}</div>
-  <script>
-    async function main() {
-      await Tone.start();
-      const beat = Tone.Time('4n').toSeconds(); // 0.5s at 120 BPM
-
-      // Warm, rounded bass tone
-      const bass = new Tone.MonoSynth({
-        oscillator: { type: 'sawtooth' },
-        filter: { Q: 2, type: 'lowpass', rolloff: -12 },
-        envelope: { attack: 0.01, decay: 0.2, sustain: 0.4, release: 0.3 },
-        filterEnvelope: { attack: 0.01, decay: 0.1, sustain: 0.3, release: 0.2, baseFrequency: 100, octaves: 2 }
-      }).toDestination();
-      bass.volume.value = -6;
-
-      // Walking bass line: beats 0-4 (0 to 2s) = Dm, beats 4-7 (2 to 3.5s) = Gm
-      // All notes scheduled within duration=4s — notes at time >= 4s are dropped
-      const walk = [
-        // Bar 1 — Dm: root, 5th, 7th, root / approach, 3rd, 4th, 5th, root
-        { note: 'D2', time: 0 },
-        { note: 'A2', time: beat },
-        { note: 'C3', time: 2 * beat },
-        { note: 'D3', time: 3 * beat },
-        { note: 'E2', time: 4 * beat },
-        { note: 'F2', time: 5 * beat },
-        { note: 'G2', time: 6 * beat },
-        { note: 'A2', time: 7 * beat },
-        // Bar 2 — Gm: root, 5th, 7th, root
-        { note: 'G2', time: 8 * beat },
-        { note: 'D3', time: 9 * beat },
-        { note: 'F3', time: 10 * beat },
-        { note: 'G3', time: 11 * beat }
-      ];
-
-      walk.forEach(({ note, time }) => {
-        if (time < 4) bass.triggerAttackRelease(note, '8n', time);
-      });
-    }
-  </script>
-</body>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TuneFrames — Bass</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
+</head>
+<body>
+  <div id="tuneframes" style="display:none">{"bpm":120,"duration":"4s"}</div>
+  <script>
+    async function main() {
+      await Tone.start();
+      const beat = Tone.Time('4n').toSeconds(); // 0.5s at 120 BPM
+
+      // Warm, rounded bass tone
+      const bass = new Tone.MonoSynth({
+        oscillator: { type: 'sawtooth' },
+        filter: { Q: 2, type: 'lowpass', rolloff: -12 },
+        envelope: { attack: 0.01, decay: 0.2, sustain: 0.4, release: 0.3 },
+        filterEnvelope: { attack: 0.01, decay: 0.1, sustain: 0.3, release: 0.2, baseFrequency: 100, octaves: 2 }
+      }).toDestination();
+      bass.volume.value = -6;
+
+      // Walking bass line: beats 0-4 (0 to 2s) = Dm, beats 4-7 (2 to 3.5s) = Gm
+      // All notes scheduled within duration=4s — notes at time >= 4s are dropped
+      const walk = [
+        // Bar 1 — Dm: root, 5th, 7th, root / approach, 3rd, 4th, 5th, root
+        { note: 'D2', time: 0 },
+        { note: 'A2', time: beat },
+        { note: 'C3', time: 2 * beat },
+        { note: 'D3', time: 3 * beat },
+        { note: 'E2', time: 4 * beat },
+        { note: 'F2', time: 5 * beat },
+        { note: 'G2', time: 6 * beat },
+        { note: 'A2', time: 7 * beat },
+        // Bar 2 — Gm: root, 5th, 7th, root
+        { note: 'G2', time: 8 * beat },
+        { note: 'D3', time: 9 * beat },
+        { note: 'F3', time: 10 * beat },
+        { note: 'G3', time: 11 * beat }
+      ];
+
+      walk.forEach(({ note, time }) => {
+        if (time < 4) bass.triggerAttackRelease(note, '8n', time);
+      });
+    }
+  </script>
+</body>
 </html>

package/examples/example-lofi.html

@@ -1,45 +1,45 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>TuneFrames — Lofi Example</title>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
-</head>
-<body>
-  <div id="tuneframes" style="display:none">{"bpm":80,"duration":"10s"}</div>
-  <script>
-    async function main() {
-      await Tone.start();
-      
-      const reverb = new Tone.Reverb({ decay: 4, wet: 0.6 }).toDestination();
-      const pad = new Tone.PolySynth(Tone.Synth, {
-        oscillator: { type: 'triangle' },
-        envelope: { attack: 0.5, decay: 0.3, sustain: 0.8, release: 2 }
-      }).connect(reverb);
-      
-      // Am - F - C - G chord progression
-      const chords = [
-        ['A3', 'C4', 'E4'],
-        ['F3', 'A3', 'C4'],
-        ['C3', 'E3', 'G3'],
-        ['G3', 'B3', 'D4'],
-      ];
-      
-      // Play each chord for 2 beats at 80 BPM
-      for (let i = 0; i < chords.length; i++) {
-        pad.triggerAttackRelease(chords[i], '2n', i * Tone.Time('2n').toSeconds());
-      }
-      
-      // Simple melody
-      const melody = new Tone.Synth({
-        oscillator: { type: 'sine' },
-        envelope: { attack: 0.01, decay: 0.1, sustain: 0.3, release: 0.5 }
-      }).toDestination();
-      
-      melody.triggerAttackRelease('C5', '8n', Tone.Time('2n').toSeconds() * 0.5);
-      melody.triggerAttackRelease('E5', '8n', Tone.Time('2n').toSeconds() * 1.5);
-      melody.triggerAttackRelease('G5', '8n', Tone.Time('2n').toSeconds() * 2.5);
-      melody.triggerAttackRelease('C5', '4n', Tone.Time('2n').toSeconds() * 3.5);
-    }
-  </script>
-</body>
-</html>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TuneFrames — Lofi Example</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
+</head>
+<body>
+  <div id="tuneframes" style="display:none">{"bpm":80,"duration":"10s"}</div>
+  <script>
+    async function main() {
+      await Tone.start();
+      
+      const reverb = new Tone.Reverb({ decay: 4, wet: 0.6 }).toDestination();
+      const pad = new Tone.PolySynth(Tone.Synth, {
+        oscillator: { type: 'triangle' },
+        envelope: { attack: 0.5, decay: 0.3, sustain: 0.8, release: 2 }
+      }).connect(reverb);
+      
+      // Am - F - C - G chord progression
+      const chords = [
+        ['A3', 'C4', 'E4'],
+        ['F3', 'A3', 'C4'],
+        ['C3', 'E3', 'G3'],
+        ['G3', 'B3', 'D4'],
+      ];
+      
+      // Play each chord for 2 beats at 80 BPM
+      for (let i = 0; i < chords.length; i++) {
+        pad.triggerAttackRelease(chords[i], '2n', i * Tone.Time('2n').toSeconds());
+      }
+      
+      // Simple melody
+      const melody = new Tone.Synth({
+        oscillator: { type: 'sine' },
+        envelope: { attack: 0.01, decay: 0.1, sustain: 0.3, release: 0.5 }
+      }).toDestination();
+      
+      melody.triggerAttackRelease('C5', '8n', Tone.Time('2n').toSeconds() * 0.5);
+      melody.triggerAttackRelease('E5', '8n', Tone.Time('2n').toSeconds() * 1.5);
+      melody.triggerAttackRelease('G5', '8n', Tone.Time('2n').toSeconds() * 2.5);
+      melody.triggerAttackRelease('C5', '4n', Tone.Time('2n').toSeconds() * 3.5);
+    }
+  </script>
+</body>
+</html>

package/examples/example-minimal.html

@@ -1,21 +1,21 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>TuneFrames — Minimal</title>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
-</head>
-<body>
-  <div id="tuneframes" style="display:none">{"bpm":120,"duration":"2s"}</div>
-  <script>
-    async function main() {
-      await Tone.start();
-      const synth = new Tone.Synth().toDestination();
-      const beat = Tone.Time('4n').toSeconds();
-      // C major arpeggio — three notes, clean and simple
-      synth.triggerAttackRelease('C4', '4n', 0);
-      synth.triggerAttackRelease('E4', '4n', beat);
-      synth.triggerAttackRelease('G4', '4n', beat * 2);
-    }
-  </script>
-</body>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TuneFrames — Minimal</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
+</head>
+<body>
+  <div id="tuneframes" style="display:none">{"bpm":120,"duration":"2s"}</div>
+  <script>
+    async function main() {
+      await Tone.start();
+      const synth = new Tone.Synth().toDestination();
+      const beat = Tone.Time('4n').toSeconds();
+      // C major arpeggio — three notes, clean and simple
+      synth.triggerAttackRelease('C4', '4n', 0);
+      synth.triggerAttackRelease('E4', '4n', beat);
+      synth.triggerAttackRelease('G4', '4n', beat * 2);
+    }
+  </script>
+</body>
 </html>

package/examples/example-orchestral.html

@@ -1,67 +1,67 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>TuneFrames — Orchestral</title>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
-</head>
-<body>
-  <div id="tuneframes" style="display:none">{"bpm":72,"duration":"14s"}</div>
-  <script>
-    async function main() {
-      await Tone.start();
-      
-      const verb = new Tone.Reverb({ decay: 6, wet: 0.5 }).toDestination();
-      
-      // Strings section
-      const strings = new Tone.PolySynth(Tone.Synth, {
-        oscillator: { type: 'sawtooth' },
-        envelope: { attack: 1.5, decay: 0.3, sustain: 0.9, release: 3 }
-      }).connect(verb);
-      strings.volume.value = -12;
-
-      // Brass
-      const brass = new Tone.PolySynth(Tone.Synth, {
-        oscillator: { type: 'sawtooth' },
-        envelope: { attack: 0.3, decay: 0.2, sustain: 0.7, release: 1.5 }
-      }).connect(verb);
-      brass.volume.value = -10;
-
-      // Timpani
-      const timpani = new Tone.MembraneSynth({
-        pitchDecay: 0.05,
-        octaves: 4,
-        oscillator: { type: 'sine' },
-        envelope: { attack: 0.001, decay: 1, sustain: 0, release: 2 }
-      }).toDestination();
-      timpani.volume.value = -8;
-
-      const beat = Tone.Time('1n').toSeconds();
-
-      // Strings: swell on every bar
-      const stringChords = [
-        ['D3', 'F3', 'A3', 'C4'],  // Dm7
-        ['C3', 'E3', 'G3', 'B3'],  // Cmaj7
-        ['Bb2', 'D3', 'F3', 'A3'], // Bbmaj7
-        ['A2', 'C3', 'E3', 'G3'],  // Am7
-      ];
-      stringChords.forEach((chord, i) => {
-        strings.triggerAttackRelease(chord, '1n', i * beat);
-      });
-
-      // Brass: enters on bar 3 with fanfare
-      const fanfares = [
-        ['D4', 'F4', 'A4'],
-        ['C4', 'E4', 'G4'],
-      ];
-      fanfares.forEach((chord, i) => {
-        brass.triggerAttackRelease(chord, '2n', (i + 2) * beat);
-      });
-
-      // Timpani: tonic hits on bars 1 and 3
-      timpani.triggerAttackRelease('D2', '1n', 0);
-      timpani.triggerAttackRelease('D2', '1n', beat * 2);
-      timpani.triggerAttackRelease('A1', '2n', beat * 3.5);
-    }
-  </script>
-</body>
-</html>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TuneFrames — Orchestral</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.js"></script>
+</head>
+<body>
+  <div id="tuneframes" style="display:none">{"bpm":72,"duration":"14s"}</div>
+  <script>
+    async function main() {
+      await Tone.start();
+      
+      const verb = new Tone.Reverb({ decay: 6, wet: 0.5 }).toDestination();
+      
+      // Strings section
+      const strings = new Tone.PolySynth(Tone.Synth, {
+        oscillator: { type: 'sawtooth' },
+        envelope: { attack: 1.5, decay: 0.3, sustain: 0.9, release: 3 }
+      }).connect(verb);
+      strings.volume.value = -12;
+
+      // Brass
+      const brass = new Tone.PolySynth(Tone.Synth, {
+        oscillator: { type: 'sawtooth' },
+        envelope: { attack: 0.3, decay: 0.2, sustain: 0.7, release: 1.5 }
+      }).connect(verb);
+      brass.volume.value = -10;
+
+      // Timpani
+      const timpani = new Tone.MembraneSynth({
+        pitchDecay: 0.05,
+        octaves: 4,
+        oscillator: { type: 'sine' },
+        envelope: { attack: 0.001, decay: 1, sustain: 0, release: 2 }
+      }).toDestination();
+      timpani.volume.value = -8;
+
+      const beat = Tone.Time('1n').toSeconds();
+
+      // Strings: swell on every bar
+      const stringChords = [
+        ['D3', 'F3', 'A3', 'C4'],  // Dm7
+        ['C3', 'E3', 'G3', 'B3'],  // Cmaj7
+        ['Bb2', 'D3', 'F3', 'A3'], // Bbmaj7
+        ['A2', 'C3', 'E3', 'G3'],  // Am7
+      ];
+      stringChords.forEach((chord, i) => {
+        strings.triggerAttackRelease(chord, '1n', i * beat);
+      });
+
+      // Brass: enters on bar 3 with fanfare
+      const fanfares = [
+        ['D4', 'F4', 'A4'],
+        ['C4', 'E4', 'G4'],
+      ];
+      fanfares.forEach((chord, i) => {
+        brass.triggerAttackRelease(chord, '2n', (i + 2) * beat);
+      });
+
+      // Timpani: tonic hits on bars 1 and 3
+      timpani.triggerAttackRelease('D2', '1n', 0);
+      timpani.triggerAttackRelease('D2', '1n', beat * 2);
+      timpani.triggerAttackRelease('A1', '2n', beat * 3.5);
+    }
+  </script>
+</body>
+</html>