eta357/LibreTunes-Nix-Test
1
0
Fork 0
Code Pull Requests Actions Activity

allow choosing artists by searching for upload

Browse Source
This commit is contained in:
Danny Zou 2024-05-16 18:35:02 -04:00
parent 5775d3148b
commit 955fc84412
2 changed files with 69 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
src/components/upload.rs
View File

@ -3,6 +3,7 @@ use leptos::*;
use leptos_icons::*;
use leptos_router::Form;
use crate::search::search_artists;
use crate::models::Artist;
#[component]
pub fn UploadBtn(dialog_open: RwSignal<bool>) -> impl IntoView {
@ -22,24 +23,29 @@ pub fn UploadBtn(dialog_open: RwSignal<bool>) -> impl IntoView {
#[component]
pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
let (artists_search, set_artists_search) = create_signal("".to_string());
// Create signals for the artist input and the filtered artists
let (artists, set_artists) = create_signal("".to_string());
let (filtered_artists, set_filtered_artists) = create_signal(vec![]);
let close_dialog = move |ev: leptos::ev::MouseEvent| {
ev.prevent_default();
open.set(false);
};
// let click_cancel_bubble = move |ev: leptos::ev::MouseEvent| {
// ev.prevent_default();
// ev.stop_propagation();
// };
// Create a filter function to handle filtering artists
let handle_filter = move |ev: leptos::ev::Event| {
ev.prevent_default();
let searchArtist = event_target_value(&ev);
log!("searchArtist: {:?}", searchArtist);
set_artists_search.update(|value| *value = searchArtist);
let artist_input: String = event_target_value(&ev);
//Get the artist that we are currently searching for
let mut all_artists: Vec<&str> = artist_input.split(",").collect();
let search = all_artists.pop().unwrap().to_string();
//Update the artist signal with the input
set_artists.update(|value: &mut String| *value = artist_input);
spawn_local(async move {
let filter_results = search_artists(artists_search.get_untracked(), 3).await;
let filter_results = search_artists(search, 3).await;
if let Err(err) = filter_results {
log!("Error filtering artists: {:?}", err);
} else if let Ok(artists) = filter_results {
@ -48,7 +54,6 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
set_filtered_artists.update(|value| *value = artists);
}
})
};
view! {
<Show when=open fallback=move || view! {}>
@ -58,15 +63,13 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
<h1>Upload Song</h1>
</div>
<Form action="/api/upload" method="POST" enctype=String::from("multipart/form-data") class="upload-form">
<div class="input-bx">
<input type="text" name="title" required class="text-input" required/>
<span>Title</span>
</div>
<div class="artists">
<div class="input-bx">
<input type="text" name="artist_ids" class="text-input" required on:input=handle_filter/>
<input type="text" name="artist_ids" class="text-input" prop:value=artists required on:input=handle_filter/>
<span>Artists</span>
</div>
<Show
@ -76,17 +79,12 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
<ul class="artist_results">
{
move || filtered_artists.get().iter().enumerate().map(|(_index,filtered_artist)| view! {
<div class="artist">
{filtered_artist.clone().name}
</div>
<Artist artist=filtered_artist.clone() artists=artists set_artists=set_artists set_filtered=set_filtered_artists/>
}).collect::<Vec<_>>()
}
</ul>
</Show>
</div>
<div class="input-bx">
<input type="text" name="album_id" class="text-input" required/>
<span>Album ID</span>
@ -95,7 +93,6 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
<input type="number" name="track_number" class="text-input" required/>
<span>Track Number</span>
</div>
<div class="release-date">
<div class="left">
<span>Release</span>
@ -103,15 +100,60 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
</div>
<input class="info" type="date" name="release_date"/>
</div>
<div class="file">
<span>File</span>
<input class="info" type="file" name="file"/>
</div>
<button type="submit" class="upload-button">Upload</button>
</Form>
</div>
</Show>
}
}
#[component]
pub fn Artist(artist: Artist, artists: ReadSignal<String>, set_artists: WriteSignal<String>, set_filtered: WriteSignal<Vec<Artist>>) -> impl IntoView {
// Create a function to add an artist to the artist input
let add_artist = move |_| {
//Create an empty string to hold the artist ids
let mut s: String = String::from("");
//Get the current value of the artist input
let all_artirts: String = artists.get();
//Split the input into a vector of artists separated by commas
let mut ids: Vec<&str> = all_artirts.split(",").collect();
//If there is only one artist in the input, get their id equivalent and add it to the string
if ids.len() == 1 {
let value_str = match artist.id.clone() {
Some(v) => v.to_string(),
None => String::from("None"),
};
s.push_str(&value_str);
s.push_str(",");
set_artists.update(|value| *value = s);
//If there are multiple artists in the input, pop the last artist by string off the vector,
//get their id equivalent, and add it to the string
} else {
ids.pop();
for id in ids {
s.push_str(id);
s.push_str(",");
}
let value_str = match artist.id.clone() {
Some(v) => v.to_string(),
None => String::from("None"),
};
s.push_str(&value_str);
s.push_str(",");
set_artists.update(|value| *value = s);
}
//Clear the search results
set_filtered.update(|value| *value = vec![]);
};
view! {
<div class="artist" on:click=add_artist>
{artist.name.clone()}
</div>
}
}

5
style/upload.scss
View File

@ -161,6 +161,11 @@
.artist {
border-bottom: 1px solid white;
padding: 10px;
cursor: pointer;
transition: 0.3s;
&:hover {
background-color: #7f8fa6;
}
}
.artist:last-child {
border-bottom: none;