Update constants.py
Browse files- constants.py +90 -27
 
    	
        constants.py
    CHANGED
    
    | 
         @@ -1,36 +1,69 @@ 
     | 
|
| 1 | 
         
            -
             
     | 
| 2 | 
         
            -
             
     | 
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 3 | 
         | 
| 4 | 
         
            -
             
     | 
| 5 | 
         
            -
            It contains static data that defines the application's behavior, such as system prompts,
         
     | 
| 6 | 
         
            -
            available AI models, and UI elements.
         
     | 
| 7 | 
         | 
| 8 | 
         
            -
             
     | 
| 9 | 
         
            -
             
     | 
| 10 | 
         
            -
             
     | 
| 11 | 
         
            -
            "" 
     | 
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 12 | 
         | 
| 13 | 
         
            -
            #  
     | 
| 14 | 
         
            -
             
     | 
| 15 | 
         
            -
             
     | 
| 16 | 
         
            -
             
     | 
| 17 | 
         
            -
             
     | 
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 18 | 
         | 
| 19 | 
         
            -
            # --- HTML System Prompt (for EXTERNAL CSS/JS) ---
         
     | 
| 20 | 
         
            -
            # This prompt is specifically designed for a project where style.css and index.js
         
     | 
| 21 | 
         
            -
            # are separate, existing files. It instructs the AI to focus ONLY on the HTML structure.
         
     | 
| 22 | 
         
             
            HTML_SYSTEM_PROMPT = """
         
     | 
| 23 | 
         
            -
            You are an expert-level front-end web developer,  
     | 
| 24 | 
         
            -
            Your task is to generate ONLY the HTML code that should go inside the `<body>` tag of a web page.
         
     | 
| 25 | 
         | 
| 26 | 
         
             
            **Your Guiding Principles:**
         
     | 
| 27 | 
         
            -
            1.  ** 
     | 
| 28 | 
         
            -
            2.  ** 
     | 
| 29 | 
         
            -
            3.  ** 
     | 
| 30 | 
         
            -
            4.  **Accessibility:** All images (`<img>`) must have descriptive `alt` attributes.  
     | 
| 
         | 
|
| 
         | 
|
| 31 | 
         | 
| 32 | 
         
             
            **Output Format:**
         
     | 
| 33 | 
         
            -
            You MUST output ONLY the raw HTML code  
     | 
| 34 | 
         
             
            """
         
     | 
| 35 | 
         | 
| 36 | 
         
             
            # --- Transformers.js System Prompt ---
         
     | 
| 
         @@ -46,6 +79,36 @@ You are a specialist in machine learning on the web, with deep expertise in the 
     | 
|
| 46 | 
         | 
| 47 | 
         
             
            **Output Format:**
         
     | 
| 48 | 
         
             
            Your entire response MUST consist of exactly three markdown code blocks in the following order, with no other text or explanations:
         
     | 
| 49 | 
         
            -
             
     | 
| 50 | 
         
            -
             
     | 
| 51 | 
         
            -
             
     | 
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 
         | 
| 
         | 
|
| 1 | 
         
            +
             import os
         
     | 
| 2 | 
         
            +
            import re
         
     | 
| 3 | 
         
            +
            from http import HTTPStatus
         
     | 
| 4 | 
         
            +
            from typing import Dict, List, Optional, Tuple
         
     | 
| 5 | 
         
            +
            import base64
         
     | 
| 6 | 
         
            +
            import mimetypes
         
     | 
| 7 | 
         
            +
            import PyPDF2
         
     | 
| 8 | 
         
            +
            import docx
         
     | 
| 9 | 
         
            +
            import cv2
         
     | 
| 10 | 
         
            +
            import numpy as np
         
     | 
| 11 | 
         
            +
            from PIL import Image
         
     | 
| 12 | 
         
            +
            import pytesseract
         
     | 
| 13 | 
         
            +
            import requests
         
     | 
| 14 | 
         
            +
            from urllib.parse import urlparse, urljoin
         
     | 
| 15 | 
         
            +
            from bs4 import BeautifulSoup
         
     | 
| 16 | 
         
            +
            import html2text
         
     | 
| 17 | 
         
            +
            import json
         
     | 
| 18 | 
         
            +
            import time
         
     | 
| 19 | 
         
            +
            import webbrowser
         
     | 
| 20 | 
         
            +
            import urllib.parse
         
     | 
| 21 | 
         | 
| 22 | 
         
            +
            import gradio as gr
         
     | 
| 
         | 
|
| 
         | 
|
| 23 | 
         | 
| 24 | 
         
            +
            # Load API keys from environment
         
     | 
| 25 | 
         
            +
            HF_TOKEN = os.getenv("HF_TOKEN")
         
     | 
| 26 | 
         
            +
            if not HF_TOKEN:
         
     | 
| 27 | 
         
            +
                raise RuntimeError("HF_TOKEN environment variable is not set. Please set it to your Hugging Face API token.")
         
     | 
