jmarya/watchdogs
jmarya/watchdogs
1
0
Fork 0
Code Issues 10 Pull requests Projects Releases Packages 1 Wiki Activity

update

Browse source
This commit is contained in:
JMARyA 2025-01-21 14:12:43 +01:00
parent b38351c821
commit 2567b2a0ab
Signed by: jmarya
GPG key ID: 901B2ADDF27C2263
4 changed files with 80 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
Cargo.lock generated
View file

@ -146,7 +146,7 @@ checksum = "8c3c1a368f70d6cf7302d78f8f7093da241fb8e8807c05cc9e51a125895a6d5b"
[[package]]
name = "based"
version = "0.1.0"
source = "git+https://git.hydrar.de/jmarya/based?branch=ui#79f08fd202abcfbc52cbab09be7dccc02f4c7c01"
source = "git+https://git.hydrar.de/jmarya/based?branch=ui#e02def6bc16dfe61937816d669514c9d4300ae1a"
dependencies = [
"bcrypt",
"chrono",
@ -1131,9 +1131,9 @@ dependencies = [
[[package]]
name = "indexmap"
version = "2.7.0"
version = "2.7.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "62f822373a4fe84d4bb149bf54e584a7f4abec90e072ed49cda0edea5b95471f"
checksum = "8c9c992b02b5b4c94ea26e32fe5bccb7aa7d9f390ab5c1221ff895bc7ea8b652"
dependencies = [
"equivalent",
"hashbrown 0.15.2",
@ -1157,9 +1157,9 @@ dependencies = [
[[package]]
name = "ipnet"
version = "2.10.1"
version = "2.11.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ddc24109865250148c2e0f3d25d4f0f479571723792d3802153c60922a4fb708"
checksum = "469fb0b9cefa57e3ef31275ee7cacb78f2fdca44e4765491884a2b119d4eb130"
[[package]]
name = "is-terminal"
@ -2096,9 +2096,9 @@ dependencies = [
[[package]]
name = "serde_json"
version = "1.0.135"
version = "1.0.137"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2b0d7ba2887406110130a978386c4e1befb98c674b4fba677954e4db976630d9"
checksum = "930cfb6e6abf99298aaad7d29abbef7a9999a9a8806a40088f55f0dcec03146b"
dependencies = [
"itoa",
"memchr",
@ -2907,9 +2907,9 @@ checksum = "b6c140620e7ffbb22c2dee59cafe6084a59b5ffc27a8859a5f0d494b5d52b6be"
[[package]]
name = "uuid"
version = "1.12.0"
version = "1.12.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "744018581f9a3454a9e15beb8a33b017183f1e7c0cd170232a2d1453b23a51c4"
checksum = "b3758f5e68192bb96cc8f9b7e2c2cfdabb435499a28499a42f8f984092adad4b"
dependencies = [
"getrandom",
"serde",

104
src/pages/components.rs
View file

@ -1,6 +1,7 @@
use crate::library::Video;
use based::ui::components::AppBar;
use based::ui::prelude::*;
use based::ui::wrapper::HoverWrapper;
use based::ui::{prelude::*, UIWidget};
use based::{
auth::User,
format::{format_date, format_number, format_seconds_to_hhmmss},
@ -34,33 +35,40 @@ pub async fn render_page(
.await
}
#[allow(non_snake_case)]
pub fn HoverScaleAnimation<T: UIWidget + 'static>(inner: T) -> HoverWrapper {
Hover(Animated(ZIndex::five(Scale(1.02, Nothing()))).scope(Scope::All)).on(inner)
}
pub async fn video_element_wide(video: &Video) -> PreEscaped<String> {
html!(
a href=(format!("/watch?v={}", video.id)) class="flex items-center w-full my-4 bg-gray-900 hover:bg-gray-800 shadow-lg rounded-lg overflow-hidden" {
div class="flex-shrink-0 relative" {
img width="480" src=(format!("/video/thumbnail?v={}", video.id)) class="aspect-video w-32 w-48 rounded-md object-cover";
img width="480" src=(format!("/video/thumbnail?v={}", video.id)) class="aspect-video h-32 w-48 rounded-l-md object-cover";
span class="absolute bottom-2 right-2 bg-black text-white text-xs px-2 py-1 rounded-sm opacity-90" {
(( format_seconds_to_hhmmss(video.duration) ))
};
};
div class="flex flex-col flex-grow ml-2" {
div class="flex flex-col flex-grow ml-2 max-h-32" {
(Margin(Text(&video.title).large().semibold().max_lines(LineClamp::_3).title(&video.title).align(TextAlignment::Start)
).bottom(ScreenValue::_1)
)
div class="flex flex-col flex-grow ml-2 py-1" {
@if let Some(meta) = video.youtube_meta().await {
div class="text-sm text-gray-400 mb-2" {
div class="text-sm text-gray-400 mb-2 text-start" {
(Span(&meta.uploader_name).medium())
(Span(" - "))
(Span(&format_date(&meta.upload_date)))
};
div class="text-sm text-gray-400" {
div class="text-sm text-gray-400 text-start" {
(Span(&format_number(meta.views)))
(Span(" views"))
};
};
}
};
};
)
@ -69,7 +77,17 @@ pub async fn video_element_wide(video: &Video) -> PreEscaped<String> {
pub fn video_thumbnail_with_time(video: &Video) -> PreEscaped<String> {
html! {
div class="relative" {
img width="480" src=(format!("/video/thumbnail?v={}", video.id)) class="w-full h-auto object-cover aspect-video";
(
Width(ScreenValue::full,
Height(ScreenValue::auto,
Aspect::video(
Rounded(
Image(&format!("/video/thumbnail?v={}", video.id))
).size(Size::Large).side(Side::Top)
)
)
)
)
span class="absolute bottom-2 right-2 bg-black text-white text-xs px-2 py-1 rounded-sm opacity-90" {
(( format_seconds_to_hhmmss(video.duration) ))
};
@ -78,41 +96,43 @@ pub fn video_thumbnail_with_time(video: &Video) -> PreEscaped<String> {
}
pub async fn video_element(video: &mut Video) -> PreEscaped<String> {
Margin(Context(MaxWidth(
ScreenValue::_90,
MaxHeight(
ScreenValue::_60,
Aspect::video(Link(
&format!("/watch?v={}", video.id),
Context(
Hover(Background(Gray::_800, Nothing())).on(Background(
Gray::_900,
Shadow::large(
Rounded(
Div().push(video_thumbnail_with_time(&video)).push(Context(
Rounded(Shadow::large(
Padding(
Text(&video.title)
.base_size()
.semibold()
.align(TextAlignment::Start)
.title(&video.title)
.max_lines(LineClamp::_1)
.overflow(TextOverflow::Truncate),
)
.y(ScreenValue::_4)
.x(ScreenValue::_2),
))
.size(Size::Large),
)),
)
.size(Size::Large),
),
)),
),
)),
),
)))
.y(ScreenValue::_6)
HoverScaleAnimation(
Margin(Context(MaxWidth(
ScreenValue::_90,
MaxHeight(
ScreenValue::_60,
Aspect::video(Link(
&format!("/watch?v={}", video.id),
Context(
Hover(Background(Nothing()).color(Gray::_800)).on(Background(
Shadow::large(
Rounded(
Div().push(video_thumbnail_with_time(&video)).push(Context(
Rounded(Shadow::large(
Padding(
Text(&video.title)
.base_size()
.semibold()
.align(TextAlignment::Start)
.title(&video.title)
.max_lines(LineClamp::_1)
.overflow(TextOverflow::Truncate),
)
.y(ScreenValue::_4)
.x(ScreenValue::_2),
))
.size(Size::Large),
)),
)
.size(Size::Large),
),
)
.color(Gray::_900)),
),
)),
),
)))
.y(ScreenValue::_6),
)
.render()
}

7
src/pages/index.rs
View file

@ -117,16 +117,15 @@ pub async fn index_page(
(Margin(
Padding(
Hover(Background(Purple::_600, Nothing())).on(
Background(Purple::_500,
Hover(Background(Cursor::Pointer.on(Nothing())).color(Purple::_600)).on(
Background(
Rounded(
// TODO : Implement cursor-pointer
Link(
&format!("/d/{dir}"),
Text(&dir).white()
).use_htmx()
).size(Size::Full)
))
).color(Purple::_500))
).x(ScreenValue::_3).y(ScreenValue::_2)).all(ScreenValue::_2))
br;
};

12
src/pages/watch.rs
View file

@ -48,24 +48,24 @@ pub async fn watch_page(
Screen::large(Width(Fraction::_10on12, Nothing())).on(
Div().push(
Context(Aspect::video(
Background(Colors::Black,
Background(
Rounded(
html! {
video
controls
autoplay
class="w-full h-full" {
class="w-full h-full rounded-lg" {
source src=(format!("/video/raw?v={}", video.id)) type="video/mp4" {
"Your browser does not support the video"
};
};
}
).size(Size::Large)
)
).color(Colors::Black)
))
).push(
Context(Margin(Padding(
Background(Stone::_900,
Background(
Rounded(
Shadow::large(
Div()
@ -73,7 +73,7 @@ pub async fn watch_page(
Text(&video.title)._2xl().semibold()
)
.push_some(youtube_meta.as_ref(), |meta: &_| {
Div().vanish()
Div()
.push(
Margin(Flex(
Div().vanish().push(
@ -93,7 +93,7 @@ pub async fn watch_page(
}
)
)).size(Size::Large)
)
).color(Stone::_900)
).all(ScreenValue::_4)).top(ScreenValue::_8))
)
)