🦝 Ranccoon Browser Extension

A powerful Chrome/Edge browser extension that helps you auto-fill startup submission forms with AI-powered field generation and view your website statistics directly from your browser.

✨ Features

🤖 AI-Powered Field Generation (NEW!)

• OpenAI Integration: Automatically generate missing fields using OpenAI GPT-4
• Smart Content Extraction: Analyzes website content to generate accurate information
• Auto-Generated Fields: Key Features, Use Cases, Integrations, Target Audience, and Pricing
• Image Extraction: Automatically captures favicon, logo, and hero images from your website
• Hero Screenshot Capture: Automatically captures a screenshot of your hero section for submissions
• Contextual Analysis: Uses existing domain data for better accuracy
• One-Click Enhancement: Generate all missing fields, extract images, and capture screenshots with a single button click

🚀 Auto-Fill Forms

• Dual-Mode Filling: Choose between standard pattern matching or AI-powered intelligent form analysis
• Smart Field Detection: Intelligently matches form fields using common naming patterns
• AI Form Analysis with Validation: Hybrid approach that tries standard fill first, then uses AI for remaining fields
• Self-Validation & Retry: AI automatically validates its work and retries failed fields up to 2 times
• Automatic AI Fallback: When standard patterns fail, automatically offers AI-powered filling
• Detailed Progress Tracking: Real-time updates showing each phase (Standard Fill → Validation → AI Retry → Validation)
• Comprehensive Reporting: Shows exact numbers of fields filled by standard vs AI methods
• Works on All Forms: Compatible with Product Hunt, BetaList, Hacker News, and any custom submission form

📊 Domain Statistics

• Real-Time Stats: View your Domain Rating (DR), backlinks, and referring domains
• Growth Tracking: Visual chart showing DR growth over time
• Activity Heatmap: GitHub-style activity heatmap showing rating changes
• Milestones: Track and celebrate your domain's achievements

📋 Copy & Paste Data

• Easy Copy: One-click copy buttons for all your domain information
• Quick Access: Copy title, tagline, description, tags, alternatives, and AI-generated fields instantly
• Formatted Data: Ready-to-paste content for any submission form
• AI-Enhanced Fields: Access generated features, use cases, integrations, target audience, and pricing
• Image Management: View and select from favicon, extracted images, hero screenshots, and custom uploads
• Custom Image Uploads: Upload your own images (logos, screenshots) for form submissions
• Auto-Screenshot: Hero section automatically captured during AI enhancement

🎯 Smart Organization

• Tabbed Interface: Organized tabs for Overview, Copy Data, Heatmap, and Milestones
• State Persistence: Remembers your selected domain and tab between sessions
• Multi-Domain Support: Switch between multiple domains seamlessly

📦 Installation

From Source

1. Clone the repository:

   git clone https://github.com/yourusername/ranccoon.com.git
   cd ranccoon.com/extension

2. Load the extension in Chrome/Edge:

   • Open Chrome/Edge and navigate to chrome://extensions/ or edge://extensions/
   • Enable "Developer mode" (toggle in top right)
   • Click "Load unpacked"
   • Select the extension folder

3. Get your API Key:

   • Visit https://www.ranccoon.com
   • Sign in to your account
   • Navigate to your profile settings
   • Generate or copy your API key

4. Configure the extension:

   • Click the Ranccoon extension icon in your browser
   • Click the settings icon (⚙️)
   • Paste your Ranccoon API key and save

5. Optional: Enable AI Field Generation:

   • Get an OpenAI API key from https://platform.openai.com/api-keys
   • Open extension settings (⚙️)
   • Scroll to "OpenAI Configuration (Optional)"
   • Paste your OpenAI API key and save
   • Test the connection to verify it works

🚀 Usage

Auto-Filling Forms

Option 1: Standard Auto-Fill

1. Navigate to any startup submission form (Product Hunt, BetaList, etc.)
2. Click the Ranccoon extension icon
3. Select your domain from the dropdown
4. Click "Auto-Fill Current Page" button
5. The extension will automatically fill all matching form fields using predefined patterns

Option 2: AI-Powered Auto-Fill with Validation & Retry

1. Navigate to any startup submission form

2. Click the Ranccoon extension icon

3. Select your domain from the dropdown

4. Click "Auto-Fill Using AI" button

5. The extension will execute a 4-phase intelligent filling process:

   Phase 1 - Standard Fill: Tries pattern-based auto-fill first

   Phase 2 - Validation: Analyzes which fields are still empty

   Phase 3 - AI Retry: Uses OpenAI to intelligently fill remaining fields

   Phase 4 - Self-Validation: Validates each AI attempt and retries up to 2 times

6. Get a detailed report showing:

   • How many fields were filled by standard patterns
   • How many were filled by AI
   • How many attempts were needed
   • Any remaining empty fields

AI-Powered Fallback: If standard auto-fill can't match any fields (0 fields filled), it will offer to use AI automatically. This requires an OpenAI API key.

Why This Approach Works Better:

• ✅ Efficiency: Standard patterns fill 80%+ of fields instantly without AI costs
• ✅ Reliability: AI focuses only on problematic fields, improving accuracy
• ✅ Self-Correcting: Automatic validation catches and fixes failed fills
• ✅ Cost-Effective: Only uses OpenAI tokens for fields that need it
• ✅ Transparent: Detailed reporting shows exactly what worked and what didn't
• ✅ Resilient: Multiple retry attempts with validation ensure maximum success