| 28 | 
         
            +
             
     | 
| 29 | 
         
            +
            OPENAI_API_KEY = os.getenv("OPENAI_API_KEY")
         
     | 
| 30 | 
         
            +
            if not OPENAI_API_KEY:
         
     | 
| 31 | 
         
            +
                print("Warning: OPENAI_API_KEY not set; OpenAI provider will be unavailable.")
         
     | 
| 32 | 
         
            +
             
     | 
| 33 | 
         
            +
            GEMINI_API_KEY = os.getenv("GEMINI_API_KEY")
         
     | 
| 34 | 
         
            +
            if not GEMINI_API_KEY:
         
     | 
| 35 | 
         
            +
                print("Warning: GEMINI_API_KEY not set; Gemini provider will be unavailable.")
         
     | 
| 36 | 
         | 
| 37 | 
         
            +
            # Gradio supported languages for syntax highlighting
         
     | 
| 38 | 
         
            +
            GRADIO_SUPPORTED_LANGUAGES = [
         
     | 
| 39 | 
         
            +
                "python", "c", "cpp", "markdown", "latex", "json", "html", "css", "javascript",
         
     | 
| 40 | 
         
            +
                "jinja2", "typescript", "yaml", "dockerfile", "shell", "r", "sql", "sql-msSQL",
         
     | 
| 41 | 
         
            +
                "sql-mySQL", "sql-mariaDB", "sql-sqlite", "sql-cassandra", "sql-plSQL", "sql-hive",
         
     | 
| 42 | 
         
            +
                "sql-pgSQL", "sql-gql", "sql-gpSQL", "sql-sparkSQL", "sql-esper", None
         
     | 
| 43 | 
         
            +
            ]
         
     | 
| 44 | 
         
            +
             
     | 
| 45 | 
         
            +
             
     | 
| 46 | 
         
            +
            def get_gradio_language(language):
         
     | 
| 47 | 
         
            +
                return language if language in GRADIO_SUPPORTED_LANGUAGES else None
         
     | 
| 48 | 
         
            +
             
     | 
| 49 | 
         
            +
            # Search/Replace Constants
         
     | 
| 50 | 
         
            +
            SEARCH_START = "<<<<<<< SEARCH"
         
     | 
| 51 | 
         
            +
            DIVIDER = "======="
         
     | 
| 52 | 
         
            +
            REPLACE_END = ">>>>>>> REPLACE"
         
     | 
| 53 | 
         | 
| 
         | 
|
| 
         | 
|
| 
         | 
|
| 54 | 
         
             
            HTML_SYSTEM_PROMPT = """
         
     | 
| 55 | 
         
            +
            You are an expert-level front-end web developer, renowned for creating modern, clean, and fully responsive web pages. Your task is to generate complete, single-file HTML documents based on user requests.
         
     | 
| 
         | 
|
| 56 | 
         | 
| 57 | 
         
             
            **Your Guiding Principles:**
         
     | 
| 58 | 
         
            +
            1.  **Structure is Paramount:** Employ semantic HTML5 tags (`<header>`, `<main>`, `<section>`, `<footer>`, `<nav>`, etc.) to create a logical and accessible document structure.
         
     | 
| 59 | 
         
            +
            2.  **Style with Finesse:** All CSS styling MUST be placed within a single `<style>` tag in the `<head>` of the HTML document. Adhere to modern practices; DO NOT use inline styles (e.g., `<div style="...">`).
         
     | 
| 60 | 
         
            +
            3.  **Modern & Responsive:** Utilize modern CSS techniques like Flexbox and Grid for layout. Ensure the page is fully responsive and looks exceptional on all screen sizes, from mobile phones to widescreen desktops.
         
     | 
| 61 | 
         
            +
            4.  **Accessibility First:** All images (`<img>`) must have descriptive `alt` attributes. Interactive elements should be accessible.
         
     | 
| 62 | 
         
            +
            5.  **Complete & Valid:** Always generate a full, valid HTML5 document, including `<!DOCTYPE html>`, `<html>`, `<head>`, and `<body>` tags. Include a relevant `<title>` in the head.
         
     | 
| 63 | 
         
            +
            6.  **JavaScript Best Practices:** Any necessary JavaScript should be placed in a `<script>` tag just before the closing `</body>` tag. The code must be clean, commented, and efficient.
         
     | 
| 64 | 
         | 
| 65 | 
         
             
            **Output Format:**
         
     | 
| 66 | 
         
            +
            You MUST output ONLY the raw HTML code enclosed within a single ```html ... ``` code block. Do not include any conversational text, apologies, or explanations before or after the code block. Your response should be immediately usable.
         
     | 
| 67 | 
         
             
            """
         
     | 
| 68 | 
         | 
| 69 | 
         
             
            # --- Transformers.js System Prompt ---
         
     | 
| 
         | 
|
| 79 | 
         | 
| 80 | 
         
             
            **Output Format:**
         
     | 
