Added a slightly different sustain style option.

Author: johnnesky

editor/EditorConfig.ts

@@ -22,7 +22,7 @@ export function prettyNumber(value: number): string {
 }
 
 export class EditorConfig {
-	public static readonly version: string = "4.1";
+	public static readonly version: string = "4.1.1";
 
 	public static readonly versionDisplayName: string = "BeepBox";
 	public static readonly releaseNotesURL: string = "https://github.com/johnnesky/beepbox/releases/tag/v" + EditorConfig.version;

editor/SongEditor.ts

@@ -28,6 +28,7 @@ import {Piano} from "./Piano";
 import {BeatsPerBarPrompt} from "./BeatsPerBarPrompt";
 import {MoveNotesSidewaysPrompt} from "./MoveNotesSidewaysPrompt";
 import {SongDurationPrompt} from "./SongDurationPrompt";
+import {SustainPrompt} from "./SustainPrompt";
 import {ChannelSettingsPrompt} from "./ChannelSettingsPrompt";
 import {ExportPrompt} from "./ExportPrompt";
 import {ImportPrompt} from "./ImportPrompt";
@@ -249,7 +250,8 @@ export class SongEditor {
 	private readonly _bitcrusherFreqSlider: Slider = new Slider(input({style: "margin: 0;", type: "range", min: "0", max: Config.bitcrusherFreqRange - 1, value: "0", step: "1"}), this._doc, (oldValue: number, newValue: number) => new ChangeBitcrusherFreq(this._doc, oldValue, newValue));
 	private readonly _bitcrusherFreqRow: HTMLDivElement = div({class: "selectRow"}, span({class: "tip", onclick: ()=>this._openPrompt("bitcrusherFreq")}, "Freq Crush:"), this._bitcrusherFreqSlider.input);
 	private readonly _stringSustainSlider: Slider = new Slider(input({style: "margin: 0;", type: "range", min: "0", max: Config.stringSustainRange - 1, value: "0", step: "1"}), this._doc, (oldValue: number, newValue: number) => new ChangeStringSustain(this._doc, oldValue, newValue));
-	private readonly _stringSustainRow: HTMLDivElement = div({class: "selectRow"}, span({class: "tip", onclick: ()=>this._openPrompt("stringSustain")}, "Sustain:"), this._stringSustainSlider.input);
+	private readonly _stringSustainLabel: HTMLSpanElement = span({class: "tip", onclick: ()=>this._openPrompt("stringSustain")}, "Sustain:");
+	private readonly _stringSustainRow: HTMLDivElement = div({class: "selectRow"}, this._stringSustainLabel, this._stringSustainSlider.input);
 	private readonly _unisonSelect: HTMLSelectElement = buildOptions(select(), Config.unisons.map(unison=>unison.name));
 	private readonly _unisonSelectRow: HTMLElement = div({class: "selectRow"}, span({class: "tip", onclick: ()=>this._openPrompt("unison")}, "Unison:"), div({class: "selectContainer"}, this._unisonSelect));
 	private readonly _chordSelect: HTMLSelectElement = buildOptions(select(), Config.chords.map(chord=>chord.name));
@@ -605,7 +607,7 @@ export class SongEditor {
 		this._currentPromptName = promptName;
 
 		if (this.prompt) {
-			if (this._wasPlaying && !(this.prompt instanceof TipPrompt)) {
+			if (this._wasPlaying && !(this.prompt instanceof TipPrompt || this.prompt instanceof SustainPrompt)) {
 				this._doc.performance.play();
 			}
 			this._wasPlaying = false;
@@ -645,13 +647,16 @@ export class SongEditor {
 				case "recordingSetup":
 					this.prompt = new RecordingSetupPrompt(this._doc);
 					break;
+				case "stringSustain":
+					this.prompt = new SustainPrompt(this._doc);
+					break;
 				default:
 					this.prompt = new TipPrompt(this._doc, promptName);
 					break;
 			}
 
 			if (this.prompt) {
-				if (!(this.prompt instanceof TipPrompt)) {
+				if (!(this.prompt instanceof TipPrompt || this.prompt instanceof SustainPrompt)) {
 					this._wasPlaying = this._doc.synth.playing;
 					this._doc.performance.pause();
 				}
@@ -812,6 +817,7 @@ export class SongEditor {
 			if (instrument.type == InstrumentType.pickedString) {
 				this._stringSustainRow.style.display = "";
 				this._stringSustainSlider.updateValue(instrument.stringSustain);
+				this._stringSustainLabel.textContent = "Sustain (" + Config.sustainTypeNames[instrument.stringSustainType].substring(0,1).toUpperCase() + "):";
 			} else {
 				this._stringSustainRow.style.display = "none";
 			}

editor/SustainPrompt.ts

@@ -0,0 +1,70 @@
+// Copyright (c) 2012-2022 John Nesky and contributing authors, distributed under the MIT license, see accompanying the LICENSE.md file.
+
+import {Config} from "../synth/SynthConfig";
+import {Instrument} from "../synth/synth";
+import {HTML} from "imperative-html/dist/esm/elements-strict";
+import {SongDocument} from "./SongDocument";
+import {Prompt} from "./Prompt";
+import {ChangeGroup} from "./Change";
+import {ChangeStringSustainType} from "./changes";
+
+const {button, div, label, h2, p, select, option} = HTML;
+
+export class SustainPrompt implements Prompt {
+	private readonly _typeSelect: HTMLSelectElement = select({style: "width: 100%;"},
+		option({value: "acoustic"}, "(A) Acoustic"),
+		option({value: "bright"}, "(B) Bright"),
+	);
+	private readonly _cancelButton: HTMLButtonElement = button({class: "cancelButton"});
+	private readonly _okayButton: HTMLButtonElement = button({class: "okayButton", style: "width:45%;"}, "Okay");
+	
+	public readonly container: HTMLDivElement = div({class: "prompt", style: "width: 300px;"},
+		div(
+			h2("String Sustain"),
+			p("This setting controls how quickly the picked string vibration decays."),
+			p("Unlike most of BeepBox's instrument synthesizer features, a picked string cannot change frequency suddenly while maintaining its decay. If a tone's pitch changes suddenly (e.g. if the chord type is set to \"arpeggio\" or the transition type is set to \"continues\") then the string will be re-picked and start decaying from the beginning again, even if the envelopes don't otherwise restart."),
+		),
+		div(
+			p("BeepBox comes with two slightly different sustain designs. You can select one here and press \"Okay\" to confirm it."),
+			div({class: "selectContainer", style: "width: 100%;"}, this._typeSelect),
+		),
+		label({style: "display: flex; flex-direction: row-reverse; justify-content: space-between;"},
+			this._okayButton,
+		),
+		this._cancelButton,
+	);
+	
+	constructor(private _doc: SongDocument) {
+		const instrument: Instrument = this._doc.song.channels[this._doc.channel].instruments[this._doc.getCurrentInstrument()];
+		this._typeSelect.value = Config.sustainTypeNames[instrument.stringSustainType];
+		
+		setTimeout(()=>this._cancelButton.focus());
+		
+		this._okayButton.addEventListener("click", this._saveChanges);
+		this._cancelButton.addEventListener("click", this._close);
+		this.container.addEventListener("keydown", this._whenKeyPressed);
+	}
+	
+	private _close = (): void => { 
+		this._doc.undo();
+	}
+	
+	public cleanUp = (): void => { 
+		this._okayButton.removeEventListener("click", this._saveChanges);
+		this._cancelButton.removeEventListener("click", this._close);
+		this.container.removeEventListener("keydown", this._whenKeyPressed);
+	}
+	
+	private _whenKeyPressed = (event: KeyboardEvent): void => {
+		if ((<Element> event.target).tagName != "BUTTON" && event.keyCode == 13) { // Enter key
+			this._saveChanges();
+		}
+	}
+	
+	private _saveChanges = (): void => {
+		const group: ChangeGroup = new ChangeGroup();
+		group.append(new ChangeStringSustainType(this._doc, <any> Config.sustainTypeNames.indexOf(this._typeSelect.value)));
+		this._doc.prompt = null;
+		this._doc.record(group, true);
+	}
+}

editor/TipPrompt.ts

@@ -272,13 +272,6 @@ export class TipPrompt implements Prompt {
 					p("Every other notch on this slider is aligned with the currently selected key of the song, and the in-between notches are aligned with the tritones of the key."),
 				);
 			} break;
-			case "stringSustain": {
-				message = div(
-					h2("String sustain"),
-					p("This setting controls how quickly the picked string vibration decays."),
-					p("Unlike most of BeepBox's instrument synthesizer features, a picked string cannot change frequency suddenly while maintaining its decay. If a tone's pitch changes suddenly (e.g. if the chord type is set to \"arpeggio\" or the transition type is set to \"continues\") then the string will be re-picked and start decaying from the beginning again, even if the envelopes don't otherwise restart."),
-				);
-			} break;
 			case "envelopes": {
 				message = div(
 					h2("Envelopes"),

editor/changes.ts

@@ -1,6 +1,6 @@
 // Copyright (c) 2012-2022 John Nesky and contributing authors, distributed under the MIT license, see accompanying the LICENSE.md file.
 
-import {Algorithm, Dictionary, FilterType, InstrumentType, EffectType, AutomationTarget, Config, effectsIncludePanning, effectsIncludeDistortion} from "../synth/SynthConfig";
+import {Algorithm, Dictionary, FilterType, SustainType, InstrumentType, EffectType, AutomationTarget, Config, effectsIncludePanning, effectsIncludeDistortion} from "../synth/SynthConfig";
 import {NotePin, Note, makeNotePin, Pattern, FilterSettings, FilterControlPoint, SpectrumWave, HarmonicsWave, Instrument, Channel, Song, Synth} from "../synth/synth";
 import {Preset, PresetCategory, EditorConfig} from "./EditorConfig";
 import {Change, ChangeGroup, ChangeSequence, UndoableChange} from "./Change";
@@ -1367,6 +1367,20 @@ export class ChangeStringSustain extends ChangeInstrumentSlider {
 	}
 }
 
+export class ChangeStringSustainType extends Change {
+	constructor(doc: SongDocument, newValue: SustainType) {
+		super();
+		const instrument: Instrument = doc.song.channels[doc.channel].instruments[doc.getCurrentInstrument()];
+		const oldValue: SustainType = instrument.stringSustainType;
+		if (oldValue != newValue) {
+			instrument.stringSustainType = newValue;
+			instrument.preset = instrument.type;
+			doc.notifier.changed();
+			this._didSomething();
+		}
+	}
+}
+
 export class ChangeFilterAddPoint extends UndoableChange {
 	private _doc: SongDocument;
 	private _instrument: Instrument;

synth/SynthConfig.ts

@@ -35,6 +35,12 @@ export const enum FilterType {
 	length,
 }
 
+export const enum SustainType {
+	bright,
+	acoustic,
+	length,
+}
+
 export const enum EnvelopeType {
 	noteSize,
 	none,
@@ -481,10 +487,11 @@ export class Config {
 	public static readonly pickedStringDispersionFreqScale: number = 0.3; // The tone fundamental freq freq moves this much toward the center freq for computing the all-pass corner freq.
 	public static readonly pickedStringDispersionFreqMult: number = 4.0; // The all-pass corner freq is based on this times the adjusted tone fundamental freq.
 	public static readonly pickedStringShelfHz: number = 4000.0; // The cutoff freq of the shelf filter that is used to decay the high frequency energy in the picked string.
-	
-	public static readonly distortionRange: number = 8;
 	public static readonly stringSustainRange: number = 15;
 	public static readonly stringDecayRate: number = 0.12;
+	public static readonly sustainTypeNames: ReadonlyArray<string> = ["bright", "acoustic"]; // See SustainType enum above.
+	
+	public static readonly distortionRange: number = 8;
 	public static readonly bitcrusherFreqRange: number = 14;
 	public static readonly bitcrusherOctaveStep: number = 0.5;
 	public static readonly bitcrusherQuantizationRange: number = 8;

synth/filtering.ts

@@ -167,7 +167,8 @@ denominator with the imaginary component negated.)
 Finally, I'll list some of the links that helped me understand filters and
 provided some of the algorithms I that use here.
 
-Here's where I found accurate 2nd order low-pass and high-pass digital filters:
+Here's where I found accurate 2nd order low-pass, high-pass, and high-shelf
+digital filters:
 https://web.archive.org/web/20120531011328/http://www.musicdsp.org/files/Audio-EQ-Cookbook.txt
 
 This page is how I found a link to the cookbook article above. It claims these
@@ -366,6 +367,23 @@ export class FilterCoefficients {
 		this.order = 2;
 	}
 	*/
+	
+	public highShelf2ndOrder(cornerRadiansPerSample: number, shelfLinearGain: number, slope: number): void {
+		const A: number = Math.sqrt(shelfLinearGain);
+		const c: number = Math.cos(cornerRadiansPerSample);
+		const Aplus: number = A + 1.0;
+		const Aminus: number = A - 1.0;
+		const alpha: number = Math.sin(cornerRadiansPerSample) * 0.5 * Math.sqrt((Aplus / A) * (1.0 / slope - 1.0) + 2.0);
+		const sqrtA2Alpha: number = 2.0 * Math.sqrt(A) * alpha;
+		const a0: number =   (Aplus  - Aminus * c + sqrtA2Alpha);
+		this.a[1] =  2 *     (Aminus - Aplus  * c              ) / a0;
+		this.a[2] =          (Aplus  - Aminus * c - sqrtA2Alpha) / a0;
+		this.b[0] =      A * (Aplus  + Aminus * c + sqrtA2Alpha) / a0;
+		this.b[1] = -2 * A * (Aminus + Aplus  * c              ) / a0;
+		this.b[2] =      A * (Aplus  + Aminus * c - sqrtA2Alpha) / a0;
+		this.order = 2;
+	}
+	
 	public peak2ndOrder(cornerRadiansPerSample: number, peakLinearGain: number, bandWidthScale: number): void {
 		const sqrtGain: number = Math.sqrt(peakLinearGain);
 		const bandWidth: number = bandWidthScale * cornerRadiansPerSample / (sqrtGain >= 1 ? sqrtGain : 1/sqrtGain);
@@ -503,3 +521,17 @@ export class DynamicBiquadFilter {
 		this.useMultiplicativeInputCoefficients = useMultiplicativeInputCoefficients;
 	}
 }
+
+// Filters are typically designed as analog filters first, then converted to
+// digital filters using one of two methods: the "matched z-transform" or the
+// "bilinear transform". The "bilinear transform" does a better job of
+// preserving the magnitudes of the frequency response, but warps the frequency
+// range such that the nyquist frequency of the digital filter (π) maps to the
+// infinity frequency of the analog filter. You can use the below functions to
+// manually perform this warping in either direction.
+export function warpNyquistToInfinity(radians: number): number {
+	return 2.0 * Math.tan(radians * 0.5);
+}
+export function warpInfinityToNyquist(radians: number): number {
+	return 2.0 * Math.atan(radians * 0.5);
+}