From 4ce3bb42e06ce35c5206ec8595336e9617d505f9 Mon Sep 17 00:00:00 2001 From: Samidy Date: Tue, 10 Mar 2026 08:53:09 +0300 Subject: [PATCH] i got bored idk --- CONTRIBUTING.md | 14 ++- DOCKER.md | 13 --- INSTANCES.md | 13 ++- README.md | 40 ++++--- index.html | 2 +- js/qobuz-api.js | 3 + legacy.html | 6 +- self-hosted-database.md | 251 ---------------------------------------- 8 files changed, 51 insertions(+), 291 deletions(-) delete mode 100644 self-hosted-database.md diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 2219b51..f8f1c0b 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -26,14 +26,16 @@ Thank you for your interest in contributing to Monochrome! This guide will help ### Quick Start -1. **Fork and clone the repository:** +1. Fork the Repository + +2. clone the repository: ```bash git clone https://github.com/YOUR_USERNAME/monochrome.git cd monochrome ``` -2. **Install dependencies:** +3. Install dependencies: ```bash bun install @@ -41,7 +43,7 @@ Thank you for your interest in contributing to Monochrome! This guide will help npm install ``` -3. **Start the development server:** +4. Start the development server: ```bash bun run dev @@ -49,7 +51,7 @@ Thank you for your interest in contributing to Monochrome! This guide will help npm run dev ``` -4. **Open your browser:** +5. Open your browser: Navigate to `http://localhost:5173/` --- @@ -118,12 +120,12 @@ monochrome/ - **`/js`** - All JavaScript source code - Keep modules focused and single-purpose - Use ES6+ features - - Add JSDoc comments for complex functions + - Keep the code easy to work with/maintain - **`/public`** - Static assets copied directly to build - Images should be optimized before adding - Keep file sizes reasonable - - Use appropriate formats (WebP where possible) + - Use appropriate formats (PNG where possible) --- diff --git a/DOCKER.md b/DOCKER.md index 74a4e5d..f6bd93e 100644 --- a/DOCKER.md +++ b/DOCKER.md @@ -10,19 +10,6 @@ docker compose up -d Visit `http://localhost:3000` -### With PocketBase - -```bash -cp .env.example .env -# Edit .env -- set PB_ADMIN_EMAIL and PB_ADMIN_PASSWORD -docker compose --profile pocketbase up -d -``` - -- Monochrome: `http://localhost:3000` -- PocketBase admin: `http://localhost:8090/_/` - -Configure PocketBase collections per [self-hosted-database.md](self-hosted-database.md). - ### Development ```bash diff --git a/INSTANCES.md b/INSTANCES.md index 7dfd12d..5570ee6 100644 --- a/INSTANCES.md +++ b/INSTANCES.md @@ -17,6 +17,14 @@ The official Monochrome instance maintained by the core team: ## Community Instances +### Community Monochrome Instances + +These instances are community instances of Monochrome & its WebUI: + +| Provider | URL | Status | +| ------------- | ------------------------------------------- | --------- | +| **Squid.WTF** | [mono.squid.wtf](https://mono.squid.wtf) | Community | + ### UI-Only Instances These instances provide the tidal-ui web interface, not monochrome: @@ -42,7 +50,7 @@ These are available API endpoints that can be used with Monochrome or other Hi-F | Provider | URL | Notes | | ----------------- | ----------------------------------- | ---------------------------------------------------------- | -| **Monochrome** | `https://monochrome-api.samidy.com` | Official API - [See Note](https://rentry.co/monochromeapi) | +| **Monochrome** | `https://monochrome-api.samidy.com` | Official API | | | `https://api.monochrome.tf` | Official API | | | `https://arran.monochrome.tf` | Official API | | **squid.wtf** | `https://triton.squid.wtf` | Community hosted | @@ -95,6 +103,5 @@ Want to add your instance to this list? ## Related Resources -- [Self-Hosting Guide](self-hosted-database.md) - Host your own instance - [Contributing Guide](CONTRIBUTE.md) - Contribute to the project -- [Main Repository](https://github.com/SamidyFR/monochrome) - Source code +- [Main Repository](https://github.com/monochrome-music/monochrome) - Source code diff --git a/README.md b/README.md index 41c6cb2..a30fd95 100644 --- a/README.md +++ b/README.md @@ -11,12 +11,11 @@

