perelman/contra-renderer
1
0
Fork 1
Code Issues 5 Pull Requests Activity

Compare commits

base: perelman:edd25ba7d126bd646f95620b7f24df1f8c90e946
Branches Tags
perelman:main
perelman:feature/variants
perelman:exp/dancer-colors
perelman:exp/perf/cache-strings
...
compare: perelman:5bb8bfe747306849af021248a5fe0ba2c32b40df
Branches Tags
perelman:feature/variants
perelman:main
perelman:exp/dancer-colors
perelman:exp/perf/cache-strings

2 Commits
edd25ba7d1 ... 5bb8bfe747

Author SHA1 Message Date
Daniel Perelman
5bb8bfe747 Only normalize positions if actually necessary. 2023-08-27 17:58:01 -07:00
Daniel Perelman
fa1f499388 UI for loading dances. 2023-08-27 17:48:23 -07:00
3 changed files with 103 additions and 54 deletions
Show Stats Expand all files Collapse all files

16
www/js/interpreter.ts
View File

@ -565,7 +565,17 @@ function danceAsLowLevelMoves(moves: Move[], startingPos: Map<DancerIdentity, Se
}
export const mappedDance = exampleDance.map(nameLibFigureParameters);
export let mappedDance: Move[];
export const interpretedDance = danceAsLowLevelMoves(mappedDance, handsFourImproper);
export const interpretedAnimation: animation.Animation = animateFromLowLevelMoves(interpretedDance);
export let interpretedDance: Map<DancerIdentity, LowLevelMove[]>;
export let interpretedAnimation: animation.Animation;
export function loadDance(dance: LibFigureDance): animation.Animation {
mappedDance = dance.map(nameLibFigureParameters);
interpretedDance = danceAsLowLevelMoves(mappedDance, handsFourImproper);
interpretedAnimation = animateFromLowLevelMoves(interpretedDance);
return interpretedAnimation;
}
loadDance(exampleDance);

16
www/js/lowLevelMove.ts
View File

