@gorilla-engine-sdk/create-gorilla-engine-plugin 1.0.0

package/generator-gorilla-engine-plugin/app/templates/basic-synth/instrument/Basic Synth Example.txt

@@ -0,0 +1,184 @@
+' SimpleSynth
+'
+' Demonstrating a basic set of synth controls
+'
+
+on init
+  'oscillator properties
+  prop_stepped Mode
+  add_step(Mode, "Poly")
+  add_step(Mode, "Mono")
+  set_prop_param(Mode, PROP_GROUP, "Osc")
+
+  prop_stepped Octave = 2
+  add_step(Octave, "-2")
+  add_step(Octave, "-1")
+  add_step(Octave, " 0")
+  add_step(Octave, "+1")
+  add_step(Octave, "+2")
+  set_prop_param(Octave, PROP_GROUP, "Osc")
+
+  prop_exp LFO_Rate(1000000, 10, 100000) = 694589
+  set_prop_param(LFO_Rate, PROP_UNITS, "Hz")
+  set_prop_param(LFO_Rate, PROP_GROUP, "Osc")
+
+  prop_linear Glide_Time(0, 127, 1)
+  set_prop_param(Glide_Time, PROP_GROUP, "Osc")
+
+  'filter properties
+  prop_exp Filter_Cutoff(1000000, 20000, 25000000) = 500000
+  set_prop_param(Filter_Cutoff, PROP_UNITS, "Hz")
+  set_prop_param(Filter_Cutoff, PROP_GROUP, "Filter")
+
+  prop_linear Filter_Reso(0, 1000, 10)
+  set_prop_param(Filter_Reso, PROP_UNITS, "%")
+  set_prop_param(Filter_Reso, PROP_GROUP, "Filter")
+
+  prop_linear Filter_Env(-1000, 1000, 10) = 750
+  set_prop_param(Filter_Env, PROP_UNITS, "%")
+  set_prop_param(Filter_Env, PROP_GROUP, "Filter")
+
+  prop_exp Filter_Attack(1000000, 0, 16000)
+  set_prop_param(Filter_Attack, PROP_UNITS, "s")
+  set_prop_param(Filter_Attack, PROP_GROUP, "Filter")
+
+  prop_exp Filter_Decay(1000000, 0, 16000) = 500000
+  set_prop_param(Filter_Decay, PROP_UNITS, "s")
+  set_prop_param(Filter_Decay, PROP_GROUP, "Filter")
+
+  prop_linear Filter_Sustain(0, 1000, 10)
+  set_prop_param(Filter_Sustain, PROP_UNITS, "%")
+  set_prop_param(Filter_Sustain, PROP_GROUP, "Filter")
+
+  prop_exp Filter_Release(1000000, 0, 16000) = 250000
+  set_prop_param(Filter_Release, PROP_UNITS, "s")
+  set_prop_param(Filter_Release, PROP_GROUP, "Filter")
+
+  'amp properties
+  prop_exp Amp_Attack(1000000, 0, 16000)
+  set_prop_param(Amp_Attack, PROP_UNITS, "s")
+  set_prop_param(Amp_Attack, PROP_GROUP, "Amp")
+
+  prop_exp Amp_Decay(1000000, 0, 16000) = 500000
+  set_prop_param(Amp_Decay, PROP_UNITS, "s")
+  set_prop_param(Amp_Decay, PROP_GROUP, "Amp")
+
+  prop_linear Amp_Sustain(0, 1000, 10) = 1000
+  set_prop_param(Amp_Sustain, PROP_UNITS, "%")
+  set_prop_param(Amp_Sustain, PROP_GROUP, "Amp")
+
+  prop_exp Amp_Release(1000000, 0, 16000) = 250000
+  set_prop_param(Amp_Release, PROP_UNITS, "s")
+  set_prop_param(Amp_Release, PROP_GROUP, "Amp")
+
+  prop_linear Amp_Velocity(0, 100, 1) = 50
+  set_prop_param(Amp_Velocity, PROP_UNITS, "%")
+  set_prop_param(Amp_Velocity, PROP_GROUP, "Amp")
+  var v 'for velocity sensitivity calculations
+
+  prop_boolean Chorus
+
+  prop_decibels Volume(1000000, 12)
+  set_prop_param(Volume, PROP_MIDI_CC, 7)
+end on
+
+
+on Mode
+  set_module_param(M_GROUP, 0, 0, 8, Mode) 'select Voice Group
+end on
+
+
+on Octave
+  'could set in oscillator directly instead of in "on note"
+  'set_module_param(M_GROUP+0, M_FILTER+1, 0, 2, 166666 + 166667 * Octave)
+end on
+
+
+on note
+  'adjust octave
+  set_key(EVENT_ID, EVENT_KEY + 12 * Octave - 24)
+end on
+
+
+on LFO_Rate
+  set_module_param(M_GROUP, M_MOD_SRC+4, 0, 3, LFO_Rate)
+end on
+
+
+on Glide_Time 'set MIDI CC used as a mod source
+  set_controller(5, Glide_Time)
+end on
+
+
+on Filter_Cutoff
+  set_module_param(M_GROUP, M_FILTER+2, 0, 2, Filter_Cutoff)
+end on
+
+
+on Filter_Reso
+  set_module_param(M_GROUP, M_FILTER+2, 0, 3, 1000 * Filter_Reso)
+end on
+
+
+on Filter_Env
+  set_module_param(M_GROUP, M_FILTER+2, M_MOD+1, 4, -Filter_Env) 'Invert
+  set_module_param(M_GROUP, M_FILTER+2, M_MOD+1, 5, 1000 * abs(Filter_Env)) 'Depth
+end on
+
+
+on Filter_Attack
+  set_module_param(M_GROUP, M_MOD_SRC+1, 0, 2, Filter_Attack)
+end on
+
+
+on Filter_Decay
+  set_module_param(M_GROUP, M_MOD_SRC+1, 0, 5, Filter_Decay)
+end on
+
+
+on Filter_Sustain
+  set_module_param(M_GROUP, M_MOD_SRC+1, 0, 7, 1000 * Filter_Sustain)
+end on
+
+
+on Filter_Release
+  set_module_param(M_GROUP, M_MOD_SRC+1, 0, 8, Filter_Release)
+end on
+
+
+on Amp_Attack
+  set_module_param(M_GROUP, M_MOD_SRC+2, 0, 2, Amp_Attack)
+end on
+
+
+on Amp_Decay
+  set_module_param(M_GROUP, M_MOD_SRC+2, 0, 5, Amp_Decay)
+end on
+
+
+on Amp_Sustain
+  set_module_param(M_GROUP, M_MOD_SRC+2, 0, 7, 1000 * Amp_Sustain)
+end on
+
+
+on Amp_Release
+  set_module_param(M_GROUP, M_MOD_SRC+2, 0, 8, Amp_Release)
+end on
+
+
+on Amp_Velocity
+  v = 100 - Amp_Velocity
+  v = 1000000 - v * v * v
+  set_module_param(M_GROUP, 0, M_MOD+2, 5, v)
+end on
+
+
+on Chorus
+  set_module_param(M_BUS+1, M_EFFECT+1, 0, 1, 1 - Chorus)
+end on
+
+
+on Volume
+  set_module_param(M_INST, 0, 0, 4, Volume)
+end on
+

