simponic/compiling-the-lambda-calculus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

more

Browse Source
This commit is contained in:
Elizabeth Hunt 2024-02-07 11:06:03 -07:00
parent 1e53c846e4
commit 6a3ce850c5
Signed by: simponic
GPG Key ID: 52B3774857EB24B1
12 changed files with 285 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
package-lock.json generated
View File

@ -8,13 +8,13 @@
"name": "compilinglambda",
"version": "0.0.0",
"dependencies": {
"@motion-canvas/2d": "^3.13.0",
"@motion-canvas/core": "^3.13.0",
"@motion-canvas/2d": "^3.14.0",
"@motion-canvas/core": "^3.14.0",
"@motion-canvas/ffmpeg": "^1.1.0"
},
"devDependencies": {
"@motion-canvas/ui": "^3.13.0",
"@motion-canvas/vite-plugin": "^3.13.0",
"@motion-canvas/ui": "^3.14.0",
"@motion-canvas/vite-plugin": "^3.14.0",
"typescript": "^5.2.2",
"vite": "^4.0.0"
}
@ -587,20 +587,20 @@
]
},
"node_modules/@motion-canvas/2d": {
"version": "3.13.0",
"resolved": "https://registry.npmjs.org/@motion-canvas/2d/-/2d-3.13.0.tgz",
"integrity": "sha512-FrQumHi7wTsik27rHvQ9ZO8Uq4lmcMurEwGPkoCAb+cp+K4gLUhczLvrkXb14fCJ2Ie4QxClnGVfs7hYD4MGDw==",
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/@motion-canvas/2d/-/2d-3.14.1.tgz",
"integrity": "sha512-9bwpp/3bbaXycK4yGY2pD1qyZuHmVcf+cgMAhw9Xu/QSMbElh68u5bguN6AXLpaRxAWWLu9lGtf6Pws7tRgv4g==",
"dependencies": {
"@motion-canvas/core": "^3.13.0",
"@motion-canvas/core": "^3.14.1",
"code-fns": "^0.8.2",
"mathjax-full": "^3.2.2",
"parse-svg-path": "^0.1.2"
}
},
"node_modules/@motion-canvas/core": {
"version": "3.13.0",
"resolved": "https://registry.npmjs.org/@motion-canvas/core/-/core-3.13.0.tgz",
"integrity": "sha512-W1mkJQs2XW4pDB1DkG9ptPv4EjrpQcYSRUdJW1wLT1UDqVcDtPrlCx3w2MM5cJmNZGl1DdJn9K5Uw12iri6jBA==",
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/@motion-canvas/core/-/core-3.14.1.tgz",
"integrity": "sha512-1rEys/mOa1WwUttAeHOQwDoLDcVNsFhNIO6YDVTzEGWYMGhHavEsVWdWD8YaDRbBkcHwd1uLKtIahyjERzBnjw==",
"dependencies": {
"@types/chroma-js": "^2.1.4",
"chroma-js": "^2.4.2"
@ -622,24 +622,25 @@
}
},
"node_modules/@motion-canvas/ui": {
"version": "3.13.0",
"resolved": "https://registry.npmjs.org/@motion-canvas/ui/-/ui-3.13.0.tgz",
"integrity": "sha512-ARZzuJELaYrpgs3InhcwU67ZxaWnX0OCLx4U2RMxjNWCo1yxBZ9B4ZGN8Ei2BGdUxLCVa9Rs3A+nTX7FbjLGtA==",
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/@motion-canvas/ui/-/ui-3.14.1.tgz",
"integrity": "sha512-6HLqzDnLUVyURGVl8hFvq6AOirlxz0ROnQlEgBiryRmdmJ/eSrZ3nVpxVCP2fp8AJ2f2KwHBNtwXyLv+xq1Uyw==",
"dev": true,
"dependencies": {
"@motion-canvas/core": "^3.13.0",
"@motion-canvas/core": "^3.14.1",
"@preact/signals": "^1.2.1",
"preact": "^10.19.2"
}
},
"node_modules/@motion-canvas/vite-plugin": {
"version": "3.13.0",
"resolved": "https://registry.npmjs.org/@motion-canvas/vite-plugin/-/vite-plugin-3.13.0.tgz",
"integrity": "sha512-f/yfoeBsb5XmD4Ny0SMHAz9aycyvXVR48Lbj15iVllXRCgtbKjSfbTgeAp8zf2S6qSu/BnuhUrVuZ55QhVjtnQ==",
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/@motion-canvas/vite-plugin/-/vite-plugin-3.14.1.tgz",
"integrity": "sha512-INkDrLmGRLwXlVrHSo7LMbORimYkxlE2DnBnuRdkHF6JeTxeUU+KtHTSW+vTg55cwEz2UykIIW2Tc0KicOU11Q==",
"dependencies": {
"fast-glob": "^3.3.1",
"follow-redirects": "^1.15.2",
"mime-types": "^2.1.35"
"mime-types": "^2.1.35",
"source-map": "^0.6.1"
},
"peerDependencies": {
"vite": "4.x || 5.x"
@ -1147,6 +1148,14 @@
"queue-microtask": "^1.2.2"
}
},
"node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/source-map-js": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",