| 81 | 
         
             
            Your entire response MUST consist of exactly three markdown code blocks in the following order, with no other text or explanations:
         
     | 
| 82 | 
         
            +
            # Available HF models for code generation
         
     | 
| 83 | 
         
            +
            AVAILABLE_MODELS = [
         
     | 
| 84 | 
         
            +
                {"name": "Moonshot Kimi-K2", "id": "moonshotai/Kimi-K2-Instruct", "description": "Moonshot AI Kimi-K2-Instruct model"},
         
     | 
| 85 | 
         
            +
                {"name": "DeepSeek V3", "id": "deepseek-ai/DeepSeek-V3-0324", "description": "DeepSeek V3 model"},
         
     | 
| 86 | 
         
            +
                {"name": "DeepSeek R1", "id": "deepseek-ai/DeepSeek-R1-0528", "description": "DeepSeek R1 model"},
         
     | 
| 87 | 
         
            +
                {"name": "ERNIE-4.5-VL", "id": "baidu/ERNIE-4.5-VL-424B-A47B-Base-PT", "description": "ERNIE-4.5-VL model"},
         
     | 
| 88 | 
         
            +
                {"name": "MiniMax M1", "id": "MiniMaxAI/MiniMax-M1-80k", "description": "MiniMax M1 model"},
         
     | 
| 89 | 
         
            +
                {"name": "Qwen3-235B-A22B", "id": "Qwen/Qwen3-235B-A22B", "description": "Qwen3-235B-A22B model"},
         
     | 
| 90 | 
         
            +
                {"name": "SmolLM3-3B", "id": "HuggingFaceTB/SmolLM3-3B", "description": "SmolLM3-3B model"},
         
     | 
| 91 | 
         
            +
                {"name": "GLM-4.1V-9B-Thinking", "id": "THUDM/GLM-4.1V-9B-Thinking", "description": "GLM-4.1V-9B-Thinking model"},
         
     | 
| 92 | 
         
            +
                {"name": "OpenAI GPT-4", "id": "openai/gpt-4", "description": "OpenAI GPT-4 model"},
         
     | 
| 93 | 
         
            +
                {"name": "Gemini Pro", "id": "gemini/pro", "description": "Google Gemini Pro model"},
         
     | 
| 94 | 
         
            +
                {"name": "Fireworks AI", "id": "fireworks-ai/fireworks-v1", "description": "Fireworks AI model"},
         
     | 
| 95 | 
         
            +
            ]
         
     | 
| 96 | 
         
            +
             
     | 
| 97 | 
         
            +
            # Quick‑start demo list
         
     | 
| 98 | 
         
            +
            # Quick‑start demo list for the sidebar
         
     | 
| 99 | 
         
            +
            DEMO_LIST = [
         
     | 
| 100 | 
         
            +
                {"title": "Todo App", "description": "Create a simple todo application with add, delete, and mark as complete functionality"},
         
     | 
| 101 | 
         
            +
                {"title": "Calculator", "description": "Build a basic calculator with addition, subtraction, multiplication, and division"},
         
     | 
| 102 | 
         
            +
                {"title": "Chat Interface", "description": "Build a chat interface with message history and user input"},
         
     | 
| 103 | 
         
            +
                {"title": "E-commerce Product Card", "description": "Create a product card component for an e-commerce website"},
         
     | 
| 104 | 
         
            +
                {"title": "Login Form", "description": "Build a responsive login form with validation"},
         
     | 
| 105 | 
         
            +
                {"title": "Dashboard Layout", "description": "Create a dashboard layout with sidebar navigation and main content area"},
         
     | 
| 106 | 
         
            +
                {"title": "Data Table", "description": "Build a data table with sorting and filtering capabilities"},
         
     | 
| 107 | 
         
            +
                {"title": "Image Gallery", "description": "Create an image gallery with lightbox functionality and responsive grid layout"},
         
     | 
| 108 | 
         
            +
                {"title": "UI from Image", "description": "Upload an image of a UI design and I'll generate the HTML/CSS code for it"},
         
     | 
| 109 | 
         
            +
                {"title": "Extract Text from Image", "description": "Upload an image containing text and I'll extract and process the text content"},
         
     | 
| 110 | 
         
            +
                {"title": "Website Redesign", "description": "Enter a website URL to extract its content and redesign it with a modern, responsive layout"},
         
     | 
| 111 | 
         
            +
                {"title": "Modify HTML", "description": "After generating HTML, ask me to modify it with specific changes using search/replace format"},
         
     | 
| 112 | 
         
            +
                {"title": "Search/Replace Example", "description": "Generate HTML first, then ask: 'Change the title to My New Title' or 'Add a blue background to the body'"},
         
     | 
| 113 | 
         
            +
                {"title": "Transformers.js App", "description": "Create a transformers.js application with AI/ML functionality using the transformers.js library"}
         
     | 
| 114 | 
         
            +
            ]
         
     |