1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
|
import { Video, Layout, makeScene2D } from "@motion-canvas/2d";
import {
Direction,
all,
beginSlide,
createRef,
slideTransition,
} from "@motion-canvas/core";
import { PEOPLE, Person, PersonI } from "../components/person";
import { birthdayCardFn, valentineCardFn } from "./generalized";
import { CardI } from "./birthday_letters";
import { FunctionBox } from "../components/function_box";
import curry from "../../public/img/curry.mp4";
export const cardGeneratorsFor = (
person: PersonI,
): ((type: string) => () => CardI) => {
const birthdayCardGenerator = () => birthdayCardFn(person);
const valentineCardGenerator = () => valentineCardFn(person);
const messageType = (type: string) => {
switch (type) {
case "valentine":
return valentineCardGenerator;
case "birthday":
return birthdayCardGenerator;
}
throw new Error(type + " not implemented");
};
return messageType;
};
export const cardGeneratorsForSource = `const cardGeneratorsFor = (person: PersonI): ((type: string) => () => CardI) => {
const birthdayCardGenerator = () => birthdayCardFn(person);
const valentineCardGenerator = () => valentineCardFn(person);
const generatorForType = (type: string) => {
switch (type) {
case "valentine":
return valentineCardGenerator;
case "birthday":
return birthdayCardGenerator;
}
throw new Error(type + " not implemented");
};
return generatorForType;
};`;
export default makeScene2D(function* (view) {
const box = createRef<FunctionBox>();
const vid = createRef<Video>();
view.add(
<Layout>
<FunctionBox
ref={box}
fn={cardGeneratorsFor}
source={cardGeneratorsForSource}
outputFontSize={20}
/>
<Video ref={vid} src={curry} width={0} />
</Layout>,
);
yield* all(
box().reset(0.1),
box().showCode(0.5),
slideTransition(Direction.Left, 0.5),
);
yield* beginSlide("show code");
const [alan] = PEOPLE;
yield* box().setInputs([{ val: alan, node: <Person person={alan} /> }], 0.5);
yield* beginSlide("show inputs");
yield* box().hideCode(0.5);
yield* box().propogateInput(0.5);
yield* box().propogateOutput(0.5);
yield* beginSlide("create child function");
const child = box().getChild();
yield* child().showCode(0.5);
yield* beginSlide("show child function");
yield* child().hideCode(0.5);
yield* child().setInputs([{ val: "valentine" }], 0.5);
yield* child().propogateInput(0.5);
yield* child().propogateOutput(0.5);
const curriedChild = child().getChild();
yield* curriedChild().showCode(0.5);
yield* beginSlide("propogate child function");
yield* curriedChild().hideCode(0.5);
yield* curriedChild().setInputs([{ val: "" }], 0.5);
yield* curriedChild().propogateInput(0.5);
yield* curriedChild().propogateOutput(0.5);
yield* beginSlide("propogate curry");
yield vid().play();
yield vid().loop(true);
yield* vid().width(400, 2);
yield* beginSlide("do i smell curry");
});
|