# MultiChat Overlay - Setup and Testing Instructions

This document provides instructions to set up and test the MultiChat Overlay application.

## 1. MySQL Database Setup

1.  **Install MySQL:** Ensure you have MySQL server installed and running on your system.
2.  **Create Database:** Log in to your MySQL server and create a new database.
    ```sql
    CREATE DATABASE multichat_overlay;
    ```
3.  **Create User (Optional but Recommended):** Create a dedicated MySQL user for the application and grant it privileges to the `multichat_overlay` database.
    ```sql
    CREATE USER 'multichat_user'@'localhost' IDENTIFIED BY 'your_secure_password';
    GRANT ALL PRIVILEGES ON multichat_overlay.* TO 'multichat_user'@'localhost';
    FLUSH PRIVILEGES;
    ```
4.  **Update `php/config.php`:** Open `/home/joe/MultiChatOverlay/php/config.php` and update the `DB_USER` and `DB_PASS` constants with your MySQL credentials.

## 2. PHP Development Server Setup

1.  **Install PHP:** Ensure you have PHP installed on your system (PHP 7.4+ recommended).
2.  **Start Server:** Navigate to the `/home/joe/MultiChatOverlay/php` directory in your terminal and start the PHP built-in web server:
    ```bash
    cd /home/joe/MultiChatOverlay/php
    php -S localhost:80 -t .
    ```
    *   **Note:** The `-t .` flag tells the server to use the current directory (`php/`) as the document root. This means your application will be accessible at `http://localhost/`.
    *   If port 80 is already in use, you can choose another port (e.g., `php -S localhost:8000 -t .`) and update the `BASE_URL` in `php/config.php` accordingly.

## 3. Configure Twitch API Credentials

1.  **Create Twitch Application:** Go to the Twitch Developer Console (dev.twitch.tv/console/apps) and create a new application.
    *   Set the **OAuth Redirect URLs** to `http://localhost/auth.php` (or `http://localhost:PORT/auth.php` if you're using a different port for your PHP server).
2.  **Get Client ID and Secret:** Note down your Client ID and generate a Client Secret.
3.  **Update `php/config.php`:** Open `/home/joe/MultiChatOverlay/php/config.php` and update the `TWITCH_CLIENT_ID`, `TWITCH_CLIENT_SECRET`, and `TWITCH_REDIRECT_URI` constants with your application's credentials.

## 4. Test the Application

1.  **Ensure PHP Server is Running:** Make sure your PHP development server is running as described in step 2.
2.  **Access Application:** Open your web browser and navigate to `http://localhost/`.
3.  **Login with Twitch:**
    *   Click on "Get Started" or navigate to `http://localhost/login`.
    *   Click "Login with Twitch".
    *   You will be redirected to Twitch for authorization. Ensure you grant the requested permissions (`user:read:email` and `chat:read`).
    *   You should then be redirected to the dashboard (`http://localhost/dashboard`).
4.  **Verify Dashboard:**
    *   Check if your Twitch username is displayed.
    *   Verify that the "Twitch: Connected" status is shown.
    *   Note the "Your Overlay URL" – it should now contain your `user_id`.
5.  **Test Twitch Chat Listener (Manual):**
    *   Open a new terminal.
    *   Navigate to the `/home/joe/MultiChatOverlay` directory.
    *   Activate your Python virtual environment: `source python/venv/bin/activate`
    *   Run the Twitch chat listener script, replacing placeholders with your actual values:
        ```bash
        export TWITCH_CLIENT_ID="YOUR_TWITCH_CLIENT_ID"
        export TWITCH_CLIENT_SECRET="YOUR_TWITCH_CLIENT_SECRET"
        python python/twitch_chat_listener.py "YOUR_TWITCH_ACCESS_TOKEN" "YOUR_TWITCH_CHANNEL_NAME" "YOUR_USER_ID_FROM_DASHBOARD"
        ```
        *   **Note:** You will need to manually retrieve your `TWITCH_ACCESS_TOKEN` from the MySQL database for now (e.g., by querying the `users` table).
        *   `YOUR_TWITCH_CHANNEL_NAME` is your Twitch username.
        *   `YOUR_USER_ID_FROM_DASHBOARD` is the `user_id` displayed in your overlay URL on the dashboard.
    *   Send a message in your Twitch channel. You should see the chat message printed in the terminal where `twitch_chat_listener.py` is running.

This completes the basic setup and verification of the Twitch login and chat listener. The next step will be to integrate the Node.js WebSocket server.