164 lines
4.6 KiB
TypeScript
164 lines
4.6 KiB
TypeScript
import { ComponentChildren, toChildArray } from "preact";
|
|
import { Main, render_and_copy, shuffle, n_of } from "./common.tsx";
|
|
|
|
const tag_link = (tag: string) => `https://cohost.org/rc/tagged/${tag}`;
|
|
const Tag = ({ tag }: { tag: string }) => (
|
|
<a href={tag_link(tag)}>{`#${tag}`}</a>
|
|
);
|
|
|
|
const tags = [
|
|
"CSS Crimes",
|
|
"borgesposting",
|
|
"NEISVoid",
|
|
"circling the square",
|
|
"retrocomputing",
|
|
"cats of cohost",
|
|
"coho film club",
|
|
"cohost crafts",
|
|
"the cohost plural feed",
|
|
"cohost summer mixtape",
|
|
"trans trucks",
|
|
"The Cohost Local Feed (Minnesota)",
|
|
"cohost draws",
|
|
"tv head",
|
|
"make up a mech pilot",
|
|
"frasierposting",
|
|
"cohost utilities",
|
|
"alt text request",
|
|
"meepismonday",
|
|
"rats",
|
|
"worldwide music wednesday",
|
|
"chaos magick",
|
|
"tea",
|
|
"journaling",
|
|
"digital collage",
|
|
"gamedev",
|
|
"manga recs",
|
|
"doll posting",
|
|
"comics on cohost",
|
|
"he is only carbon now",
|
|
"trickcircle",
|
|
"Cohost Mixtape Club",
|
|
"mashup",
|
|
"girlposting",
|
|
"jewhost",
|
|
"musicians on cohost",
|
|
"ooak",
|
|
"The Cohost Gimmick Feed",
|
|
"gardening",
|
|
"dogs of cohost",
|
|
"cheeseposting",
|
|
"love",
|
|
"little guy respect zone",
|
|
"gunpla",
|
|
];
|
|
|
|
const default_repeat = 2;
|
|
|
|
// repeating makes it seem more random, but adds a lot of weight to an increasingly heavy post
|
|
export const PseudoRandom = ({
|
|
children,
|
|
repeat = default_repeat,
|
|
}: {
|
|
children: ComponentChildren;
|
|
repeat?: number;
|
|
}) => (
|
|
<div
|
|
class="pseudo-random"
|
|
style={{
|
|
display: "flex",
|
|
backgroundColor: "#008282",
|
|
borderRadius: "0.5rem",
|
|
height: "3rem",
|
|
}}
|
|
>
|
|
{...n_of(repeat, toChildArray(children))
|
|
.map(shuffle)
|
|
.flat()
|
|
.map(child => <Choice>{child}</Choice>)}
|
|
</div>
|
|
);
|
|
|
|
/// width is 0-1
|
|
export const Choice = ({ children }: { children: ComponentChildren }) => (
|
|
<details
|
|
style={{
|
|
width: "100%",
|
|
display: "flex",
|
|
flex: 1,
|
|
cursor: "pointer",
|
|
}}
|
|
class="choice"
|
|
>
|
|
<summary
|
|
style={{ listStyle: "none", width: "100%", height: "100%" }}
|
|
></summary>
|
|
<div
|
|
class="result"
|
|
style={{
|
|
position: "absolute",
|
|
top: "1.5rem",
|
|
left: 0,
|
|
right: 0,
|
|
width: "100%",
|
|
height: "fit-content",
|
|
display: "flex",
|
|
alignContent: "center",
|
|
justifyContent: "center",
|
|
verticalAlign: "center",
|
|
color: "white",
|
|
}}
|
|
>
|
|
{children}
|
|
</div>
|
|
</details>
|
|
);
|
|
|
|
render_and_copy(
|
|
<Main>
|
|
<PseudoRandom>{...tags.map(tag => <Tag tag={tag} />)}</PseudoRandom>
|
|
Some notes:
|
|
<ul>
|
|
<li>all tags are from @TagOfTheDay</li>
|
|
<li>i'll do my best to keep this up to date</li>
|
|
<li>
|
|
you can also go{" "}
|
|
<a
|
|
href={`https://pyrope.net/randirect#${tags
|
|
.map(tag_link)
|
|
.join("::")}`}
|
|
>
|
|
here
|
|
</a>{" "}
|
|
to be redirected to a random tag
|
|
</li>
|
|
<ul>
|
|
<li>
|
|
it would be helpful if you could pester me in the comments
|
|
when this tag list is out of date (most recent first): (also
|
|
you can just like. use this tag list)
|
|
</li>
|
|
<ul>
|
|
{...tags.toReversed().map(tag => (
|
|
<li>
|
|
<Tag tag={tag} />
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</ul>
|
|
<li>
|
|
if there's enough interest, i'll hack together a little
|
|
generator for these (it would be easy to make one for tags, but
|
|
one for other stuff would require a bit more work)
|
|
</li>
|
|
<li>
|
|
a lot of these tags are bad tags. not their content, but, like, the actual tag. this drives me up the wall but i know there's nothing i can do. i really wish everyone cared about good tagging as much as i do, but i know that will never happen. it's frustrating that only boorus seem to have good tags (sometimes) (implications and stuff help)
|
|
</li>
|
|
<li>
|
|
this was generated on {new Date().toDateString()} at{" "}
|
|
{new Date().toTimeString()}
|
|
</li>
|
|
</ul>
|
|
</Main>
|
|
);
|