8
package.json
View File

@ -8,13 +8,13 @@
"build": "tsc && vite build"
},
"dependencies": {
"@motion-canvas/core": "^3.13.0",
"@motion-canvas/2d": "^3.13.0",
"@motion-canvas/core": "^3.14.0",
"@motion-canvas/2d": "^3.14.0",
"@motion-canvas/ffmpeg": "^1.1.0"
},
"devDependencies": {
"@motion-canvas/ui": "^3.13.0",
"@motion-canvas/vite-plugin": "^3.13.0",
"@motion-canvas/ui": "^3.14.0",
"@motion-canvas/vite-plugin": "^3.14.0",
"typescript": "^5.2.2",
"vite": "^4.0.0"
}

35
script.md
View File

@ -3,10 +3,13 @@ About Me
"For the new faces, I'm Elizabeth, or simponic on the discord..."
- I'm 20 years old, graduating this semester once I'm done with my final general class I missed on my grad plan (2credits only, ugh)
- I've been enjoying programs functionally for over 3 years; in LISP and Elixir mostly
- I love functional programming; I've been enjoying programs functionally for over 3 years; in LISP and Elixir mostly
- Soon to be SDE at AWS
- I'm 20 years old, graduating this semester once I'm done with my final general class I missed on my grad plan (2credits only, ugh, ask me after if you want to hear the bureacracy)
- I was president of the USU Linux club from 2021 - 2024
Of course this presentation is open source at the link you see on the board.
Part One
===
@ -20,33 +23,29 @@ Tomorrow's Valentine's day, but you realize; you don't have a Valentine!
Desparate to make yourself feel better, you turn to your computer and open Emacs, querying "m-x doctor".
```
I am the psychotherapist. Please, describe your problems. Each time
you are finished talking, type RET twice.
I am the psychotherapist. Please, describe your problems. Each time you are finished talking, type RET twice.
> i need a valentine
Why do you say you might want to have this valentine?
> im lonely
Are you lonely often?
> sometimes
Can you elaborate on that?
> i need someone or something i can trust
What makes you believe you need someone or something you can trust?
> i want something that when i ask one question i'll get the
> same answer no matter what.
> i want something that when i ask one question i'll get the same answer no matter what.
Is it because when you ask one question you will get the same answer no matter what that you came to me?
> yes
I see... Well, are you sure that this is so?
> yes
Yes, hmmm... so, do you really think this is so?
> yes
```
What could exist out there that provides this? Let's put a pin in that; it looks like we have a black box here that
came out of nowhere. What does it do?
well that's not super helpful
When we feed it a one and press a button, it returns one. When we feed it a two, it returns one. A three, two. A four, three. And so forth.
It looks like we have a black box here that came out of nowhere. What does it do?
When we feed it a one and put it at this arrow, it returns one. When we feed it a two, it returns one. A three, two. A four, three. And so forth.
No matter how many times we put a number in it gives me the same answer; we're all in love with it already.
So we're ready to start getting to know this so called "function". Where could our curiosity take us?

2
src/project.meta
View File

