Update app.py

app.py

@@ -1,70 +1,51 @@
 """
-Text-to-Game Generator
-- Code  : WithinUsAI/Opus4.7-GODs.Ghost.Codex-4B.GGuF (local GGUF, CPU, ~2.5GB)
-- Images: black-forest-labs/FLUX.1-schnell via nscale (free HF Inference API, 0MB disk)
+Text-to-Game Generator - Groq Edition (Truly Free)
+- Code  : llama-3.1-8b-instant via Groq API (free, rate-limited per minute not monthly)
+- Images: canvas-drawn graphics only (zero API calls, zero quota, zero cost)
 
-Total disk: ~2.5GB — well within 16GB free Space limit.
-No ZeroGPU needed — code runs on CPU, images run on HF servers.
+No HF token needed. No local models. No compilation. No OOM.
+Just add GROQ_API_KEY as a Space secret.
 
-Setup: add HF_TOKEN as a Space secret:
-Settings > Variables and secrets > New secret > Name: HF_TOKEN
+Get a free Groq key (no credit card) at: console.groq.com
+Settings > Variables and secrets > New secret > Name: GROQ_API_KEY
 """
 
 import os
 import re
-import io
 import base64
 import traceback
 
 import gradio as gr
-from llama_cpp import Llama
-from huggingface_hub import InferenceClient
-from PIL import Image
+from openai import OpenAI
 
 # ---------------------------------------------------------------------------
-# Code model — loaded locally on CPU at startup
+# Groq client
 # ---------------------------------------------------------------------------
 
-CODE_REPO     = "WithinUsAI/Opus4.7-GODs.Ghost.Codex-4B.GGuF"
-CODE_FILENAME = "Opus4.7-Distill-GODsGhost-Codex-4B-Q4_K_M.gguf"
+CODE_MODEL   = "llama-3.1-8b-instant"
+GROQ_API_KEY = os.environ.get("GROQ_API_KEY", "")
 
-print("Loading Opus4.7-GODs.Ghost.Codex-4B...")
-from huggingface_hub import hf_hub_download
 
-_model_path = hf_hub_download(
-    repo_id=CODE_REPO,
-    filename=CODE_FILENAME,
-)
-print("Model cached at:", _model_path)
-
-code_llm = Llama(
-    model_path=_model_path,
-    n_ctx=4096,
-    n_threads=4,
-    n_gpu_layers=0,
-    verbose=False,
-)
-print("Code model ready.")
-
-# ---------------------------------------------------------------------------
-# Image model — FLUX.1-schnell via nscale (HF Inference API, free)
-# ---------------------------------------------------------------------------
-
-IMAGE_MODEL = "black-forest-labs/FLUX.1-schnell"
-HF_TOKEN    = os.environ.get("HF_TOKEN", "")
-
-
-def get_image_client():
-    if not HF_TOKEN:
+def _check_key():
+    if not GROQ_API_KEY:
         raise ValueError(
-            "HF_TOKEN is not set. Add it as a Space secret: "
-            "Settings > Variables and secrets > New secret > Name: HF_TOKEN"
+            "GROQ_API_KEY is not set.\n"
+            "1. Sign up free (no credit card) at console.groq.com\n"
+            "2. Create an API key\n"
+            "3. Add it as a Space secret: Settings > Variables and secrets > Name: GROQ_API_KEY"
         )
-    return InferenceClient(provider="nscale", api_key=HF_TOKEN)
+
+
+def get_client():
+    _check_key()
+    return OpenAI(
+        base_url="https://api.groq.com/openai/v1",
+        api_key=GROQ_API_KEY,
+    )
 
 
 # ---------------------------------------------------------------------------
-# Game type configs
+# Game type configs — all use canvas drawing, no image files
 # ---------------------------------------------------------------------------
 
 GAME_TYPES = {
@@ -79,10 +60,9 @@ GAME_TYPES = {
             "- At least 5 platforms, 2 moving enemies, and a goal to reach.\n"
             "- Show score/lives on the canvas.\n"
             "- Use requestAnimationFrame for the game loop.\n"
-            "- For every image asset use: const img = new Image(); img.src = 'sprite_NAME.png';\n"
-            "  e.g. sprite_player.png, sprite_enemy.png, sprite_background.png. Max 3 sprites.\n"
-            "- No external libraries or CDN links.\n"
-            "- Theme all visuals to match: {theme}.\n"
+            "- Draw ALL graphics using canvas 2D shapes and colors (fillRect, arc, fillStyle, etc).\n"
+            "- Make colors, shapes and labels vividly match the theme: {theme}.\n"
+            "- NO image files, NO external libraries, NO CDN links.\n"
             "Output ONLY the raw HTML. No explanation, no markdown fences."
         ),
     },
