import { Main } from "./common.tsx";
import { Html, debug_render, render } from "./html.ts";
import { Component } from "./jsx/jsx-runtime.ts";
const peopleify = (...people: string[]): string[] =>
people.map(p => `${p} people`);
const animation_length = (num_items: number): number => /*num_items / 5*/ 3;
const wheel_style = (num_items: number): string =>
`transform: translateY(calc(2rem * -${num_items})); animation: ${animation_length(
num_items
)}s ease-in-out reverse none running spin;`;
const get_delays = (...lengths: number[]): number[] => {
let out = [0];
for (const l of lengths) {
out.push((out.at(-1) ?? 0) + animation_length(l));
}
return out;
};
const Wheel: Component = ({ items }, _) => (
{...items.map((i: string) => {i}
)}
{/*
*/}
{...items.map((item: string, i: number) => (
{item}
))}
);
// i'll probably just hardcode the delays... lame but w/e
// nope
// it would be possible to have it so the final text is actually properyly selectable maybe but eh
const Take: Component = ({ subjects, objects, adjectives }, _) => (
);
const Checkmark: Component = () => (
);
const Author: Component = () => (
traitor joe
@phoebe_bridgers
);
const Info: Component = () => (
10:02 PM ·{" "}
Feb 20, 2021 ·{" "}
Twitter for iPhone
);
const Stats: Component = () => (
39.3K Likes
);
// might want to have the final item be seperate
// turned out to be unnecessary
debug_render(
);