more
This commit is contained in:
parent
1e53c846e4
commit
6a3ce850c5
47
package-lock.json
generated
47
package-lock.json
generated
@ -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",
|
||||
|
10
package.json
10
package.json
@ -8,14 +8,14 @@
|
||||
"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
35
script.md
@ -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?
|
||||
|
@ -4,7 +4,7 @@
|
||||
"background": "rgb(30,30,46)",
|
||||
"range": [
|
||||
0,
|
||||
null
|
||||
33.18333233333333
|
||||
],
|
||||
"size": {
|
||||
"x": 1920,
|
||||
|
55
src/scenes/doctor.tsx
Normal file
55
src/scenes/doctor.tsx
Normal 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
156
src/scenes/first_box.tsx
Normal 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");
|
||||
});
|
@ -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);
|
||||
|
@ -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,
|
||||
];
|
||||
|
@ -1,3 +0,0 @@
|
||||
{
|
||||
"version": 0
|
||||
}
|
@ -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>
|
||||
|
@ -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
|
||||
|
@ -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");
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user