@@ -98,9 +78,9 @@ GAME_TYPES = {
             "- Display health, score, and wave on canvas.\n"
             "- Game-over screen with score and restart button.\n"
             "- Use requestAnimationFrame for the game loop.\n"
-            "- For every image asset: const img = new Image(); img.src = 'sprite_NAME.png'; Max 3 sprites.\n"
-            "- No external libraries or CDN links.\n"
-            "- Theme everything to match: {theme}.\n"
+            "- Draw ALL graphics using canvas 2D shapes and colors only.\n"
+            "- Make colors, shapes and labels vividly match the theme: {theme}.\n"
+            "- NO image files, NO external libraries, NO CDN links.\n"
             "Output ONLY the raw HTML. No explanation, no markdown fences."
         ),
     },
@@ -115,9 +95,9 @@ GAME_TYPES = {
             "- At least 15x10 tile grid, collectible keys, and a locked exit.\n"
             "- Show a move counter or timer.\n"
             "- Win screen when player collects all keys and exits.\n"
-            "- For every image asset: const img = new Image(); img.src = 'sprite_NAME.png'; Max 3 sprites.\n"
-            "- No external libraries or CDN links.\n"
-            "- Theme everything to match: {theme}.\n"
+            "- Draw ALL graphics using canvas 2D shapes and colors only.\n"
+            "- Make colors, shapes and labels vividly match the theme: {theme}.\n"
+            "- NO image files, NO external libraries, NO CDN links.\n"
             "Output ONLY the raw HTML. No explanation, no markdown fences."
         ),
     },
@@ -132,9 +112,9 @@ GAME_TYPES = {
             "- Collision ends the game; show time survived as score.\n"
             "- High score stored in a JS variable; restart button on game-over screen.\n"
             "- Use requestAnimationFrame for the game loop.\n"
-            "- For every image asset: const img = new Image(); img.src = 'sprite_NAME.png'; Max 3 sprites.\n"
-            "- No external libraries or CDN links.\n"
-            "- Theme everything to match: {theme}.\n"
+            "- Draw ALL graphics using canvas 2D shapes and colors only.\n"
+            "- Make colors, shapes and labels vividly match the theme: {theme}.\n"
+            "- NO image files, NO external libraries, NO CDN links.\n"
             "Output ONLY the raw HTML. No explanation, no markdown fences."
         ),
     },
@@ -150,9 +130,9 @@ GAME_TYPES = {
             "- Clear win/lose conditions and a score display.\n"
             "- Game-over / win screen with a restart button.\n"
             "- Use requestAnimationFrame for the game loop.\n"
-            "- For every image asset: const img = new Image(); img.src = 'sprite_NAME.png'; Max 3 sprites.\n"
-            "- No external libraries or CDN links.\n"
-            "- Theme everything vividly to match: {theme}.\n"
+            "- Draw ALL graphics using canvas 2D shapes and colors only.\n"
+            "- Make colors, shapes and labels vividly match the theme: {theme}.\n"
+            "- NO image files, NO external libraries, NO CDN links.\n"
             "Output ONLY the raw HTML. No explanation, no markdown fences."
         ),
     },
@@ -168,67 +148,6 @@ THEME_EXAMPLES = {
     "Surprise Me!":     [["A sentient library that rearranges itself"], ["Deep sea bioluminescent creatures"], ["Retro space diner on a comet"]],
 }
 
