spectrome / patchcab Goto Github PK
View Code? Open in Web Editor NEWModular Eurorack style synthesizer made with Web Audio
Home Page: https://patch.cab
License: MIT License
Modular Eurorack style synthesizer made with Web Audio
Home Page: https://patch.cab
License: MIT License
When I run yarn build
in my local checkout, the screenshots it produces in modules/
directories all use the default (seriffed, in my case) fonts rather than the expected Routed Gothic.
I thought perhaps it was just my own modules but this happens even when I run yarn build
in the main @patchcab/modules
package too, e.g:
I added some logging to capture the js dev console output in screenshot.ts
and it says this, which may be relevant:
PAGE LOG: %c * Tone.js v14.7.77 * background: #000; color: #fff
PAGE LOG: The resource http://localhost:3000/assets/routed-gothic.woff2 was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
PAGE LOG: The resource http://localhost:3000/assets/routed-gothic-wide.woff2 was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
If I pause and inspect the elements in devtools, it looks like they have the proper font-face property (and the files apparently loaded successfully, per the logs above), it just isn't rendering the right font.
I hesitate to really call this a "bug" since vercel seems to generate these screenshots without this issue when it runs build
, so I suspect the problem is somewhere on my end, but do you have ideas for things I should double-check?
So far, I've tried:
screenshot.ts
: adding --font-render-hinting=none
to puppeteer.lauch
argsindex.html
:
type="font/woff2"
to the <link rel="preload"...
links for the fontsfont-display
to block' in the
@font-face` CSS rulesKind of grasping at straws here. Any other ideas?
Environment:
Is this feature request for a module or Patchcab in general?
Describe the solution you'd like
Oscilloscopes IRL usually have a "triggered sweep" feature:
https://en.wikipedia.org/wiki/Oscilloscope#Triggered_sweep
It would be nice for the included OSC module to offer this as well.
It's very helpful for understanding the shape of a periodic wave.
I would be happy to write up PR for this if you don't already have plans to implement it.
This is a super cool project by the way! I had started to build something similar (using Web Components instead of Svelte, but whatever...) and this saves me a ton of work!
Describe the bug
When running npx patchcab
, these lines in bin.ts
cause my ./modules
directory to be destroyed:
Line 28 in 0fdb815
Line 36 in 0fdb815
./modules
seems to be a source directory - why is it being deleted?
To Reproduce
Environment:
Vercel does not find the patchcab
binary from ./modules
directory on the build step.
Is this feature request for a module or Patchcab in general?
First of all, I'm mindblown that this exists - THANK YOU! ❤️❤️❤️❤️
I found this repo when I had the idea to implement an LFO on a completely non-audio related project. I was thinking that it would be really nice to have modular-style cv tools that could modulate any JS variable, especially if it was playable and patchable (like the slider values of a stylegan toy or something)
How difficult would it be to package a small single row instance of patchcab as a svelte component to be dropped into any app? I'm imagining a CV out module that you could drop in a <slot />
and bind each jack to whatever variable you want and use it in your app.
That way you could use LFOs, sequencers, noise, etc to control literally anything, even outside of a musical context!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.