coq talk with eggbug
This commit is contained in:
parent
f4d9cf8c5e
commit
619818774e
2 changed files with 258 additions and 16 deletions
257
html/coq.tsx
Normal file
257
html/coq.tsx
Normal file
|
|
@ -0,0 +1,257 @@
|
|||
import { reify_dialogue } from "./dialogue.tsx";
|
||||
import { debug_render } from "./html.ts";
|
||||
import { Component } from "./jsx/jsx-runtime.ts";
|
||||
|
||||
const Option: Component = ({ n }, children) => (
|
||||
<>
|
||||
<span
|
||||
class="number"
|
||||
title={`Option #${n} (there's no actual keyboard shortcut, sorry)`}
|
||||
>{`[${n}]`}</span>{" "}
|
||||
{...children}
|
||||
</>
|
||||
);
|
||||
|
||||
const WaterRitual: Component = () => (
|
||||
<span class="water-ritual">
|
||||
[begin water ritual; <span class="one">1</span> dram of{" "}
|
||||
<span class="water">water</span>]
|
||||
</span>
|
||||
);
|
||||
|
||||
const End: Component = () => <span class="end">[End]</span>;
|
||||
|
||||
const Name: Component = ({ color }, children) => (
|
||||
<div style={`color: ${color};`} class="name">
|
||||
{...children}
|
||||
</div>
|
||||
);
|
||||
|
||||
const Speech: Component = (
|
||||
{ name, name_color, portrait = <></> },
|
||||
children
|
||||
) => (
|
||||
<div class="speech">
|
||||
<div class="portrait">{portrait}</div>
|
||||
<Name color={name_color}>{name}</Name>
|
||||
<img
|
||||
src="https://static.pyrope.net/coq-hr.png"
|
||||
alt="a snazzy horizontal rule with three central spikes, taken from caves of qud"
|
||||
/>
|
||||
<div class="text">{...children}</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
const Website: Component = () => <span class="website">website</span>;
|
||||
|
||||
const Eggbug: Component = ({ emotion }, children) => (
|
||||
<Speech
|
||||
name="Eggbug"
|
||||
name_color="#83254F"
|
||||
portrait={
|
||||
<img
|
||||
src={`https://static.pyrope.net/coq-eggbug-sprite${
|
||||
emotion ? `-${emotion}` : ""
|
||||
}.png`}
|
||||
alt={`a pixel-art, caves of qud-style portrait of eggbug${
|
||||
emotion ? ` that looks ${emotion}` : ""
|
||||
}}`}
|
||||
/>
|
||||
}
|
||||
>
|
||||
{...children}
|
||||
</Speech>
|
||||
);
|
||||
|
||||
const dialogue = reify_dialogue([
|
||||
<Eggbug>
|
||||
hi hey hi what whati
|
||||
<br /> what is up
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>I want your stuff</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
oh cool that's neat what stuff like what stuff are you talking
|
||||
about
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>You know, your... stuff.</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
i really don't know how would i know what ur talking
|
||||
about lol
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>
|
||||
Items, trinkets, books. Stuff. You really should
|
||||
know this
|
||||
</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
okay like, okay yeah idon't know still
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>Give</Option>,
|
||||
[
|
||||
<Eggbug>what</Eggbug>,
|
||||
[
|
||||
<Option n={1}>me</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
oh mehbark is like making the
|
||||
player like click through a
|
||||
bunch for comedic effect ok
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>your</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
it's taking them a ton
|
||||
of effort to make this
|
||||
deep tree though lol
|
||||
like they're typing it
|
||||
in and thinking hm maybe
|
||||
i could abstract this a
|
||||
bit but they know that
|
||||
will be more trouble
|
||||
than it's worth
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>
|
||||
stuff.
|
||||
</Option>,
|
||||
<Eggbug>
|
||||
aslo it's 5 in the
|
||||
morning for
|
||||
the— oh it's
|
||||
done
|
||||
<br /> i still have
|
||||
no stuff ok
|
||||
<br />
|
||||
game over i guess
|
||||
(all of these paths
|
||||
lead to game over
|
||||
(except one (this
|
||||
was definitely
|
||||
planned and not
|
||||
decided as this was
|
||||
being written)))
|
||||
</Eggbug>,
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
[
|
||||
<Option n={2}>Where are your wings???</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
That my friend, is a long, sad story. There was a time when
|
||||
people cared to hear it, but I fear that time has passed.
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>
|
||||
Thanks for warning me. That sounds really boring, PASS!
|
||||
</Option>,
|
||||
<Eggbug emotion="angry">
|
||||
you are such a butt you suck your so annoying LEAVE{" "}
|
||||
<a href="https://cohost.org/mehbark/post/1967096-game-over">
|
||||
<span style="color: red;">GAME OVER</span>
|
||||
<span style="color: red;">GAME OVER</span>
|
||||
<span style="color: red;">GAME OVER</span>
|
||||
</a>
|
||||
</Eggbug>,
|
||||
],
|
||||
[
|
||||
<Option n={1}>
|
||||
I would be honored to any tale from an eggbug of your
|
||||
stature, let alone one of such great intrigue.
|
||||
</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
okay, get comfortable, something to eat, something to
|
||||
drink, heck, maybe even rent a{" "}
|
||||
<a href="https://www.webstaurantstore.com/55609/portable-toilets-and-urinals.html">
|
||||
portable bathroom
|
||||
</a>{" "}
|
||||
to keep nearby. this is a LONG story
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>
|
||||
I have done every single one of those things, and I
|
||||
also hired a guy to slap me whenever I'm falling
|
||||
asleep (due to length, not boredom, of course).
|
||||
</Option>,
|
||||
<Eggbug>
|
||||
it was to hard to get the pixelts to work
|
||||
</Eggbug>,
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
],
|
||||
[
|
||||
<Option n={3}>
|
||||
Based on an in-depth analysis of the mehbark, I have found a{" "}
|
||||
<span class="power-word">power word</span> that will GUARANTEE my
|
||||
victory.
|
||||
</Option>,
|
||||
[
|
||||
<Eggbug>
|
||||
heck yes i love <span class="power-word">power word</span>s have
|
||||
at it ( idoubt it will work no offense)
|
||||
</Eggbug>,
|
||||
[
|
||||
<Option n={1}>homestuck</Option>,
|
||||
<span class="win">you win</span>,
|
||||
],
|
||||
],
|
||||
],
|
||||
[
|
||||
<Option n={4}>
|
||||
Your thirst is mine, my water is yours. <WaterRitual />{" "}
|
||||
</Option>,
|
||||
[
|
||||
<div>
|
||||
You don't have any water because this is a <Website />. <br />
|
||||
also eggbug probably uses like eggbug juice or something
|
||||
</div>,
|
||||
[
|
||||
<Option n={1}>Wait, really?</Option>,
|
||||
<Eggbug>
|
||||
how wouldi know lol ask like a cohost maker lol
|
||||
</Eggbug>,
|
||||
],
|
||||
],
|
||||
],
|
||||
[
|
||||
<Option n={5}>
|
||||
Live and drink. <End />
|
||||
</Option>,
|
||||
<Eggbug>
|
||||
uh what
|
||||
<br />
|
||||
ok
|
||||
<br />i guess
|
||||
<br />
|
||||
every dialogue tree eventually ends anyways so this is just like to
|
||||
look more coqqy iguess
|
||||
</Eggbug>,
|
||||
],
|
||||
]);
|
||||
|
||||
debug_render(
|
||||
<div class="main">
|
||||
<div class="gradient">{dialogue}</div>
|
||||
<div class="scanlines"></div>
|
||||
</div>
|
||||
);
|
||||
|
|
@ -8,7 +8,7 @@ function not_empty<T>(arr: T[]): arr is [T, ...T[]] {
|
|||
return arr.length > 0;
|
||||
}
|
||||
|
||||
function reify_dialogue(d: Dialogue): Html {
|
||||
export function reify_dialogue(d: Dialogue): Html {
|
||||
if (!Array.isArray(d)) return d;
|
||||
|
||||
const [r, ...rest] = d;
|
||||
|
|
@ -30,18 +30,3 @@ function reify_dialogue(d: Dialogue): Html {
|
|||
);
|
||||
}
|
||||
}
|
||||
|
||||
const rd = reify_dialogue([
|
||||
"Hi!",
|
||||
["Hello!", "How are you!"],
|
||||
[
|
||||
"Bye",
|
||||
[
|
||||
":(",
|
||||
["Sorry", <span class="blue">:D</span>],
|
||||
["Not sorry", <span class="red">D:</span>],
|
||||
],
|
||||
],
|
||||
]);
|
||||
|
||||
debug_render(rd);
|
||||
|
|
|
|||
Loading…
Reference in a new issue