package/generator-gorilla-engine-plugin/app/templates/basic-synth/src/app/Root.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { UserInterface } from './components/UserInterface';
+import { useNotification } from '@gorilla-engine-sdk/ge-dialogs-lib';
+import {
+  IPresetManager,
+  useSessionAndPresetsManager,
+} from '@gorilla-engine-sdk/ge-session-presets-lib';
+
+export function Root(props) {
+  const presetManager: IPresetManager = useSessionAndPresetsManager();
+  const [showNotification] = useNotification();
+
+  React.useEffect(() => {
+    if (presetManager) {
+      // it is possible to add additional logic when saving or loading sessions or presets
+      // typically you would add custom logic here to handle additional tasks when saving or loading presets
+      presetManager.setAdditionalSavePreset(
+        async (
+          instrument: GorillaEngine.Instrument,
+          presetObj: any,
+          fileObj: { filePath: string },
+        ) => {
+          showNotification({ message: 'Preset saved successfully' });
+          return true;
+        },
+      );
+    }
+  }, [presetManager]);
+
+  return (
+    <geLabel x={0} y={0} width={920} height={590} backgroundColor={'2F323D'}>
+      <UserInterface instrument={props.instrument} />
+    </geLabel>
+  );
+}

package/generator-gorilla-engine-plugin/app/templates/basic-synth/src/app/components/ErrorBoundary.tsx