Viewing Statistics

1. Click the Ranccoon extension icon
2. Select your domain from the dropdown
3. Browse through the tabs:
   • Overview: See your DR, backlinks, and growth chart
   • Copy Data: Copy any domain information with one click
   • Heatmap: View your activity heatmap
   • Milestones: See all your achieved milestones

Copying Data

1. Open the extension popup
2. Navigate to the "Copy Data" tab
3. Click the copy button (📋) next to any field
4. The data is copied to your clipboard
5. Paste it wherever you need it

AI Field Enhancement (Optional)

Important: You must be on your website to use this feature!

1. Configure your OpenAI API key in settings (see installation step 5)
2. Navigate to your website in the current tab (the domain you have selected)
3. Open the extension popup
4. Select your domain from the dropdown
5. Navigate to the "Copy Data" tab
6. Click "AI Enhance Fields" button
7. The extension will:
   • Extract content from the current page you're viewing
   • Extract favicon and relevant images (logos, hero images)
   • Capture a screenshot of the hero section for submissions
   • Analyze the content using OpenAI GPT-4o-mini
   • Generate missing fields: Key Features, Use Cases, Integrations, Target Audience, and Pricing
   • Save the generated data, images, and screenshot for future use
8. Generated fields and images will appear in the Copy Data tab
9. View extracted image thumbnails in the "Extracted Images" section:
   • Favicon (yellow badge)
   • Logo images (green badge)
   • Hero images (blue badge)
   • Hero Screenshot (light blue badge) - automatically captured
   • Custom uploaded images (purple badge)
10. Upload your own images: Click the "Upload" button to add custom images (logo, screenshots, etc.)
11. Click on images to select/deselect which ones to use for uploads (selected images have a checkmark)
12. Delete custom uploaded images by hovering and clicking the × button
13. When auto-filling forms with file upload fields, only your selected images will be automatically uploaded

Notes:

• The AI enhancement feature requires an OpenAI API key and will consume tokens based on usage
• The feature uses GPT-4o-mini for cost-effective generation
• You MUST be on your actual website for accurate content and image extraction
• The extension will alert you if you're not on the correct domain
• Extracted images are saved and automatically used for file uploads in forms

🛠️ Technical Details

Architecture

• Manifest V3: Built with the latest Chrome extension manifest
• Vanilla JavaScript: No framework dependencies for fast performance
• Chrome Storage API: For secure API key storage and state persistence
• Content Scripts: For form detection and auto-filling

File Structure

extension/
├── manifest.json       # Extension configuration
├── popup.html          # Main popup interface
├── popup.js            # Popup logic and API calls
├── popup.css           # Popup styling
├── content.js          # Content script for form filling
├── openai-helper.js    # OpenAI API integration for field generation
├── background.js       # Service worker
├── options.html        # Settings page
├── options.js          # Settings logic (Ranccoon + OpenAI API keys)
├── options.css         # Settings styling
├── content-scripts/    # Content script modules
│   ├── field-mappings.js      # Field name patterns
│   ├── field-handlers.js      # Field filling logic
│   ├── smart-selectors.js     # Smart category/platform selection
│   ├── file-upload.js         # File upload handling
│   ├── validation.js          # Field validation and empty field detection
│   ├── ai-form-analyzer.js    # AI-powered form structure analysis
│   └── utils.js               # Utility functions
└── icons/              # Extension icons

API Endpoints Used

Ranccoon API:

• GET /api/extension/domains - List user's domains
• GET /api/extension/domains/[id]/info - Get domain information
• GET /api/extension/domains/[id]/ratings - Get rating history
• GET /api/extension/domains/[id]/heatmap - Get heatmap data
• GET /api/extension/verify - Verify API key

OpenAI API (Optional):

• POST https://api.openai.com/v1/chat/completions - Generate AI-enhanced fields
• GET https://api.openai.com/v1/models - Verify API key
• GET /api/extension/domains/[id]/milestones - Get milestones

Permissions

• storage: Store API key and user preferences
• activeTab: Access current tab for form filling
• scripting: Inject content scripts
• https://www.ranccoon.com/*: Communicate with Ranccoon API

🔒 Privacy & Security

• API Key Storage: Your API key is stored locally in your browser using Chrome's secure storage API
• No Data Collection: The extension doesn't collect or transmit any personal data
• Secure Communication: All API calls use HTTPS
• Local Processing: Form filling happens entirely in your browser

🐛 Troubleshooting

Extension not loading

• Make sure you've enabled Developer mode
• Check that all files are in the extension folder
• Verify manifest.json is valid JSON

API key not working

• Verify your API key is correct in settings
• Check that your account is active on ranccoon.com
• Ensure you have at least one domain added

Forms not filling

• Make sure you're on a page with a form
• Check browser console for errors (F12)
• If 0 fields are filled, the extension will offer AI-powered form detection
• For AI detection to work, you need an OpenAI API key configured
• Some forms with unusual structures may still require manual input

Data not loading

• Check your internet connection
• Verify your API key is valid
• Ensure you have domains added to your account

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Built for the Ranccoon platform
• Inspired by the need for faster startup submissions
• Thanks to all contributors and users

📞 Support

• Website: https://www.ranccoon.com
• Issues: GitHub Issues
• Email: support@ranccoon.com

🤝 Contributing

Contributions are welcome! Please see our Contributing Guidelines for details.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

---

Made with 🦝 by the Ranccoon team