@ -4,7 +4,7 @@
"background": "rgb(30,30,46)",
"range": [
0,
null
33.18333233333333
],
"size": {
"x": 1920,

55
src/scenes/doctor.tsx Normal file
View File

@ -0,0 +1,55 @@
import { Txt, makeScene2D } from "@motion-canvas/2d";
import {
Direction,
beginSlide,
createRef,
slideTransition,
waitFor,
} from "@motion-canvas/core";
import { CodeBlock, insert } from "@motion-canvas/2d/lib/components/CodeBlock";
import { theme } from "../theme";
const conversation = `
I am the psychotherapist. Please, describe your problems. Each time you are finished talking, type RET twice.
> i need a valentine
Why do you say you might want to have this valentine?
> im lonely
Are you lonely often?
> sometimes
Can you elaborate on that?
> i need someone or something i can trust
What makes you believe you need someone or something you can trust?
> i want something that when i ask one question i'll get the same answer no matter what.
Is it because when you ask one question you will get the same answerno matter what that you came to me?
> yes
I see... Well, are you sure that this is so?
> yes
Yes, hmmm... so, do you really think this is so?
> yes`
.split("\n")
.filter((x) => x.trim());
export default makeScene2D(function* (view) {
const block = createRef<CodeBlock>();
yield view.add(
<CodeBlock
fontFamily={theme.font}
language="markdown"
ref={block}
fontSize={20}
></CodeBlock>,
);
yield* slideTransition(Direction.Right);
let currentConversation = conversation[0] + "\n";
let id = 0;
for (const line of conversation.slice(1)) {
yield* block().edit(1.2, false)`${currentConversation}${insert(
"\n" + line + "\n",
)}`;
currentConversation += "\n" + line + "\n";
yield* beginSlide(line.split(" ").slice(0, 3).join(" ") + id.toString());
}
});

156
src/scenes/first_box.tsx Normal file
View File

@ -0,0 +1,156 @@
import {
Img,
Rect,
Node,
Video,
makeScene2D,
Txt,
Line,
LineSegment,
} from "@motion-canvas/2d";
import {
Direction,
beginSlide,
createRef,
map,
slideTransition,
tween,
all,
waitFor,
} from "@motion-canvas/core";
import { CodeBlock } from "@motion-canvas/2d/lib/components/CodeBlock";
import { theme } from "../theme";
const fibonacciFn = (n: number): number => {
if (n <= 2) {
return 1;
}
return fibonacciFn(n - 1) + fibonacciFn(n - 2);
};
const fibonacci = `
const fibonacci = (n: number): number => {
if (n <= 2) {
return 1;
}
return fibonacci(n - 1) + fibonacci(n - 2);
};
`
.split("\n")
.filter((x) => x.trim())
.join("\n");
export default makeScene2D(function* (view) {
const block = createRef<CodeBlock>();
const node = createRef<Node>();
const rect = createRef<Rect>();
const boxMoji = createRef<Txt>();
const inSegment = createRef<Line>();
const outSegment = createRef<Line>();
const input = createRef<Txt>();
const output = createRef<Txt>();
yield* view.add(
<>
<Rect
ref={rect}
radius={4}
stroke={theme.overlay0.hex}
fill={theme.crust.hex}
lineWidth={4}
padding={60}
layout
>
<Node ref={node} opacity={0}>
<CodeBlock
fontFamily={theme.font}
language="typescript"
ref={block}
fontSize={1}
code={fibonacci}
></CodeBlock>
</Node>
</Rect>
<Txt fontFamily={theme.font} fill={theme.text.hex} ref={boxMoji}>
😴
</Txt>
<Line
points={[]}
ref={inSegment}
stroke={theme.green.hex}
lineWidth={8}
radius={40}
endArrow
></Line>
<Line
points={[]}
ref={outSegment}
stroke={theme.red.hex}
lineWidth={8}
radius={40}
endArrow
></Line>
<Txt
opacity={0}
fontFamily={theme.font}
fill={theme.text.hex}
ref={input}
></Txt>
<Txt
opacity={0}
fontFamily={theme.font}
fill={theme.text.hex}
ref={output}
></Txt>
</>,
);
yield boxMoji().position(rect().middle());
yield* slideTransition(Direction.Left);
yield* beginSlide("Black Box");
const padding = 100;
const left = rect().left();
const right = rect().right();
yield* all(
inSegment().points([left.addX(-padding), left], 0.5),
outSegment().points([right, right.addX(padding)], 0.5),
);
yield input().position(left.addX(-padding));
yield output().position(right);
for (const i of [1, 2, 3]) {
yield* all(
input().opacity(1, 0.5),
input().text(i.toString(), 0.5),
input().position(left.addX(-padding - 20), 0.5),
);
yield* beginSlide("Input " + i);
yield* input().position(left, 0.5);
yield* all(input().opacity(0, 0.2), boxMoji().text("👷‍♀️⚙️", 0.2));
yield* waitFor(0.5);
const result = fibonacciFn(i);
yield* all(
output().opacity(1, 0.5),
output().text(result.toString(), 0.5),
output().position(right, 0.5),
);
yield* all(boxMoji().text("😴", 0.2));
yield* beginSlide("Output " + i);
}
yield* all(
boxMoji().opacity(0, 0.2),
block().fontSize(30, 1),
node().opacity(1, 1),
);
yield* beginSlide("Revealing");
});

16
src/scenes/flirtingwithfunctions.tsx
View File

@ -1,13 +1,5 @@
import { Img, Layout, Txt, Video, makeScene2D } from "@motion-canvas/2d";
import {
Direction,
beginSlide,
createRef,
map,
slideTransition,
tween,
} from "@motion-canvas/core";
import { theme } from "../theme";
import { Img, Video, makeScene2D } from "@motion-canvas/2d";
import { beginSlide, createRef, map, tween } from "@motion-canvas/core";
import sad from "../../public/img/sad.mp4";
import emacsmac from "../../public/img/emacsmac.jpg";
@ -17,8 +9,8 @@ export default makeScene2D(function* (view) {
const startX = 1200;
const endX = 300;
view.add(<Video width={300} ref={vid} src={sad} x={0} />);
view.add(<Img width={200} ref={img} src={emacsmac} x={startX} />);
yield view.add(<Video width={300} ref={vid} src={sad} x={0} />);
yield view.add(<Img width={200} ref={img} src={emacsmac} x={startX} />);
yield vid().play();
yield vid().loop(true);

11
src/scenes/index.ts
View File

@ -2,5 +2,14 @@ import title from "./title?scene";
import me from "./me?scene";
import partone from "./partone?scene";
import flirtingwithfunctions from "./flirtingwithfunctions?scene";
import doctor from "./doctor";
import first_box from "./first_box";
export const scenes = [title, me, partone, flirtingwithfunctions];
export const scenes = [
title,
me,
partone,
flirtingwithfunctions,
doctor,
first_box,
];

3
src/scenes/itinerary.meta
View File

@ -1,3 +0,0 @@
{
"version": 0
}

24
src/scenes/me.tsx
View File

@ -1,11 +1,5 @@
import { Node, Img, Txt, Layout, makeScene2D } from "@motion-canvas/2d";
import {
beginSlide,
createRef,
waitFor,
all,
fadeTransition,
} from "@motion-canvas/core";
import { beginSlide, createRef, all } from "@motion-canvas/core";
import me from "../../public/img/me.jpg";
import { theme } from "../theme";
@ -16,7 +10,7 @@ export default makeScene2D(function* (view) {
const layout = createRef<Layout>();
const src = createRef<Txt>();
view.add(
yield view.add(
<>
<Layout
layout
@ -28,27 +22,21 @@ export default makeScene2D(function* (view) {
y={-10}
>
<Node ref={node} opacity={0}>
<Txt fontFamily={theme.font} fill={theme.text.hex}>
Hello!
</Txt>
<Txt fontFamily={theme.font} fill={theme.text.hex}>
My name is Elizabeth{" "}
<Txt fontFamily={theme.font} fill={theme.teal.hex}>
(@simponic)
</Txt>
.
</Txt>
<Txt fontFamily={theme.font} fill={theme.text.hex}>
{"=>"} I {"<3"} Functional Programming λ.
{"=>"} I {"<3"} Functional Programming λ
</Txt>
<Txt fontFamily={theme.font} fill={theme.text.hex}>
{"=>"} I've been a student networking{"\n"}software engineer here at
USU
{"\n"}
for over 1.5 years.
{"=>"} I'm a soon to be SDE at {"\n"} AWS in Seattle.
</Txt>
<Txt fontFamily={theme.font} fill={theme.text.hex}>
{"=>"} I'm an SDE at AWS starting{"\n"}soon in Seattle.
{"=>"} 20, president of FSLC from {"\n "} 2021 - 2024, grad this
semester
</Txt>
</Node>
</Layout>

2
src/scenes/partone.tsx
View File

@ -3,7 +3,7 @@ import { Direction, beginSlide, slideTransition } from "@motion-canvas/core";
import { theme } from "../theme";
export default makeScene2D(function* (view) {
view.add(
yield view.add(
<Layout layout direction="column" alignItems="center">
<Txt fontFamily={theme.font} fontSize={100} fill={theme.text.hex}>
Part One

4
src/scenes/title.tsx
View File

@ -5,7 +5,7 @@ import { theme } from "../theme";
import xkcd from "../../public/img/xkcd.png";
export default makeScene2D(function* (view) {
yield view.add(
view.add(
<>
<Layout
layout
@ -30,7 +30,7 @@ export default makeScene2D(function* (view) {
#2453
</Txt>
</Layout>
</>
</>,
);
yield* beginSlide("Title");
});