From 0c476e92e1807928ffb30864126076ef4c6a0821 Mon Sep 17 00:00:00 2001 From: Elizabeth Hunt Date: Tue, 13 Feb 2024 20:00:02 -0700 Subject: add all the stuff --- src/scenes/impostor.tsx | 134 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 134 insertions(+) create mode 100644 src/scenes/impostor.tsx (limited to 'src/scenes/impostor.tsx') diff --git a/src/scenes/impostor.tsx b/src/scenes/impostor.tsx new file mode 100644 index 0000000..830178a --- /dev/null +++ b/src/scenes/impostor.tsx @@ -0,0 +1,134 @@ +import { Img, Layout, makeScene2D } from "@motion-canvas/2d"; +import { + Direction, + beginSlide, + createRef, + slideTransition, + all, +} from "@motion-canvas/core"; +import { + CodeBlock, + edit, + insert, + lines, +} from "@motion-canvas/2d/lib/components/CodeBlock"; +import amogusSus from "../../public/amogus.png"; + +const cardBuilder = `const buildCards = ( + people: PersonI[], + cardGenerator: (person: PersonI) => CardI, +): CardI[] => { + const cards: CardI[] = []; + + for (const person of people) { + const card = cardGenerator(person); + cards.push(card); + } + + return cards; +};`; + +export default makeScene2D(function* (view) { + const layout = createRef(); + + const buildCards = createRef(); + const amogus = createRef(); + + view.add( + + + + , + ); + + yield* slideTransition(Direction.Right); + yield* beginSlide("show buildCards"); + + yield* buildCards().selection([...lines(6), ...lines(8)], 0.75); + yield* all( + amogus().width(300, 0.5), + amogus().height(400, 0.5), + + amogus().opacity(1, 0.5), + layout().gap(100, 0.5), + ); + + yield* beginSlide("show side effects"); + + yield* all( + buildCards().edit(1.2)`const buildCards = ( + people: PersonI[], + cardGenerator: (person: PersonI) => CardI, +): CardI[] => {${insert(` + if (people.length === 0) { + return []; + } +`)} + const cards: CardI[] = []; + + for (const person of people) { + const card = cardGenerator(person); + cards.push(card); + } + + return cards; +};`, + amogus().width(0, 0.3), + amogus().height(0, 0.3), + + layout().gap(0, 0.3), + ); + yield* beginSlide("base case"); + + yield* buildCards().edit(1.2)`const buildCards = ( + people: PersonI[], + cardGenerator: (person: PersonI) => CardI, +): CardI[] => { + if (people.length === 0) { + return []; + } + + ${edit( + "const cards: CardI[] = [];", + `const person = people[0]; + const card = cardGenerator(person);`, + )} + + for (const person of people) { + const card = cardGenerator(person); + cards.push(card); + } + + return cards; +};`; + yield* beginSlide("first card"); + + yield* buildCards().edit(1.2)`const buildCards = ( + people: PersonI[], + cardGenerator: (person: PersonI) => CardI, +): CardI[] => { + if (people.length === 0) { + return []; + } + + const person = people[0]; + const card = cardGenerator(person); + + ${edit( + `for (const person of people) { + const card = cardGenerator(person); + cards.push(card); + }`, + `const restPeople = people.slice(1); + const cards = [card].concat(buildCards(restPeople, cardGenerator));`, + )} + + return cards; +};`; + yield* beginSlide("recursion"); +}); -- cgit v1.2.3-70-g09d2