From 9b44c088b8e4833b15108a751d857a9742ad94f7 Mon Sep 17 00:00:00 2001 From: ramforth Date: Mon, 17 Nov 2025 00:46:15 +0100 Subject: [PATCH] chore: Added redirect URL. APP_BASE_URL set in .env --- .env.example | 2 ++ DEVELOPMENT_PLAN.md | 41 +++++++++++++++++------------------------ TASKS.md | 9 +++------ auth.py | 6 ++++-- config.py | 2 +- 5 files changed, 27 insertions(+), 33 deletions(-) diff --git a/.env.example b/.env.example index 1e7dce8..1552474 100644 --- a/.env.example +++ b/.env.example @@ -5,3 +5,5 @@ ENCRYPTION_KEY=your_32_byte_url_safe_base64_encoded_key_goes_here TWITCH_CLIENT_ID=your_twitch_client_id_goes_here TWITCH_CLIENT_SECRET=your_twitch_client_secret_goes_here + +APP_BASE_URL=http://localhost:8000 diff --git a/DEVELOPMENT_PLAN.md b/DEVELOPMENT_PLAN.md index fecc99b..7bde0e4 100644 --- a/DEVELOPMENT_PLAN.md +++ b/DEVELOPMENT_PLAN.md @@ -9,40 +9,33 @@ The goal is to create a service where streamers can log in using their platform ## 2. Technology Stack * **Team Communications:** Discord and Nextcloud, primarily. This can change. There's a list of links in the [README.md](README.md) -* **Backend:** Python 3.9+ (FastAPI) +* **Backend:** Python 3.13+ (FastAPI) * **Database:** SQLite (for initial development) with SQLAlchemy ORM * **Frontend:** Vanilla HTML, CSS, and JavaScript * **Chat Listeners:** `twitchio` (Twitch), `pytchat` (YouTube) ## 3. Implementation Roadmap -### Phase 1: Basic Setup & Twitch Chat Listener (Python) -1. **Project Structure:** Establish a clear directory structure for PHP, Python, Node.js, and static assets. -2. **Python Environment:** Set up a Python virtual environment and install `twitchio`. -3. **Twitch Chat Listener (Python Script):** Create a standalone Python script that connects to Twitch chat, listens for messages, and prints them to standard output. This script will be run as a background process. -4. **Twitch OAuth2 (Python):** Implement a simple Python script or a PHP endpoint to handle Twitch OAuth2 to obtain user access tokens. Store these securely in MySQL. +### Phase 1: User Authentication & Database (FastAPI) +1. **Project Skeleton:** Establish the core FastAPI application structure, dependencies, and version control. +2. **Database Schema:** Define the data models for users and settings using SQLAlchemy. +3. **Twitch OAuth2:** Implement the server-side OAuth2 flow within FastAPI to authenticate users and securely store encrypted tokens in the database. +4. **Session Management:** Create a system to manage logged-in user sessions. +5. **Basic Frontend:** Develop a simple login page. -### Phase 2: MySQL Database & User Management (PHP) -1. **MySQL Setup:** Set up a MySQL database and create a `users` table to store user information (Twitch ID, username, access token, refresh token). -2. **PHP Web Server:** Configure a basic PHP web server. -3. **User Registration/Login (PHP):** Implement PHP scripts for user registration and login, integrating with the MySQL database. -4. **Dashboard (PHP/HTML):** Create a basic dashboard where logged-in users can see their Twitch connection status and their unique overlay URL. +### Phase 2: User Dashboard & Configuration +1. **Dashboard UI:** Create a dashboard page accessible only to authenticated users. +2. **Settings API:** Build API endpoints for users to save and retrieve their overlay settings (e.g., custom CSS). +3. **Overlay URL Generation:** Display a unique, persistent overlay URL for each user on their dashboard. -### Phase 3: WebSocket Server (Node.js) & Overlay (HTML/CSS/JS) -1. **Node.js Environment:** Set up a Node.js environment and install `ws` (WebSocket library). -2. **WebSocket Server (Node.js):** Create a Node.js WebSocket server that: - * Accepts connections from overlay clients. - * Receives chat messages from the Python Twitch listener (via a simple inter-process communication mechanism, e.g., writing to a file or a local socket). - * Broadcasts messages to connected overlay clients. -3. **Overlay Frontend (HTML/CSS/JS):** Create a basic `overlay.html` that: - * Connects to the Node.js WebSocket server. - * Displays incoming chat messages. -4. **Inter-process Communication:** Implement a mechanism for the Python Twitch listener to send messages to the Node.js WebSocket server. +### Phase 3: Dynamic Listeners & Basic Overlay +1. **Dynamic Listener Manager:** Design and build a background service that starts and stops chat listener processes (`twitchio`, `pytchat`) based on user activity. +2. **Real-time Message Broadcasting:** Implement a WebSocket system within FastAPI to push chat messages to the correct user's overlay in real-time. +3. **Basic Overlay UI:** Create the `overlay.html` page that connects to the WebSocket and renders incoming chat messages. ### Phase 4: Integration & Refinement -1. **Dynamic Listener Management:** Develop a system (e.g., a PHP script or a Node.js API) to start and stop Python Twitch listener processes based on user activity. -2. **YouTube Integration:** Add YouTube chat listening capabilities (Python `pytchat`) and integrate with the existing system. This will be implemented after the core Twitch functionality is stable. -3. **Advanced Overlay Customization:** Implement options for users to customize their overlay. +1. **YouTube Integration:** Implement the full YouTube OAuth2 flow and integrate the `pytchat` listener into the dynamic listener manager. +2. **Advanced Overlay Customization:** Add more features for users to customize their overlay's appearance and behavior. ## 4. Requirements for Completion (Initial Version) diff --git a/TASKS.md b/TASKS.md index a1bc00f..5585cdf 100644 --- a/TASKS.md +++ b/TASKS.md @@ -20,21 +20,18 @@ If you want to use emojis for visibility, here's some I have used: ### To Do -* `[ ]` **1.3: Secure Token Storage:** Implement helper functions to `encrypt` and `decrypt` OAuth tokens before storing them in the database. * `[ ]` **1.4: Basic Session Management:** Create a simple session/JWT system to know *who* is logged in. -* `[ ]` **1.5: Login Frontend:** Create a basic `login.html` file with a "Login with Twitch" button. ### In Progress -* `[🧑‍🔧]` **1.2: Twitch OAuth API:** Create FastAPI endpoints for `/login/twitch` (redirect) and `/auth/twitch/callback` (handles token exchange). @ramforth - - - ### Done * `[✔️]` **1.0: Project Skeleton** - @ramforth * *Task:* Setup `main.py`, `requirements.txt`, and `.gitignore`. * `[✔️]` **1.1: Database Schema:** Define SQLAlchemy models for `User` (id, username, platform, encrypted_tokens) and `Settings`. @ramforth * `[✔️]` **1.1.5: Discord Overview:** Create an automated 'TASK-LIST' and post to Discord whenever someone pushes a change to the repository. @ramforth +* `[✔️]` **1.2: Twitch OAuth API:** Create FastAPI endpoints for `/login/twitch` (redirect) and `/auth/twitch/callback` (handles token exchange). @ramforth +* `[✔️]` **1.3: Secure Token Storage:** Implement helper functions to `encrypt` and `decrypt` OAuth tokens before storing them in the database. @ramforth +* `[✔️]` **1.5: Login Frontend:** Create a basic `login.html` file with a "Login with Twitch" button. @ramforth --- ## ⏳ Phase 2: User Dashboard & Configuration diff --git a/auth.py b/auth.py index d258f8f..dc9c6a7 100644 --- a/auth.py +++ b/auth.py @@ -101,5 +101,7 @@ async def auth_twitch_callback(code: str, state: str, request: Request, db: Sess db.add(user) db.commit() - - return {"message": f"Successfully authenticated as {user_data['display_name']}. User data has been saved."} \ No newline at end of file + + # Redirect to a future dashboard page for a better user experience + # For now, we can redirect back to the home page. + return RedirectResponse(url="/") \ No newline at end of file diff --git a/config.py b/config.py index baac62d..4fc6b59 100644 --- a/config.py +++ b/config.py @@ -13,6 +13,6 @@ class Settings: TWITCH_CLIENT_SECRET: str = os.getenv("TWITCH_CLIENT_SECRET") # The full URL where our app is running, needed for the redirect_uri - APP_BASE_URL: str = "http://localhost:8000" # Update for production + APP_BASE_URL: str = os.getenv("APP_BASE_URL", "http://localhost:8000") settings = Settings() \ No newline at end of file