@ -491,11 +491,17 @@ export function animateLowLevelMove(move: LowLevelMove): animation.AnimationSegm
throw "Unsupported move in animateLowLevelMove: " + JSON.stringify(move);
}
return [
animation.LinearAnimationSegment.standStill(startSetPosition),
...handleMove(),
animation.LinearAnimationSegment.standStill(endSetPosition),
];
const anim: animation.AnimationSegment[] = handleMove();
// Normalize start/end positions if necessary.
if (JSON.stringify(anim[0].startPosition) != JSON.stringify(startSetPosition)) {
anim.unshift(animation.LinearAnimationSegment.standStill(startSetPosition))
}
if (JSON.stringify(anim[anim.length - 1].endPosition) != JSON.stringify(endSetPosition)) {
anim.push(animation.LinearAnimationSegment.standStill(endSetPosition))
}
return anim;
}
export function animateFromLowLevelMoves(moves: Map<DancerIdentity, LowLevelMove[]>): animation.Animation {

125
www/js/main.ts
View File

@ -2,7 +2,7 @@ import * as animation from "./animation.js";
import * as interpreter from "./interpreter.js";
import * as renderer from "./renderer.js";
import { DancerIdentity } from "./danceCommon.js";
import { Move } from "./libfigureMapper.js";
import { LibFigureDance, Move } from "./libfigureMapper.js";
import { animateLowLevelMove, LowLevelMove } from "./lowLevelMove.js";
const body = document.querySelector('body')!;
@ -139,6 +139,32 @@ function playAnimation(bpm: number, start: number, end: number) {
anim();
}
// Two Hearts in Time by Isaac Banner. Selected arbitrarily.
const exampleDance: LibFigureDance = [{ "parameter_values": [true, 8], "move": "petronella" }, { "parameter_values": [true, 8], "move": "petronella" }, { "parameter_values": ["neighbors", "balance", 16], "move": "swing" }, { "parameter_values": ["ladles", true, 540, 8], "move": "allemande" }, { "parameter_values": ["partners", "none", 8], "move": "swing" }, { "parameter_values": ["gentlespoons", 360, 6], "move": "mad robin" }, { "parameter_values": [true, 270, 6], "move": "circle" }, { "parameter_values": ["partners", 4], "move": "California twirl", "progression": 1 }];
const danceJsonArea = document.createElement('textarea');
danceJsonArea.value = JSON.stringify(exampleDance, undefined, 2);
danceJsonArea.rows = 15;
danceJsonArea.cols = 30;
const loadDanceButton = document.createElement('button');
loadDanceButton.innerText = 'Load Dance';
wrapperDiv.appendChild(document.createElement('br'));
wrapperDiv.appendChild(danceJsonArea);
wrapperDiv.appendChild(loadDanceButton);
loadDanceButton.addEventListener('click', (ev) => {
const dance: LibFigureDance = JSON.parse(danceJsonArea.value);
r.animation = interpreter.loadDance(dance);
if (cancelAnim !== undefined) {
cancelAnimationFrame(cancelAnim);
playButton.innerText = 'Play';
}
beatSlider.value = '0';
beatDisplay.innerText = '0';
r.drawSetsWithTrails(0);
buildDebugTable();
});
function createJsonCell(content: any, rowSpan?: number, id?: DancerIdentity) {
const cell = document.createElement('td');
const pre = document.createElement('pre');
@ -195,61 +221,68 @@ body.appendChild(showDebugLabel);
const table = document.createElement('table');
table.id = 'debug'
const headerRow = document.createElement('tr');
const roles = [DancerIdentity.OnesLark, DancerIdentity.OnesRobin,
DancerIdentity.TwosLark, DancerIdentity.TwosRobin];
headerRow.appendChild(createHeaderCell("Move"));
for (const role of roles) {
headerRow.appendChild(createHeaderCell(role.toString(), role));
}
table.appendChild(headerRow);
function buildDebugTable() {
while (table.childNodes.length > 0) {
table.removeChild(table.childNodes[table.childNodes.length - 1]);
}
const byMove: { move: Move, byRole: Map<DancerIdentity, { lowLevelMove?: LowLevelMove, animationSegment: animation.AnimationSegment, numSegments?: number }[]> }[] = [];
for (const [role, moveList] of interpreter.interpretedDance.entries()) {
for (const move of moveList) {
let entry = byMove.find(el => el.move === move.move);
if (!entry) {
entry = { move: move.move, byRole: new Map<DancerIdentity, { lowLevelMove?: LowLevelMove, animationSegment: animation.AnimationSegment, numSegments?: number }[]>() };
byMove.push(entry);
}
let forRole = entry.byRole.get(role);
if (!forRole) {
forRole = [];
entry.byRole.set(role, forRole);
}
const animation = animateLowLevelMove(move);
let first = true;
for (const animationSegment of animation) {
if (first) {
forRole.push({ lowLevelMove: move, animationSegment, numSegments: animation.length });
first = false;
} else {
forRole.push({ animationSegment });
const headerRow = document.createElement('tr');
const roles = [DancerIdentity.OnesLark, DancerIdentity.OnesRobin,
DancerIdentity.TwosLark, DancerIdentity.TwosRobin];
headerRow.appendChild(createHeaderCell("Move"));
for (const role of roles) {
headerRow.appendChild(createHeaderCell(role.toString(), role));
}
table.appendChild(headerRow);
const byMove: { move: Move, byRole: Map<DancerIdentity, { lowLevelMove?: LowLevelMove, animationSegment: animation.AnimationSegment, numSegments?: number }[]> }[] = [];
for (const [role, moveList] of interpreter.interpretedDance.entries()) {
for (const move of moveList) {
let entry = byMove.find(el => el.move === move.move);
if (!entry) {
entry = { move: move.move, byRole: new Map<DancerIdentity, { lowLevelMove?: LowLevelMove, animationSegment: animation.AnimationSegment, numSegments?: number }[]>() };
byMove.push(entry);
}
let forRole = entry.byRole.get(role);
if (!forRole) {
forRole = [];
entry.byRole.set(role, forRole);
}
const animation = animateLowLevelMove(move);
let first = true;
for (const animationSegment of animation) {
if (first) {
forRole.push({ lowLevelMove: move, animationSegment, numSegments: animation.length });
first = false;
} else {
forRole.push({ animationSegment });
}
}
}
}
}
for (const infoForMove of byMove) {
const moveRow = document.createElement('tr');
const numRows = Math.max(...[...infoForMove.byRole.values()].map(l => l.length));
moveRow.appendChild(createJsonCell(infoForMove.move, numRows));
for (const infoForMove of byMove) {
const moveRow = document.createElement('tr');
const numRows = Math.max(...[...infoForMove.byRole.values()].map(l => l.length));
moveRow.appendChild(createJsonCell(infoForMove.move, numRows));
for (let i = 0; i < numRows; i++) {
const row = i == 0 ? moveRow : document.createElement('tr');
for (let i = 0; i < numRows; i++) {
const row = i == 0 ? moveRow : document.createElement('tr');
for (const role of roles) {
const lowLevelMove = infoForMove.byRole.get(role)?.at(i);
if (!lowLevelMove) {
row.appendChild(createJsonCell(undefined, undefined, role));
} else if (lowLevelMove.lowLevelMove) {
row.appendChild(createJsonCell(lowLevelMove.lowLevelMove, lowLevelMove.numSegments, role));
for (const role of roles) {
const lowLevelMove = infoForMove.byRole.get(role)?.at(i);
if (!lowLevelMove) {
row.appendChild(createJsonCell(undefined, undefined, role));
} else if (lowLevelMove.lowLevelMove) {
row.appendChild(createJsonCell(lowLevelMove.lowLevelMove, lowLevelMove.numSegments, role));
}
row.appendChild(createJsonCell(lowLevelMove?.animationSegment, undefined, role));
}
row.appendChild(createJsonCell(lowLevelMove?.animationSegment, undefined, role));
}
table.appendChild(row);
table.appendChild(row);
}
}
}
buildDebugTable();
body.appendChild(table);