Compare commits
9 Commits
main
...
148-create
| Author | SHA1 | Date | |
|---|---|---|---|
| d73a114d35 | |||
| f8a28ca75c | |||
| 0afdbf2ad5 | |||
| 03889d4efe | |||
| f6fb92e361 | |||
| 00f4b2e28f | |||
| 340129a859 | |||
| 7828992e80 | |||
| 9600e8c442 |
@ -9,6 +9,3 @@
|
||||
!/Cargo.lock
|
||||
!/Cargo.toml
|
||||
!/ascii_art.txt
|
||||
!/flake.nix
|
||||
!/flake.lock
|
||||
!/rust-toolchain.toml
|
||||
|
||||
@ -18,4 +18,3 @@ DATABASE_URL=postgresql://libretunes:password@localhost:5432/libretunes
|
||||
|
||||
LIBRETUNES_AUDIO_PATH=assets/audio
|
||||
LIBRETUNES_IMAGE_PATH=assets/images
|
||||
LIBRETUNES_DISABLE_SIGNUP=true
|
||||
|
||||
@ -7,20 +7,18 @@ jobs:
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
- name: Use Cache
|
||||
uses: Swatinem/rust-cache@v2
|
||||
- name: Build project
|
||||
env:
|
||||
RUSTFLAGS: "-D warnings"
|
||||
run: cargo-leptos build
|
||||
|
||||
docker-build:
|
||||
runs-on: ubuntu-latest-docker
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
- name: Set up Docker Buildx
|
||||
uses: docker/setup-buildx-action@v3
|
||||
with:
|
||||
endpoint: ${{ env.docker_endpoint }}
|
||||
- name: Login to Gitea container registry
|
||||
uses: docker/login-action@v3
|
||||
with:
|
||||
@ -36,22 +34,22 @@ jobs:
|
||||
with:
|
||||
push: true
|
||||
tags: "${{ steps.get-image-name.outputs.IMAGE_NAME }}:${{ gitea.sha }}"
|
||||
cache-to: mode=max
|
||||
cache-from: type=registry,ref=${{ steps.get-image-name.outputs.IMAGE_NAME }}:${{ gitea.sha }}
|
||||
cache-to: type=inline
|
||||
- name: Build and push Docker image with "latest" tag
|
||||
uses: docker/build-push-action@v5
|
||||
if: gitea.ref == 'refs/heads/main'
|
||||
with:
|
||||
push: true
|
||||
tags: "${{ steps.get-image-name.outputs.IMAGE_NAME }}:latest"
|
||||
cache-to: mode=max
|
||||
cache-from: type=registry,ref=${{ steps.get-image-name.outputs.IMAGE_NAME }}:latest
|
||||
cache-to: type=inline
|
||||
|
||||
test:
|
||||
runs-on: libretunes-cicd
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
- name: Use Cache
|
||||
uses: Swatinem/rust-cache@v2
|
||||
- name: Test project
|
||||
run: cargo test --all-targets --all-features
|
||||
|
||||
@ -60,8 +58,6 @@ jobs:
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
- name: Use Cache
|
||||
uses: Swatinem/rust-cache@v2
|
||||
- name: Run Leptos tests
|
||||
run: cargo-leptos test
|
||||
|
||||
@ -70,8 +66,6 @@ jobs:
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
- name: Use Cache
|
||||
uses: Swatinem/rust-cache@v2
|
||||
- name: Generate docs
|
||||
run: cargo doc --no-deps
|
||||
- name: Upload docs
|
||||
@ -79,23 +73,3 @@ jobs:
|
||||
with:
|
||||
name: docs
|
||||
path: target/doc
|
||||
|
||||
nix-build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Update Package Lists
|
||||
run: apt update
|
||||
- name: Install Nix
|
||||
run: apt install -y nix-bin
|
||||
- name: Restore and cache Nix store
|
||||
uses: nix-community/cache-nix-action@v5
|
||||
with:
|
||||
primary-key: nix-build
|
||||
- name: Build project with Nix
|
||||
run: nix build --experimental-features 'nix-command flakes' git+$GITHUB_SERVER_URL/$GITHUB_REPOSITORY.git?ref=$GITHUB_REF_NAME#default --no-write-lock-file
|
||||
|
||||
env:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Print Environment
|
||||
run: env
|
||||
|
||||
4
.gitignore
vendored
4
.gitignore
vendored
@ -31,7 +31,3 @@ playwright/.cache/
|
||||
|
||||
# Sass cache
|
||||
.sass-cache
|
||||
|
||||
# Nix-related files
|
||||
.direnv/
|
||||
result/
|
||||
|
||||
20
Cargo.lock
generated
20
Cargo.lock
generated
@ -3444,9 +3444,9 @@ checksum = "9c8d87e72b64a3b4db28d11ce29237c246188f4f51057d65a7eab63b7987e423"
|
||||
|
||||
[[package]]
|
||||
name = "wasm-bindgen"
|
||||
version = "0.2.96"
|
||||
version = "0.2.95"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "21d3b25c3ea1126a2ad5f4f9068483c2af1e64168f847abe863a526b8dbfe00b"
|
||||
checksum = "128d1e363af62632b8eb57219c8fd7877144af57558fb2ef0368d0087bddeb2e"
|
||||
dependencies = [
|
||||
"cfg-if",
|
||||
"once_cell",
|
||||
@ -3455,9 +3455,9 @@ dependencies = [
|
||||
|
||||
[[package]]
|
||||
name = "wasm-bindgen-backend"
|
||||
version = "0.2.96"
|
||||
version = "0.2.95"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "52857d4c32e496dc6537646b5b117081e71fd2ff06de792e3577a150627db283"
|
||||
checksum = "cb6dd4d3ca0ddffd1dd1c9c04f94b868c37ff5fac97c30b97cff2d74fce3a358"
|
||||
dependencies = [
|
||||
"bumpalo",
|
||||
"log",
|
||||
@ -3482,9 +3482,9 @@ dependencies = [
|
||||
|
||||
[[package]]
|
||||
name = "wasm-bindgen-macro"
|
||||
version = "0.2.96"
|
||||
version = "0.2.95"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "920b0ffe069571ebbfc9ddc0b36ba305ef65577c94b06262ed793716a1afd981"
|
||||
checksum = "e79384be7f8f5a9dd5d7167216f022090cf1f9ec128e6e6a482a2cb5c5422c56"
|
||||
dependencies = [
|
||||
"quote",
|
||||
"wasm-bindgen-macro-support",
|
||||
@ -3492,9 +3492,9 @@ dependencies = [
|
||||
|
||||
[[package]]
|
||||
name = "wasm-bindgen-macro-support"
|
||||
version = "0.2.96"
|
||||
version = "0.2.95"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "bf59002391099644be3524e23b781fa43d2be0c5aa0719a18c0731b9d195cab6"
|
||||
checksum = "26c6ab57572f7a24a4985830b120de1594465e5d500f24afe89e16b4e833ef68"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
@ -3505,9 +3505,9 @@ dependencies = [
|
||||
|
||||
[[package]]
|
||||
name = "wasm-bindgen-shared"
|
||||
version = "0.2.96"
|
||||
version = "0.2.95"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "e5047c5392700766601942795a436d7d2599af60dcc3cc1248c9120bfb0827b0"
|
||||
checksum = "65fc09f10666a9f147042251e0dda9c18f166ff7de300607007e96bdebc1068d"
|
||||
|
||||
[[package]]
|
||||
name = "wasm-streams"
|
||||
|
||||
@ -15,7 +15,7 @@ leptos = { version = "0.6", default-features = false, features = ["nightly"] }
|
||||
leptos_meta = { version = "0.6", features = ["nightly"] }
|
||||
leptos_axum = { version = "0.6", optional = true }
|
||||
leptos_router = { version = "0.6", features = ["nightly"] }
|
||||
wasm-bindgen = { version = "=0.2.96", default-features = false, optional = true }
|
||||
wasm-bindgen = { version = "=0.2.95", default-features = false, optional = true }
|
||||
leptos_icons = { version = "0.3.0" }
|
||||
icondata = { version = "0.3.0" }
|
||||
diesel = { version = "2.1.4", features = ["postgres", "r2d2", "chrono"], default-features = false, optional = true }
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
FROM rust:slim AS builder
|
||||
FROM rust:slim as builder
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
|
||||
@ -3,7 +3,7 @@ name: libretunes
|
||||
services:
|
||||
libretunes:
|
||||
container_name: libretunes
|
||||
# image: git.libretunes.xyz/libretunes/libretunes:latest
|
||||
# image: registry.mregirouard.com/libretunes/libretunes:latest
|
||||
build: .
|
||||
ports:
|
||||
- "3000:3000"
|
||||
@ -15,7 +15,6 @@ services:
|
||||
POSTGRES_DB: ${POSTGRES_DB}
|
||||
LIBRETUNES_AUDIO_PATH: /assets/audio
|
||||
LIBRETUNES_IMAGE_PATH: /assets/images
|
||||
LIBRETUNES_DISABLE_SIGNUP: "true"
|
||||
volumes:
|
||||
- libretunes-audio:/assets/audio
|
||||
- libretunes-images:/assets/images
|
||||
|
||||
114
flake.lock
generated
114
flake.lock
generated
@ -1,114 +0,0 @@
|
||||
{
|
||||
"nodes": {
|
||||
"cargo-leptos": {
|
||||
"flake": false,
|
||||
"locked": {
|
||||
"lastModified": 1730677835,
|
||||
"narHash": "sha256-Oe65m9io7ihymUjylaWHQM/x7r0y/xXqD313H3oyjN8=",
|
||||
"owner": "leptos-rs",
|
||||
"repo": "cargo-leptos",
|
||||
"rev": "ff6b19a5f9fd4e433774b6a9c57922ea5a1634cc",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "leptos-rs",
|
||||
"ref": "v0.2.21",
|
||||
"repo": "cargo-leptos",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"flake-utils": {
|
||||
"inputs": {
|
||||
"systems": "systems"
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1731533236,
|
||||
"narHash": "sha256-l0KFg5HjrsfsO/JpG+r7fRrqm12kzFHyUHqHCVpMMbI=",
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"rev": "11707dc2f618dd54ca8739b309ec4fc024de578b",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"nixpkgs": {
|
||||
"locked": {
|
||||
"lastModified": 1733940404,
|
||||
"narHash": "sha256-Pj39hSoUA86ZePPF/UXiYHHM7hMIkios8TYG29kQT4g=",
|
||||
"owner": "NixOS",
|
||||
"repo": "nixpkgs",
|
||||
"rev": "5d67ea6b4b63378b9c13be21e2ec9d1afc921713",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "NixOS",
|
||||
"ref": "nixos-unstable",
|
||||
"repo": "nixpkgs",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"nixpkgs_2": {
|
||||
"locked": {
|
||||
"lastModified": 1728538411,
|
||||
"narHash": "sha256-f0SBJz1eZ2yOuKUr5CA9BHULGXVSn6miBuUWdTyhUhU=",
|
||||
"owner": "NixOS",
|
||||
"repo": "nixpkgs",
|
||||
"rev": "b69de56fac8c2b6f8fd27f2eca01dcda8e0a4221",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "NixOS",
|
||||
"ref": "nixpkgs-unstable",
|
||||
"repo": "nixpkgs",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"root": {
|
||||
"inputs": {
|
||||
"cargo-leptos": "cargo-leptos",
|
||||
"flake-utils": "flake-utils",
|
||||
"nixpkgs": "nixpkgs",
|
||||
"rust-overlay": "rust-overlay"
|
||||
}
|
||||
},
|
||||
"rust-overlay": {
|
||||
"inputs": {
|
||||
"nixpkgs": "nixpkgs_2"
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1734230139,
|
||||
"narHash": "sha256-zsp0Mz8VgyIAnU8UhP/YT1g+zlsl+NIJTBMAbY+RifQ=",
|
||||
"owner": "oxalica",
|
||||
"repo": "rust-overlay",
|
||||
"rev": "150fbc8aa2bc501041810bbc1dbfe73694a861be",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "oxalica",
|
||||
"repo": "rust-overlay",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"systems": {
|
||||
"locked": {
|
||||
"lastModified": 1681028828,
|
||||
"narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=",
|
||||
"owner": "nix-systems",
|
||||
"repo": "default",
|
||||
"rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "nix-systems",
|
||||
"repo": "default",
|
||||
"type": "github"
|
||||
}
|
||||
}
|
||||
},
|
||||
"root": "root",
|
||||
"version": 7
|
||||
}
|
||||
102
flake.nix
102
flake.nix
@ -1,102 +0,0 @@
|
||||
{
|
||||
description = "LibreTunes build and development environment";
|
||||
|
||||
inputs = {
|
||||
nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
|
||||
rust-overlay.url = "github:oxalica/rust-overlay";
|
||||
flake-utils.url = "github:numtide/flake-utils";
|
||||
cargo-leptos = {
|
||||
url = "github:leptos-rs/cargo-leptos?ref=v0.2.22";
|
||||
flake = false;
|
||||
};
|
||||
};
|
||||
|
||||
outputs = { self, nixpkgs, rust-overlay, flake-utils, cargo-leptos, ... }:
|
||||
flake-utils.lib.eachDefaultSystem (system:
|
||||
let
|
||||
overlays = [ (import rust-overlay) ];
|
||||
pkgs = import nixpkgs {
|
||||
inherit system overlays;
|
||||
};
|
||||
|
||||
# Build a specific version of cargo-leptos
|
||||
cargo-leptos-build = pkgs.rustPlatform.buildRustPackage {
|
||||
name = "cargo-leptos";
|
||||
buildFeatures = ["no_downloads"];
|
||||
src = cargo-leptos;
|
||||
cargoHash = "sha256-4v6sCTPRxe7bO7uV3HwUC8P1UsG8ydIvZ4rG2kU22zA=";
|
||||
|
||||
nativeBuildInputs = with pkgs; [
|
||||
pkg-config
|
||||
openssl
|
||||
];
|
||||
|
||||
doCheck = false;
|
||||
};
|
||||
|
||||
buildPkgs = with pkgs; [
|
||||
(rust-bin.fromRustupToolchainFile ./rust-toolchain.toml)
|
||||
cargo-leptos-build
|
||||
clang
|
||||
sass
|
||||
openssl
|
||||
postgresql
|
||||
imagemagick
|
||||
pkg-config
|
||||
];
|
||||
in
|
||||
{
|
||||
devShells.default = pkgs.mkShell {
|
||||
LIBCLANG_PATH = pkgs.lib.makeLibraryPath [ pkgs.llvmPackages_latest.libclang.lib ];
|
||||
|
||||
buildInputs = with pkgs; buildPkgs ++ [
|
||||
diesel-cli
|
||||
];
|
||||
|
||||
shellHook = ''
|
||||
set -a
|
||||
[[ -f .env ]] && source .env
|
||||
set +a
|
||||
'';
|
||||
};
|
||||
|
||||
packages.default = pkgs.rustPlatform.buildRustPackage {
|
||||
name = "libretunes";
|
||||
src = ./.;
|
||||
|
||||
cargoLock = {
|
||||
lockFile = ./Cargo.lock;
|
||||
};
|
||||
|
||||
LIBCLANG_PATH = pkgs.lib.makeLibraryPath [ pkgs.llvmPackages_latest.libclang.lib ];
|
||||
|
||||
nativeBuildInputs = with pkgs; buildPkgs ++ [
|
||||
makeWrapper
|
||||
];
|
||||
|
||||
buildInputs = with pkgs; [
|
||||
openssl
|
||||
imagemagick
|
||||
];
|
||||
|
||||
# TODO enable --release builds
|
||||
# Creates an issue with cargo-leptos trying to create cache directories
|
||||
# See https://github.com/leptos-rs/cargo-leptos/issues/79
|
||||
buildPhase = ''
|
||||
cargo-leptos build --precompress #--release
|
||||
'';
|
||||
|
||||
installPhase = ''
|
||||
mkdir -p $out/bin
|
||||
install -t $out target/debug/libretunes
|
||||
cp -r target/site $out/site
|
||||
|
||||
makeWrapper $out/libretunes $out/bin/libretunes \
|
||||
--set LEPTOS_SITE_ROOT $out/site
|
||||
'';
|
||||
|
||||
doCheck = false;
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
@ -1,4 +1,3 @@
|
||||
|
||||
[toolchain]
|
||||
channel = "nightly"
|
||||
targets = ["wasm32-unknown-unknown"]
|
||||
|
||||
|
||||
@ -1,14 +1,11 @@
|
||||
use crate::models::Artist;
|
||||
use crate::components::dashboard_tile::DashboardTile;
|
||||
use serde::{Serialize, Deserialize};
|
||||
|
||||
use chrono::NaiveDate;
|
||||
|
||||
/// Holds information about an album
|
||||
///
|
||||
/// Intended to be used in the front-end
|
||||
|
||||
#[derive(Serialize, Deserialize, Clone)]
|
||||
pub struct AlbumData {
|
||||
/// Album id
|
||||
pub id: i32,
|
||||
|
||||
@ -1,33 +0,0 @@
|
||||
use leptos::*;
|
||||
use crate::albumdata::AlbumData;
|
||||
use crate::songdata::SongData;
|
||||
|
||||
use cfg_if::cfg_if;
|
||||
|
||||
cfg_if! {
|
||||
if #[cfg(feature = "ssr")] {
|
||||
use leptos::server_fn::error::NoCustomError;
|
||||
use crate::database::get_db_conn;
|
||||
}
|
||||
}
|
||||
|
||||
#[server(endpoint = "album/get")]
|
||||
pub async fn get_album(id: i32) -> Result<AlbumData, ServerFnError> {
|
||||
use crate::models::Album;
|
||||
let db_con = &mut get_db_conn();
|
||||
let album = Album::get_album_data(id,db_con)
|
||||
.map_err(|e| ServerFnError::<NoCustomError>::ServerError(format!("Error getting album: {}", e)))?;
|
||||
Ok(album)
|
||||
}
|
||||
|
||||
#[server(endpoint = "album/get_songs")]
|
||||
pub async fn get_songs(id: i32) -> Result<Vec<SongData>, ServerFnError> {
|
||||
use crate::models::Album;
|
||||
use crate::auth::get_logged_in_user;
|
||||
let user = get_logged_in_user().await?;
|
||||
let db_con = &mut get_db_conn();
|
||||
// TODO: NEEDS SONG DATA QUERIES
|
||||
let songdata = Album::get_song_data(id,user,db_con)
|
||||
.map_err(|e| ServerFnError::<NoCustomError>::ServerError(format!("Error getting song data: {}", e)))?;
|
||||
Ok(songdata)
|
||||
}
|
||||
@ -1,4 +1,3 @@
|
||||
pub mod history;
|
||||
pub mod profile;
|
||||
pub mod songs;
|
||||
pub mod album;
|
||||
|
||||
@ -7,7 +7,6 @@ use leptos_router::*;
|
||||
use crate::pages::login::*;
|
||||
use crate::pages::signup::*;
|
||||
use crate::pages::profile::*;
|
||||
use crate::pages::albumpage::*;
|
||||
use crate::error_template::{AppError, ErrorTemplate};
|
||||
use crate::util::state::GlobalState;
|
||||
|
||||
@ -45,7 +44,6 @@ pub fn App() -> impl IntoView {
|
||||
<Route path="search" view=Search />
|
||||
<Route path="user/:id" view=Profile />
|
||||
<Route path="user" view=Profile />
|
||||
<Route path="album/:id" view=AlbumPage />
|
||||
</Route>
|
||||
<Route path="/login" view=Login />
|
||||
<Route path="/signup" view=Signup />
|
||||
|
||||
@ -19,11 +19,6 @@ use crate::users::UserCredentials;
|
||||
/// Returns a Result with the error message if the user could not be created
|
||||
#[server(endpoint = "signup")]
|
||||
pub async fn signup(new_user: User) -> Result<(), ServerFnError> {
|
||||
// Check LIBRETUNES_DISABLE_SIGNUP env var
|
||||
if std::env::var("LIBRETUNES_DISABLE_SIGNUP").is_ok_and(|v| v == "true") {
|
||||
return Err(ServerFnError::<NoCustomError>::ServerError("Signup is disabled".to_string()));
|
||||
}
|
||||
|
||||
use crate::users::create_user;
|
||||
|
||||
// Ensure the user has no id, and is not a self-proclaimed admin
|
||||
@ -92,7 +87,6 @@ pub async fn logout() -> Result<(), ServerFnError> {
|
||||
auth_session.logout().await
|
||||
.map_err(|e| ServerFnError::<NoCustomError>::ServerError(format!("Error getting auth session: {}", e)))?;
|
||||
|
||||
leptos_axum::redirect("/login");
|
||||
Ok(())
|
||||
}
|
||||
|
||||
|
||||
@ -8,4 +8,3 @@ pub mod upload;
|
||||
pub mod song_list;
|
||||
pub mod loading;
|
||||
pub mod error;
|
||||
pub mod album_info;
|
||||
@ -1,25 +0,0 @@
|
||||
use leptos::leptos_dom::*;
|
||||
use leptos::*;
|
||||
use crate::albumdata::AlbumData;
|
||||
|
||||
#[component]
|
||||
pub fn AlbumInfo(albumdata: AlbumData) -> impl IntoView {
|
||||
view! {
|
||||
<div class="album-info">
|
||||
<img class="album-image" src={albumdata.image_path} alt="dashboard-tile" />
|
||||
<div class="album-body">
|
||||
<p class="album-title">{albumdata.title}</p>
|
||||
<div class="album-artists">
|
||||
{
|
||||
albumdata.artists.iter().map(|artist| {
|
||||
view! {
|
||||
<a class="album-artist" href={format!("/artist/{}", artist.id.unwrap())}>{artist.name.clone()}</a>
|
||||
}
|
||||
}).collect::<Vec<_>>()
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}.into_view()
|
||||
}
|
||||
|
||||
@ -1,8 +1,6 @@
|
||||
use leptos::leptos_dom::*;
|
||||
use leptos::*;
|
||||
use leptos_icons::*;
|
||||
use crate::auth::logout;
|
||||
use crate::util::state::GlobalState;
|
||||
|
||||
#[component]
|
||||
pub fn Personal() -> impl IntoView {
|
||||
@ -16,66 +14,18 @@ pub fn Personal() -> impl IntoView {
|
||||
#[component]
|
||||
pub fn Profile() -> impl IntoView {
|
||||
let (dropdown_open, set_dropdown_open) = create_signal(false);
|
||||
let user = GlobalState::logged_in_user();
|
||||
|
||||
let open_dropdown = move |_| {
|
||||
set_dropdown_open.update(|value| *value = !*value);
|
||||
log!("opened dropdown");
|
||||
};
|
||||
|
||||
let user_profile_picture = move || {
|
||||
user.get().and_then(|user| {
|
||||
if let Some(user) = user {
|
||||
if user.id.is_none() {
|
||||
return None;
|
||||
}
|
||||
Some(format!("/assets/images/profile/{}.webp", user.id.unwrap()))
|
||||
} else {
|
||||
None
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
view! {
|
||||
<div class="profile-container">
|
||||
<div class="profile-name">
|
||||
<Suspense
|
||||
fallback=|| view!{
|
||||
<h1>Not Logged In</h1>
|
||||
}>
|
||||
<Show
|
||||
when=move || user.get().map(|user| user.is_some()).unwrap_or(false)
|
||||
fallback=|| view!{
|
||||
<h1>Not Logged In</h1>
|
||||
}>
|
||||
<h1>{move || user.get().map(|user| user.map(|user| user.username))}</h1>
|
||||
</Show>
|
||||
</Suspense>
|
||||
</div>
|
||||
<div class="profile-icon" on:click=open_dropdown>
|
||||
<Suspense fallback=|| view! { <Icon icon=icondata::CgProfile width="45" height="45"/> }>
|
||||
<Show
|
||||
when=move || user.get().map(|user| user.is_some()).unwrap_or(false)
|
||||
fallback=|| view! { <Icon icon=icondata::CgProfile width="45" height="45"/> }
|
||||
>
|
||||
<object class="profile-image" data={user_profile_picture} type="image/webp">
|
||||
<Icon class="profile-image" icon=icondata::CgProfile width="45" height="45"/>
|
||||
</object>
|
||||
</Show>
|
||||
</Suspense>
|
||||
<Icon icon=icondata::CgProfile />
|
||||
</div>
|
||||
<div class="dropdown-container" style={move || if dropdown_open() {"display: flex"} else {"display: none"}}>
|
||||
<Suspense
|
||||
fallback=|| view!{
|
||||
<DropDownNotLoggedIn />
|
||||
}>
|
||||
<Show
|
||||
when=move || user.get().map(|user| user.is_some()).unwrap_or(false)
|
||||
fallback=|| view!{
|
||||
<DropDownNotLoggedIn />
|
||||
}>
|
||||
<DropDownLoggedIn />
|
||||
</Show>
|
||||
</Suspense>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@ -83,33 +33,10 @@ pub fn Profile() -> impl IntoView {
|
||||
#[component]
|
||||
pub fn DropDownNotLoggedIn() -> impl IntoView {
|
||||
view! {
|
||||
<div class="dropdown-logged">
|
||||
<h1>Not Logged In</h1>
|
||||
<div class="dropdown-not-logged">
|
||||
<h1>Not Logged in!</h1>
|
||||
<a href="/login"><button class="auth-button">Log In</button></a>
|
||||
<a href="/signup"><button class="auth-button">Sign Up</button></a>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
#[component]
|
||||
pub fn DropDownLoggedIn() -> impl IntoView {
|
||||
|
||||
let logout = move |_| {
|
||||
spawn_local(async move {
|
||||
let result = logout().await;
|
||||
if let Err(err) = result {
|
||||
log!("Error logging out: {:?}", err);
|
||||
} else {
|
||||
let user = GlobalState::logged_in_user();
|
||||
user.refetch();
|
||||
log!("Logged out successfully");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
view! {
|
||||
<div class="dropdown-logged">
|
||||
<h1>"Logged In"</h1>
|
||||
<button on:click=logout class="auth-button">Log Out</button>
|
||||
<a href="/signup"><button class="auth-button">Sign up</button></a>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,152 @@
|
||||
use html::Li;
|
||||
use leptos::*;
|
||||
use crate::search::search;
|
||||
use crate::song::Song;
|
||||
use crate::models::Album;
|
||||
use crate::models::Artist;
|
||||
use crate::models::Song;
|
||||
use crate::util::state::GlobalState;
|
||||
use leptos::ev::*;
|
||||
use leptos::leptos_dom::*;
|
||||
use leptos_icons::*;
|
||||
|
||||
const OPTIONS_BTN_SIZE: &str = "2.5rem";
|
||||
|
||||
#[component]
|
||||
pub fn Search() -> impl IntoView {
|
||||
|
||||
let status = GlobalState::play_status();
|
||||
|
||||
let search_query = create_rw_signal(String::new());
|
||||
let search_results = create_rw_signal((Vec::<(Album, f32)>::new(), Vec::<(Artist, f32)>::new(), Vec::<(Song, f32)>::new()));
|
||||
let search_limit = 10;
|
||||
|
||||
let on_input = move |e: Event| {
|
||||
search_query.set(event_target_value(&e));
|
||||
|
||||
log!("Search Query: {:?}", search_query.get_untracked());
|
||||
|
||||
spawn_local(async move {
|
||||
log!("Searching for: {:?}", search_query.get_untracked());
|
||||
let results = search(search_query.get_untracked(), search_limit).await;
|
||||
|
||||
match results {
|
||||
Ok((albums, artists, songs)) => {
|
||||
search_results.set((albums, artists, songs));
|
||||
}
|
||||
Err(err) => {
|
||||
log!("Error searching albums: {:?}", err);
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
let on_disabled = move |_e: FocusEvent| {
|
||||
status.update(|status| {
|
||||
status.search_active = false;
|
||||
});
|
||||
log!("Search Bar Disabled");
|
||||
};
|
||||
|
||||
let on_enabled = move |_e: FocusEvent| {
|
||||
status.update(|status| {
|
||||
status.search_active = true;
|
||||
});
|
||||
log!("Search Bar Enabled");
|
||||
};
|
||||
|
||||
let prevent_focus = move |e: MouseEvent| {
|
||||
e.prevent_default();
|
||||
};
|
||||
|
||||
view! {
|
||||
<div class="search-container home-component">
|
||||
<h1>Searching...</h1>
|
||||
<div class="search-bar">
|
||||
<input type="search" placeholder="Search" on:input=on_input on:blur=on_disabled on:focus=on_enabled/>
|
||||
</div>
|
||||
<div class="search-results">
|
||||
// Display 3 columns of search results: songs, albums, and artists
|
||||
<ul class="search-result-list">
|
||||
{move || search_results.with(|results| -> Vec<leptos::HtmlElement<Li>> {
|
||||
let mut song_list = Vec::new();
|
||||
for (song, _) in results.2.clone() {
|
||||
song_list.push(view! {
|
||||
<li class="search-result">
|
||||
<div class="result-container">
|
||||
<Song song_image_path=match song.image_path.clone() {
|
||||
Some(path) => path,
|
||||
None => "".to_string()
|
||||
} song_title=song.title.clone() song_artist="".to_string() />
|
||||
<div class="right-side-result">
|
||||
<div class="search-item-type">
|
||||
"(Song)"
|
||||
</div>
|
||||
<button class="search-result-options" on:mousedown=prevent_focus>
|
||||
<Icon class="search-result-options-icon" width=OPTIONS_BTN_SIZE height=OPTIONS_BTN_SIZE icon=icondata::BsThreeDotsVertical />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
});
|
||||
}
|
||||
song_list
|
||||
})}
|
||||
</ul>
|
||||
<ul class="search-result-list">
|
||||
{move || search_results.with(|results| -> Vec<leptos::HtmlElement<Li>> {
|
||||
let mut album_list = Vec::new();
|
||||
for (album, _) in results.0.clone() {
|
||||
album_list.push(view! {
|
||||
<li class="search-result">
|
||||
<div class="result-container">
|
||||
<div class="search-result-album">
|
||||
{album.title.clone()}
|
||||
{match album.release_date {
|
||||
Some(date) => format!(" ({})", date),
|
||||
None => "".to_string()
|
||||
}}
|
||||
</div>
|
||||
<div class="right-side-result">
|
||||
<div class="search-item-type">
|
||||
"(Album)"
|
||||
</div>
|
||||
<button class="search-result-options" on:mousedown=prevent_focus>
|
||||
<Icon class="search-result-options-icon" width=OPTIONS_BTN_SIZE height=OPTIONS_BTN_SIZE icon=icondata::BsThreeDotsVertical />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
});
|
||||
}
|
||||
album_list
|
||||
})}
|
||||
</ul>
|
||||
<ul class="search-result-list">
|
||||
{move || search_results.with(|results| -> Vec<leptos::HtmlElement<Li>> {
|
||||
let mut artist_list = Vec::new();
|
||||
for (artist, _) in results.1.clone() {
|
||||
artist_list.push(view! {
|
||||
<li class="search-result">
|
||||
<div class="result-container">
|
||||
<div class="search-result-artist">
|
||||
{artist.name.clone()}
|
||||
</div>
|
||||
<div class="right-side-result">
|
||||
<div class="search-item-type">
|
||||
"(Artist)"
|
||||
</div>
|
||||
<button class="search-result-options" on:mousedown=prevent_focus>
|
||||
<Icon class="search-result-options-icon" width=OPTIONS_BTN_SIZE height=OPTIONS_BTN_SIZE icon=icondata::BsThreeDotsVertical />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
});
|
||||
}
|
||||
artist_list
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@ -124,7 +124,7 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
|
||||
>
|
||||
<ul class="artist_results search-results">
|
||||
{
|
||||
move || filtered_artists.get().iter().enumerate().map(|(_index,filtered_artist)| view! {
|
||||
move || filtered_artists.get().iter().enumerate().map(|(_index,(filtered_artist, _score))| view! {
|
||||
<Artist artist=filtered_artist.clone() artists=artists set_artists=set_artists set_filtered=set_filtered_artists/>
|
||||
}).collect::<Vec<_>>()
|
||||
}
|
||||
@ -142,7 +142,7 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
|
||||
>
|
||||
<ul class="album_results search-results">
|
||||
{
|
||||
move || filtered_albums.get().iter().enumerate().map(|(_index,filtered_album)| view! {
|
||||
move || filtered_albums.get().iter().enumerate().map(|(_index,(filtered_album, _score))| view! {
|
||||
<Album album=filtered_album.clone() _albums=albums set_albums=set_albums set_filtered=set_filtered_albums/>
|
||||
}).collect::<Vec<_>>()
|
||||
}
|
||||
@ -182,15 +182,15 @@ pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn Artist(artist: Artist, artists: ReadSignal<String>, set_artists: WriteSignal<String>, set_filtered: WriteSignal<Vec<Artist>>) -> impl IntoView {
|
||||
pub fn Artist(artist: Artist, artists: ReadSignal<String>, set_artists: WriteSignal<String>, set_filtered: WriteSignal<Vec<(Artist, f32)>>) -> impl IntoView {
|
||||
// Converts artist name to artist id and adds it to the artist input
|
||||
let add_artist = move |_| {
|
||||
//Create an empty string to hold previous artist ids
|
||||
let mut s: String = String::from("");
|
||||
//Get the current artist input
|
||||
let all_artirts: String = artists.get();
|
||||
let all_artists: String = artists.get();
|
||||
//Split the input into a vector of artists separated by commas
|
||||
let mut ids: Vec<&str> = all_artirts.split(",").collect();
|
||||
let mut ids: Vec<&str> = all_artists.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() {
|
||||
@ -227,7 +227,7 @@ pub fn Artist(artist: Artist, artists: ReadSignal<String>, set_artists: WriteSig
|
||||
}
|
||||
}
|
||||
#[component]
|
||||
pub fn Album(album: Album, _albums: ReadSignal<String>, set_albums: WriteSignal<String>, set_filtered: WriteSignal<Vec<Album>>) -> impl IntoView {
|
||||
pub fn Album(album: Album, _albums: ReadSignal<String>, set_albums: WriteSignal<String>, set_filtered: WriteSignal<Vec<(Album, f32)>>) -> impl IntoView {
|
||||
//Converts album title to album id to upload a song
|
||||
let add_album = move |_| {
|
||||
let value_str = match album.id.clone() {
|
||||
|
||||
@ -14,11 +14,10 @@ extern crate diesel_migrations;
|
||||
#[cfg(feature = "ssr")]
|
||||
#[tokio::main]
|
||||
async fn main() {
|
||||
use axum::{routing::get, Router, extract::Path, middleware::from_fn};
|
||||
use axum::{routing::get, Router, extract::Path};
|
||||
use leptos::*;
|
||||
use leptos_axum::{generate_route_list, LeptosRoutes};
|
||||
use libretunes::app::*;
|
||||
use libretunes::util::require_auth::require_auth_middleware;
|
||||
use libretunes::fileserv::{file_and_error_handler, get_asset_file, get_static_file, AssetType};
|
||||
use axum_login::tower_sessions::SessionManagerLayer;
|
||||
use tower_sessions_redis_store::{fred::prelude::*, RedisStore};
|
||||
@ -64,7 +63,6 @@ async fn main() {
|
||||
.route("/assets/audio/:song", get(|Path(song) : Path<String>| get_asset_file(song, AssetType::Audio)))
|
||||
.route("/assets/images/:image", get(|Path(image) : Path<String>| get_asset_file(image, AssetType::Image)))
|
||||
.route("/assets/*uri", get(|uri| get_static_file(uri, "")))
|
||||
.layer(from_fn(require_auth_middleware))
|
||||
.layer(auth_layer)
|
||||
.fallback(file_and_error_handler)
|
||||
.with_state(leptos_options);
|
||||
|
||||
145
src/models.rs
145
src/models.rs
@ -6,10 +6,8 @@ use cfg_if::cfg_if;
|
||||
cfg_if! {
|
||||
if #[cfg(feature = "ssr")] {
|
||||
use diesel::prelude::*;
|
||||
use crate::database::*;
|
||||
use crate::database::PgPooledConn;
|
||||
use std::error::Error;
|
||||
use crate::songdata::SongData;
|
||||
use crate::albumdata::AlbumData;
|
||||
}
|
||||
}
|
||||
|
||||
@ -500,7 +498,7 @@ impl Album {
|
||||
Ok(())
|
||||
}
|
||||
|
||||
/// Get songs by this album from the database
|
||||
/// Get songs by this artist from the database
|
||||
///
|
||||
/// The `id` field of this album must be present (Some) to get songs
|
||||
///
|
||||
@ -527,150 +525,13 @@ impl Album {
|
||||
|
||||
Ok(my_songs)
|
||||
}
|
||||
|
||||
/// Obtain an album from its albumid
|
||||
/// # Arguments
|
||||
///
|
||||
/// * `album_id` - The id of the album to select
|
||||
/// * `conn` - A mutable reference to a database connection
|
||||
///
|
||||
/// # Returns
|
||||
///
|
||||
/// * `Result<Album, Box<dyn Error>>` - A result indicating success with the desired album, or an error
|
||||
///
|
||||
#[cfg(feature = "ssr")]
|
||||
pub fn get_album_data(album_id: i32, conn: &mut PgPooledConn) -> Result<AlbumData, Box<dyn Error>> {
|
||||
use crate::schema::*;
|
||||
|
||||
let artist_list: Vec<Artist> = album_artists::table
|
||||
.filter(album_artists::album_id.eq(album_id))
|
||||
.inner_join(artists::table.on(album_artists::artist_id.eq(artists::id)))
|
||||
.select(
|
||||
artists::all_columns
|
||||
)
|
||||
.load(conn)?;
|
||||
|
||||
// Get info of album
|
||||
let albuminfo = albums::table
|
||||
.filter(albums::id.eq(album_id))
|
||||
.first::<Album>(conn)?;
|
||||
|
||||
let img = albuminfo.image_path.unwrap_or("/assets/images/placeholders/MusicPlaceholder.svg".to_string());
|
||||
|
||||
let albumdata = AlbumData {
|
||||
id: albuminfo.id.unwrap(),
|
||||
title: albuminfo.title,
|
||||
artists: artist_list,
|
||||
release_date: albuminfo.release_date,
|
||||
image_path: img
|
||||
};
|
||||
|
||||
Ok(albumdata)
|
||||
}
|
||||
|
||||
/// Obtain an album from its albumid
|
||||
/// # Arguments
|
||||
///
|
||||
/// * `album_id` - The id of the album to select
|
||||
/// * `conn` - A mutable reference to a database connection
|
||||
///
|
||||
/// # Returns
|
||||
///
|
||||
/// * `Result<Album, Box<dyn Error>>` - A result indicating success with the desired album, or an error
|
||||
///
|
||||
#[cfg(feature = "ssr")]
|
||||
pub fn get_song_data(album_id: i32, user_like_dislike: Option<User>, conn: &mut PgPooledConn) -> Result<Vec<SongData>, Box<dyn Error>> {
|
||||
use crate::schema::*;
|
||||
use std::collections::HashMap;
|
||||
|
||||
let song_list = if let Some(user_like_dislike) = user_like_dislike {
|
||||
let user_like_dislike_id = user_like_dislike.id.unwrap();
|
||||
let song_list: Vec<(Album, Option<Song>, Option<Artist>, Option<(i32, i32)>, Option<(i32, i32)>)> =
|
||||
albums::table
|
||||
.find(album_id)
|
||||
.left_join(songs::table.on(albums::id.nullable().eq(songs::album_id)))
|
||||
.left_join(song_artists::table.inner_join(artists::table).on(songs::id.eq(song_artists::song_id)))
|
||||
.left_join(song_likes::table.on(songs::id.eq(song_likes::song_id).and(song_likes::user_id.eq(user_like_dislike_id))))
|
||||
.left_join(song_dislikes::table.on(songs::id.eq(song_dislikes::song_id).and(song_dislikes::user_id.eq(user_like_dislike_id))))
|
||||
.select((
|
||||
albums::all_columns,
|
||||
songs::all_columns.nullable(),
|
||||
artists::all_columns.nullable(),
|
||||
song_likes::all_columns.nullable(),
|
||||
song_dislikes::all_columns.nullable()
|
||||
))
|
||||
.order(songs::track.asc())
|
||||
.load(conn)?;
|
||||
song_list
|
||||
} else {
|
||||
let song_list: Vec<(Album, Option<Song>, Option<Artist>)> =
|
||||
albums::table
|
||||
.find(album_id)
|
||||
.left_join(songs::table.on(albums::id.nullable().eq(songs::album_id)))
|
||||
.left_join(song_artists::table.inner_join(artists::table).on(songs::id.eq(song_artists::song_id)))
|
||||
.select((
|
||||
albums::all_columns,
|
||||
songs::all_columns.nullable(),
|
||||
artists::all_columns.nullable()
|
||||
))
|
||||
.order(songs::track.asc())
|
||||
.load(conn)?;
|
||||
|
||||
let song_list: Vec<(Album, Option<Song>, Option<Artist>, Option<(i32, i32)>, Option<(i32, i32)>)> =
|
||||
song_list.into_iter().map( |(album, song, artist)| (album, song, artist, None, None) ).collect();
|
||||
song_list
|
||||
};
|
||||
|
||||
let mut album_songs: HashMap<i32, SongData> = HashMap::with_capacity(song_list.len());
|
||||
|
||||
for (album, song, artist, like, dislike) in song_list {
|
||||
if let Some(song) = song {
|
||||
if let Some(stored_songdata) = album_songs.get_mut(&song.id.unwrap()) {
|
||||
// If the song is already in the map, update the artists
|
||||
if let Some(artist) = artist {
|
||||
stored_songdata.artists.push(artist);
|
||||
}
|
||||
} else {
|
||||
let like_dislike = match (like, dislike) {
|
||||
(Some(_), Some(_)) => Some((true, true)),
|
||||
(Some(_), None) => Some((true, false)),
|
||||
(None, Some(_)) => Some((false, true)),
|
||||
_ => None,
|
||||
};
|
||||
|
||||
let image_path = song.image_path.unwrap_or(
|
||||
album.image_path.clone().unwrap_or("/assets/images/placeholders/MusicPlaceholder.svg".to_string()));
|
||||
|
||||
let songdata = SongData {
|
||||
id: song.id.unwrap(),
|
||||
title: song.title,
|
||||
artists: artist.map(|artist| vec![artist]).unwrap_or_default(),
|
||||
album: Some(album),
|
||||
track: song.track,
|
||||
duration: song.duration,
|
||||
release_date: song.release_date,
|
||||
song_path: song.storage_path,
|
||||
image_path: image_path,
|
||||
like_dislike: like_dislike,
|
||||
};
|
||||
|
||||
album_songs.insert(song.id.unwrap(), songdata);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Sort the songs by date
|
||||
let mut songdata: Vec<SongData> = album_songs.into_values().collect();
|
||||
songdata.sort_by(|a, b| a.track.cmp(&b.track));
|
||||
Ok(songdata)
|
||||
}
|
||||
}
|
||||
|
||||
/// Model for a song
|
||||
#[cfg_attr(feature = "ssr", derive(Queryable, Selectable, Insertable))]
|
||||
#[cfg_attr(feature = "ssr", diesel(table_name = crate::schema::songs))]
|
||||
#[cfg_attr(feature = "ssr", diesel(check_for_backend(diesel::pg::Pg)))]
|
||||
#[derive(Serialize, Deserialize)]
|
||||
#[derive(Serialize, Deserialize, Clone, Debug)]
|
||||
pub struct Song {
|
||||
/// A unique id for the song
|
||||
#[cfg_attr(feature = "ssr", diesel(deserialize_as = i32))]
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
pub mod login;
|
||||
pub mod signup;
|
||||
pub mod profile;
|
||||
pub mod albumpage;
|
||||
|
||||
@ -1,87 +0,0 @@
|
||||
use leptos::leptos_dom::*;
|
||||
use leptos::*;
|
||||
use leptos_router::*;
|
||||
use crate::components::song_list::*;
|
||||
use crate::api::album::*;
|
||||
use crate::components::album_info::*;
|
||||
|
||||
|
||||
#[derive(Params, PartialEq)]
|
||||
struct AlbumParams {
|
||||
id: i32
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn AlbumPage() -> impl IntoView {
|
||||
let params = use_params::<AlbumParams>();
|
||||
|
||||
let id = move || {params.with(|params| {
|
||||
params.as_ref()
|
||||
.map(|params| params.id)
|
||||
.map_err(|e| e.clone())
|
||||
})
|
||||
};
|
||||
|
||||
let song_list = create_resource(
|
||||
id,
|
||||
|value| async move {
|
||||
match value {
|
||||
Ok(v) => {get_songs(v).await},
|
||||
Err(e) => {Err(ServerFnError::Request(format!("Error getting song data: {}", e).into()))},
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
let albumdata = create_resource(
|
||||
id,
|
||||
|value| async move {
|
||||
match value {
|
||||
Ok(v) => {get_album(v).await},
|
||||
Err(e) => {Err(ServerFnError::Request(format!("Error getting song data: {}", e).into()))},
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
view! {
|
||||
<div class="album-page-container">
|
||||
<div class="album-header">
|
||||
<Suspense
|
||||
fallback=move || view! { <p class="loading">"Loading..."</p> }
|
||||
>
|
||||
{move || {
|
||||
albumdata.with( |albumdata| {
|
||||
match albumdata {
|
||||
Some(Ok(s)) => {
|
||||
view! { <AlbumInfo albumdata=(*s).clone() /> }
|
||||
},
|
||||
Some(Err(e)) => {
|
||||
view! { <div class="error">{format!("Error loading album : {}",e)}</div> }.into_view()
|
||||
},
|
||||
None => {view! { }.into_view()}
|
||||
}
|
||||
})
|
||||
}}
|
||||
</Suspense>
|
||||
</div>
|
||||
|
||||
<Suspense
|
||||
fallback=move || view! { <p class="loading">"Loading..."</p> }
|
||||
>
|
||||
{move || {
|
||||
song_list.with( |song_list| {
|
||||
match song_list {
|
||||
Some(Ok(s)) => {
|
||||
view! { <SongList songs=(*s).clone()/> }
|
||||
},
|
||||
Some(Err(e)) => {
|
||||
view! { <div class="error">{format!("Error loading albums: : {}",e)}</div> }.into_view()
|
||||
},
|
||||
None => {view! { }.into_view()}
|
||||
}
|
||||
})
|
||||
}}
|
||||
</Suspense>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,7 +4,6 @@ use leptos::leptos_dom::*;
|
||||
use leptos::*;
|
||||
use leptos_icons::*;
|
||||
use crate::users::UserCredentials;
|
||||
use crate::components::loading::Loading;
|
||||
|
||||
#[component]
|
||||
pub fn Login() -> impl IntoView {
|
||||
@ -13,9 +12,6 @@ pub fn Login() -> impl IntoView {
|
||||
|
||||
let (show_password, set_show_password) = create_signal(false);
|
||||
|
||||
let loading = create_rw_signal(false);
|
||||
let error_msg = create_rw_signal(None);
|
||||
|
||||
let toggle_password = move |_| {
|
||||
set_show_password.update(|show_password| *show_password = !*show_password);
|
||||
log!("showing password");
|
||||
@ -28,9 +24,6 @@ pub fn Login() -> impl IntoView {
|
||||
let password1 = password.get();
|
||||
|
||||
spawn_local(async move {
|
||||
loading.set(true);
|
||||
error_msg.set(None);
|
||||
|
||||
let user_credentials = UserCredentials {
|
||||
username_or_email: username_or_email1,
|
||||
password: password1
|
||||
@ -42,7 +35,6 @@ pub fn Login() -> impl IntoView {
|
||||
if let Err(err) = login_result {
|
||||
// Handle the error here, e.g., log it or display to the user
|
||||
log!("Error logging in: {:?}", err);
|
||||
error_msg.set(Some(err.to_string()));
|
||||
|
||||
// Since we're not sure what the state is, manually refetch the user
|
||||
user.refetch();
|
||||
@ -56,13 +48,10 @@ pub fn Login() -> impl IntoView {
|
||||
log!("Navigated to home page after login");
|
||||
} else if let Ok(None) = login_result {
|
||||
log!("Invalid username or password");
|
||||
error_msg.set(Some("Invalid username or password".to_string()));
|
||||
|
||||
// User could be already logged in or not, so refetch the user
|
||||
user.refetch();
|
||||
}
|
||||
|
||||
loading.set(false);
|
||||
});
|
||||
};
|
||||
|
||||
@ -107,13 +96,7 @@ pub fn Login() -> impl IntoView {
|
||||
</Show>
|
||||
</div>
|
||||
<a href="" class="forgot-pw">Forgot Password?</a>
|
||||
<div class="error-msg" >{ move || error_msg.get() }</div>
|
||||
<Show
|
||||
when=move || !loading.get()
|
||||
fallback=move || view! { <Loading /> }
|
||||
>
|
||||
<input type="submit" value="Login" />
|
||||
</Show>
|
||||
<span class="go-to-signup">
|
||||
New here? <a href="/signup">Create an Account</a>
|
||||
</span>
|
||||
|
||||
@ -4,7 +4,6 @@ use crate::util::state::GlobalState;
|
||||
use leptos::leptos_dom::*;
|
||||
use leptos::*;
|
||||
use leptos_icons::*;
|
||||
use crate::components::loading::Loading;
|
||||
|
||||
#[component]
|
||||
pub fn Signup() -> impl IntoView {
|
||||
@ -14,9 +13,6 @@ pub fn Signup() -> impl IntoView {
|
||||
|
||||
let (show_password, set_show_password) = create_signal(false);
|
||||
|
||||
let loading = create_rw_signal(false);
|
||||
let error_msg = create_rw_signal(None);
|
||||
|
||||
let toggle_password = move |_| {
|
||||
set_show_password.update(|show_password| *show_password = !*show_password);
|
||||
log!("showing password");
|
||||
@ -34,16 +30,12 @@ pub fn Signup() -> impl IntoView {
|
||||
};
|
||||
log!("new user: {:?}", new_user);
|
||||
|
||||
loading.set(true);
|
||||
error_msg.set(None);
|
||||
|
||||
let user = GlobalState::logged_in_user();
|
||||
|
||||
spawn_local(async move {
|
||||
if let Err(err) = signup(new_user.clone()).await {
|
||||
// Handle the error here, e.g., log it or display to the user
|
||||
log!("Error signing up: {:?}", err);
|
||||
error_msg.set(Some(err.to_string()));
|
||||
|
||||
// Since we're not sure what the state is, manually refetch the user
|
||||
user.refetch();
|
||||
@ -57,8 +49,6 @@ pub fn Signup() -> impl IntoView {
|
||||
leptos_router::use_navigate()("/", Default::default());
|
||||
log!("Navigated to home page after signup")
|
||||
}
|
||||
|
||||
loading.set(false);
|
||||
});
|
||||
};
|
||||
|
||||
@ -109,13 +99,7 @@ pub fn Signup() -> impl IntoView {
|
||||
</button>
|
||||
</Show>
|
||||
</div>
|
||||
<div class="error-msg">{ move || error_msg.get() }</div>
|
||||
<Show
|
||||
when=move || !loading.get()
|
||||
fallback=move || view!{ <Loading /> }
|
||||
>
|
||||
<input type="submit" value="Sign Up" />
|
||||
</Show>
|
||||
<span class="go-to-login">
|
||||
Already Have an Account? <a href="/login" class="link" >Go to Login</a>
|
||||
</span>
|
||||
|
||||
@ -489,7 +489,7 @@ pub fn PlayBar() -> impl IntoView {
|
||||
|
||||
// Listen for key down events -- arrow keys don't seem to trigger key press events
|
||||
let _arrow_key_handle = window_event_listener(ev::keydown, move |e: ev::KeyboardEvent| {
|
||||
if e.key() == "ArrowRight" {
|
||||
if e.key() == "ArrowRight" && status.with_untracked(|status| status.search_active) == false {
|
||||
e.prevent_default();
|
||||
log!("Right arrow key pressed, skipping forward by {} seconds", ARROW_KEY_SKIP_TIME);
|
||||
|
||||
@ -502,7 +502,7 @@ pub fn PlayBar() -> impl IntoView {
|
||||
error!("Unable to skip forward: Unable to get current duration");
|
||||
}
|
||||
|
||||
} else if e.key() == "ArrowLeft" {
|
||||
} else if e.key() == "ArrowLeft" && status.with_untracked(|status| status.search_active) == false {
|
||||
e.prevent_default();
|
||||
log!("Left arrow key pressed, skipping backward by {} seconds", ARROW_KEY_SKIP_TIME);
|
||||
|
||||
@ -519,7 +519,7 @@ pub fn PlayBar() -> impl IntoView {
|
||||
|
||||
// Listen for space bar presses to play/pause
|
||||
let _space_bar_handle = window_event_listener(ev::keypress, move |e: ev::KeyboardEvent| {
|
||||
if e.key() == " " {
|
||||
if e.key() == " " && status.with_untracked(|status| status.search_active) == false {
|
||||
e.prevent_default();
|
||||
log!("Space bar pressed, toggling play/pause");
|
||||
|
||||
|
||||
@ -11,6 +11,8 @@ pub struct PlayStatus {
|
||||
pub playing: bool,
|
||||
/// Whether or not the queue is open
|
||||
pub queue_open: bool,
|
||||
/// Whether or not the search bar is active (useful for knowing when spacebar to play/pause, etc should be disabled)
|
||||
pub search_active: bool,
|
||||
/// A reference to the HTML audio element
|
||||
pub audio_player: Option<NodeRef<Audio>>,
|
||||
/// A queue of songs that have been played, ordered from oldest to newest
|
||||
@ -56,6 +58,7 @@ impl Default for PlayStatus {
|
||||
Self {
|
||||
playing: false,
|
||||
queue_open: false,
|
||||
search_active: false,
|
||||
audio_player: None,
|
||||
history: VecDeque::new(),
|
||||
queue: VecDeque::new(),
|
||||
|
||||
@ -39,10 +39,11 @@ if #[cfg(feature = "ssr")] {
|
||||
/// # Returns
|
||||
/// A Result containing a vector of albums if the search was successful, or an error if the search failed
|
||||
#[server(endpoint = "search_albums")]
|
||||
pub async fn search_albums(query: String, limit: i64) -> Result<Vec<Album>, ServerFnError> {
|
||||
pub async fn search_albums(query: String, limit: i64) -> Result<Vec<(Album, f32)>, ServerFnError> {
|
||||
use crate::schema::albums::dsl::*;
|
||||
|
||||
Ok(albums
|
||||
.select((albums::all_columns(), trgm_distance(title, query.clone())))
|
||||
.filter(trgm_similar(title, query.clone()))
|
||||
.order_by(trgm_distance(title, query))
|
||||
.limit(limit)
|
||||
@ -58,10 +59,11 @@ pub async fn search_albums(query: String, limit: i64) -> Result<Vec<Album>, Serv
|
||||
/// # Returns
|
||||
/// A Result containing a vector of artists if the search was successful, or an error if the search failed
|
||||
#[server(endpoint = "search_artists")]
|
||||
pub async fn search_artists(query: String, limit: i64) -> Result<Vec<Artist>, ServerFnError> {
|
||||
pub async fn search_artists(query: String, limit: i64) -> Result<Vec<(Artist, f32)>, ServerFnError> {
|
||||
use crate::schema::artists::dsl::*;
|
||||
|
||||
Ok(artists
|
||||
.select((artists::all_columns(), trgm_distance(name, query.clone())))
|
||||
.filter(trgm_similar(name, query.clone()))
|
||||
.order_by(trgm_distance(name, query))
|
||||
.limit(limit)
|
||||
@ -77,10 +79,11 @@ pub async fn search_artists(query: String, limit: i64) -> Result<Vec<Artist>, Se
|
||||
/// # Returns
|
||||
/// A Result containing a vector of songs if the search was successful, or an error if the search failed
|
||||
#[server(endpoint = "search_songs")]
|
||||
pub async fn search_songs(query: String, limit: i64) -> Result<Vec<Song>, ServerFnError> {
|
||||
pub async fn search_songs(query: String, limit: i64) -> Result<Vec<(Song, f32)>, ServerFnError> {
|
||||
use crate::schema::songs::dsl::*;
|
||||
|
||||
Ok(songs
|
||||
.select((songs::all_columns(), trgm_distance(title, query.clone())))
|
||||
.filter(trgm_similar(title, query.clone()))
|
||||
.order_by(trgm_distance(title, query))
|
||||
.limit(limit)
|
||||
@ -95,9 +98,10 @@ pub async fn search_songs(query: String, limit: i64) -> Result<Vec<Song>, Server
|
||||
/// `limit` - The maximum number of results to return for each type
|
||||
///
|
||||
/// # Returns
|
||||
/// A Result containing a tuple of vectors of albums, artists, and songs if the search was successful,
|
||||
/// A Result containing a tuple of vectors of albums, artists, and songs,
|
||||
/// along with respective similarity scores, if the search was successful.
|
||||
#[server(endpoint = "search")]
|
||||
pub async fn search(query: String, limit: i64) -> Result<(Vec<Album>, Vec<Artist>, Vec<Song>), ServerFnError> {
|
||||
pub async fn search(query: String, limit: i64) -> Result<(Vec<(Album, f32)>, Vec<(Artist, f32)>, Vec<(Song, f32)>), ServerFnError> {
|
||||
let albums = search_albums(query.clone(), limit);
|
||||
let artists = search_artists(query.clone(), limit);
|
||||
let songs = search_songs(query.clone(), limit);
|
||||
|
||||
@ -3,9 +3,9 @@ use leptos::*;
|
||||
#[component]
|
||||
pub fn Song(song_image_path: String, song_title: String, song_artist: String) -> impl IntoView {
|
||||
view!{
|
||||
<div class="queue-song">
|
||||
<div class="song">
|
||||
<img src={song_image_path} alt={song_title.clone()} />
|
||||
<div class="queue-song-info">
|
||||
<div class="song-info">
|
||||
<h3>{song_title}</h3>
|
||||
<p>{song_artist}</p>
|
||||
</div>
|
||||
|
||||
@ -117,7 +117,7 @@ pub async fn validate_user(credentials: UserCredentials) -> Result<Option<User>,
|
||||
|
||||
/// Get a user from the database by username or email
|
||||
/// Returns a Result with the user if found, None if not found, or an error if there was a problem
|
||||
#[server(endpoint = "find_user")]
|
||||
#[server(endpoint = "get_user")]
|
||||
pub async fn get_user(username_or_email: String) -> Result<Option<User>, ServerFnError> {
|
||||
let mut user = find_user(username_or_email).await?;
|
||||
|
||||
|
||||
@ -3,7 +3,6 @@ use cfg_if::cfg_if;
|
||||
cfg_if! {
|
||||
if #[cfg(feature = "ssr")] {
|
||||
pub mod audio;
|
||||
pub mod require_auth;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,46 +0,0 @@
|
||||
use axum::extract::Request;
|
||||
use axum::response::Response;
|
||||
use axum::body::Body;
|
||||
use axum::middleware::Next;
|
||||
use axum_login::AuthSession;
|
||||
use http::StatusCode;
|
||||
|
||||
use crate::auth_backend::AuthBackend;
|
||||
|
||||
use axum::extract::FromRequestParts;
|
||||
|
||||
// Things in pkg/ are allowed automatically. This includes the CSS/JS/WASM files
|
||||
const ALLOWED_PATHS: [&str; 5] = ["/login", "/signup", "/api/login", "/api/signup", "/favicon.ico"];
|
||||
|
||||
/**
|
||||
* Middleware to require authentication for all paths except those in ALLOWED_PATHS
|
||||
*
|
||||
* If a user is not authenticated, they will be redirected to the login page
|
||||
*/
|
||||
pub async fn require_auth_middleware(req: Request, next: Next) -> Result<Response<Body>, (StatusCode, &'static str)> {
|
||||
let path = req.uri().path();
|
||||
|
||||
if !ALLOWED_PATHS.iter().any(|&x| x == path) {
|
||||
let (mut parts, body) = req.into_parts();
|
||||
|
||||
let auth_session = AuthSession::<AuthBackend>::from_request_parts(&mut parts, &())
|
||||
.await?;
|
||||
|
||||
if auth_session.user.is_none() {
|
||||
let response = Response::builder()
|
||||
.status(StatusCode::TEMPORARY_REDIRECT)
|
||||
.header("Location", "/login")
|
||||
.body(Body::empty())
|
||||
.map_err(|_| (StatusCode::INTERNAL_SERVER_ERROR, "Failed to build response"))?;
|
||||
|
||||
return Ok(response);
|
||||
}
|
||||
|
||||
let req = Request::from_parts(parts, body);
|
||||
let response = next.run(req).await;
|
||||
Ok(response)
|
||||
} else {
|
||||
let response = next.run(req).await;
|
||||
Ok(response)
|
||||
}
|
||||
}
|
||||
@ -1,80 +0,0 @@
|
||||
@import 'theme.scss';
|
||||
|
||||
.album-page-container {
|
||||
width: 90vw;
|
||||
|
||||
.album-header {
|
||||
height: 40vh;
|
||||
width: 65vw;
|
||||
margin: auto;
|
||||
|
||||
|
||||
padding:20px;
|
||||
|
||||
background-image: linear-gradient($accent-color, $background-color);
|
||||
border-radius: 15px;
|
||||
|
||||
.album-info {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.album-info {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-around;
|
||||
|
||||
.album-image {
|
||||
max-width: 80%;
|
||||
max-height: 80%;
|
||||
box-shadow: 10px 10px 50px -10px $background-color;
|
||||
}
|
||||
|
||||
.album-body {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: center;
|
||||
|
||||
.album-title {
|
||||
color: $text-controls-color;
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
margin:15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.album-artists {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-around;
|
||||
align-content: space-around;
|
||||
margin:15px;
|
||||
|
||||
color: $text-controls-color;
|
||||
font-size: 20px;
|
||||
|
||||
.album-artist {
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: $text-controls-color;
|
||||
}
|
||||
a:visited {
|
||||
color: $text-controls-color;
|
||||
}
|
||||
a:hover {
|
||||
color: $controls-hover-color;
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: $controls-click-color;
|
||||
}
|
||||
|
||||
}
|
||||
@ -8,7 +8,7 @@
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 27rem;
|
||||
height: 31rem;
|
||||
height: 30rem;
|
||||
transform: translate(-50%, -50%);
|
||||
background: $auth-containers;
|
||||
z-index: 1;
|
||||
@ -96,17 +96,6 @@
|
||||
color: #fff;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
.login-form .error-msg {
|
||||
color: $error-color;
|
||||
margin-top: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
.login-form .loading {
|
||||
margin-top: 4.5rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: calc(1.5rem - 10px);
|
||||
}
|
||||
.login-form input[type="submit"] {
|
||||
margin-top: 3rem;
|
||||
width: 100%;
|
||||
|
||||
@ -15,7 +15,6 @@
|
||||
@import 'song_list.scss';
|
||||
@import 'profile.scss';
|
||||
@import 'loading.scss';
|
||||
@import 'album_page.scss';
|
||||
|
||||
body {
|
||||
font-family: sans-serif;
|
||||
|
||||
@ -11,19 +11,9 @@
|
||||
border-radius: 0.4rem;
|
||||
margin: 0.2rem;
|
||||
min-height: 6rem;
|
||||
border: 0.2rem solid rgba(89, 89, 89, 0.199);
|
||||
border: 2px solid rgba(89, 89, 89, 0.199);
|
||||
padding: 0.5rem;
|
||||
|
||||
.profile-name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 0.5rem;
|
||||
h1 {
|
||||
font-size: 1.2rem;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-icon {
|
||||
display: inline-flex;
|
||||
padding: 0.2rem;
|
||||
@ -31,23 +21,17 @@
|
||||
font-size: 2rem;
|
||||
border-radius: 50%;
|
||||
transition: all 0.3s;
|
||||
height: 45;
|
||||
width: 45;
|
||||
height: max-content;
|
||||
margin-left: auto;
|
||||
.profile-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-icon:hover {
|
||||
transform: scale(1.05);
|
||||
transform: scale(1.1);
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.profile-icon:active {
|
||||
transform: scale(0.95);
|
||||
transform: scale(0.8);
|
||||
}
|
||||
.dropdown-container {
|
||||
position: absolute;
|
||||
@ -57,10 +41,10 @@
|
||||
border-radius: 0.5rem;
|
||||
width: 10rem;
|
||||
z-index: 1;
|
||||
background-color: #1c1c1c;
|
||||
border: 0.2rem solid rgba(89, 89, 89, 0.199);
|
||||
background-color: red;
|
||||
border: 1px solid grey;
|
||||
|
||||
.dropdown-logged {
|
||||
.dropdown-not-logged {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
@ -69,29 +53,21 @@
|
||||
h1 {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.profile-info {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
border-top: 0.2rem solid rgba(89, 89, 89, 0.199);
|
||||
border-bottom: 0.2rem solid rgba(89, 89, 89, 0.199);
|
||||
h1 {
|
||||
font-size: 1rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
.auth-button {
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
border-radius: 0.5rem;
|
||||
background-color: #1c1c1c;
|
||||
border: 0.2rem solid rgba(89, 89, 89, 0.199);
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dropdown-container:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -0.4rem;
|
||||
right: 0.92rem;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
transform: rotate(45deg);
|
||||
background-color: red;
|
||||
border-left: 1px solid grey;
|
||||
border-top: 1px solid grey;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,10 +5,12 @@
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 400px;
|
||||
height: calc(100% - 78.9px); /* Adjust height to fit the queue */
|
||||
height: calc(100% - 87px); /* Adjust height to fit the queue */
|
||||
background-color: #424242; /* Queue background color */
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
||||
overflow-y: auto; /* Add scroll bar when queue is too long */
|
||||
margin: 5px;
|
||||
border-radius: 5px;
|
||||
|
||||
.queue-header {
|
||||
background-color: #333; /* Header background color */
|
||||
@ -30,31 +32,6 @@
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
|
||||
.queue-song {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid #ccc; /* Separator line color */
|
||||
|
||||
img {
|
||||
max-width: 50px; /* Adjust maximum width for images */
|
||||
margin-right: 10px; /* Add spacing between image and text */
|
||||
border-radius: 5px; /* Add border radius to image */
|
||||
}
|
||||
|
||||
.queue-song-info {
|
||||
h3 {
|
||||
margin: 0; /* Remove default margin for heading */
|
||||
color: #fff; /* Adjust text color for song */
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0; /* Remove default margin for paragraph */
|
||||
color: #aaa; /* Adjust text color for artist */
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
@ -1,4 +1,92 @@
|
||||
@import "theme.scss";
|
||||
|
||||
.search-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
|
||||
.search-bar {
|
||||
input[type="search"] {
|
||||
width: 100%;
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 1rem;
|
||||
border: 1px solid $search-border;
|
||||
border-radius: 4px;
|
||||
transition: border-color 0.2s;
|
||||
|
||||
&:focus {
|
||||
border-color: $accent-color;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-results {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
|
||||
.search-result-list {
|
||||
flex: 1;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.search-result {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
border: 1px solid $search-border;
|
||||
border-radius: 4px;
|
||||
background-color: $search-background;
|
||||
transition: box-shadow 0.2s;
|
||||
margin: 0.2rem;
|
||||
min-height: 6rem;
|
||||
|
||||
.result-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.search-result-album,
|
||||
.search-result-artist {
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.search-item-type {
|
||||
font-size: 0.9rem;
|
||||
color: $text-controls-color;
|
||||
}
|
||||
|
||||
.right-side-result {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
|
||||
.search-result-options {
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
|
||||
.search-result-options-icon {
|
||||
fill: $text-controls-color;
|
||||
transition: fill 0.2s;
|
||||
|
||||
&:hover {
|
||||
fill: $controls-hover-color;
|
||||
}
|
||||
|
||||
&:active {
|
||||
fill: $controls-click-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 27rem;
|
||||
height: 36rem;
|
||||
height: 35rem;
|
||||
transform: translate(-50%, -50%);
|
||||
background: $auth-containers;
|
||||
z-index: 1;
|
||||
@ -92,17 +92,7 @@
|
||||
.signup-form .input-box input:focus ~ i {
|
||||
height: 2.6rem;
|
||||
}
|
||||
.signup-form .error-msg {
|
||||
color: $error-color;
|
||||
margin-top: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
.signup-form .loading {
|
||||
margin-top: 4.5rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: calc(1.5rem - 10px);
|
||||
}
|
||||
|
||||
.signup-form input[type="submit"] {
|
||||
margin-top: 3.5rem;
|
||||
width: 100%;
|
||||
|
||||
22
style/song.scss
Normal file
22
style/song.scss
Normal file
@ -0,0 +1,22 @@
|
||||
.song {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
max-width: 50px; /* Adjust maximum width for images */
|
||||
margin-right: 10px; /* Add spacing between image and text */
|
||||
border-radius: 5px; /* Add border radius to image */
|
||||
}
|
||||
|
||||
.song-info {
|
||||
h3 {
|
||||
margin: 0;
|
||||
color: #fff; /* Adjust text color for song */
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
color: #aaa; /* Adjust text color for artist */
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -10,9 +10,9 @@ $controls-click-color: #909090;
|
||||
$play-bar-background-color: #212121;
|
||||
$play-grad-start: #0a0533;
|
||||
$play-grad-end: $accent-color;
|
||||
$border-color: #7851ed;
|
||||
$queue-background-color: $play-bar-background-color;
|
||||
$error-color: red;
|
||||
$search-background: $play-bar-background-color;
|
||||
$search-border: #3f3f3f;
|
||||
|
||||
$auth-inputs: #796dd4;
|
||||
$auth-containers: white;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user