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]] [[package]]
name = "based" name = "based"
version = "0.1.0" 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 = [ dependencies = [
"bcrypt", "bcrypt",
"chrono", "chrono",
@ -1131,9 +1131,9 @@ dependencies = [
[[package]] [[package]]
name = "indexmap" name = "indexmap"
version = "2.7.0" version = "2.7.1"
source = "registry+https://github.com/rust-lang/crates.io-index" source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "62f822373a4fe84d4bb149bf54e584a7f4abec90e072ed49cda0edea5b95471f" checksum = "8c9c992b02b5b4c94ea26e32fe5bccb7aa7d9f390ab5c1221ff895bc7ea8b652"
dependencies = [ dependencies = [
"equivalent", "equivalent",
"hashbrown 0.15.2", "hashbrown 0.15.2",
@ -1157,9 +1157,9 @@ dependencies = [
[[package]] [[package]]
name = "ipnet" name = "ipnet"
version = "2.10.1" version = "2.11.0"
source = "registry+https://github.com/rust-lang/crates.io-index" source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ddc24109865250148c2e0f3d25d4f0f479571723792d3802153c60922a4fb708" checksum = "469fb0b9cefa57e3ef31275ee7cacb78f2fdca44e4765491884a2b119d4eb130"
[[package]] [[package]]
name = "is-terminal" name = "is-terminal"
@ -2096,9 +2096,9 @@ dependencies = [
[[package]] [[package]]
name = "serde_json" name = "serde_json"
version = "1.0.135" version = "1.0.137"
source = "registry+https://github.com/rust-lang/crates.io-index" source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2b0d7ba2887406110130a978386c4e1befb98c674b4fba677954e4db976630d9" checksum = "930cfb6e6abf99298aaad7d29abbef7a9999a9a8806a40088f55f0dcec03146b"
dependencies = [ dependencies = [
"itoa", "itoa",
"memchr", "memchr",
@ -2907,9 +2907,9 @@ checksum = "b6c140620e7ffbb22c2dee59cafe6084a59b5ffc27a8859a5f0d494b5d52b6be"
[[package]] [[package]]
name = "uuid" name = "uuid"
version = "1.12.0" version = "1.12.1"
source = "registry+https://github.com/rust-lang/crates.io-index" source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "744018581f9a3454a9e15beb8a33b017183f1e7c0cd170232a2d1453b23a51c4" checksum = "b3758f5e68192bb96cc8f9b7e2c2cfdabb435499a28499a42f8f984092adad4b"
dependencies = [ dependencies = [
"getrandom", "getrandom",
"serde", "serde",

40
src/pages/components.rs
View file

@ -1,6 +1,7 @@
use crate::library::Video; use crate::library::Video;
use based::ui::components::AppBar; use based::ui::components::AppBar;
use based::ui::prelude::*; use based::ui::wrapper::HoverWrapper;
use based::ui::{prelude::*, UIWidget};
use based::{ use based::{
auth::User, auth::User,
format::{format_date, format_number, format_seconds_to_hhmmss}, format::{format_date, format_number, format_seconds_to_hhmmss},
@ -34,33 +35,40 @@ pub async fn render_page(
.await .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> { pub async fn video_element_wide(video: &Video) -> PreEscaped<String> {
html!( 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" { 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" { 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" { 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) )) (( 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) (Margin(Text(&video.title).large().semibold().max_lines(LineClamp::_3).title(&video.title).align(TextAlignment::Start)
).bottom(ScreenValue::_1) ).bottom(ScreenValue::_1)
) )
div class="flex flex-col flex-grow ml-2 py-1" {
@if let Some(meta) = video.youtube_meta().await { @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(&meta.uploader_name).medium())
(Span(" - ")) (Span(" - "))
(Span(&format_date(&meta.upload_date))) (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(&format_number(meta.views)))
(Span(" 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> { pub fn video_thumbnail_with_time(video: &Video) -> PreEscaped<String> {
html! { html! {
div class="relative" { 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" { 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) )) (( format_seconds_to_hhmmss(video.duration) ))
}; };
@ -78,6 +96,7 @@ pub fn video_thumbnail_with_time(video: &Video) -> PreEscaped<String> {
} }
pub async fn video_element(video: &mut Video) -> PreEscaped<String> { pub async fn video_element(video: &mut Video) -> PreEscaped<String> {
HoverScaleAnimation(
Margin(Context(MaxWidth( Margin(Context(MaxWidth(
ScreenValue::_90, ScreenValue::_90,
MaxHeight( MaxHeight(
@ -85,8 +104,7 @@ pub async fn video_element(video: &mut Video) -> PreEscaped<String> {
Aspect::video(Link( Aspect::video(Link(
&format!("/watch?v={}", video.id), &format!("/watch?v={}", video.id),
Context( Context(
Hover(Background(Gray::_800, Nothing())).on(Background( Hover(Background(Nothing()).color(Gray::_800)).on(Background(
Gray::_900,
Shadow::large( Shadow::large(
Rounded( Rounded(
Div().push(video_thumbnail_with_time(&video)).push(Context( Div().push(video_thumbnail_with_time(&video)).push(Context(
@ -108,11 +126,13 @@ pub async fn video_element(video: &mut Video) -> PreEscaped<String> {
) )
.size(Size::Large), .size(Size::Large),
), ),
)), )
.color(Gray::_900)),
), ),
)), )),
), ),
))) )))
.y(ScreenValue::_6) .y(ScreenValue::_6),
)
.render() .render()
} }

7
src/pages/index.rs
View file

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

12
src/pages/watch.rs
View file

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