add basic rec
Some checks failed
ci/woodpecker/push/build Pipeline failed

This commit is contained in:
JMARyA 2024-12-16 22:00:08 +01:00
parent ae36928791
commit 8fb4d5a5c5
Signed by: jmarya
GPG key ID: 901B2ADDF27C2263
2 changed files with 15 additions and 6 deletions

View file

@ -166,15 +166,18 @@ pub fn format_number(num: i32) -> String {
num.to_string() num.to_string()
} }
pub async fn video_element_wide(video: &mut 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 p-4 bg-gray-900 shadow-lg rounded-lg overflow-hidden mb-2 mt-2" { a href=(format!("/watch?v={}", video.id)) class="flex items-center w-full p-4 bg-gray-900 shadow-lg rounded-lg overflow-hidden mb-2 mt-2" {
div class="flex-shrink-0" { div class="flex-shrink-0 relative" {
img width="480" src=(format!("/video/thumbnail?v={}", video.id)) alt="Video Thumbnail" class="w-48 h-32 object-cover rounded-md"; img width="480" src=(format!("/video/thumbnail?v={}", video.id)) class="w-48 h-32 object-cover rounded-md";
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-4" { div class="flex flex-col flex-grow ml-4" {
h3 class="text-lg font-semibold truncate mb-1" { h3 class="text-lg font-semibold truncate mb-1" title=(video.title) {
( video.title ) ( video.title )
}; };

View file

@ -8,7 +8,7 @@ use serde_json::json;
use crate::{ use crate::{
library::{self, user::UserManager, Library}, library::{self, user::UserManager, Library},
pages::components::{format_date, video_element}, pages::components::{format_date, video_element, video_element_wide},
}; };
use super::{ use super::{
@ -34,7 +34,7 @@ pub async fn watch_page(
let content = html!( let content = html!(
main class="container mx-auto mt-6 flex flex-col lg:flex-row gap-6" { main class="container mx-auto mt-6 flex flex-col lg:flex-row gap-6" {
div class="lg:w-2/3 mt-10" { div class="lg:w-10/12 mt-10" {
div class="bg-black aspect-video rounded-lg overflow-hidden" { div class="bg-black aspect-video rounded-lg overflow-hidden" {
video video
controls controls
@ -61,6 +61,12 @@ pub async fn watch_page(
}; };
}; };
div id="recommendations" class="mt-8" {
h3 class="text-center text-4xl font-extrabold leading-tight mb-2" { "In " a class="text-blue-500" href=(format!("/d/{}", video.directory)) { (video.directory) }; }
@for video in library.get_directory_videos(&video.directory).await {
(video_element_wide(&video).await);
};
};
}; };
); );