fix confirm dialog

packages/desktopbridge/oscbridge.mjs

@@ -1,12 +1,21 @@
 import { parseNumeral, Pattern, averageArray } from '@strudel/core';
+
+
 import { Invoke } from './utils.mjs';
+import { getAudioContext } from '../superdough/superdough.mjs';
 
 let offsetTime;
 let timeAtPrevOffsetSample;
 let prevOffsetTimes = [];
 
-Pattern.prototype.osc = function () {
-  return this.onTrigger(async (time, hap, currentTime, cps = 1, targetTime) => {
+
+export const superdirtOutput = (hap, deadline, hapDuration, cps, targetTime) => {
+  const ctx = getAudioContext();
+  const currentTime = ctx.currentTime;
+  return oscTrigger(null, hap, currentTime, cps, targetTime)
+}
+
+async function oscTrigger(t_deprecate, hap, currentTime, cps = 1, targetTime) {
   hap.ensureObjectValue();
   const cycle = hap.wholeOrPart().begin.valueOf();
   const delta = hap.duration.valueOf();
@@ -60,5 +69,7 @@ Pattern.prototype.osc = function () {
   setTimeout(() => {
     Invoke('sendosc', { messagesfromjs: [message] });
   });
-  });
+}
+Pattern.prototype.osc = function () {
+  return this.onTrigger(oscTrigger);
 };

packages/webaudio/webaudio.mjs

@@ -20,6 +20,8 @@ export const webaudioOutputTrigger = (t, hap, ct, cps) => superdough(hap2value(h
 export const webaudioOutput = (hap, deadline, hapDuration, cps, t) =>
   superdough(hap2value(hap), t ? `=${t}` : deadline, hapDuration);
 
+
+
 Pattern.prototype.webaudio = function () {
   return this.onTrigger(webaudioOutputTrigger);
 };

website/src/repl/Repl.jsx

@@ -14,7 +14,8 @@ import {
   resetLoadedSounds,
   initAudioOnFirstClick,
 } from '@strudel/webaudio';
-import { defaultAudioDeviceName } from '../settings.mjs';
+import { superdirtOutput } from '@strudel/desktopbridge/oscbridge.mjs';
+import { audioEngineTargets, defaultAudioDeviceName } from '../settings.mjs';
 import { getAudioDevices, setAudioDevice, setVersionDefaultsFrom } from './util.mjs';
 import { StrudelMirror, defaultSettings } from '@strudel/codemirror';
 import { clearHydra } from '@strudel/hydra';
@@ -61,13 +62,14 @@ async function getModule(name) {
 
 export function Repl({ embedded = false }) {
   const isEmbedded = embedded || isIframe;
-  const { panelPosition, isZen, isSyncEnabled } = useSettings();
+  const { panelPosition, isZen, isSyncEnabled, audioEngineTarget } = useSettings();
+  const defaultOutput = audioEngineTarget === audioEngineTargets.superdirt ? superdirtOutput : webaudioOutput;
   const init = useCallback(() => {
     const drawTime = [-2, 2];
     const drawContext = getDrawContext();
     const editor = new StrudelMirror({
       sync: isSyncEnabled,
-      defaultOutput: webaudioOutput,
+      defaultOutput,
       getTime: () => getAudioContext().currentTime,
       setInterval,
       clearInterval,

website/src/repl/components/panel/AudioEngineTargetSelector.jsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { audioEngineTargets } from '../../../settings.mjs';
+import { SelectInput } from './SelectInput';
+
+// Allows the user to select an audio interface for Strudel to play through
+export function AudioEngineTargetSelector({ target, onChange, isDisabled }) {
+  const onTargetChange = (target) => {
+    onChange(target);
+  };
+  const options = new Map();
+  Array.from(Object.keys(audioEngineTargets)).map((key) => {
+    options.set(key, key);
+  });
+
+  return <SelectInput isDisabled={isDisabled} options={options} value={target} onChange={onTargetChange} />;
+}

website/src/repl/components/panel/SettingsTab.jsx

@@ -3,6 +3,8 @@ import { themes } from '@strudel/codemirror';
 import { isUdels } from '../../util.mjs';
 import { ButtonGroup } from './Forms.jsx';
 import { AudioDeviceSelector } from './AudioDeviceSelector.jsx';
+import { AudioEngineTargetSelector } from './AudioEngineTargetSelector.jsx';
+import { isTauri } from '@src/tauri.mjs';
 
 function Checkbox({ label, value, onChange, disabled = false }) {
   return (
@@ -78,6 +80,20 @@ const fontFamilyOptions = {
   galactico: 'galactico',
 };
 
+const RELOAD_MSG = 'Changing this setting requires the window to reload itself. OK?';
+
+function confirmDialog(msg) {
+  // confirm dialog is a promise in Tauri and possibly other browsers... normalize it to be a promise everywhere
+  return new Promise(function (resolve, reject) {
+    let confirmed = confirm(msg);
+    if (confirmed instanceof Promise) {
+      confirmed.then((r) => (r ? resolve(true) : reject(false)));
+    } else {
+      return confirmed ? resolve(true) : reject(false);
+    }
+  });
+}
+
 export function SettingsTab({ started }) {
   const {
     theme,
@@ -96,11 +112,14 @@ export function SettingsTab({ started }) {
     fontFamily,
     panelPosition,
     audioDeviceName,
+    audioEngineTarget,
   } = useSettings();
   const shouldAlwaysSync = isUdels();
+  const inDesktopApp = isTauri();
+  const canChangeAudioDevice = AudioContext.prototype.setSinkId != null;
   return (
     <div className="text-foreground p-4 space-y-4">
-      {AudioContext.prototype.setSinkId != null && (
+      {canChangeAudioDevice && (
         <FormItem label="Audio Output Device">
           <AudioDeviceSelector
             isDisabled={started}
@@ -109,6 +128,21 @@ export function SettingsTab({ started }) {
           />
         </FormItem>
       )}
+      {inDesktopApp && (
+        <FormItem label="Audio Engine Target">
+          <AudioEngineTargetSelector
+            target={audioEngineTarget}
+            onChange={(target) => {
+              confirmDialog(RELOAD_MSG).then((r) => {
+                if (r == true) {
+                  settingsMap.setKey('audioEngineTarget', target);
+                  return window.location.reload();
+                }
+              });
+            }}
+          />
+        </FormItem>
+      )}
       <FormItem label="Theme">
         <SelectInput options={themeOptions} value={theme} onChange={(theme) => settingsMap.setKey('theme', theme)} />
       </FormItem>
@@ -193,10 +227,13 @@ export function SettingsTab({ started }) {
         <Checkbox
           label="Sync across Browser Tabs / Windows"
           onChange={(cbEvent) => {
-            if (confirm('Changing this setting requires the window to reload itself. OK?')) {
-              settingsMap.setKey('isSyncEnabled', cbEvent.target.checked);
+            const newVal = cbEvent.target.checked;
+            confirmDialog(RELOAD_MSG).then((r) => {
+              if (r) {
+                settingsMap.setKey('isSyncEnabled', newVal);
                 window.location.reload();
               }
+            });
           }}
           disabled={shouldAlwaysSync}
           value={isSyncEnabled}

website/src/settings.mjs

@@ -5,6 +5,11 @@ import { isUdels } from './repl/util.mjs';
 
 export const defaultAudioDeviceName = 'System Standard';
 
+export const audioEngineTargets = {
+  webaudio: 'webaudio',
+  superdirt: 'superdirt',
+};
+
 export const defaultSettings = {
   activeFooter: 'intro',
   keybindings: 'codemirror',
@@ -28,6 +33,7 @@ export const defaultSettings = {
   panelPosition: 'right',
   userPatterns: '{}',
   audioDeviceName: defaultAudioDeviceName,
+  audioEngineTarget: audioEngineTargets.webaudio //webaudio | superdirt
 };
 
 let search = null;