mirror of
https://github.com/eliasstepanik/strudel-docker.git
synced 2026-01-24 03:58:53 +00:00
fixed create and duplicate behavior
This commit is contained in:
parent
4e0a60db00
commit
0355c358b8
@ -157,9 +157,9 @@ export function Repl({ embedded = false }) {
|
|||||||
|
|
||||||
const handleTogglePlay = async () => editorRef.current?.toggle();
|
const handleTogglePlay = async () => editorRef.current?.toggle();
|
||||||
|
|
||||||
// payload = {reset?: boolean, code?: string, evaluate?: boolean, patternID?: string }
|
// payload = {reset?: boolean, code?: string, evaluate?: boolean, pattern?: string }
|
||||||
const handleUpdate = async (payload) => {
|
const handleUpdate = async (payload) => {
|
||||||
const { reset = false, code = null, evaluate = true, patternID = null } = payload;
|
const { reset = false, code = null, evaluate = true, pattern = null } = payload;
|
||||||
|
|
||||||
if (reset) {
|
if (reset) {
|
||||||
clearCanvas();
|
clearCanvas();
|
||||||
@ -167,9 +167,9 @@ export function Repl({ embedded = false }) {
|
|||||||
editorRef.current.repl.setCps(1);
|
editorRef.current.repl.setCps(1);
|
||||||
await prebake(); // declare default samples
|
await prebake(); // declare default samples
|
||||||
}
|
}
|
||||||
if (code != null) {
|
if (code != null && pattern != null) {
|
||||||
editorRef.current.setCode(code);
|
editorRef.current.setCode(code);
|
||||||
setViewingPattern(patternID);
|
setViewingPattern(pattern);
|
||||||
}
|
}
|
||||||
if (evaluate) {
|
if (evaluate) {
|
||||||
editorRef.current.evaluate();
|
editorRef.current.evaluate();
|
||||||
|
|||||||
@ -1,13 +1,13 @@
|
|||||||
import { DocumentDuplicateIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/20/solid';
|
import { DocumentDuplicateIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/20/solid';
|
||||||
import { useMemo } from 'react';
|
|
||||||
import {
|
import {
|
||||||
clearUserPatterns,
|
clearUserPatterns,
|
||||||
deletePattern,
|
deletePattern,
|
||||||
duplicatePattern,
|
createDuplicatePattern,
|
||||||
exportPatterns,
|
exportPatterns,
|
||||||
getUserPattern,
|
addUserPattern,
|
||||||
importPatterns,
|
importPatterns,
|
||||||
newUserPattern,
|
createNewUserPattern,
|
||||||
renamePattern,
|
renamePattern,
|
||||||
useActivePattern,
|
useActivePattern,
|
||||||
useViewingPattern,
|
useViewingPattern,
|
||||||
@ -55,9 +55,14 @@ export function PatternsTab({ context }) {
|
|||||||
const activePattern = useActivePattern();
|
const activePattern = useActivePattern();
|
||||||
const viewingPattern = useViewingPattern();
|
const viewingPattern = useViewingPattern();
|
||||||
// const isExample = useMemo(() => activePattern && !!tunes[activePattern], [activePattern]);
|
// const isExample = useMemo(() => activePattern && !!tunes[activePattern], [activePattern]);
|
||||||
const onPatternClick = (key, data) => {
|
const onPatternClick = (pattern, data) => {
|
||||||
// display selected pattern code in the window
|
// display selected pattern code in the window
|
||||||
context.handleUpdate({ patternID: key, code: data.code, evaluate: false });
|
context.handleUpdate({ pattern, code: data.code, evaluate: false });
|
||||||
|
};
|
||||||
|
|
||||||
|
const addPattern = ({ pattern, code }) => {
|
||||||
|
addUserPattern(pattern, { code });
|
||||||
|
context.handleUpdate({ code, pattern, evaluate: false });
|
||||||
};
|
};
|
||||||
|
|
||||||
const examplePatterns = {};
|
const examplePatterns = {};
|
||||||
@ -76,7 +81,11 @@ export function PatternsTab({ context }) {
|
|||||||
{/* <PencilIcon className="w-5 h-5" /> */}
|
{/* <PencilIcon className="w-5 h-5" /> */}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
<button className="hover:opacity-50" onClick={() => duplicatePattern(viewingPattern)} title="Duplicate">
|
<button
|
||||||
|
className="hover:opacity-50"
|
||||||
|
onClick={() => addPattern(createDuplicatePattern(viewingPattern))}
|
||||||
|
title="Duplicate"
|
||||||
|
>
|
||||||
<DocumentDuplicateIcon className="w-5 h-5" />
|
<DocumentDuplicateIcon className="w-5 h-5" />
|
||||||
</button>
|
</button>
|
||||||
{!isExample && (
|
{!isExample && (
|
||||||
@ -97,9 +106,7 @@ export function PatternsTab({ context }) {
|
|||||||
<button
|
<button
|
||||||
className="hover:opacity-50"
|
className="hover:opacity-50"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const name = newUserPattern();
|
addPattern(createNewUserPattern());
|
||||||
const { code } = getUserPattern(name);
|
|
||||||
context.handleUpdate({ code, evaluate: false });
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
new
|
new
|
||||||
|
|||||||
@ -120,15 +120,14 @@ export function addUserPattern(name, config) {
|
|||||||
setUserPatterns({ ...userPatterns, [name]: config });
|
setUserPatterns({ ...userPatterns, [name]: config });
|
||||||
}
|
}
|
||||||
|
|
||||||
export function newUserPattern() {
|
export function createNewUserPattern() {
|
||||||
const userPatterns = getUserPatterns();
|
const userPatterns = getUserPatterns();
|
||||||
const date = new Date().toISOString().split('T')[0];
|
const date = new Date().toISOString().split('T')[0];
|
||||||
const todays = Object.entries(userPatterns).filter(([name]) => name.startsWith(date));
|
const todays = Object.entries(userPatterns).filter(([name]) => name.startsWith(date));
|
||||||
const num = String(todays.length + 1).padStart(3, '0');
|
const num = String(todays.length + 1).padStart(3, '0');
|
||||||
const name = date + '_' + num;
|
const pattern = date + '_' + num;
|
||||||
const code = 's("hh")';
|
const code = 's("hh")';
|
||||||
setUserPatterns({ ...userPatterns, [name]: { code } });
|
return {pattern, code}
|
||||||
setViewingPattern(name);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export function clearUserPatterns() {
|
export function clearUserPatterns() {
|
||||||
@ -194,16 +193,14 @@ export function deletePattern(pattern) {
|
|||||||
setViewingPattern('');
|
setViewingPattern('');
|
||||||
}
|
}
|
||||||
|
|
||||||
export function duplicatePattern(pattern) {
|
export function createDuplicatePattern(pattern) {
|
||||||
let latestCode = getSetting('latestCode');
|
let latestCode = getSetting('latestCode');
|
||||||
if (!pattern) {
|
if (!pattern) {
|
||||||
console.warn('cannot duplicate: no pattern selected');
|
console.warn('cannot duplicate: no pattern selected');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const userPatterns = getUserPatterns();
|
|
||||||
const newPattern = getNextCloneName(pattern);
|
const newPattern = getNextCloneName(pattern);
|
||||||
setUserPatterns({ ...userPatterns, [newPattern]: { code: latestCode } });
|
return {pattern: newPattern, code: latestCode}
|
||||||
setViewingPattern(newPattern);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function importPatterns(fileList) {
|
export async function importPatterns(fileList) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user