- Website • - Donate • - Features • - Installation • - Usage • - Self-Hosting • + Website - + Donate - + Features - + Usage - + Self-Hosting - Contributing

@@ -39,8 +38,14 @@ **Monochrome** is an open-source, privacy-respecting, ad-free [TIDAL](https://tidal.com) web UI, built on top of [Hi-Fi](https://github.com/binimum/hifi-api). It provides a beautiful, minimalist interface for streaming high-quality music without the clutter of traditional streaming platforms.

- - image + + Image of 'NASIR' By Nas On Monochrome + +

+ +

+ + Image of 'Jump Out' By Osamason On Monochrome

@@ -50,15 +55,16 @@ ### Audio Quality -- High-quality Hi-Res/lossless audio streaming +- High-quality High-Res/lossless audio streaming - Support for local music files -- Intelligent API caching for improved performance +- API caching for improved performance ### Interface - Dark, minimalist interface optimized for focus -- Customizable themes -- Community Theme Store +- Animated Album Covers For Supported Albums +- High-quality Music Videos +- Customizable themes & Community Theme Store - Accurate and unique audio visualizer - Offline-capable Progressive Web App (PWA) - Media Session API integration for system controls @@ -71,6 +77,8 @@ - Playlist import from other platforms - Public playlists for social sharing - Smart recommendations for new songs, albums & artists +- Infinite Recommendation Radio +- Explore Page (Hot & New) for discovering newly added music and whats trending overall or within each genre ### Lyrics & Metadata @@ -85,8 +93,10 @@ - Last.fm and ListenBrainz integration for scrobbling - Unreleased music from [ArtistGrid](https://artistgrid.cx) - Dynamic Discord Embeds +- Artist Biography + Social Links for learning more about your favorite artists - Multiple API instance support with failover + ### Power User Features - Keyboard shortcuts & Command Palette (CTRL+K) for power users @@ -107,7 +117,9 @@ For alternative instances, check [INSTANCES.md](INSTANCES.md). ## Self-Hosting -NOTE: We only allow authorized domains to use our firebase authentication system, so unless you switch to your own firebase project, accounts wont work. +NOTE: Accounts will not work on self-hosted instances. Our Appwrite authentication system only allows authorized domains. + +We had to heavily customize the authentication system and write several custom scripts to support features like SMTP and Google OAuth (which are currently bugged in Appwrite). Because of this, we can no longer provide a self-hostable accounts system. ### Option 1: Docker (Recommended) @@ -144,7 +156,7 @@ docker compose down docker compose up -d ``` -For PocketBase, development mode, and advanced setups, see [DOCKER.md](DOCKER.md). +For development mode and advanced setups, see [DOCKER.md](DOCKER.md). ### Option 2: Manual Installation diff --git a/index.html b/index.html index a387dd6..faa8018 100644 --- a/index.html +++ b/index.html @@ -5912,4 +5912,4 @@ - + \ No newline at end of file diff --git a/js/qobuz-api.js b/js/qobuz-api.js index ef0245c..dd27af1 100644 --- a/js/qobuz-api.js +++ b/js/qobuz-api.js @@ -1,6 +1,9 @@ // js/qobuz-api.js // Qobuz API integration for Monochrome Music + +// LMFAOOOO this shit is useless now qobuz killing accounts every time a dude takes their breath + const QOBUZ_API_BASE = 'https://qobuz.squid.wtf/api'; export class QobuzAPI { diff --git a/legacy.html b/legacy.html index b4fb7f9..d2d75f9 100644 --- a/legacy.html +++ b/legacy.html @@ -5,12 +5,12 @@ Redirecting... - + -

If you are not redirected, click here.

+

If you are not redirected, click here.

diff --git a/self-hosted-database.md b/self-hosted-database.md deleted file mode 100644 index 33a1774..0000000 --- a/self-hosted-database.md +++ /dev/null @@ -1,251 +0,0 @@ -# Self-Hosted Database Setup Guide - -This guide will show you how to set up your own authentication system and database for Monochrome accounts. - -> ⚠️ **Note:** You will need to enter the same configurations on each device where you want to use your custom database. - ---- - -## Table of Contents - -- [Prerequisites](#prerequisites) -- [Step 1: Setup Firebase Authentication](#step-1-setup-firebase-authentication) -- [Step 2: PocketBase Setup](#step-2-pocketbase-setup) -- [Step 3: Cloudflare Tunnel Setup](#step-3-cloudflare-tunnel-setup) -- [Step 4: Getting Configurations](#step-4-getting-configurations) -- [Step 5: Linking with Monochrome](#step-5-linking-with-monochrome) -- [Troubleshooting](#troubleshooting) - ---- - -## Prerequisites - -Before starting, ensure you have: - -- A computer to host the database (can also use a VPS) -- A [Firebase](https://firebase.google.com) account (for authentication only) -- [PocketBase](https://pocketbase.io) installed on your host machine -- A domain name (free options available at [DigitalPlat](https://domain.digitalplat.org/)) - -> 💡 **This guide assumes you're setting everything up on your local machine. The process is identical for a VPS.** - ---- - -## Step 1: Setup Firebase Authentication - -### 1.1 Create a Firebase Project - -1. Go to the [Firebase Console](https://console.firebase.google.com) -2. Create a new project -3. On the left sidebar, click **Build** → **Authentication** -4. Click **Get Started** - -### 1.2 Enable Sign-in Methods - -1. Go to the **Sign-in method** tab -2. Enable **Google** and **Email** providers -3. Set your project support email -4. Click **Save** - -### 1.3 Authorize Your Domain - -Firebase requires authorized domains for authentication: - -1. In **Authentication** → **Settings** → **Authorized domains** -2. Click **Add domain** -3. Add your hosting domain: - - If using the official Monochrome site: `monochrome.samidy.com` or your preferred mirror (e.g., `monochrome.tf`) - - If self-hosting the website: add your custom domain - -> 💡 `localhost` is usually added by default for local testing. You can leave this enabled. - ---- - -## Step 2: PocketBase Setup - -### 2.1 Install and Configure - -1. Download [PocketBase](https://pocketbase.io) and follow their setup guide -2. Access the PocketBase Admin UI (typically at `http://127.0.0.1:8090/_/`) - -### 2.2 Create Collections - -Create two collections: `DB_users` and `public_playlists` (do NOT use the default "users" collection) - -#### DB_users Fields - -| Field Name | Type | Description | -| --------------------- | --------------- | --------------------------------- | -| `firebase_id` | Plain Text | Links to Firebase user ID | -| `lastUpdated` | Number | Timestamp of last update | -| `history` | JSON | User listening history | -| `library` | JSON | User's saved library | -| `user_playlists` | JSON | User's custom playlists | -| `user_folders` | JSON | User's playlist folders | -| `deleted_playlists` | JSON | Soft-deleted playlists | -| `username` | Plain Text | Unique username | -| `display_name` | Plain Text | Profile display name | -| `avatar_url` | URL | Profile avatar URL | -| `banner` | URL | Profile banner URL | -| `status` | Plain Text | User status | -| `about` | Plain Text | About me bio | -| `website` | URL | Personal website URL | -| `lastfm_username` | Plain Text | Last.fm username | -| `privacy` | JSON | Privacy settings | -| `profile_data_source` | Select (lastfm) | Preferred data source for profile | -| `favorite_albums` | JSON | User's favorite albums | - -#### public_playlists Fields - -| Field Name | Type | Description | -| ---------------- | ---------- | -------------------------- | -| `firebase_id` | Plain Text | Creator's Firebase user ID | -| `addedAt` | Number | Creation timestamp | -| `numberOfTracks` | Number | Total track count | -| `OriginalId` | Plain Text | Original playlist ID | -| `publishedAt` | Number | Publication timestamp | -| `title` | Plain Text | Playlist title | -| `uid` | Plain Text | Unique identifier | -| `uuid` | Plain Text | UUID for the playlist | -| `tracks` | JSON | Playlist tracks data | -| `image` | URL | Playlist cover image | - -### 2.3 Configure API Rules - -Set the API rules for both collections to allow read/write access: - -**DB_users API Rules:** - -- List/Search Rule: `firebase_id = @request.query.f_id || username != ""` -- View Rule: `firebase_id = @request.query.f_id || username != ""` -- Create Rule: `firebase_id = @request.query.f_id` -- Update Rule: `firebase_id = @request.query.f_id` -- Delete Rule: `firebase_id = @request.query.f_id` - -**public_playlists API Rules:** - -- List/Search Rule: `uuid = @request.query.p_id` -- View Rule: `id != ""` -- Create Rule: `firebase_id = @request.query.f_id` -- Update Rule: `uid = @request.query.f_id` -- Delete Rule: `uid = @request.query.f_id` - ---- - -## Step 3: Cloudflare Tunnel Setup - -To make your PocketBase instance accessible from other devices securely: - -### 3.1 Create a Cloudflare Account - -1. Sign up at the [Cloudflare Dashboard](https://dash.cloudflare.com) -2. Set up **Zero Trust** (free plan available) - -### 3.2 Create a Tunnel - -1. In the Cloudflare dashboard, go to **Zero Trust** → **Networks** → **Connectors** -2. Select **Cloudflared** -3. Give your tunnel a name (e.g., `monochrome-database`) -4. Follow the installation guide for your operating system - -### 3.3 Configure Hostname - -1. In the tunnel setup, add a **Public Hostname** -2. **Subdomain:** Choose a subdomain (e.g., `db` for `db.yourdomain.com`) -3. **Domain:** Select your domain from the dropdown -4. **Service:** Select **HTTP** -5. **URL:** Enter your PocketBase local address (e.g., `127.0.0.1:8090`) - -> ⚠️ **Note:** Cloudflare requires a valid domain. Free `.pages.dev` domains won't work for this. Get a free domain at [DigitalPlat](https://domain.digitalplat.org/). - -6. Save the configuration - -Your database will now be accessible at your chosen domain! - ---- - -## Step 4: Getting Configurations - -### 4.1 Get Firebase Configuration - -1. In the [Firebase Console](https://console.firebase.google.com), open your project -2. Click the **⚙️ Settings** icon next to "Project Overview" -3. Select **Project settings** -4. In the **General** tab, scroll to "Your apps" -5. Click the **Web icon** (``) -6. Register your app (e.g., "Monochrome Auth") -7. Copy the `firebaseConfig` object: - -```javascript -const firebaseConfig = { - apiKey: 'AIzaSy...', - authDomain: 'your-project.firebaseapp.com', - databaseURL: 'https://your-project.firebaseio.com', - projectId: 'your-project', - storageBucket: 'your-project.appspot.com', - messagingSenderId: '...', - appId: '...', -}; -``` - -> ⚠️ **Copy only the object content inside the curly braces `{ ... }`** - -### 4.2 Get Database URL - -Simply copy your PocketBase domain from Cloudflare (e.g., `https://db.yourdomain.com`) - ---- - -## Step 5: Linking with Monochrome - -Now configure Monochrome to use your custom backend: - -1. Open Monochrome in your browser -2. Go to **Settings** (gear icon) -3. Click **ADVANCED: Custom Account Database** -4. Enter your configurations: - - **Database Config:** Your PocketBase domain (e.g., `https://db.yourdomain.com`) - - **Authentication Config:** The Firebase config JSON object from Step 4.1 -5. Click **Save** - -✅ **Done!** Your Monochrome instance is now connected to your custom database. - -> 📝 **Important:** Repeat Step 5 on every device where you want to use your custom database. - ---- - -## Troubleshooting - -### Cannot sign in - -- Ensure your domain is added to Firebase's authorized domains -- Check that the Firebase config JSON is correctly formatted - -### Database connection errors - -- Verify your Cloudflare tunnel is running -- Check that PocketBase is accessible at your domain -- Ensure API rules are configured correctly - -### Data not syncing - -- Make sure you're signed in with the same account on all devices -- Check the browser console for error messages -- Verify your database collections have the correct fields - ---- - -## Security Tips - -- Keep your Firebase API key secure (it's okay to expose it for client-side auth, but don't share it unnecessarily) -- Regularly backup your PocketBase database -- Use strong, unique passwords for your Cloudflare and Firebase accounts -- Consider enabling 2FA on all accounts - ---- - -## Need Help? - -- Join our [Discord community](https://monochrome.tf/discord) (if available) -- Open an issue on [GitHub](https://github.com/monochrome-music/monochrome/issues) -- Check existing [GitHub issues](https://github.com/monochrome-music/monochrome/issues) for solutions