elias/strudel-docker
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel-docker.git synced 2026-01-22 02:58:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

implement onPaint with pattern state

Browse Source
This commit is contained in:
Felix Roos 2024-06-02 03:00:57 +02:00
parent 94e411aa7a
commit faba4a4e4e
2 changed files with 27 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/core/pattern.mjs
View File

@ -94,6 +94,14 @@ export class Pattern {
return result; return result;
} }
// runs func on query state
withState(func) {
return this.withHaps((haps, state) => {
func(state);
return haps;
});
}
/** /**
* see `withValue` * see `withValue`
* @noAutocomplete * @noAutocomplete

25
packages/draw/draw.mjs
View File

@ -74,13 +74,23 @@ Pattern.prototype.draw = function (fn, options) {
export const cleanupDraw = (clearScreen = true, id) => { export const cleanupDraw = (clearScreen = true, id) => {
const ctx = getDrawContext(); const ctx = getDrawContext();
clearScreen && ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.width); clearScreen && ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
stopAllAnimations(id); stopAllAnimations(id);
}; };
Pattern.prototype.onPaint = function () { Pattern.prototype.onPaint = function (painter) {
console.warn('[draw] onPaint was not overloaded. Some drawings might not work'); return this.withState((state) => {
return this; if (!state.controls.painters) {
state.controls.painters = [];
}
state.controls.painters.push(painter);
});
};
Pattern.prototype.getPainters = function () {
let painters = [];
this.queryArc(0, 0, { painters });
return painters;
}; };
// const round = (x) => Math.round(x * 1000) / 1000; // const round = (x) => Math.round(x * 1000) / 1000;
@ -119,6 +129,7 @@ export class Drawer {
this.visibleHaps = []; this.visibleHaps = [];
this.lastFrame = null; this.lastFrame = null;
this.drawTime = drawTime; this.drawTime = drawTime;
this.painters = [];
this.framer = new Framer( this.framer = new Framer(
() => { () => {
if (!this.scheduler) { if (!this.scheduler) {
@ -143,7 +154,7 @@ export class Drawer {
// add new haps with onset (think right edge bars scrolling in) // add new haps with onset (think right edge bars scrolling in)
.concat(haps.filter((h) => h.hasOnset())); .concat(haps.filter((h) => h.hasOnset()));
const time = phase - lookahead; const time = phase - lookahead;
onDraw(this.visibleHaps, time, this); onDraw(this.visibleHaps, time, this, this.painters);
}, },
(err) => { (err) => {
console.warn('draw error', err); console.warn('draw error', err);
@ -161,11 +172,13 @@ export class Drawer {
t = t ?? scheduler.now(); t = t ?? scheduler.now();
this.scheduler = scheduler; this.scheduler = scheduler;
let [_, lookahead] = this.drawTime; let [_, lookahead] = this.drawTime;
// +0.1 = workaround for weird holes in query..
const [begin, end] = [Math.max(t, 0), t + lookahead + 0.1]; const [begin, end] = [Math.max(t, 0), t + lookahead + 0.1];
// remove all future haps // remove all future haps
this.visibleHaps = this.visibleHaps.filter((h) => h.whole.begin < t); this.visibleHaps = this.visibleHaps.filter((h) => h.whole.begin < t);
this.painters = []; // will get populated by .onPaint calls attached to the pattern
// query future haps // query future haps
const futureHaps = scheduler.pattern.queryArc(begin, end); // +0.1 = workaround for weird holes in query.. const futureHaps = scheduler.pattern.queryArc(begin, end, { painters: this.painters });
// append future haps // append future haps
this.visibleHaps = this.visibleHaps.concat(futureHaps); this.visibleHaps = this.visibleHaps.concat(futureHaps);
} }