-# ---------------------------------------------------------------------------
-# Image helpers
-# ---------------------------------------------------------------------------
-
-def _pil_to_data_uri(pil_image: Image.Image, size: int = 64) -> str:
-    img = pil_image.resize((size, size), Image.LANCZOS)
-    buf = io.BytesIO()
-    img.save(buf, format="PNG")
-    return "data:image/png;base64," + base64.b64encode(buf.getvalue()).decode()
-
-
-def _colored_placeholder(name: str) -> str:
-    colours = ["#e74c3c", "#3498db", "#2ecc71", "#f39c12", "#9b59b6", "#1abc9c"]
-    colour  = colours[abs(hash(name)) % len(colours)]
-    label   = name.replace("sprite_", "")[:6]
-    svg = (
-        '<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64">'
-        '<rect width="64" height="64" fill="' + colour + '" rx="8"/>'
-        '<text x="32" y="38" font-size="10" text-anchor="middle" fill="white">' + label + '</text>'
-        '</svg>'
-    )
-    return "data:image/svg+xml;base64," + base64.b64encode(svg.encode()).decode()
-
-
-def _sprite_prompt(sprite_name: str, theme: str) -> str:
-    label = sprite_name.replace("sprite_", "").replace("_", " ")
-    return (
-        "Pixel-art game sprite: " + label + ". Theme: " + theme + ". "
-        "Vibrant colours, clear silhouette, plain dark background, 64x64 pixel style."
-    )
-
-
-def _find_sprite_filenames(html_code: str) -> list:
-    pattern = r"""(?:src\s*=\s*['"]|\.src\s*=\s*['"])\s*(sprite_[a-zA-Z0-9_]+\.png)\s*['"]"""
-    return list(dict.fromkeys(re.findall(pattern, html_code)))[:3]
-
-
-def _inject_sprites(html_code: str, sprite_map: dict) -> str:
-    for fname, data_uri in sprite_map.items():
-        html_code = html_code.replace('"' + fname + '"', '"' + data_uri + '"')
-        html_code = html_code.replace("'" + fname + "'", "'" + data_uri + "'")
-    return html_code
-
-
-def generate_sprites(sprite_names: list, theme: str) -> dict:
-    if not sprite_names:
-        return {}
-    mapping = {}
-    for fname in sprite_names:
-        name_no_ext = fname.replace(".png", "")
-        prompt = _sprite_prompt(name_no_ext, theme)
-        try:
-            client  = get_image_client()
-            pil_img = client.text_to_image(prompt, model=IMAGE_MODEL)
-            mapping[fname] = _pil_to_data_uri(pil_img, size=64)
-        except Exception as exc:
-            print("[FLUX] Failed '" + fname + "': " + str(exc))
-            mapping[fname] = _colored_placeholder(name_no_ext)
-    return mapping
-
-
 # ---------------------------------------------------------------------------
 # Code generation
 # ---------------------------------------------------------------------------
