From cb8b65f6f3970ffc60e526f6e31fb3620644a7a8 Mon Sep 17 00:00:00 2001 From: Felix Roos Date: Wed, 28 Dec 2022 15:39:42 +0100 Subject: [PATCH] add my-patterns --- my-patterns/README.md | 8 +++++ website/src/pages/my-patterns/[name].png.js | 29 ++++++++++++++++ website/src/pages/my-patterns/index.astro | 29 ++++++++++++++++ website/src/pages/my-patterns/list.json.js | 38 +++++++++++++++++++++ 4 files changed, 104 insertions(+) create mode 100644 my-patterns/README.md create mode 100644 website/src/pages/my-patterns/[name].png.js create mode 100644 website/src/pages/my-patterns/index.astro create mode 100644 website/src/pages/my-patterns/list.json.js diff --git a/my-patterns/README.md b/my-patterns/README.md new file mode 100644 index 00000000..153d198c --- /dev/null +++ b/my-patterns/README.md @@ -0,0 +1,8 @@ +# my-patterns + +This directory can be used to save your own patterns. + +0. fork the strudel repo +1. Save one or more .txt files here. +2. and run `npm run repl` +3. open `http://localhost:3000/my-patterns` ! diff --git a/website/src/pages/my-patterns/[name].png.js b/website/src/pages/my-patterns/[name].png.js new file mode 100644 index 00000000..aa8aabf3 --- /dev/null +++ b/website/src/pages/my-patterns/[name].png.js @@ -0,0 +1,29 @@ +import { createCanvas } from 'canvas'; +import { pianoroll } from '@strudel.cycles/core'; +import { evaluate } from '@strudel.cycles/transpiler'; +import '../../../../test/runtime.mjs'; +import { getMyPatterns } from './list.json'; + +export async function get({ params, request }) { + const patterns = await getMyPatterns(); + const { name } = params; + const tune = patterns[name]; + const { pattern } = await evaluate(tune); + const haps = pattern.queryArc(0, 4); + const canvas = createCanvas(800, 800); + const ctx = canvas.getContext('2d'); + pianoroll({ time: 4, haps, ctx, playhead: 1, fold: 1, background: 'transparent', playheadColor: 'transparent' }); + const buffer = canvas.toBuffer('image/png'); + return { + body: buffer, + encoding: 'binary', + }; +} +export async function getStaticPaths() { + const patterns = await getMyPatterns(); + return Object.keys(patterns).map((name) => ({ + params: { + name, + }, + })); +} diff --git a/website/src/pages/my-patterns/index.astro b/website/src/pages/my-patterns/index.astro new file mode 100644 index 00000000..15ea7da4 --- /dev/null +++ b/website/src/pages/my-patterns/index.astro @@ -0,0 +1,29 @@ +--- +import { getMyPatterns } from './list.json'; + +import { Content } from '../../../../my-patterns/README.md'; + +const myPatterns = await getMyPatterns(); +--- + + + { + Object.keys(myPatterns).length === 0 && ( +
+ +
+ ) + } +
+ { + Object.entries(myPatterns).map(([name, tune]) => ( + +
+ {name} +
+ + + )) + } +
+ diff --git a/website/src/pages/my-patterns/list.json.js b/website/src/pages/my-patterns/list.json.js new file mode 100644 index 00000000..e310eacf --- /dev/null +++ b/website/src/pages/my-patterns/list.json.js @@ -0,0 +1,38 @@ +import fs from 'fs'; +import path from 'path'; +import { dirname } from 'path'; +import { fileURLToPath } from 'url'; + +const __dirname = dirname(fileURLToPath(import.meta.url)); + +async function readTextFiles(folder) { + const absolutePath = path.resolve(__dirname, folder); + + // Use `fs.promises.readdir()` to get a list of all the files in the folder + const files = await fs.promises.readdir(absolutePath); + + // Filter the list of files to only include those with a `.txt` extension + const textFiles = files.filter((file) => file.endsWith('.txt')); + // Initialize an empty object to store the file contents + const fileContents = {}; + + // Use `fs.promises.readFile()` to read the contents of each text file + for (const file of textFiles) { + const filePath = `${absolutePath}/${file}`; + const data = await fs.promises.readFile(filePath, 'utf8'); + fileContents[file] = data; + } + // Return the object with the filenames as keys and the file contents as values + return fileContents; +} + +export function getMyPatterns() { + return readTextFiles('../../../../my-patterns'); +} + +export async function get({ params, request }) { + const all = await getMyPatterns(); + return { + body: JSON.stringify(all), + }; +}