Merge remote-tracking branch 'origin/main' into velocity-in-value

website/src/repl/Repl.jsx

@@ -4,7 +4,8 @@ Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/st
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { code2hash, getDrawContext, logger, silence } from '@strudel/core';
+import { code2hash, logger, silence } from '@strudel/core';
+import { getDrawContext } from '@strudel/draw';
 import cx from '@src/cx.mjs';
 import { transpiler } from '@strudel/transpiler';
 import {
@@ -17,6 +18,7 @@ import {
 import { defaultAudioDeviceName } from '../settings.mjs';
 import { getAudioDevices, setAudioDevice } from './util.mjs';
 import { StrudelMirror, defaultSettings } from '@strudel/codemirror';
+import { clearHydra } from '@strudel/hydra';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { settingsMap, useSettings } from '../settings.mjs';
 import {
@@ -75,6 +77,11 @@ export function Repl({ embedded = false }) {
       onUpdateState: (state) => {
         setReplState({ ...state });
       },
+      onToggle: (playing) => {
+        if (!playing) {
+          clearHydra();
+        }
+      },
       afterEval: (all) => {
         const { code } = all;
         setLatestCode(code);
@@ -165,6 +172,7 @@ export function Repl({ embedded = false }) {
   const resetEditor = async () => {
     resetGlobalEffects();
     clearCanvas();
+    clearHydra();
     resetLoadedSounds();
     editorRef.current.repl.setCps(0.5);
     await prebake(); // declare default samples
@@ -189,6 +197,7 @@ export function Repl({ embedded = false }) {
     setActivePattern(patternData.id);
     setViewingPatternData(patternData);
     clearCanvas();
+    clearHydra();
     resetLoadedSounds();
     resetGlobalEffects();
     await prebake(); // declare default samples

website/src/repl/drawings.mjs

@@ -24,7 +24,9 @@ angle(saw)
 `;
 
 // https://strudel.cc/?C31_NrcMfZEO
-export const spiralflower = `const {innerWidth:ww,innerHeight:wh} = window;
+export const spiralflower = `let {innerWidth:ww,innerHeight:wh} = window;
+ww*=window.devicePixelRatio;
+wh*=window.devicePixelRatio;
 const ctx = getDrawContext()
 const piDiv180 = Math.PI / 180;
 function fromPolar(angle, radius, cx, cy) {

website/src/repl/util.mjs

@@ -72,6 +72,7 @@ export async function getRandomTune() {
 export function loadModules() {
   let modules = [
     import('@strudel/core'),
+    import('@strudel/draw'),
     import('@strudel/tonal'),
     import('@strudel/mini'),
     import('@strudel/xen'),