@@ -983,10 +979,6 @@
Reimagined as classic game-console music using Motif’s Wario engine.
diff --git a/play.html b/play.html
index 8dfb16c..ab891d6 100644
--- a/play.html
+++ b/play.html
@@ -320,14 +320,7 @@
max-width: 72ch;
}
- .volume-row {
- margin-top: 14px;
- opacity: 0.6;
- }
- .volume-row label {
- font-size: 12px;
- color: rgba(255,255,255,0.5);
- }
+ /* No volume control on share page */
@@ -370,12 +363,6 @@
Rendered using Motif’s Wario game-console engine.
-
-
-
-
-
-
diff --git a/src/main.ts b/src/main.ts
index b06de8e..7d6889a 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -27,13 +27,11 @@ class MotifApp {
private selectedMeta!: HTMLElement;
private selectedDetails!: HTMLElement;
- // Preview player controls
- private soundfontVolumeSlider!: HTMLInputElement;
+ // Preview player (no UI volume)
// Motif controls
private motifBtn!: HTMLButtonElement;
private motifStopBtn!: HTMLButtonElement;
- private motifVolumeSlider!: HTMLInputElement;
private motifProgressContainer!: HTMLElement;
private motifProgressBar!: HTMLInputElement;
private motifProgressFill!: HTMLElement;
@@ -71,8 +69,8 @@ class MotifApp {
this.initializeUI();
this.setupEventListeners();
- // Apply initial volume immediately (slider default set in HTML)
- this.motifEngine.setVolume(parseFloat(this.motifVolumeSlider.value));
+ // Always play at 100%
+ this.motifEngine.setVolume(1);
}
/**
@@ -83,7 +81,7 @@ class MotifApp {
const audioContext = await unlockAudio();
if (!this.soundfontPlayer) {
this.soundfontPlayer = new SoundfontMIDIPlayer(audioContext);
- this.soundfontPlayer.setVolume(parseFloat(this.soundfontVolumeSlider.value));
+ this.soundfontPlayer.setVolume(1);
}
return this.soundfontPlayer;
}
@@ -101,13 +99,9 @@ class MotifApp {
this.selectedMeta = document.getElementById('selectedMeta')!;
this.selectedDetails = document.getElementById('selectedDetails')!;
- // Preview player controls
- this.soundfontVolumeSlider = document.getElementById('soundfontVolume') as HTMLInputElement;
-
// Motif controls
this.motifBtn = document.getElementById('motifBtn') as HTMLButtonElement;
this.motifStopBtn = document.getElementById('motifStopBtn') as HTMLButtonElement;
- this.motifVolumeSlider = document.getElementById('motifVolume') as HTMLInputElement;
this.motifProgressContainer = document.getElementById('motifProgressContainer')!;
this.motifProgressBar = document.getElementById('motifProgressBar') as HTMLInputElement;
this.motifProgressFill = document.getElementById('motifProgressFill')!;
@@ -143,18 +137,10 @@ class MotifApp {
});
// Preview MIDI (verification only) — controlled from results table rows
- this.soundfontVolumeSlider.addEventListener('input', (e) => {
- const volume = parseFloat((e.target as HTMLInputElement).value);
- this.soundfontPlayer?.setVolume(volume);
- });
// Motif
this.motifBtn.addEventListener('click', () => this.handleMotif());
this.motifStopBtn.addEventListener('click', () => this.handleMotifStop());
- this.motifVolumeSlider.addEventListener('input', (e) => {
- const volume = parseFloat((e.target as HTMLInputElement).value);
- this.motifEngine.setVolume(volume);
- });
// Use both input and change for iOS compatibility
const seekHandler = (e: Event) => {
const progress = parseFloat((e.target as HTMLInputElement).value) / 100;
@@ -369,7 +355,7 @@ class MotifApp {
}
await player.load(events);
- player.setVolume(parseFloat(this.soundfontVolumeSlider.value));
+ player.setVolume(1);
await player.play();
this.playingPreviewIndex = index;
@@ -493,6 +479,7 @@ class MotifApp {
// Generate a variation using the procedural role-mapping mode
await this.motifEngine.generateFromMIDI(this.currentMIDI.events, 'procedural');
+ this.motifEngine.setVolume(1);
await this.motifEngine.play();
diff --git a/src/play.ts b/src/play.ts
index a3489b3..50bd8f0 100644
--- a/src/play.ts
+++ b/src/play.ts
@@ -128,7 +128,6 @@ async function main(): Promise {
const titleEl = qs('songTitle');
const artistEl = qs('songArtist');
const playBtn = qs('playToggleBtn') as HTMLButtonElement;
- const volumeEl = qs('volume') as HTMLInputElement;
const generateOwn = qs('generateOwn') as HTMLAnchorElement;
const progressContainer = qs('playProgressContainer') as HTMLElement;
const progressBar = qs('playProgressBar') as HTMLInputElement;
@@ -235,11 +234,6 @@ async function main(): Promise {
}
}
- volumeEl.addEventListener('input', () => {
- const vol = Number.parseFloat(volumeEl.value);
- motifEngine.setVolume(vol);
- });
-
const seekHandler = (e: Event) => {
showTimeRow();
const p = Number.parseFloat((e.target as HTMLInputElement).value) / 100;
@@ -289,7 +283,7 @@ async function main(): Promise {
if (!isGenerated) {
// Match main page "Generate & Play": procedural role-mapping → existing SynthesisEngine.
await motifEngine.generateFromMIDI(events, 'procedural');
- motifEngine.setVolume(Number.parseFloat(volumeEl.value));
+ motifEngine.setVolume(1);
durationSec = motifEngine.getDuration();
durationEl.textContent = formatTime(durationSec);
progressContainer.style.display = 'block';
@@ -300,6 +294,7 @@ async function main(): Promise {
}
setUiPlaying(true);
+ motifEngine.setVolume(1);
await motifEngine.play();
// Seek to remembered position (for pause/resume and scrub-before-play)
if (durationSec > 0 && playOffsetSec > 0) {