Site should be feature complete. Testimonials page is now working.

This commit is contained in:
Ada Werefox 2024-04-01 18:50:11 -05:00
parent 6d6d3f54d5
commit c8348a4f21
4 changed files with 155 additions and 65 deletions

View File

@ -29,20 +29,20 @@ watch_path = ["src", "public", "tailwind.config.js", "Dioxus.toml", "Cargo.toml"
# implement redirect on 404
index_on_404 = true
# include `assets` in web platform
[web.resource]
# # include `assets` in web platform
# [web.resource]
# CSS style file
style = ["/styles/tailwind.min.css"]
# # CSS style file
# style = ["/styles/tailwind.min.css"]
# Javascript code file
script = []
# # Javascript code file
# script = []
[web.resource.dev]
# [web.resource.dev]
# CSS style file
style = ["/styles/tailwind.min.css"]
# # CSS style file
# style = ["/styles/tailwind.min.css"]
# Javascript code file
# serve: [dev-server] only
script = []
# # Javascript code file
# # serve: [dev-server] only
# script = []

View File

@ -1,3 +1,7 @@
[[accounts]]
username = "@efi@chitter.xyz"
content = "have I mentioned I would smooch this girl?"
[[accounts]]
username = "@shroomie@0w0.is"
content = "dragon woman play metroid good"
@ -27,7 +31,7 @@ username = "@GameDevWitch@tech.lgbt"
content = "You are the best Werefox I have ever met."
[[accounts]]
username = "@astraluma@tech.lgbt"
username = "@astraluma@tacobelllabs.net"
content = "a good derg"
[[accounts]]

View File

@ -600,6 +600,10 @@ video {
order: 2;
}
.m-auto {
margin: auto;
}
.mx-auto {
margin-left: auto;
margin-right: auto;
@ -657,6 +661,10 @@ video {
display: none;
}
.h-16 {
height: 4rem;
}
.h-4 {
height: 1rem;
}
@ -701,6 +709,10 @@ video {
width: 100%;
}
.min-w-full {
min-width: 100%;
}
.max-w-3xl {
max-width: 48rem;
}
@ -835,6 +847,10 @@ video {
overflow: auto;
}
.overflow-hidden {
overflow: hidden;
}
.overflow-visible {
overflow: visible;
}
@ -843,6 +859,10 @@ video {
border-radius: 0.5rem;
}
.rounded-md {
border-radius: 0.375rem;
}
.rounded-sm {
border-radius: 0.125rem;
}
@ -1089,6 +1109,10 @@ video {
}
@media (min-width: 640px) {
.sm\:h-32 {
height: 8rem;
}
.sm\:h-6 {
height: 1.5rem;
}

View File

@ -133,7 +133,7 @@ pub mod info_app {
rsx! {
HomePage { page_title: "About a Werefox", card_title: "Hi! I'm Alice Werefox!",
WerefoxCard { card_title: "Basic Info".to_string(), title_emoji: None,
div { class: "grid xl:grid-rows-1 xl:grid-cols-6 sm:grid-rows-2 sm:grid-cols-3 grid-rows-9 grid-cols-1 sm:gap-2 gap-0",
div { class: "grid grid-cols-1 gap-0 xl:grid-rows-1 xl:grid-cols-6 sm:grid-rows-2 sm:grid-cols-3 grid-rows-9 sm:gap-2",
for e in identity_list {
IdentityButton { button_text: e.0, image_props: e.1 }
}
@ -304,62 +304,101 @@ pub mod info_app {
),
];
rsx! {
BasicPage { page_title: "Some stuff I do!",
div { class: "rounded-lg ring-2 ring-alice-werefox-grey dark:ring-alice-werefox-grey-darker bg-alice-werefox-grey-light dark:bg-alice-werefox-grey",
WerefoxCard { card_title: "Personal Projects",
for project in project_list {
ProjectCard { project_title: project.0, project_description: project.1, project_link: project.2, image_props: project.3 }
}
ProjectFoldable {
project_title: "Services",
project_description: "Click here for a list of the services I host.",
image_props: ImageProps {
src: "/emoji/crt_blue_screen.svg".to_string(),
alt: "A CRT blue screen emoji.".to_string(),
},
for service in service_list {
ProjectCard { project_title: service.0, project_description: service.1, project_link: service.2, image_props: service.3 }
}
}
ProjectFoldable {
project_title: "Personal Use",
project_description: "Click here for a list of services I have set up for just me.",
image_props: ImageProps {
src: "/emoji/crt_blue_screen.svg".to_string(),
alt: "A CRT blue screen emoji.".to_string(),
},
for personal in personal_list {
ProjectCard {
project_title: personal.0,
project_description: personal.1,
project_link: personal.2,
image_props: personal.3
}
}
BasicPage { page_title: "Some stuff I do!",
div { class: "rounded-lg ring-2 ring-alice-werefox-grey dark:ring-alice-werefox-grey-darker bg-alice-werefox-grey-light dark:bg-alice-werefox-grey",
WerefoxCard { card_title: "Personal Projects",
for project in project_list {
ProjectCard { project_title: project.0, project_description: project.1, project_link: project.2, image_props: project.3 }
}
ProjectFoldable {
project_title: "Services",
project_description: "Click here for a list of the services I host.",
image_props: ImageProps {
src: "/emoji/crt_blue_screen.svg".to_string(),
alt: "A CRT blue screen emoji.".to_string(),
},
for service in service_list {
ProjectCard { project_title: service.0, project_description: service.1, project_link: service.2, image_props: service.3 }
}
}
ProjectFoldable {
project_title: "Personal Use",
project_description: "Click here for a list of services I have set up for just me.",
image_props: ImageProps {
src: "/emoji/crt_blue_screen.svg".to_string(),
alt: "A CRT blue screen emoji.".to_string(),
},
for personal in personal_list {
ProjectCard {
project_title: personal.0,
project_description: personal.1,
project_link: personal.2,
image_props: personal.3
}
}
}
}
}
}
}
}
#[component]
pub fn Testimonials() -> Element {
let mastodon_status = use_resource(get_account_avatar);
// use_effect(|| {
// to_owned![mastodon_status];
// async move {
// mastodon_status.set(get_mastodon_info().await.unwrap());
// }
// });
rsx! { div { match (mastodon_status.value())() {
Some(account) => format!("{:#?}", account.unwrap()),
_ => "Nothing yet...".to_string(),
} } }
let mastodon_status = use_resource(get_account_avatars);
rsx! {
BasicPage { page_title: "Testimonials!",
WerefoxCard {
card_title: "Sometimes, people say some nice things about me. Here are some
examples!",
div { class: "p-2 space-y-4",
match (mastodon_status.value())() {
Some(account) => rsx! {
for a in account.unwrap() {
div { class: "transition rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip",
a { href: format!("{}", a.url.unwrap().trim_matches(|c| c == '\"')),
target: "_blank",
div { class: "flex flex-row min-w-full overflow-hidden",
div { class: "order-1 inline-block object-contain pt-4 pb-4 pl-4",
// span { class: "relative w-16 h-16 sm:w-32 sm:h-32",
img {
src: format!("{}", a.avatar.unwrap().trim_matches(|c| c == '\"')),
class: "object-contain h-16 rounded-md sm:h-32",
alt: ""
}
// }
}
div { class: "flex items-center justify-center order-2 w-full min-h-full p-4",
div { class: "text-xs text-center animate-wiggle sm:text-lg",
p { class: "overflow-auto",
{ format!("{}", a.content) }
}
{ format!("{}", a.username) }
}
}
}
}
}
}
},
_ => rsx! {
div { class: "flex flex-col justify-center w-full m-auto space-y-2 align-middle",
img { class: "flex justify-center m-auto align-middle",
src: "emoji/:ablobalicebongo:.gif",
alt: "A gif of Alice in a blob emoji form, performing the bongocat animation."
}
p { "Just a sec, lemme grab those for ya..." }
}
}
}
}
}
}
}
}
#[server]
async fn get_account_avatar() -> Result<String, ServerFnError> {
async fn get_account_avatars() -> Result<Vec<Testimonial>, ServerFnError> {
let client = megalodon::generator(
megalodon::SNS::Mastodon,
String::from("https://bark.lgbt"),
@ -367,20 +406,43 @@ pub mod info_app {
None,
);
let testimonial_toml: String = tokio::fs::read_to_string("data/testimonials.toml").await?;
let testinomial_accounts: TestimonialAccount = toml::from_str(testimonial_toml.as_str()).unwrap();
let res = client.search_account(String::from("@heatherhorns@plush.city"), None).await?;
Ok(format!("{}", res.json()[0].avatar_static))
let testimonial_accounts: TestimonialAccount =
toml::from_str(testimonial_toml.as_str()).unwrap();
let mut testimonial_avatars: Vec<Testimonial> = vec![];
for account in testimonial_accounts.accounts {
let res = client
.search_account(
String::from(account.username.clone()),
Some(&megalodon::megalodon::SearchAccountInputOptions {
following: None,
resolve: Some(false),
limit: Some(1),
max_id: None,
since_id: None,
}),
)
.await?;
testimonial_avatars.push(Testimonial {
username: account.username,
content: account.content,
avatar: Some(format!("{:?}", res.json()[0].avatar_static)),
url: Some(format!("{:?}", res.json()[0].url)),
})
}
Ok(testimonial_avatars)
}
#[derive(Deserialize)]
#[derive(Deserialize, Debug)]
struct TestimonialAccount {
accounts: Vec<Testimonial>,
}
#[derive(Deserialize)]
struct Testimonial {
#[derive(Serialize, Deserialize, Debug, Clone)]
pub struct Testimonial {
username: String,
content: String,
avatar: Option<String>,
url: Option<String>,
}
#[component]
@ -402,7 +464,7 @@ pub mod info_app {
rsx! {
BasicPage { page_title: "Track my HRT progress!",
WerefoxCard { card_title: "I'm so glad you're interested!!",
div { class: "p-2 sm:text-xl text-lg text-center text-alice-werefox-red-dark dark:text-alice-werefox-red-light grid grid-cols-1 grid-rows-4 gap-2",
div { class: "grid grid-cols-1 grid-rows-4 gap-2 p-2 text-lg text-center sm:text-xl text-alice-werefox-red-dark dark:text-alice-werefox-red-light",
p { "I've been on HRT for:" }
p { "{time_elapsed.read().days} days" }
p { "{time_elapsed.read().hours} hours" }