BetaHub Widget Demo

📍 Try the feedback widget!

The BetaHub widget is now active on this page. You can open it in two ways:

Click the button below to test it right away
Use the floating button in the bottom-right corner

Note: This demo is connected to a real BetaHub project. Your submissions will be received!

✨ Features

Three feedback types: Bug Reports, Suggestions, and Support Tickets
Shadow DOM for complete CSS isolation
Beautiful pastel blue minimalistic design
Custom fields for game metadata (version, level, etc.)
Responsive design that works on any screen size
Zero dependencies - pure vanilla JavaScript
Easy integration with any web game engine (PixiJS, Phaser, etc.)

// Basic Usage
<script src="betahub-widget.js"></script>
<script>
  BetaHubWidget.init({
    projectId: 'your-project-id',
    authToken: 'tkn-your-auth-token',

    // Optional configuration
    apiBaseUrl: 'https://app.betahub.io',
    position: 'bottom-right', // button position
    buttonText: 'Feedback',

    // Contact information options
    userEmail: 'user@example.com',  // pre-filled email (optional)
    requireEmail: false,  // require email for bugs/suggestions
    showEmailField: 'auto',  // 'auto', 'always', 'never'

    // Custom fields (metadata sent with every submission)
    customFields: {
      gameVersion: '1.0.0',
      platform: 'web',
      userLevel: '15'
    }
  });
</script>

📦 Configuration Options

Required:

projectId - Your BetaHub project ID
authToken - Your authentication token (format: tkn-...)

Optional:

apiBaseUrl - API endpoint (default: https://app.betahub.io)
position - 'bottom-right', 'bottom-left', 'top-right', 'top-left' (default: 'bottom-right')
buttonText - Custom button text (default: 'Feedback')
customFields - Object with custom metadata to include with submissions
userEmail - Pre-filled user email (creates virtual user)
requireEmail - Require email for bugs/suggestions (default: false, tickets always require)
showEmailField - 'auto', 'always', 'never' (default: 'auto')

🔐 Getting Your Credentials

To use this widget with your BetaHub project:

Go to your BetaHub project dashboard
Navigate to Project → Integrations → Auth Tokens
Create a new auth token with permissions for:
- can_create_bug_report
- can_create_feature_request
Copy your project ID and the generated token
Use them in the widget initialization

🚀 BetaHub Feedback Widget

📍 Try the feedback widget!

✨ Features

🎮 PixiJS Game Integration Example

📦 Configuration Options

🔐 Getting Your Credentials