@@ -0,0 +1,138 @@
+import * as React from 'react';
+
+const FONT_MEDIUM = 'fonts/Roboto-Medium.otf';
+const FONT_BOLD = 'fonts/Roboto-Bold.otf';
+const FONT_REGULAR = 'fonts/Roboto-Regular.otf';
+
+type ErrorBoundaryState = {
+  hasError: boolean;
+  message: string;
+  stack: string;
+};
+
+export class ErrorBoundary extends React.Component<React.PropsWithChildren, ErrorBoundaryState> {
+  declare state: ErrorBoundaryState;
+
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, message: '', stack: '' };
+  }
+
+  static getDerivedStateFromError(error: Error) {
+    return { hasError: true, message: error.message || String(error) };
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    this.setState({
+      message: error.message || String(error),
+      stack: errorInfo.componentStack || error.stack || '',
+    });
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <geLabel x={0} y={0} width={920} height={590} backgroundColor="17191F">
+          <geLabel x={0} y={0} width={8} height={590} backgroundColor="E85D5D" />
+          <geLabel x={8} y={0} width={912} height={72} backgroundColor="20232B">
+            <geLabel
+              x={32}
+              y={18}
+              width={38}
+              height={38}
+              backgroundColor="E85D5D"
+              text="!"
+              textColor="FFFFFF"
+              font={FONT_BOLD}
+              fontSize={24}
+              textAlign="center"
+            />
+            <geLabel
+              x={86}
+              y={24}
+              width={420}
+              height={24}
+              text="PLUGIN UI INTERRUPTED"
+              textColor="F4F6FA"
+              font={FONT_BOLD}
+              fontSize={20}
+            />
+            <geLabel
+              x={748}
+              y={25}
+              width={132}
+              height={20}
+              text="RENDER ERROR"
+              textColor="E85D5D"
+              font={FONT_MEDIUM}
+              fontSize={11}
+              textAlign="center"
+              backgroundColor="33262A"
+            />
+          </geLabel>
+
+          <geLabel
+            x={40}
+            y={104}
+            width={840}
+            height={18}
+            text="WHAT HAPPENED"
+            textColor="7E8797"
+            font={FONT_MEDIUM}
+            fontSize={11}
+          />
+          <geLabel
+            x={40}
+            y={128}
+            width={840}
+            height={76}
+            text={this.state.message || 'An unexpected rendering error occurred.'}
+            textColor="F4F6FA"
+            font={FONT_MEDIUM}
+            fontSize={16}
+            backgroundColor="242730"
+          />
+
+          <geLabel x={40} y={226} width={840} height={1} backgroundColor="353945" />
+          <geLabel
+            x={40}
+            y={246}
+            width={840}
+            height={18}
+            text="COMPONENT TRACE"
+            textColor="7E8797"
+            font={FONT_MEDIUM}
+            fontSize={11}
+          />
+          <geLabel
+            x={40}
+            y={274}
+            width={840}
+            height={236}
+            text={this.state.stack || 'No component trace was provided.'}
+            textColor="B9C1CF"
+            font={FONT_REGULAR}
+            fontSize={11}
+            textAlign="left"
+            backgroundColor="111319"
+          />
+
+          <geLabel x={40} y={536} width={840} height={1} backgroundColor="353945" />
+          <geLabel
+            x={748}
+            y={552}
+            width={132}
+            height={18}
+            text="GORILLA ENGINE"
+            textColor="596171"
+            font={FONT_MEDIUM}
+            fontSize={10}
+            textAlign="right"
+          />
+        </geLabel>
+      );
+    }
+
+    return (this.props as any).children;
+  }
+}

package/generator-gorilla-engine-plugin/app/templates/basic-synth/src/app/components/UserInterface.tsx

