elias/strudel-docker
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel-docker.git synced 2026-01-27 13:38:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #337 from tidalcycles/animate

Browse Source 
animation options
This commit is contained in:
Felix Roos 2023-01-01 12:22:55 +01:00 committed by GitHub
commit 670af8fb1b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
packages/core/animate.mjs
View File

@ -1,17 +1,18 @@
import { controls, Pattern, getDrawContext, silence, scheduler } from './index.mjs'; import { controls, Pattern, getDrawContext, silence, scheduler } from './index.mjs';
const { createParams } = controls; const { createParams } = controls;
let clearColor = '#20001010'; let clearColor = '#22222210';
let currentSmear = 0.5;
export let syncAnimationWithScheduler = true;
Pattern.prototype.animate = function (callback) { Pattern.prototype.animate = function ({ callback, sync = false, smear = 0.5 } = {}) {
window.frame && cancelAnimationFrame(window.frame); window.frame && cancelAnimationFrame(window.frame);
const ctx = getDrawContext(); const ctx = getDrawContext();
const { clientWidth: ww, clientHeight: wh } = ctx.canvas; const { clientWidth: ww, clientHeight: wh } = ctx.canvas;
let smearPart = smear === 0 ? '99' : Number((1 - smear) * 100).toFixed(0);
smearPart = smearPart.length === 1 ? `0${smearPart}` : smearPart;
clearColor = `#200010${smearPart}`;
const render = (t) => { const render = (t) => {
let frame; let frame;
if (syncAnimationWithScheduler) { if (sync) {
t = scheduler.now(); t = scheduler.now();
frame = this.queryArc(t, t); frame = this.queryArc(t, t);
} else { } else {
@ -21,13 +22,7 @@ Pattern.prototype.animate = function (callback) {
ctx.fillStyle = clearColor; ctx.fillStyle = clearColor;
ctx.fillRect(0, 0, ww, wh); ctx.fillRect(0, 0, ww, wh);
frame.forEach((f) => { frame.forEach((f) => {
let { x, y, w, h, s, r, a = 0, fill = 'darkseagreen', smear } = f.value; let { x, y, w, h, s, r, a = 0, fill = 'darkseagreen' } = f.value;
if (smear && smear !== currentSmear) {
currentSmear = smear;
let smearPart = Number((1 - smear) * 100).toFixed(0);
smearPart = smearPart.length === 1 ? `0${smearPart}` : smearPart;
clearColor = `#200010${smearPart}`;
}
w *= ww; w *= ww;
h *= wh; h *= wh;
if (r !== undefined && a !== undefined) { if (r !== undefined && a !== undefined) {