@@ -241,14 +160,16 @@ def generate_game_code(game_type: str, theme: str, temperature: float, max_new_t
     user_prompt = template.format(theme=theme.strip())
     system_msg  = (
         "You are an expert HTML5 game developer. "
-        "Write a complete, working, single-file HTML5 game using canvas and vanilla JavaScript. "
-        "Use new Image() with src='sprite_NAME.png' for every visual asset (max 3 sprites). "
+        "Write a complete, working, single-file HTML5 game using only canvas 2D drawing. "
+        "Never use image files or external resources. "
+        "Draw everything with canvas shapes, colors, and text. "
         "Output ONLY the raw HTML - no markdown fences, no explanation."
     )
 
     try:
-        # Step 1: Generate HTML via Opus4.7 Codex (local llama-cpp, CPU)
-        response = code_llm.create_chat_completion(
+        client = get_client()
+        completion = client.chat.completions.create(
+            model=CODE_MODEL,
             messages=[
                 {"role": "system", "content": system_msg},
                 {"role": "user",   "content": user_prompt},
@@ -256,37 +177,22 @@ def generate_game_code(game_type: str, theme: str, temperature: float, max_new_t
             max_tokens=int(max_new_tokens),
             temperature=float(temperature),
         )
-        code = response["choices"][0]["message"]["content"].strip()
+        code = completion.choices[0].message.content.strip()
         code = re.sub(r"^```[a-zA-Z]*\n?", "", code).strip()
         code = re.sub(r"\n?```$",           "", code).strip()
         if "<html" not in code.lower() and "<!doctype" not in code.lower():
             code = _wrap_in_html(code, theme)
 
-        # Step 2: Detect sprites (max 3)
-        sprite_names = _find_sprite_filenames(code)
-
-        # Step 3: Generate sprites via FLUX.1-schnell (nscale, free API)
-        sprite_map = generate_sprites(sprite_names, theme.strip())
-
-        # Step 4: Inject base64 images into HTML
-        final_code = _inject_sprites(code, sprite_map)
-
-        n_real     = sum(1 for v in sprite_map.values() if "image/png" in v)
-        n_fallback = len(sprite_map) - n_real
-        status = (
-            "Done! " + str(len(sprite_names)) + " sprite(s) - "
-            + str(n_real) + " by FLUX.1-schnell, "
-            + str(n_fallback) + " fallback. Click Launch Game to play."
-        )
-        return final_code, status, _build_preview(final_code)
+        status = "Done! Game generated. Click Launch Game to play."
+        return code, status, _build_preview(code)
 
     except Exception as exc:
         traceback.print_exc()
         err = str(exc)
-        if "401" in err or "unauthorized" in err.lower():
-            err = "Unauthorized - make sure HF_TOKEN is added as a Space secret."
+        if "invalid_api_key" in err.lower() or "401" in err:
+            err = "Invalid GROQ_API_KEY. Check your key at console.groq.com."
         elif "429" in err or "rate" in err.lower():
-            err = "Rate limited - wait a moment and try again."
+            err = "Rate limited by Groq - wait a few seconds and try again."
         else:
             err = "Error: " + str(exc)
         return "", err, _placeholder_html(err)
@@ -349,15 +255,15 @@ def get_first_theme(game_type: str) -> str:
 # ---------------------------------------------------------------------------
 
 def build_ui():
-    with gr.Blocks(title="Game Generator") as demo:
+    with gr.Blocks(title="Game Generator - Free") as demo:
 
         gr.Markdown(
-            "# Game Generator\n"
-            "**Opus4.7-GODs.Ghost.Codex-4B** (local, CPU) writes the game code. "
-            "**FLUX.1-schnell** (nscale API, free) generates the sprites.\n\n"
-            "> Add your **HF_TOKEN** as a Space secret "
-            "(Settings > Variables and secrets > New secret > Name: HF_TOKEN). "
-            "First run downloads the code model (~2.5GB) — subsequent runs are instant."
+            "# Game Generator (Truly Free)\n"
+            "**Llama-3.1-8B** via Groq generates complete playable games instantly.\n"
+            "All graphics are drawn with canvas — no image API, no quota, no cost.\n\n"
+            "> **Setup:** Sign up free at [console.groq.com](https://console.groq.com) "
+            "(no credit card needed), create an API key, then add it as a Space secret "
+            "named `GROQ_API_KEY`."
         )
 
         with gr.Row():
@@ -391,11 +297,11 @@ def build_ui():
                     label="Temperature - higher = more creative",
                 )
                 max_tokens_slider = gr.Slider(
-                    minimum=1000, maximum=4000, value=2500, step=500,
-                    label="Max tokens - more = longer game",
+                    minimum=1000, maximum=6000, value=4000, step=500,
+                    label="Max tokens - more = longer / more complete game",
                 )
 
-                generate_btn = gr.Button("Generate Game + Sprites", variant="primary")
+                generate_btn = gr.Button("Generate Game", variant="primary")
                 gen_status   = gr.Markdown(value="_No game generated yet._")
 
             with gr.Column(scale=2, min_width=500):
@@ -403,7 +309,7 @@ def build_ui():
                 gr.Markdown("## 3. Generated code (editable)")
 
                 code_box = gr.Code(
-                    label="HTML source (sprites embedded as base64)",
+                    label="HTML source",
                     language="html",
                     lines=12,
                     interactive=True,
@@ -430,8 +336,9 @@ def build_ui():
 
         gr.Markdown(
             "---\n"
-            "**Code:** Opus4.7-GODs.Ghost.Codex-4B Q4_K_M GGUF (~2.5GB) via llama-cpp on CPU. "
-            "**Images:** FLUX.1-schnell via nscale provider (free with HF token, 0MB disk). "
+            "**Why Groq is truly free:** Groq uses per-minute rate limits, not monthly credit quotas. "
+            "If you hit a limit, wait 60 seconds — not 30 days. "
+            "Games use only canvas drawing so no image API is ever called. "
             "Edit the HTML and click **Launch Game** to hot-reload."
         )