@@ -0,0 +1,338 @@
+import * as React from 'react';
+import { LabeledKnob, LabeledSlider } from '@gorilla-engine-sdk/ge-labeled-components';
+
+const FONT_M = 'fonts/Roboto-Medium.otf';
+const FONT_B = 'fonts/Roboto-Bold.otf';
+const FONT_R = 'fonts/Roboto-Regular.otf';
+
+const KNOB_PROPS = {
+  width: 85,
+  height: 85,
+  backgroundColor: '00FFFFFF',
+  hideValueLabel: true,
+  hideTextValue: true,
+  toggleVisibilityOnHover: true,
+  valueLabel: { y: 71, height: 14, font: FONT_M, fontSize: 14, textAlign: 'center' as const },
+  knob: {
+    filmstrip: { path: 'images/Rotary.png', count: 128, direction: 'vertical' as const },
+  },
+};
+
+const BIPOLAR_KNOB = {
+  filmstrip: {
+    path: 'images/Rotary Bipolar.png',
+    count: 128,
+    direction: 'vertical' as const,
+  },
+};
+
+const knobLabel = (text: string) => ({ ...KNOB_PROPS.valueLabel, text });
+
+const SLIDER_PROPS = {
+  width: 160,
+  height: 40,
+  backgroundColor: '00FFFFFF',
+  hideValueLabel: true,
+  hideTextValue: true,
+  toggleVisibilityOnHover: true,
+  valueLabel: { y: 0, height: 16, font: FONT_M, fontSize: 13, textAlign: 'center' as const },
+  slider: {
+    width: 140,
+    height: 18,
+    y: 20,
+    direction: 'horizontal' as const,
+    filmstrip: {
+      path: 'images/Horizontal Slider.png',
+      count: 128,
+      direction: 'vertical' as const,
+    },
+  },
+};
+
+const sliderLabel = (text: string) => ({ ...SLIDER_PROPS.valueLabel, text });
+
+type Props = {
+  instrument: GorillaEngine.Runtime.Instrument;
+};
+
+export function UserInterface({ instrument }: Props) {
+  return (
+    <>
+      {/* ── Header: centred in the space to the right of the preset browser ── */}
+      <geLabel
+        x={397}
+        y={25}
+        width={484}
+        height={14}
+        text={GorillaEngine.getManufacturerName()}
+        textColor="5177E0"
+        font={FONT_M}
+        fontSize={12}
+        textAlign="center"
+      />
+      <geLabel
+        x={397}
+        y={40}
+        width={484}
+        height={28}
+        text={GorillaEngine.getPluginName()}
+        textColor="E1E6F5"
+        font={FONT_B}
+        fontSize={24}
+        textAlign="center"
+      />
+
+      {/* ── Section labels ──────────────────────────────────────────── */}
+      <geLabel
+        x={40}
+        y={100}
+        width={200}
+        height={14}
+        text="AMP"
+        textColor="5177E0"
+        font={FONT_M}
+        fontSize={13}
+      />
+      <geLabel
+        x={439}
+        y={100}
+        width={200}
+        height={14}
+        text="FILTER"
+        textColor="5177E0"
+        font={FONT_M}
+        fontSize={13}
+      />
+
+      {/* ── AMP — row 1: Attack, Decay, Sustain ─────────────────────── */}
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={60}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.amp_attack}
+        textLabel={knobLabel('ATTACK')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={160}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.amp_decay}
+        textLabel={knobLabel('DECAY')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={260}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.amp_sustain}
+        textLabel={knobLabel('SUSTAIN')}
+      />
+
+      {/* ── AMP — row 2: Release, Velocity ──────────────────────────── */}
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={120}
+        y={228}
+        instrument={instrument}
+        instrumentProp={instrument.amp_release}
+        textLabel={knobLabel('RELEASE')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={220}
+        y={228}
+        instrument={instrument}
+        instrumentProp={instrument.amp_velocity}
+        textLabel={knobLabel('VELOCITY')}
+      />
+
+      {/* ── FILTER — row 1: ADSR ────────────────────────────────────── */}
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={469}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.filter_attack}
+        textLabel={knobLabel('ATTACK')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={569}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.filter_decay}
+        textLabel={knobLabel('DECAY')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={669}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.filter_sustain}
+        textLabel={knobLabel('SUSTAIN')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={769}
+        y={118}
+        instrument={instrument}
+        instrumentProp={instrument.filter_release}
+        textLabel={knobLabel('RELEASE')}
+      />
+
+      {/* ── FILTER — row 2: Cutoff, Reso, Env ───────────────────────── */}
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={524}
+        y={228}
+        instrument={instrument}
+        instrumentProp={instrument.filter_cutoff}
+        textLabel={knobLabel('CUTOFF')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={624}
+        y={228}
+        instrument={instrument}
+        instrumentProp={instrument.filter_reso}
+        textLabel={knobLabel('RESO')}
+      />
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={724}
+        y={228}
+        instrument={instrument}
+        instrumentProp={instrument.filter_env}
+        textLabel={knobLabel('ENV')}
+        knob={BIPOLAR_KNOB}
+      />
+
+      {/* ── Divider ─────────────────────────────────────────────────── */}
+      <geLabel x={0} y={380} width={920} height={1} backgroundColor="3F4354" />
+
+      {/* ── Lower: Mode ─────────────────────────────────────────────── */}
+      <geLabel
+        x={40}
+        y={390}
+        width={96}
+        height={14}
+        text="MODE"
+        textColor="E1E6F5"
+        font={FONT_M}
+        fontSize={13}
+        textAlign="center"
+      />
+      <geComboBox
+        x={40}
+        y={408}
+        width={96}
+        height={24}
+        backgroundColor="1d2029"
+        textColor="E1E6F5"
+        font={FONT_R}
+        fontSize={13}
+        bindings={{ value: instrument.mode, items: instrument.mode }}
+      />
+
+      {/* ── Lower: Octave ───────────────────────────────────────────── */}
+      <geLabel
+        x={174}
+        y={390}
+        width={96}
+        height={14}
+        text="OCTAVE"
+        textColor="E1E6F5"
+        font={FONT_M}
+        fontSize={13}
+        textAlign="center"
+      />
+      <geComboBox
+        x={174}
+        y={408}
+        width={96}
+        height={24}
+        backgroundColor="1d2029"
+        textColor="E1E6F5"
+        font={FONT_R}
+        fontSize={13}
+        bindings={{ value: instrument.octave, items: instrument.octave }}
+      />
+
+      {/* ── Lower: LFO Rate ─────────────────────────────────────────── */}
+      <LabeledSlider
+        {...SLIDER_PROPS}
+        x={308}
+        y={390}
+        instrument={instrument}
+        instrumentProp={instrument.lfo_rate}
+        textLabel={sliderLabel('LFO RATE')}
+      />
+
+      {/* ── Lower: Glide Time ───────────────────────────────────────── */}
+      <LabeledSlider
+        {...SLIDER_PROPS}
+        x={506}
+        y={390}
+        instrument={instrument}
+        instrumentProp={instrument.glide_time}
+        textLabel={sliderLabel('GLIDE')}
+      />
+
+      {/* ── Lower: Chorus toggle ────────────────────────────────────── */}
+      <geLabel
+        x={704}
+        y={390}
+        width={80}
+        height={14}
+        text="CHORUS"
+        textColor="E1E6F5"
+        font={FONT_M}
+        fontSize={13}
+        textAlign="center"
+      />
+      <geToggle
+        x={725}
+        y={408}
+        width={38}
+        height={20}
+        onImage="images/toggle-pressed.png"
+        offImage="images/toggle-default.png"
+        bindings={{ value: instrument.chorus }}
+      />
+
+      {/* ── Lower: Volume ───────────────────────────────────────────── */}
+      <LabeledKnob
+        {...KNOB_PROPS}
+        x={810}
+        y={466}
+        instrument={instrument}
+        instrumentProp={instrument.volume}
+        textLabel={knobLabel('VOLUME')}
+      />
+
+      {/* ── MIDI Keyboard ───────────────────────────────────────────── */}
+      <geMidiKeyboard
+        x={40}
+        y={483}
+        width={745}
+        height={90}
+        lowKey={48}
+        highKey={101}
+        keys={{
+          whiteHeight: 70,
+          blackHeight: 38,
+          spacing: 2,
+          whiteColor: 'DDDDDD',
+          whiteHoverColor: 'EEEEEE',
+          whitePressedColor: '5177E0',
+          whiteOutlineColor: 'AAAAAA',
+          blackColor: '222222',
+          blackHoverColor: '444444',
+          blackPressedColor: '5177E0',
+        }}
+      />
+    </>
+  );
+}

package/generator-gorilla-engine-plugin/app/templates/basic-synth/src/app/pluginConfig.ts

@@ -0,0 +1,4 @@
+export const pluginConfig = {
+  name: "React Basic Synth",
+  manufacturer: "Gorilla Engine",
+};