Initial commit of GenAI VQA System

.ipynb_checkpoints/ai_router-checkpoint.py

@@ -0,0 +1,14 @@
+from models.blip_model import blip_answer
+from models.reasoning_model import reasoning_answer
+from models.gemini_vision import gemini_vision_answer
+
+def route_model(model_choice, image, question):
+
+    if model_choice == "local":
+        return reasoning_answer(image, question)
+
+    elif model_choice == "gemini":
+        return gemini_vision_answer(image, question)
+
+    else:
+        return "Unknown", "Invalid", "Invalid"

.ipynb_checkpoints/config-checkpoint.py

@@ -0,0 +1,15 @@
+import os
+import torch
+
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+
+# ===== ADMIN SETTINGS =====
+ADMIN_MODE = True
+ENABLE_EXTERNAL_AI = True   # Toggle Gemini here
+
+# ===== Gemini API Key =====
+GEMINI_API_KEY = os.getenv("GEMINI_API_KEY", "AIzaSyB1fMfnnp2etuOVWiLrecdMp3_0GbEWLaU")
+
+# ===== Security Limits =====
+MAX_IMAGE_SIZE_MB = 5
+RATE_LIMIT_PER_MINUTE = 30

.ipynb_checkpoints/main-checkpoint.py

@@ -0,0 +1,73 @@
+import io
+from fastapi import FastAPI, File, UploadFile, Form, Request
+from fastapi.responses import JSONResponse
+from fastapi.templating import Jinja2Templates
+from fastapi.staticfiles import StaticFiles
+from fastapi.middleware.cors import CORSMiddleware
+from PIL import Image
+
+from ai_router import route_model
+from utils.logger import log_request
+from utils.security import check_rate_limit, validate_image_size
+from config import DEVICE, ENABLE_EXTERNAL_AI
+
+
+# ================= CREATE APP FIRST =================
+app = FastAPI(title="GenAI VQA System")
+
+
+# ================= CORS =================
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+
+# ================= STATIC + TEMPLATE =================
+app.mount("/static", StaticFiles(directory="static"), name="static")
+templates = Jinja2Templates(directory="templates")
+
+
+# ================= HOME =================
+@app.get("/")
+async def home(request: Request):
+    return templates.TemplateResponse("index.html", {"request": request})
+
+
+# ================= API =================
+@app.post("/ask")
+async def ask_question(
+    file: UploadFile = File(...),
+    question: str = Form(...),
+    model_choice: str = Form("reasoning"),
+    user: str = Form("guest")
+):
+
+    check_rate_limit(user)
+
+    image_bytes = await file.read()
+    validate_image_size(len(image_bytes))
+
+    image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
+
+    caption, answer, explanation = route_model(
+        model_choice,
+        image,
+        question
+    )
+
+ 
+
+    log_request(user, model_choice, question)
+
+    return JSONResponse({
+        "device": DEVICE,
+        "model_used": model_choice,
+        "caption": caption,
+        "answer": answer,
+        "explanation": explanation,
+        "external_enabled": ENABLE_EXTERNAL_AI
+    })

.ipynb_checkpoints/test-checkpoint.py

@@ -0,0 +1,8 @@
+from google import genai
+
+client = genai.Client(api_key="AIzaSyB1fMfnnp2etuOVWiLrecdMp3_0GbEWLaU")
+
+models = client.models.list()
+
+for m in models:
+    print(m.name)

Dockerfile

@@ -0,0 +1,17 @@
+FROM python:3.10-slim
+
+WORKDIR /app
+
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+RUN pip install "numpy<2"
+
+# Download model locally during build to avoid downtime on first request
+RUN python -c "from transformers import BlipProcessor; BlipProcessor.from_pretrained('Salesforce/blip-image-captioning-base')" || true
+
+COPY . .
+
+# Expose port that HuggingFace Spaces/Render uses
+EXPOSE 7860
+
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860"]

README.md

@@ -0,0 +1,11 @@
+---
+title: GenAI Vision System
+emoji: 🧠
+colorFrom: indigo
+colorTo: purple
+sdk: docker
+pinned: false
+---
+
+# GenAI Vision System
+A multi-language Vision Question Answering (VQA) system powered by FastAPI, PyTorch (BLIP), and Google Gemini.

ai_router.py

@@ -0,0 +1,37 @@
+from models.blip_model import blip_answer
+from models.reasoning_model import reasoning_answer
+from models.gemini_vision import gemini_vision_answer
+
+try:
+    from deep_translator import GoogleTranslator
+except:
+    GoogleTranslator = None
+
+def route_model(model_choice, image, question, lang="en"):
+
+    # Translate inbound question for all models
+    if lang != "en" and GoogleTranslator:
+        try:
+            question = GoogleTranslator(source='auto', target='en').translate(question)
+        except:
+            pass
+
+    # Model Execution
+    if model_choice == "local":
+        cap, ans, exp = reasoning_answer(image, question)
+    elif model_choice == "gemini":
+        cap, ans, exp = gemini_vision_answer(image, question, lang)
+    else:
+        cap, ans, exp = "Unknown", "Invalid", "Invalid"
+
+    # Translate outbound answer for local model (convert back to user's native language)
+    if lang != "en" and GoogleTranslator and model_choice == "local":
+        try:
+            out_trans = GoogleTranslator(source='en', target=lang)
+            cap = out_trans.translate(cap)
+            ans = out_trans.translate(ans)
+            exp = out_trans.translate(exp)
+        except:
+            pass
+
+    return cap, ans, exp

config.py

@@ -0,0 +1,15 @@
+import os
+import torch
+
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+
+# ===== ADMIN SETTINGS =====
+ADMIN_MODE = True
+ENABLE_EXTERNAL_AI = True   # Toggle Gemini here
+
+# ===== Gemini API Key =====
+GEMINI_API_KEY = os.getenv("GEMINI_API_KEY", "AIzaSyB1fMfnnp2etuOVWiLrecdMp3_0GbEWLaU")
+
+# ===== Security Limits =====
+MAX_IMAGE_SIZE_MB = 5
+RATE_LIMIT_PER_MINUTE = 30

logs/.ipynb_checkpoints/main-checkpoint.py

@@ -0,0 +1,78 @@
+import io
+from fastapi import FastAPI, File, UploadFile, Form, Request
+from fastapi.responses import JSONResponse
+from fastapi.templating import Jinja2Templates
+from fastapi.staticfiles import StaticFiles
+from fastapi.middleware.cors import CORSMiddleware
+from PIL import Image
+
+from ai_router import route_model
+from models.external_model import external_answer
+from utils.logger import log_request
+from utils.security import check_rate_limit, validate_image_size
+from config import DEVICE, ENABLE_EXTERNAL_AI
+
+
+# ================= CREATE APP FIRST =================
+app = FastAPI(title="GenAI VQA System")
+
+
+# ================= CORS =================
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+
+# ================= STATIC + TEMPLATE =================
+app.mount("/static", StaticFiles(directory="static"), name="static")
+templates = Jinja2Templates(directory="templates")
+
+
+# ================= HOME =================
+@app.get("/")
+async def home(request: Request):
+    return templates.TemplateResponse("index.html", {"request": request})
+
+
+# ================= API =================
+@app.post("/ask")
+async def ask_question(
+    file: UploadFile = File(...),
+    question: str = Form(...),
+    model_choice: str = Form("reasoning"),
+    user: str = Form("guest")
+):
+
+    check_rate_limit(user)
+
+    image_bytes = await file.read()
+    validate_image_size(len(image_bytes))
+
+    image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
+
+    caption, answer, explanation = route_model(
+        model_choice,
+        image,
+        question
+    )
+
+    # Gemini override
+    if model_choice == "external" and ENABLE_EXTERNAL_AI:
+        ext_response = external_answer(caption, question)
+        explanation = ext_response
+        answer = "Generated by Gemini"
+
+    log_request(user, model_choice, question)
+
+    return JSONResponse({
+        "device": DEVICE,
+        "model_used": model_choice,
+        "caption": caption,
+        "answer": answer,
+        "explanation": explanation,
+        "external_enabled": ENABLE_EXTERNAL_AI
+    })

logs/.ipynb_checkpoints/requests-checkpoint.log

@@ -0,0 +1,55 @@
+2026-03-09 22:18:07,836 - INFO - User: demo_user | Model: reasoning | Q: what s there in the image
+2026-03-09 22:19:35,153 - INFO - User: demo_user | Model: reasoning | Q: what s there in the image
+2026-03-09 22:19:47,705 - INFO - User: demo_user | Model: reasoning | Q: what is the color of his shirt
+2026-03-09 22:20:05,270 - INFO - User: demo_user | Model: reasoning | Q: what is the color of the t shirt the man is wearing
+2026-03-09 22:20:19,709 - INFO - User: demo_user | Model: reasoning | Q: what is the man doing ?
+2026-03-09 22:20:36,089 - INFO - User: demo_user | Model: reasoning | Q: what is the man doing , what is the emotion in his face
+2026-03-09 22:31:05,406 - INFO - User: demo_user | Model: reasoning | Q: who is he
+2026-03-09 22:31:15,743 - INFO - User: demo_user | Model: blip | Q: who is he
+2026-03-09 22:34:34,578 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:34:34,895 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:34:48,620 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 22:34:53,385 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 22:34:57,133 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:36:11,525 - INFO - User: vignesh | Model: reasoning | Q: whats this soup color
+2026-03-09 22:36:53,732 - INFO - User: hi | Model: blip | Q: what colors are here
+2026-03-09 22:37:16,020 - INFO - User: hi | Model: reasoning | Q: what colors are here
+2026-03-09 22:37:28,450 - INFO - User: hi | Model: reasoning | Q: what colors are here , number?
+2026-03-09 23:20:45,973 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-09 23:20:55,493 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:21:06,527 - INFO - User: vignesh | Model: external | Q: who is he
+2026-03-09 23:22:43,844 - INFO - User: Hi | Model: blip | Q: Who is this
+2026-03-09 23:23:00,446 - INFO - User: Bye | Model: blip | Q: Who is this
+2026-03-09 23:23:07,642 - INFO - User: Bye | Model: reasoning | Q: Who is this
+2026-03-09 23:23:20,167 - INFO - User: Bye | Model: external | Q: Who is this
+2026-03-09 23:23:42,134 - INFO - User: Bye | Model: blip | Q: Is this whatsapp or pic
+2026-03-09 23:24:01,340 - INFO - User: Bye | Model: blip | Q: Is this whatsapp or pic , gimme an answer with reason
+2026-03-09 23:24:06,221 - INFO - User: Bye | Model: reasoning | Q: Is this whatsapp or pic , gimme an answer with reason
+2026-03-09 23:24:39,297 - INFO - User: Bye | Model: reasoning | Q: Whats this
+2026-03-09 23:24:52,539 - INFO - User: Bye | Model: reasoning | Q: Certificate for? 
+2026-03-09 23:25:03,802 - INFO - User: Bye | Model: reasoning | Q: Name of the guy
+2026-03-09 23:26:35,437 - INFO - User: Bye | Model: reasoning | Q: Whats this
+2026-03-09 23:27:48,389 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:27:50,344 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:28:06,294 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:28:26,274 - INFO - User: vignesh | Model: reasoning | Q: What are that red color
+2026-03-09 23:32:56,112 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:49:05,342 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 23:49:10,353 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 23:49:15,431 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:49:15,670 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:49:15,671 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:49:15,832 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:49:15,834 - INFO - User: vignesh | Model: external | Q: whats this
+2026-03-09 23:53:01,815 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-09 23:53:06,912 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:53:20,055 - INFO - User: vignesh | Model: reasoning | Q: what is he doing?
+2026-03-09 23:53:25,377 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:53:25,709 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:53:25,709 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:53:26,013 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:53:26,014 - INFO - User: vignesh | Model: external | Q: what is he doing?
+2026-03-09 23:53:43,730 - INFO - User: vignesh | Model: reasoning | Q: what is he doing?
+2026-03-10 00:27:54,001 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-10 00:27:59,362 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-10 00:28:03,253 - INFO - User: vignesh | Model: reasoning | Q: who is he

logs/main.py

@@ -0,0 +1,78 @@
+import io
+from fastapi import FastAPI, File, UploadFile, Form, Request
+from fastapi.responses import JSONResponse
+from fastapi.templating import Jinja2Templates
+from fastapi.staticfiles import StaticFiles
+from fastapi.middleware.cors import CORSMiddleware
+from PIL import Image
+
+from ai_router import route_model
+from models.external_model import external_answer
+from utils.logger import log_request
+from utils.security import check_rate_limit, validate_image_size
+from config import DEVICE, ENABLE_EXTERNAL_AI
+
+
+# ================= CREATE APP FIRST =================
+app = FastAPI(title="GenAI VQA System")
+
+
+# ================= CORS =================
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+
+# ================= STATIC + TEMPLATE =================
+app.mount("/static", StaticFiles(directory="static"), name="static")
+templates = Jinja2Templates(directory="templates")
+
+
+# ================= HOME =================
+@app.get("/")
+async def home(request: Request):
+    return templates.TemplateResponse("index.html", {"request": request})
+
+
+# ================= API =================
+@app.post("/ask")
+async def ask_question(
+    file: UploadFile = File(...),
+    question: str = Form(...),
+    model_choice: str = Form("reasoning"),
+    user: str = Form("guest")
+):
+
+    check_rate_limit(user)
+
+    image_bytes = await file.read()
+    validate_image_size(len(image_bytes))
+
+    image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
+
+    caption, answer, explanation = route_model(
+        model_choice,
+        image,
+        question
+    )
+
+    # Gemini override
+    if model_choice == "external" and ENABLE_EXTERNAL_AI:
+        ext_response = external_answer(caption, question)
+        explanation = ext_response
+        answer = "Generated by Gemini"
+
+    log_request(user, model_choice, question)
+
+    return JSONResponse({
+        "device": DEVICE,
+        "model_used": model_choice,
+        "caption": caption,
+        "answer": answer,
+        "explanation": explanation,
+        "external_enabled": ENABLE_EXTERNAL_AI
+    })

logs/requests.log

@@ -0,0 +1,199 @@
+2026-03-09 22:18:07,836 - INFO - User: demo_user | Model: reasoning | Q: what s there in the image
+2026-03-09 22:19:35,153 - INFO - User: demo_user | Model: reasoning | Q: what s there in the image
+2026-03-09 22:19:47,705 - INFO - User: demo_user | Model: reasoning | Q: what is the color of his shirt
+2026-03-09 22:20:05,270 - INFO - User: demo_user | Model: reasoning | Q: what is the color of the t shirt the man is wearing
+2026-03-09 22:20:19,709 - INFO - User: demo_user | Model: reasoning | Q: what is the man doing ?
+2026-03-09 22:20:36,089 - INFO - User: demo_user | Model: reasoning | Q: what is the man doing , what is the emotion in his face
+2026-03-09 22:31:05,406 - INFO - User: demo_user | Model: reasoning | Q: who is he
+2026-03-09 22:31:15,743 - INFO - User: demo_user | Model: blip | Q: who is he
+2026-03-09 22:34:34,578 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:34:34,895 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:34:48,620 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 22:34:53,385 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 22:34:57,133 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 22:36:11,525 - INFO - User: vignesh | Model: reasoning | Q: whats this soup color
+2026-03-09 22:36:53,732 - INFO - User: hi | Model: blip | Q: what colors are here
+2026-03-09 22:37:16,020 - INFO - User: hi | Model: reasoning | Q: what colors are here
+2026-03-09 22:37:28,450 - INFO - User: hi | Model: reasoning | Q: what colors are here , number?
+2026-03-09 23:20:45,973 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-09 23:20:55,493 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:21:06,527 - INFO - User: vignesh | Model: external | Q: who is he
+2026-03-09 23:22:43,844 - INFO - User: Hi | Model: blip | Q: Who is this
+2026-03-09 23:23:00,446 - INFO - User: Bye | Model: blip | Q: Who is this
+2026-03-09 23:23:07,642 - INFO - User: Bye | Model: reasoning | Q: Who is this
+2026-03-09 23:23:20,167 - INFO - User: Bye | Model: external | Q: Who is this
+2026-03-09 23:23:42,134 - INFO - User: Bye | Model: blip | Q: Is this whatsapp or pic
+2026-03-09 23:24:01,340 - INFO - User: Bye | Model: blip | Q: Is this whatsapp or pic , gimme an answer with reason
+2026-03-09 23:24:06,221 - INFO - User: Bye | Model: reasoning | Q: Is this whatsapp or pic , gimme an answer with reason
+2026-03-09 23:24:39,297 - INFO - User: Bye | Model: reasoning | Q: Whats this
+2026-03-09 23:24:52,539 - INFO - User: Bye | Model: reasoning | Q: Certificate for? 
+2026-03-09 23:25:03,802 - INFO - User: Bye | Model: reasoning | Q: Name of the guy
+2026-03-09 23:26:35,437 - INFO - User: Bye | Model: reasoning | Q: Whats this
+2026-03-09 23:27:48,389 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:27:50,344 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:28:06,294 - INFO - User: vignesh | Model: reasoning | Q: Whats this about
+2026-03-09 23:28:26,274 - INFO - User: vignesh | Model: reasoning | Q: What are that red color
+2026-03-09 23:32:56,112 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:49:05,342 - INFO - User: vignesh | Model: blip | Q: whats this
+2026-03-09 23:49:10,353 - INFO - User: vignesh | Model: reasoning | Q: whats this
+2026-03-09 23:49:15,431 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:49:15,670 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:49:15,671 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:49:15,832 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:49:15,834 - INFO - User: vignesh | Model: external | Q: whats this
+2026-03-09 23:53:01,815 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-09 23:53:06,912 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-09 23:53:20,055 - INFO - User: vignesh | Model: reasoning | Q: what is he doing?
+2026-03-09 23:53:25,377 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:53:25,709 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:53:25,709 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-09 23:53:26,013 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-09 23:53:26,014 - INFO - User: vignesh | Model: external | Q: what is he doing?
+2026-03-09 23:53:43,730 - INFO - User: vignesh | Model: reasoning | Q: what is he doing?
+2026-03-10 00:27:54,001 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-10 00:27:59,362 - INFO - User: vignesh | Model: blip | Q: who is he
+2026-03-10 00:28:03,253 - INFO - User: vignesh | Model: reasoning | Q: who is he
+2026-03-10 00:39:15,248 - INFO - User: vignesh | Model: blip | Q: whats in the soup
+2026-03-10 00:39:19,957 - INFO - User: vignesh | Model: reasoning | Q: whats in the soup
+2026-03-10 00:39:54,031 - INFO - User: vignesh | Model: reasoning | Q: whats in the soup
+2026-03-10 00:39:58,700 - INFO - User: vignesh | Model: blip | Q: whats in the soup
+2026-03-10 00:40:08,785 - INFO - User: vignesh | Model: reasoning | Q: whats in the soup
+2026-03-10 00:57:21,878 - INFO - User: vignesh | Model: blip | Q: what is he doing?
+2026-03-10 00:57:25,967 - INFO - User: vignesh | Model: reasoning | Q: what is he doing?
+2026-03-10 00:57:29,509 - INFO - User: vignesh | Model: external | Q: what is he doing?
+2026-03-10 01:09:14,799 - INFO - User: vignesh | Model: blip | Q: whats in the soup
+2026-03-10 01:09:19,548 - INFO - User: vignesh | Model: reasoning | Q: whats in the soup
+2026-03-10 01:09:23,999 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 01:09:26,541 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 01:09:26,543 - INFO - User: vignesh | Model: external | Q: whats in the soup
+2026-03-10 01:21:18,283 - INFO - User: vignesh | Model: blip | Q: whats in the soup
+2026-03-10 01:24:00,513 - INFO - User: vignesh | Model: local | Q: whats in the soup
+2026-03-10 01:24:06,605 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 01:24:12,471 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 01:24:12,473 - INFO - User: vignesh | Model: gemini | Q: whats in the soup
+2026-03-10 01:24:36,257 - INFO - User: vignesh | Model: local | Q: whats in the soup
+2026-03-10 01:24:50,707 - INFO - User: vignesh | Model: local | Q: color of soup
+2026-03-10 01:25:06,181 - INFO - User: vignesh | Model: local | Q: ingredients used?
+2026-03-10 01:25:18,463 - INFO - User: vignesh | Model: local | Q: ingredients used for soup?
+2026-03-10 01:25:33,965 - INFO - User: vignesh | Model: local | Q: ingredients used for soup? , list all , we need 4
+2026-03-10 01:25:45,319 - INFO - User: vignesh | Model: local | Q: ingredients used for soup? , list all , we need 10 ingredients
+2026-03-10 01:25:52,548 - INFO - User: vignesh | Model: local | Q: ingredients used for soup? 
+2026-03-10 01:26:34,844 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 01:26:38,232 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 01:26:38,234 - INFO - User: vignesh | Model: gemini | Q: ingredients used for soup? 
+2026-03-10 01:48:14,487 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 01:48:19,645 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 01:48:19,647 - INFO - User: vignesh | Model: gemini | Q: ingredients used for soup? 
+2026-03-10 02:48:53,073 - INFO - User: guest | Model: local | Q: whats happening in the image
+2026-03-10 02:49:02,279 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 02:49:10,528 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 02:49:10,532 - INFO - User: guest | Model: gemini | Q: whats happening in the image
+2026-03-10 02:54:12,379 - INFO - User: vignesh | Model: local | Q: Describe the contents of this image in detail.
+2026-03-10 02:54:27,489 - INFO - User: vignesh | Model: local | Q: color of the text
+2026-03-10 03:01:20,760 - INFO - User: vignesh | Model: local | Q: whats happening in the image
+2026-03-10 03:01:36,161 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:01:45,734 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:01:45,746 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:02:04,502 - INFO - User: vignesh | Model: local | Q: whats happening in the image
+2026-03-10 03:05:21,987 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:05:32,205 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:05:32,206 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:07:29,952 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:07:35,865 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:07:35,869 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:07:56,178 - INFO - User: vignesh | Model: local | Q: whats happening in the image
+2026-03-10 03:08:21,101 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:08:26,796 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:08:26,798 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:09:33,333 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:09:39,385 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:09:39,386 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:10:47,029 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:10:52,063 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:10:52,065 - INFO - User: vignesh | Model: gemini | Q: what is to the rught and velocity of car?
+2026-03-10 03:11:20,115 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:11:25,253 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:11:25,254 - INFO - User: vignesh | Model: gemini | Q: how many cars present
+2026-03-10 03:12:09,840 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:12:14,133 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:12:14,134 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 03:12:23,972 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:12:27,062 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:12:27,064 - INFO - User: vignesh | Model: gemini | Q: color of specs?
+2026-03-10 03:12:39,952 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:12:42,769 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:12:42,771 - INFO - User: vignesh | Model: gemini | Q: is he wearing soecs
+2026-03-10 03:12:49,344 - INFO - User: vignesh | Model: local | Q: is he wearing specs
+2026-03-10 03:14:39,111 - INFO - User: vignesh | Model: local | Q: what are the ingredients in ths soup?
+2026-03-10 03:15:41,071 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:15:46,102 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:15:46,104 - INFO - User: vignesh | Model: gemini | Q: what are the ingredients in ths soup?
+2026-03-10 03:16:04,651 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:16:07,521 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:16:07,523 - INFO - User: vignesh | Model: gemini | Q: veg or non veg soup?
+2026-03-10 03:16:11,772 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:16:14,435 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:16:14,437 - INFO - User: vignesh | Model: gemini | Q: veg or non veg soup?
+2026-03-10 03:16:42,178 - INFO - User: vignesh | Model: local | Q: veg or non veg soup?
+2026-03-10 03:44:11,600 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:44:17,364 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:44:17,375 - INFO - User: vignesh | Model: gemini | Q: What is happening in this image? Are there any text or numbers? Describe the overall theme.
+2026-03-10 03:50:31,062 - INFO - User: vignesh | Model: local | Q: what is he doing
+2026-03-10 03:50:50,464 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:51:00,293 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:51:00,296 - INFO - User: vignesh | Model: gemini | Q: what is he doing
+2026-03-10 03:51:42,234 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 03:51:51,293 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 200 OK"
+2026-03-10 03:51:51,300 - INFO - User: vignesh | Model: gemini | Q: What is to the right of the beach
+2026-03-10 03:52:10,719 - INFO - User: vignesh | Model: local | Q: What is to the right of the beach
+2026-03-10 04:08:47,209 - INFO - User: v | Model: local | Q: whats happening in the image
+2026-03-10 04:26:01,947 - INFO - User: v | Model: local | Q: whats happening in the image
+2026-03-10 04:26:19,702 - INFO - User: v | Model: local | Q: whats happening in the image
+2026-03-10 04:26:24,952 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:26:26,168 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:26:26,169 - INFO - User: v | Model: gemini | Q: whats happening in the image
+2026-03-10 04:29:50,705 - INFO - User: vignesh | Model: local | Q: whats in soup
+2026-03-10 04:30:01,330 - INFO - User: vignesh | Model: local | Q: whats in soup
+2026-03-10 04:30:16,981 - INFO - User: vignesh | Model: local | Q: whats in soup
+2026-03-10 04:30:23,317 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:30:24,432 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:30:24,434 - INFO - User: vignesh | Model: gemini | Q: whats in soup
+2026-03-10 04:35:42,648 - INFO - User: hi | Model: local | Q: whats happening in the image
+2026-03-10 04:35:45,520 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:35:46,552 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:35:46,553 - INFO - User: hi | Model: gemini | Q: whats happening in the image
+2026-03-10 04:36:50,743 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:36:51,699 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:36:51,700 - INFO - User: hi | Model: gemini | Q: whats happening in the image
+2026-03-10 04:41:49,255 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:41:50,262 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:41:50,264 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 04:43:29,558 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:43:30,555 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent "HTTP/1.1 429 Too Many Requests"
+2026-03-10 04:43:30,556 - INFO - User: vignesh | Model: gemini | Q: whats in the image
+2026-03-10 04:50:25,279 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:50:25,787 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash:generateContent "HTTP/1.1 404 Not Found"
+2026-03-10 04:50:25,788 - INFO - User: vignesh | Model: gemini | Q: whats in the image
+2026-03-10 04:53:43,008 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:53:43,606 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash-8b:generateContent "HTTP/1.1 404 Not Found"
+2026-03-10 04:53:43,607 - INFO - User: vignesgh | Model: gemini | Q: whats happening in the image
+2026-03-10 04:57:55,049 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 04:57:57,479 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-lite-preview:generateContent "HTTP/1.1 200 OK"
+2026-03-10 04:57:57,481 - INFO - User: vignesh | Model: gemini | Q: whats happening in the image
+2026-03-10 05:03:18,184 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 05:03:21,380 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-lite-preview:generateContent "HTTP/1.1 200 OK"
+2026-03-10 05:03:21,382 - INFO - User: vignesh | Model: gemini | Q: intha padathil enna ullathu?
+2026-03-10 05:03:44,902 - INFO - User: vignesh | Model: local | Q: intha padathil enna ullathu?
+2026-03-10 05:04:18,721 - INFO - User: vignesh | Model: local | Q: sattaiyin niram enna?
+2026-03-10 05:04:27,943 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 05:04:30,190 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-lite-preview:generateContent "HTTP/1.1 200 OK"
+2026-03-10 05:04:30,192 - INFO - User: vignesh | Model: gemini | Q: sattaiyin niram enna?
+2026-03-10 05:06:54,247 - INFO - User: vignesh | Model: local | Q: \u0b87\u0ba8\u0bcd\u0ba4\u0baa\u0bcd \u0baa\u0b9f\u0ba4\u0bcd\u0ba4\u0bbf\u0bb2\u0bcd \u0b8e\u0ba9\u0bcd\u0ba9 \u0b89\u0bb3\u0bcd\u0bb3\u0ba4\u0bc1
+2026-03-10 05:07:09,965 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 05:07:19,377 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-lite-preview:generateContent "HTTP/1.1 200 OK"
+2026-03-10 05:07:19,379 - INFO - User: vignesh | Model: gemini | Q: \u0b87\u0ba8\u0bcd\u0ba4\u0baa\u0bcd \u0baa\u0b9f\u0ba4\u0bcd\u0ba4\u0bbf\u0bb2\u0bcd \u0b8e\u0ba9\u0bcd\u0ba9 \u0b89\u0bb3\u0bcd\u0bb3\u0ba4\u0bc1
+2026-03-10 05:11:59,642 - INFO - User: sharu | Model: local | Q: Color of shirt
+2026-03-10 05:12:21,174 - INFO - User: sharu | Model: local | Q: Color of pant?
+2026-03-10 05:12:39,130 - INFO - AFC is enabled with max remote calls: 10.
+2026-03-10 05:12:53,394 - INFO - HTTP Request: POST https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-lite-preview:generateContent "HTTP/1.1 200 OK"
+2026-03-10 05:12:53,397 - INFO - User: sharu | Model: gemini | Q: Color of pant?

main.py

@@ -0,0 +1,116 @@
+import io
+from fastapi import FastAPI, File, UploadFile, Form, Request
+from fastapi.responses import JSONResponse
+from fastapi.templating import Jinja2Templates
+from fastapi.staticfiles import StaticFiles
+from fastapi.middleware.cors import CORSMiddleware
+from PIL import Image
+
+from ai_router import route_model
+from utils.logger import log_request
+from utils.security import check_rate_limit, validate_image_size
+from config import DEVICE, ENABLE_EXTERNAL_AI
+
+
+# ================= CREATE APP FIRST =================
+app = FastAPI(title="GenAI VQA System")
+
+
+# ================= CORS =================
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+
+# ================= STATIC + TEMPLATE =================
+app.mount("/static", StaticFiles(directory="static"), name="static")
+templates = Jinja2Templates(directory="templates")
+
+
+# ================= HOME =================
+@app.get("/")
+async def home(request: Request):
+    return templates.TemplateResponse("index.html", {"request": request})
+
+
+# ================= API =================
+@app.get("/api/logs")
+async def get_logs_endpoint(user: str):
+    import os
+    logs = []
+    if os.path.exists("logs/requests.log"):
+        with open("logs/requests.log", "r") as f:
+            for line in f:
+                if " - User: " in line:
+                    try:
+                        parts = line.split(" - INFO - User: ")
+                        timestamp = parts[0]
+                        rest = parts[1].split(" | Model: ")
+                        log_user = rest[0].strip()
+                        model_q = rest[1].split(" | Q: ")
+                        model = model_q[0].strip()
+                        question = model_q[1].strip()
+                        
+                        # Admin sees all, User sees only their own
+                        if user == "vignesh" or log_user == user:
+                            logs.append({
+                                "timestamp": timestamp, 
+                                "user": log_user, 
+                                "model": model, 
+                                "question": question
+                            })
+                    except Exception as e:
+                        pass
+    logs.reverse()
+    return {"logs": logs}
+
+
+@app.post("/ask")
+async def ask_question(
+    file: UploadFile = File(...),
+    question: str = Form(...),
+    model_choice: str = Form("reasoning"),
+    user: str = Form("guest"),
+    lang: str = Form("en")
+):
+
+    check_rate_limit(user)
+
+    image_bytes = await file.read()
+    validate_image_size(len(image_bytes))
+
+    try:
+        image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
+    except Exception as e:
+        return JSONResponse({
+            "device": "Error",
+            "model_used": model_choice,
+            "caption": "Image Load Error",
+            "answer": f"The supplied image was empty or an invalid format. Size received: {len(image_bytes)} bytes.",
+            "explanation": str(e),
+            "external_enabled": False
+        })
+
+    caption, answer, explanation = route_model(
+        model_choice,
+        image,
+        question,
+        lang
+    )
+
+ 
+
+    log_request(user, model_choice, question)
+
+    return JSONResponse({
+        "device": DEVICE,
+        "model_used": model_choice,
+        "caption": caption,
+        "answer": answer,
+        "explanation": explanation,
+        "external_enabled": ENABLE_EXTERNAL_AI
+    })

models/.ipynb_checkpoints/blip_model-checkpoint.py

@@ -0,0 +1,28 @@
+import torch
+from transformers import BlipProcessor, BlipForQuestionAnswering
+from config import DEVICE
+
+processor = BlipProcessor.from_pretrained("Salesforce/blip-vqa-base")
+model = BlipForQuestionAnswering.from_pretrained(
+    "Salesforce/blip-vqa-base"
+).to(DEVICE)
+
+model.eval()
+
+def blip_answer(image, question):
+
+    inputs = processor(
+        images=image,
+        text=question,
+        return_tensors="pt"
+    ).to(DEVICE)
+
+    with torch.no_grad():
+        output = model.generate(**inputs, max_new_tokens=5)
+
+    answer = processor.decode(output[0], skip_special_tokens=True)
+
+    # BLIP VQA does not generate caption
+    caption = "BLIP1 Direct VQA (no separate caption)"
+
+    return caption, answer

models/.ipynb_checkpoints/gemini_vision-checkpoint.py

@@ -0,0 +1,74 @@
+import base64
+from google import genai
+from config import GEMINI_API_KEY
+
+client = genai.Client(api_key=GEMINI_API_KEY)
+
+def gemini_vision_answer(image, question):
+
+    try:
+        # Convert PIL image to bytes
+        import io
+        buffer = io.BytesIO()
+        image.save(buffer, format="JPEG")
+        image_bytes = buffer.getvalue()
+
+        response = client.models.generate_content(
+            model="gemini-2.5-flash",
+            contents=[
+                {
+                    "role": "user",
+                    "parts": [
+                        {
+                            "inline_data": {
+                                "mime_type": "image/jpeg",
+                                "data": base64.b64encode(image_bytes).decode()
+                            }
+                        },
+                        {
+                            "text": f"""
+Analyze this image carefully.
+
+Question:
+{question}
+
+Respond in this exact format:
+
+Caption:
+<short caption>
+
+Final Answer:
+<direct answer>
+
+Explanation:
+<detailed reasoning>
+"""
+                        }
+                    ]
+                }
+            ]
+        )
+
+        text = response.text
+
+        # Parse response
+        caption = extract_section(text, "Caption:")
+        answer = extract_section(text, "Final Answer:")
+        explanation = extract_section(text, "Explanation:")
+
+        return caption, answer, explanation
+
+    except Exception as e:
+        print("GEMINI ERROR:", str(e))
+        return "Gemini Error", "Error", str(e)
+
+
+def extract_section(text, section_name):
+    try:
+        start = text.index(section_name) + len(section_name)
+        end = text.find("\n", start)
+        if end == -1:
+            end = len(text)
+        return text[start:end].strip()
+    except:
+        return "Not found"

models/.ipynb_checkpoints/reasoning_model-checkpoint.py

@@ -0,0 +1,39 @@
+from models.blip_model import blip_answer
+from transformers import AutoTokenizer, AutoModelForSeq2SeqLM
+import torch
+from config import DEVICE
+
+tokenizer = AutoTokenizer.from_pretrained("google/flan-t5-base")
+model = AutoModelForSeq2SeqLM.from_pretrained(
+    "google/flan-t5-base"
+).to(DEVICE)
+
+model.eval()
+
+def reasoning_answer(image, question):
+
+    caption, base_answer = blip_answer(image, question)
+
+    prompt = f"""
+Scene:
+{caption}
+
+Question:
+{question}
+
+Base Answer:
+{base_answer}
+
+Provide:
+Final Answer:
+Explanation:
+"""
+
+    inputs = tokenizer(prompt, return_tensors="pt").to(DEVICE)
+
+    with torch.no_grad():
+        outputs = model.generate(**inputs, max_new_tokens=100)
+
+    text = tokenizer.decode(outputs[0], skip_special_tokens=True)
+
+    return caption, base_answer, text

models/blip_model.py

@@ -0,0 +1,30 @@
+import torch
+from transformers import BlipProcessor, BlipForQuestionAnswering, BlipForConditionalGeneration
+from config import DEVICE
+
+processor_vqa = BlipProcessor.from_pretrained("Salesforce/blip-vqa-base")
+model_vqa = BlipForQuestionAnswering.from_pretrained("Salesforce/blip-vqa-base").to(DEVICE)
+model_vqa.eval()
+
+processor_cap = BlipProcessor.from_pretrained("Salesforce/blip-image-captioning-base")
+model_cap = BlipForConditionalGeneration.from_pretrained("Salesforce/blip-image-captioning-base").to(DEVICE)
+model_cap.eval()
+
+def blip_answer(image, question):
+    # Fix numpy tensor casting issues in HF deployment
+    if image.mode != "RGB":
+        image = image.convert("RGB")
+
+    # 1. Generate Caption
+    cap_inputs = processor_cap(images=image, return_tensors="pt").to(DEVICE)
+    with torch.no_grad():
+        cap_output = model_cap.generate(**cap_inputs, max_new_tokens=20)
+    caption = processor_cap.decode(cap_output[0], skip_special_tokens=True)
+
+    # 2. Generate Base Answer
+    vqa_inputs = processor_vqa(images=image, text=question, return_tensors="pt").to(DEVICE)
+    with torch.no_grad():
+        vqa_output = model_vqa.generate(**vqa_inputs, max_new_tokens=10)
+    answer = processor_vqa.decode(vqa_output[0], skip_special_tokens=True)
+
+    return caption, answer

models/gemini_vision.py

@@ -0,0 +1,68 @@
+import base64
+from google import genai
+from config import GEMINI_API_KEY
+import re
+
+client = genai.Client(api_key=GEMINI_API_KEY)
+
+def gemini_vision_answer(image, question, lang="en"):
+
+    try:
+        prompt = f"""Analyze this image carefully.
+
+Question:
+{question}
+
+You MUST respond strictly in the language code: {lang}. All text in your output must be translated to '{lang}'. 
+However, keep the structural English keys intact (Caption, Final Answer, Explanation).
+
+Respond strictly following this exact structure without any deviations or markdown blocks.
+
+Caption: <short caption>
+Final Answer: <direct answer>
+Explanation: <detailed reasoning>"""
+
+        response = client.models.generate_content(
+            model="gemini-3.1-flash-lite-preview",
+            contents=[image, prompt]
+        )
+
+        text = response.text
+
+        # Parse response using regex for better stability since LLMs can sometimes alter spacing
+        caption_match = re.search(r'Caption:\s*(.*?)(?=Final Answer:|$)', text, re.IGNORECASE | re.DOTALL)
+        answer_match = re.search(r'Final Answer:\s*(.*?)(?=Explanation:|$)', text, re.IGNORECASE | re.DOTALL)
+        explanation_match = re.search(r'Explanation:\s*(.*)', text, re.IGNORECASE | re.DOTALL)
+
+        caption = caption_match.group(1).strip() if caption_match else "Caption not generated correctly."
+        answer = answer_match.group(1).strip() if answer_match else "Answer not generated correctly."
+        explanation = explanation_match.group(1).strip() if explanation_match else "Explanation not generated correctly."
+
+        # Filter out markdown bolds if they leaked from the LLM prompt completion
+        caption = caption.replace("**", "")
+        answer = answer.replace("**", "")
+
+        return caption, answer, explanation
+
+    except Exception as e:
+        error_msg = str(e)
+        if "429" in error_msg or "RESOURCE_EXHAUSTED" in error_msg:
+            return (
+                "Rate Limit Exceeded",
+                "You have hit the free tier quota limit for Google Gemini.",
+                "Please wait or check your Google AI Studio dashboard for quota resets."
+            )
+        print("GEMINI ERROR:", error_msg)
+        return "Gemini Error", "Error", error_msg
+
+
+
+def extract_section(text, section_name):
+    try:
+        start = text.index(section_name) + len(section_name)
+        end = text.find("\n", start)
+        if end == -1:
+            end = len(text)
+        return text[start:end].strip()
+    except:
+        return "Not found"

models/reasoning_model.py

@@ -0,0 +1,39 @@
+from models.blip_model import blip_answer
+from transformers import AutoTokenizer, AutoModelForSeq2SeqLM
+import torch
+from config import DEVICE
+
+tokenizer = AutoTokenizer.from_pretrained("google/flan-t5-base")
+model = AutoModelForSeq2SeqLM.from_pretrained(
+    "google/flan-t5-base"
+).to(DEVICE)
+
+model.eval()
+
+def reasoning_answer(image, question):
+
+    caption, base_answer = blip_answer(image, question)
+
+    prompt = f"""
+Scene:
+{caption}
+
+Question:
+{question}
+
+Base Answer:
+{base_answer}
+
+Provide:
+Final Answer:
+Explanation:
+"""
+
+    inputs = tokenizer(prompt, return_tensors="pt").to(DEVICE)
+
+    with torch.no_grad():
+        outputs = model.generate(**inputs, max_new_tokens=100)
+
+    text = tokenizer.decode(outputs[0], skip_special_tokens=True)
+
+    return caption, base_answer, text

requirements.txt

@@ -0,0 +1,8 @@
+fastapi==0.110.0
+uvicorn==0.29.0
+python-multipart>=0.0.18
+pillow==10.2.0
+torch==2.2.1
+transformers==4.38.2
+google-genai==0.3.0
+deep-translator==1.11.4

static/app.js

@@ -0,0 +1,429 @@
+// State
+let appState = {
+    username: '',
+    logs: [],
+    stats: { total: 0, local: 0, gemini: 0 },
+    geminiEnabled: true
+};
+
+// UI Elements
+const els = {
+    tabs: document.querySelectorAll('.tab-content'),
+    menuBtns: document.querySelectorAll('.menu-btn'),
+    adminTabBtn: document.getElementById('admin-tab-btn'),
+    
+    // Login
+    loginOverlay: document.getElementById('login-overlay'),
+    loginInput: document.getElementById('login-input'),
+    loginBtn: document.getElementById('login-btn'),
+    mainApp: document.getElementById('main-app'),
+    displayUsername: document.getElementById('display-username'),
+    logoutBtn: document.getElementById('logout-btn'),
+    
+    // Image Modal
+    imageModal: document.getElementById('image-modal'),
+    modalImg: document.getElementById('modal-img'),
+    closeModal: document.getElementById('close-modal'),
+    
+    // VQA Elements
+    dropZone: document.getElementById('drop-zone'),
+    imageUpload: document.getElementById('image-upload'),
+    imagePreview: document.getElementById('image-preview'),
+    clearImageBtn: document.getElementById('clear-image-btn'),
+    uploadPlaceholder: document.getElementById('upload-placeholder'),
+    modelSelector: document.getElementById('model-selector'),
+    langSelector: document.getElementById('lang-selector'),
+    geminiOption: document.getElementById('gemini-option'),
+    questionInput: document.getElementById('question-input'),
+    askBtn: document.getElementById('ask-btn'),
+    
+    // Output Elements
+    welcomeState: document.getElementById('welcome-state'),
+    loadingIndicator: document.getElementById('loading-indicator'),
+    resultsContainer: document.getElementById('results-container'),
+    outCaption: document.getElementById('out-caption'),
+    outAnswer: document.getElementById('out-answer'),
+    outExplanation: document.getElementById('out-explanation'),
+    
+    // Stats & Admin
+    statTotal: document.getElementById('stat-total'),
+    statModels: document.getElementById('stat-models'),
+    logsBody: document.getElementById('logs-body'),
+    toggleGemini: document.getElementById('toggle-gemini'),
+    logSearch: document.getElementById('log-search'),
+    refreshLogsBtn: document.getElementById('refresh-logs-btn'),
+    
+    // Mobile
+    mobileMenuBtn: document.getElementById('mobile-menu-btn'),
+    sidebar: document.getElementById('sidebar')
+};
+
+// --- Initialization ---
+function init() {
+    setupEventListeners();
+    initChart();
+}
+
+// --- Event Listeners ---
+function setupEventListeners() {
+    // Login System
+    els.loginBtn.addEventListener('click', handleLogin);
+    els.loginInput.addEventListener('keypress', (e) => { if (e.key === 'Enter') handleLogin(); });
+    els.logoutBtn.addEventListener('click', handleLogout);
+
+    // Tabs
+    els.menuBtns.forEach(btn => {
+        btn.addEventListener('click', () => switchTab(btn.dataset.tab));
+    });
+
+    // Image Upload & Zoom Modal
+    els.dropZone.addEventListener('click', (e) => {
+        // Stop click from uploading if they clicked the clear button
+        if(e.target.closest('#clear-image-btn')) {
+            clearImage();
+            return;
+        }
+
+        // If they click the image directly, open zoom modal
+        if (e.target.id === 'image-preview' && !els.imagePreview.classList.contains('hidden')) {
+            els.modalImg.src = els.imagePreview.src;
+            els.imageModal.classList.remove('hidden');
+        } else {
+            els.imageUpload.click();
+        }
+    });
+
+    els.closeModal.addEventListener('click', () => {
+        els.imageModal.classList.add('hidden');
+    });
+
+    els.imageModal.addEventListener('click', (e) => {
+        if(e.target === els.imageModal) els.imageModal.classList.add('hidden');
+    });
+    
+    // Drag and Drop
+    els.dropZone.addEventListener('dragover', (e) => {
+        e.preventDefault(); els.dropZone.style.borderColor = 'var(--accent)';
+    });
+    els.dropZone.addEventListener('dragleave', () => {
+        els.dropZone.style.borderColor = 'var(--border-color)';
+    });
+    els.dropZone.addEventListener('drop', (e) => {
+        e.preventDefault(); els.dropZone.style.borderColor = 'var(--border-color)';
+        if (e.dataTransfer.files.length) handleImageUpload(e.dataTransfer.files[0]);
+    });
+
+    els.imageUpload.addEventListener('change', (e) => {
+        if (e.target.files.length) handleImageUpload(e.target.files[0]);
+    });
+
+    // Suggestions API (New Cards)
+    document.querySelectorAll('.sug-card').forEach(card => {
+        card.addEventListener('click', (e) => {
+            const text = card.querySelector('span').innerText;
+            els.questionInput.value = text;
+        });
+    });
+
+    // Ask Button
+    els.askBtn.addEventListener('click', handleAskAI);
+    els.questionInput.addEventListener('keypress', (e) => { if (e.key === 'Enter') handleAskAI(); });
+
+    // Voice Input & Output
+    setupVoiceFeatures();
+
+    // Admin Toggle
+    els.toggleGemini.addEventListener('change', (e) => {
+        appState.geminiEnabled = e.target.checked;
+        els.geminiOption.disabled = !appState.geminiEnabled;
+        if (!appState.geminiEnabled && els.modelSelector.value === 'gemini') {
+            els.modelSelector.value = 'local';
+        }
+    });
+
+    // Log search & Refresh
+    els.logSearch.addEventListener('input', (e) => renderLogs(e.target.value));
+    els.refreshLogsBtn.addEventListener('click', fetchLogs);
+
+    // Mobile Sidebar
+    if (els.mobileMenuBtn) {
+        els.mobileMenuBtn.addEventListener('click', () => {
+            els.sidebar.classList.toggle('open');
+        });
+    }
+
+    // Close sidebar on mobile when clicking a tab
+    els.menuBtns.forEach(btn => {
+        btn.addEventListener('click', () => {
+            if (window.innerWidth <= 900) {
+                els.sidebar.classList.remove('open');
+            }
+        });
+    });
+}
+
+// --- Login System ---
+function handleLogin() {
+    const val = els.loginInput.value.trim().toLowerCase();
+    if (!val) return alert("Please enter a username.");
+    
+    appState.username = val;
+    els.loginOverlay.classList.add('hidden');
+    els.mainApp.classList.remove('hidden');
+    els.displayUsername.innerText = appState.username;
+    
+    if (appState.username === 'vignesh') {
+        els.adminTabBtn.style.display = 'flex';
+    } else {
+        els.adminTabBtn.style.display = 'none';
+        if (document.querySelector('.menu-btn.active').dataset.tab === 'admin') {
+            switchTab('dashboard');
+        }
+    }
+    fetchLogs();
+    
+    // Small welcome speech
+    speak(`Welcome to GenAI Vision System, ${appState.username}`);
+}
+
+function handleLogout() {
+    appState.username = '';
+    els.mainApp.classList.add('hidden');
+    els.loginOverlay.classList.remove('hidden');
+    els.loginInput.value = '';
+    switchTab('dashboard');
+}
+
+// --- Voice Features (STT & TTS) ---
+function setupVoiceFeatures() {
+    // Text To Speech
+    document.querySelectorAll('.tts-btn').forEach(btn => {
+        btn.addEventListener('click', (e) => {
+            const targetId = e.currentTarget.dataset.target;
+            const textToRead = document.getElementById(targetId).innerText;
+            speak(textToRead);
+        });
+    });
+
+    // Speech To Text
+    const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+    const micBtn = document.getElementById('mic-btn');
+    if (SpeechRecognition) {
+        const recognition = new SpeechRecognition();
+        recognition.continuous = false;
+        recognition.interimResults = false;
+        
+        micBtn.addEventListener('click', () => {
+            const lang = document.getElementById('lang-selector').value;
+            recognition.lang = lang === 'en' ? 'en-US' : lang; // Convert locale code natively
+            micBtn.classList.add('recording');
+            recognition.start();
+        });
+        
+        recognition.onresult = (event) => {
+            const transcript = event.results[0][0].transcript;
+            els.questionInput.value = transcript;
+            micBtn.classList.remove('recording');
+        };
+        recognition.onerror = () => micBtn.classList.remove('recording');
+        recognition.onend = () => micBtn.classList.remove('recording');
+    } else {
+        micBtn.addEventListener('click', () => alert("Microphone not supported in this browser."));
+    }
+}
+
+function speak(text) {
+    if(!text) return;
+    window.speechSynthesis.cancel();
+    const utterance = new SpeechSynthesisUtterance(text);
+    const lang = document.getElementById('lang-selector').value;
+    utterance.lang = lang === 'en' ? 'en-US' : lang;
+    utterance.rate = window.navigator.userAgent.includes("Mac OS") ? 1.0 : 1.1;
+    window.speechSynthesis.speak(utterance);
+}
+
+// --- Tab System ---
+function switchTab(tabId) {
+    els.menuBtns.forEach(btn => btn.classList.remove('active'));
+    document.querySelector(`.menu-btn[data-tab="${tabId}"]`).classList.add('active');
+    
+    els.tabs.forEach(tab => {
+        tab.style.display = 'none';
+        tab.classList.remove('active');
+    });
+    
+    const target = document.getElementById(tabId);
+    target.style.display = 'block';
+    requestAnimationFrame(() => target.classList.add('active'));
+    
+    if (tabId === 'analytics') updateChart();
+    if (tabId === 'logs') fetchLogs();
+}
+
+// --- Image Handling ---
+let currentFile = null;
+function handleImageUpload(file) {
+    if (!file.type.startsWith('image/')) return alert("Please upload an image file.");
+    currentFile = file;
+    const reader = new FileReader();
+    reader.onload = (e) => {
+        els.imagePreview.src = e.target.result;
+        els.imagePreview.classList.remove('hidden');
+        if (els.clearImageBtn) els.clearImageBtn.classList.remove('hidden');
+        els.uploadPlaceholder.classList.add('hidden');
+    };
+    reader.readAsDataURL(file);
+}
+
+function clearImage() {
+    currentFile = null;
+    els.imageUpload.value = "";
+    els.imagePreview.src = "";
+    els.imagePreview.classList.add('hidden');
+    if (els.clearImageBtn) els.clearImageBtn.classList.add('hidden');
+    els.uploadPlaceholder.classList.remove('hidden');
+    
+    // Reset answers
+    els.resultsContainer.classList.add('hidden');
+    els.welcomeState.classList.remove('hidden');
+}
+
+// --- AI Interaction ---
+async function handleAskAI() {
+    const question = els.questionInput.value.trim();
+    if (!currentFile) return alert("Please upload an image first.");
+    if (!question) return alert("Please ask a question.");
+
+    els.askBtn.disabled = true;
+    els.askBtn.innerHTML = '<i class="fa-solid fa-spinner fa-spin"></i> Processing...';
+    els.welcomeState.classList.add('hidden');
+    els.resultsContainer.classList.add('hidden');
+    els.outCaption.innerHTML = ''; els.outAnswer.innerHTML = ''; els.outExplanation.innerHTML = '';
+    els.loadingIndicator.classList.remove('hidden');
+
+    const formData = new FormData();
+    formData.append('file', currentFile);
+    formData.append('question', question);
+    formData.append('model_choice', els.modelSelector.value);
+    formData.append('lang', els.langSelector.value);
+    formData.append('user', appState.username || "guest");
+
+    try {
+        const response = await fetch('/ask', { method: 'POST', body: formData });
+        const data = await response.json();
+        
+        els.loadingIndicator.classList.add('hidden');
+        els.resultsContainer.classList.remove('hidden');
+        
+        const cards = document.querySelectorAll('.result-card');
+        cards.forEach(card => {
+            card.classList.remove('fade-in');
+            void card.offsetWidth;
+            card.classList.add('fade-in');
+        });
+
+        typeWriter(els.outCaption, data.caption || "No caption provided");
+        setTimeout(() => typeWriter(els.outAnswer, data.answer || "No answer provided"), 500);
+        setTimeout(() => typeWriter(els.outExplanation, data.explanation || "No explanation provided"), 1000);
+
+        fetchLogs();
+
+    } catch (error) {
+        console.error(error);
+        alert("Error connecting to backend API.");
+        els.loadingIndicator.classList.add('hidden');
+    } finally {
+        els.askBtn.disabled = false;
+        els.askBtn.innerHTML = '<i class="fa-solid fa-wand-magic-sparkles"></i> Ask AI';
+    }
+}
+
+function typeWriter(element, text) {
+    let formattedText = text.replace(/\*\*(.*?)\*\*/g, '<b>$1</b>');
+    element.innerHTML = formattedText;
+}
+
+// --- Analytics & Logs API ---
+async function fetchLogs() {
+    if(!appState.username) return;
+    try {
+        const url = `/api/logs?user=${encodeURIComponent(appState.username)}`;
+        const res = await fetch(url);
+        const data = await res.json();
+        
+        appState.logs = data.logs || [];
+        appState.stats.total = appState.logs.length;
+        appState.stats.local = appState.logs.filter(l => ['local', 'blip', 'reasoning'].includes(l.model.toLowerCase())).length;
+        appState.stats.gemini = appState.logs.filter(l => ['gemini', 'external'].includes(l.model.toLowerCase())).length;
+        
+        updateDashboardView();
+    } catch(err) {
+        console.error("Failed fetching logs:", err);
+    }
+}
+
+function updateDashboardView() {
+    els.statTotal.innerText = appState.stats.total;
+    els.statModels.innerText = `${appState.stats.local} Local / ${appState.stats.gemini} Cloud`;
+    renderLogs();
+    updateChart();
+}
+
+function renderLogs(filter = '') {
+    els.logsBody.innerHTML = '';
+    appState.logs
+        .filter(log => log.question.toLowerCase().includes(filter.toLowerCase()) || log.model.includes(filter))
+        .forEach(log => {
+        const tr = document.createElement('tr');
+        tr.innerHTML = `
+            <td>${log.timestamp}</td>
+            <td><span class="user-badge" style="color: var(--text-secondary);"><i class="fa-solid fa-user"></i> ${log.user}</span></td>
+            <td><span style="color: ${log.model.includes('gemini') ? 'var(--accent)' : 'var(--success)'}">${log.model.toUpperCase()}</span></td>
+            <td>${log.question.length > 50 ? log.question.substring(0, 50) + '...' : log.question}</td>
+        `;
+        els.logsBody.appendChild(tr);
+    });
+}
+
+// --- Chart.js ---
+let myChart;
+function initChart() {
+    const ctx = document.getElementById('modelChart').getContext('2d');
+    Chart.defaults.color = '#94a3b8';
+    Chart.defaults.font.family = 'Inter';
+    
+    myChart = new Chart(ctx, {
+        type: 'bar',
+        data: getChartData(),
+        options: {
+            responsive: true, maintainAspectRatio: false,
+            plugins: { legend: { display: false } },
+            scales: {
+                y: { beginAtZero: true, grid: { color: 'rgba(255,255,255,0.1)' } },
+                x: { grid: { display: false } }
+            }
+        }
+    });
+}
+
+function getChartData() {
+    return {
+        labels: ['BLIP + FLAN (Local)', 'Gemini AI (Cloud)'],
+        datasets: [{
+            label: 'Queries',
+            data: [appState.stats.local, appState.stats.gemini],
+            backgroundColor: ['rgba(16, 185, 129, 0.6)', 'rgba(99, 102, 241, 0.6)'],
+            borderColor: ['rgba(16, 185, 129, 1)', 'rgba(99, 102, 241, 1)'],
+            borderWidth: 1, borderRadius: 6
+        }]
+    };
+}
+
+function updateChart() {
+    if (myChart) {
+        myChart.data = getChartData();
+        myChart.update();
+    }
+}
+
+init();

static/css/.ipynb_checkpoints/style-checkpoint.css

@@ -0,0 +1,14 @@
+.loader {
+  border: 6px solid #1e293b;
+  border-top: 6px solid #3b82f6;
+  border-radius: 50%;
+  width: 40px;
+  height: 40px;
+  animation: spin 1s linear infinite;
+  margin: 20px auto;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}

static/css/style.css

@@ -0,0 +1,14 @@
+.loader {
+  border: 6px solid #1e293b;
+  border-top: 6px solid #3b82f6;
+  border-radius: 50%;
+  width: 40px;
+  height: 40px;
+  animation: spin 1s linear infinite;
+  margin: 20px auto;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}

static/js/.ipynb_checkpoints/app-checkpoint.js

@@ -0,0 +1,91 @@
+let currentUser = "";
+let requestCount = 0;
+
+function login() {
+    const user = document.getElementById("username").value;
+    if (!user) return alert("Enter username");
+
+    currentUser = user;
+
+    if (user === "vignesh") {
+        document.getElementById("adminMenu").classList.remove("hidden");
+    }
+
+    document.getElementById("loginPage").classList.add("hidden");
+    document.getElementById("appContainer").classList.remove("hidden");
+}
+
+function showPage(page) {
+    ["dashboard", "analytics", "logs", "admin"].forEach(p => {
+        document.getElementById(p + "Page").classList.add("hidden");
+    });
+    document.getElementById(page + "Page").classList.remove("hidden");
+}
+
+document.getElementById("imageInput").addEventListener("change", function () {
+    const file = this.files[0];
+    if (file) {
+        const img = document.getElementById("previewImage");
+        img.src = URL.createObjectURL(file);
+        img.classList.remove("hidden");
+    }
+});
+
+document.getElementById("micBtn").addEventListener("click", function () {
+    const recognition = new webkitSpeechRecognition();
+    recognition.lang = "en-US";
+    recognition.start();
+    recognition.onresult = function (event) {
+        document.getElementById("questionInput").value =
+            event.results[0][0].transcript;
+    };
+});
+
+function typeWriter(element, text, speed = 15) {
+    element.innerHTML = "";
+    let i = 0;
+    function typing() {
+        if (i < text.length) {
+            element.innerHTML += text.charAt(i);
+            i++;
+            setTimeout(typing, speed);
+        }
+    }
+    typing();
+}
+typeWriter(document.getElementById("answerText"), data.answer);
+typeWriter(document.getElementById("explanationText"), data.explanation);
+
+async function askQuestion() {
+
+    const file = document.getElementById("imageInput").files[0];
+    const question = document.getElementById("questionInput").value;
+    const model = document.getElementById("modelSelect").value;
+
+    if (!file || !question) return alert("Upload image + ask question");
+
+    const formData = new FormData();
+    formData.append("file", file);
+    formData.append("question", question);
+    formData.append("model_choice", model);
+    formData.append("user", currentUser);
+
+    document.getElementById("loadingSpinner").classList.remove("hidden");
+
+    const response = await fetch("/ask", {
+        method: "POST",
+        body: formData
+    });
+
+    const data = await response.json();
+
+    document.getElementById("captionText").innerText = data.caption;
+    document.getElementById("answerText").innerText = data.answer;
+    document.getElementById("explanationText").innerText = data.explanation;
+
+    document.getElementById("resultsSection").classList.remove("hidden");
+    document.getElementById("loadingSpinner").classList.add("hidden");
+
+    requestCount++;
+    document.getElementById("totalRequests").innerText = requestCount;
+}

static/js/app.js

@@ -0,0 +1,91 @@
+let currentUser = "";
+let requestCount = 0;
+
+function login() {
+    const user = document.getElementById("username").value;
+    if (!user) return alert("Enter username");
+
+    currentUser = user;
+
+    if (user === "vignesh") {
+        document.getElementById("adminMenu").classList.remove("hidden");
+    }
+
+    document.getElementById("loginPage").classList.add("hidden");
+    document.getElementById("appContainer").classList.remove("hidden");
+}
+
+function showPage(page) {
+    ["dashboard", "analytics", "logs", "admin"].forEach(p => {
+        document.getElementById(p + "Page").classList.add("hidden");
+    });
+    document.getElementById(page + "Page").classList.remove("hidden");
+}
+
+document.getElementById("imageInput").addEventListener("change", function () {
+    const file = this.files[0];
+    if (file) {
+        const img = document.getElementById("previewImage");
+        img.src = URL.createObjectURL(file);
+        img.classList.remove("hidden");
+    }
+});
+
+document.getElementById("micBtn").addEventListener("click", function () {
+    const recognition = new webkitSpeechRecognition();
+    recognition.lang = "en-US";
+    recognition.start();
+    recognition.onresult = function (event) {
+        document.getElementById("questionInput").value =
+            event.results[0][0].transcript;
+    };
+});
+
+function typeWriter(element, text, speed = 15) {
+    element.innerHTML = "";
+    let i = 0;
+    function typing() {
+        if (i < text.length) {
+            element.innerHTML += text.charAt(i);
+            i++;
+            setTimeout(typing, speed);
+        }
+    }
+    typing();
+}
+typeWriter(document.getElementById("answerText"), data.answer);
+typeWriter(document.getElementById("explanationText"), data.explanation);
+
+async function askQuestion() {
+
+    const file = document.getElementById("imageInput").files[0];
+    const question = document.getElementById("questionInput").value;
+    const model = document.getElementById("modelSelect").value;
+
+    if (!file || !question) return alert("Upload image + ask question");
+
+    const formData = new FormData();
+    formData.append("file", file);
+    formData.append("question", question);
+    formData.append("model_choice", model);
+    formData.append("user", currentUser);
+
+    document.getElementById("loadingSpinner").classList.remove("hidden");
+
+    const response = await fetch("/ask", {
+        method: "POST",
+        body: formData
+    });
+
+    const data = await response.json();
+
+    document.getElementById("captionText").innerText = data.caption;
+    document.getElementById("answerText").innerText = data.answer;
+    document.getElementById("explanationText").innerText = data.explanation;
+
+    document.getElementById("resultsSection").classList.remove("hidden");
+    document.getElementById("loadingSpinner").classList.add("hidden");
+
+    requestCount++;
+    document.getElementById("totalRequests").innerText = requestCount;
+}

static/style.css

@@ -0,0 +1,611 @@
+:root {
+    --bg-dark: #0f1115;
+    --bg-panel: rgba(255, 255, 255, 0.03);
+    --bg-panel-hover: rgba(255, 255, 255, 0.05);
+    --border-color: rgba(255, 255, 255, 0.1);
+    --text-primary: #ffffff;
+    --text-secondary: #94a3b8;
+    --accent: #6366f1;
+    --accent-hover: #4f46e5;
+    --danger: #ef4444;
+    --success: #10b981;
+}
+
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+}
+
+body {
+    background-color: var(--bg-dark);
+    color: var(--text-primary);
+    min-height: 100vh;
+    overflow-x: hidden;
+}
+
+/* Mobile Header */
+.mobile-header {
+    display: none;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px 20px;
+    background: rgba(15, 17, 21, 0.95);
+    border-bottom: 1px solid var(--border-color);
+    position: sticky;
+    top: 0;
+    z-index: 90;
+}
+.mobile-header .logo {
+    margin-bottom: 0;
+    padding: 0;
+}
+
+/* Glassmorphism Panel */
+.glass-panel {
+    background: var(--bg-panel);
+    backdrop-filter: blur(12px);
+    -webkit-backdrop-filter: blur(12px);
+    border: 1px solid var(--border-color);
+    border-radius: 16px;
+    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
+}
+
+.app-container {
+    display: flex;
+    height: 100vh;
+}
+
+/* Sidebar */
+.sidebar {
+    width: 250px;
+    background: rgba(15, 17, 21, 0.8);
+    border-right: 1px solid var(--border-color);
+    display: flex;
+    flex-direction: column;
+    padding: 20px 0;
+    backdrop-filter: blur(20px);
+}
+
+.logo {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 0 24px;
+    margin-bottom: 40px;
+    color: var(--text-primary);
+}
+
+.logo i {
+    font-size: 24px;
+    color: var(--accent);
+}
+
+.menu {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 0 16px;
+    flex-grow: 1;
+}
+
+.menu-btn {
+    background: transparent;
+    border: none;
+    color: var(--text-secondary);
+    padding: 12px 16px;
+    text-align: left;
+    border-radius: 8px;
+    cursor: pointer;
+    font-size: 15px;
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    transition: all 0.2s ease;
+}
+
+.menu-btn:hover {
+    background: var(--bg-panel);
+    color: var(--text-primary);
+}
+
+.menu-btn.active {
+    background: var(--accent);
+    color: white;
+}
+
+.user-profile {
+    padding: 16px 24px;
+    border-top: 1px solid var(--border-color);
+}
+
+.user-info {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+}
+
+.user-info i {
+    font-size: 20px;
+    color: var(--text-secondary);
+}
+
+.user-info input {
+    background: transparent;
+    border: none;
+    color: var(--text-primary);
+    font-size: 14px;
+    outline: none;
+    width: 100%;
+}
+
+/* Main Content */
+.main-content {
+    flex-grow: 1;
+    padding: 40px;
+    overflow-y: auto;
+}
+
+header {
+    margin-bottom: 30px;
+}
+
+header h1 {
+    font-size: 28px;
+    font-weight: 600;
+    margin-bottom: 8px;
+    background: linear-gradient(135deg, #fff, #94a3b8);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+header p {
+    color: var(--text-secondary);
+    font-size: 15px;
+}
+
+/* Tab Management */
+.tab-content {
+    display: none;
+    animation: fadeIn 0.4s ease forwards;
+}
+
+.tab-content.active {
+    display: block;
+}
+
+/* VQA Layout */
+.vqa-container {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 30px;
+}
+
+/* Upload Area */
+.input-section {
+    padding: 24px;
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+}
+
+.upload-area {
+    width: 100%;
+    height: 250px;
+    border: 2px dashed var(--border-color);
+    border-radius: 12px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    overflow: hidden;
+    position: relative;
+    background: rgba(0,0,0,0.2);
+}
+
+.upload-area:hover {
+    border-color: var(--accent);
+    background: rgba(99, 102, 241, 0.05);
+}
+
+.upload-placeholder {
+    text-align: center;
+    color: var(--text-secondary);
+}
+
+.upload-placeholder i {
+    font-size: 48px;
+    margin-bottom: 16px;
+    color: var(--accent);
+}
+
+#image-preview {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.hidden {
+    display: none !important;
+}
+
+/* Controls */
+.controls {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.control-group {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+}
+
+.control-group label {
+    font-size: 14px;
+    font-weight: 500;
+    color: var(--text-secondary);
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+select, input[type="text"] {
+    width: 100%;
+    background: rgba(0,0,0,0.3);
+    border: 1px solid var(--border-color);
+    color: var(--text-primary);
+    padding: 12px 16px;
+    border-radius: 8px;
+    font-size: 14px;
+    outline: none;
+    transition: border-color 0.2s;
+}
+
+select:focus, input[type="text"]:focus {
+    border-color: var(--accent);
+}
+
+.input-wrapper {
+    display: flex;
+    gap: 8px;
+}
+
+.input-wrapper input {
+    flex-grow: 1;
+}
+
+.icon-btn {
+    background: rgba(0,0,0,0.3);
+    border: 1px solid var(--border-color);
+    color: var(--text-primary);
+    width: 44px;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all 0.2s;
+}
+
+.icon-btn:hover {
+    background: var(--bg-panel-hover);
+    color: var(--accent);
+}
+
+.primary-btn {
+    background: var(--accent);
+    color: white;
+    border: none;
+    padding: 14px;
+    border-radius: 8px;
+    font-size: 15px;
+    font-weight: 600;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    transition: all 0.2s;
+    margin-top: 8px;
+}
+
+.primary-btn:hover {
+    background: var(--accent-hover);
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
+}
+
+.primary-btn:disabled {
+    background: #334155;
+    cursor: not-allowed;
+    transform: none;
+    box-shadow: none;
+}
+
+/* Results Section */
+.output-section {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.result-card {
+    padding: 20px;
+    border-left: 4px solid var(--accent);
+}
+
+.result-card h3 {
+    font-size: 14px;
+    color: var(--text-secondary);
+    margin-bottom: 8px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+}
+
+.result-card p {
+    font-size: 15px;
+    line-height: 1.6;
+}
+
+/* Animations */
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(10px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.fade-in {
+    opacity: 0;
+    animation: fadeIn 0.5s ease forwards;
+}
+
+.delay-1 { animation-delay: 0.2s; }
+.delay-2 { animation-delay: 0.4s; }
+
+/* Loading Spinner */
+#loading-indicator {
+    padding: 40px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 16px;
+    height: 100%;
+}
+
+.spinner {
+    width: 40px;
+    height: 40px;
+    border: 3px solid rgba(255, 255, 255, 0.1);
+    border-radius: 50%;
+    border-top-color: var(--accent);
+    animation: spin 1s ease-in-out infinite;
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
+
+/* Typewriter Effect Container */
+.typewriter-container {
+    min-height: 24px;
+}
+
+/* Toggle Switch */
+.switch {
+    position: relative;
+    display: inline-block;
+    width: 50px;
+    height: 26px;
+}
+
+.switch input { opacity: 0; width: 0; height: 0; }
+
+.slider {
+    position: absolute;
+    cursor: pointer;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background-color: var(--border-color);
+    transition: .4s;
+    border-radius: 34px;
+}
+
+.slider:before {
+    position: absolute;
+    content: "";
+    height: 20px;
+    width: 20px;
+    left: 3px;
+    bottom: 3px;
+    background-color: white;
+    transition: .4s;
+    border-radius: 50%;
+}
+
+input:checked + .slider {
+    background-color: var(--success);
+}
+
+input:checked + .slider:before {
+    transform: translateX(24px);
+}
+
+/* Analytics Grid */
+.stats-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+    gap: 20px;
+    margin-bottom: 30px;
+}
+
+.stat-card {
+    padding: 24px;
+    text-align: center;
+}
+
+.stat-card h3 {
+    font-size: 14px;
+    color: var(--text-secondary);
+    margin-bottom: 12px;
+}
+
+.stat-value {
+    font-size: 32px;
+    font-weight: 700;
+    color: var(--accent);
+}
+
+.chart-container {
+    padding: 24px;
+    height: 400px;
+}
+
+/* Admin Grid */
+.admin-grid {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 20px;
+}
+
+.admin-card {
+    padding: 24px;
+}
+
+.admin-card h3 {
+    margin-bottom: 20px;
+    padding-bottom: 12px;
+    border-bottom: 1px solid var(--border-color);
+    color: var(--text-primary);
+}
+
+.setting-row {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.danger-btn {
+    background: rgba(239, 68, 68, 0.1);
+    color: var(--danger);
+    border: 1px solid var(--danger);
+    padding: 10px 16px;
+    border-radius: 8px;
+    cursor: pointer;
+    font-weight: 500;
+    transition: all 0.2s;
+}
+
+.danger-btn:hover {
+    background: var(--danger);
+    color: white;
+}
+
+/* Logs Table */
+.table-container {
+    overflow-x: auto;
+}
+
+.logs-table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.logs-table th, .logs-table td {
+    padding: 14px 16px;
+    text-align: left;
+    border-bottom: 1px solid var(--border-color);
+    font-size: 14px;
+}
+
+.logs-table th {
+    color: var(--text-secondary);
+    font-weight: 500;
+}
+
+.filter-bar {
+    margin-bottom: 16px;
+}
+
+.filter-bar input {
+    width: 300px;
+}
+
+/* Suggestions Grid */
+.suggestions-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 15px;
+    margin-top: 20px;
+}
+
+.sug-card {
+    background: rgba(255, 255, 255, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 12px;
+    padding: 16px;
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    color: var(--text-primary);
+    cursor: pointer;
+    font-size: 14px;
+    text-align: left;
+    transition: all 0.2s ease;
+}
+
+.sug-card:hover {
+    background: rgba(255, 255, 255, 0.1);
+    transform: translateY(-2px);
+    border-color: rgba(255, 255, 255, 0.2);
+    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
+}
+
+.sug-card i {
+    font-size: 20px;
+}
+
+/* Responsive */
+@media (max-width: 900px) {
+    .suggestions-grid {
+        grid-template-columns: 1fr;
+    }
+    
+    .app-container {
+        flex-direction: column;
+    }
+    
+    .mobile-header {
+        display: flex;
+    }
+
+    .vqa-container {
+        grid-template-columns: 1fr;
+    }
+    
+    .sidebar {
+        position: fixed;
+        left: -250px;
+        top: 0;
+        height: 100vh;
+        z-index: 100;
+        transition: left 0.3s;
+        box-shadow: 5px 0 15px rgba(0,0,0,0.5);
+    }
+    
+    .sidebar.open {
+        left: 0;
+    }
+    
+    .main-content {
+        padding: 15px;
+    }
+    
+    /* Login fix for mobile */
+    .login-box {
+        margin: 20px;
+        padding: 30px 20px;
+    }
+}

templates/.ipynb_checkpoints/index-checkpoint.html

@@ -0,0 +1,122 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>GenAI VQA Dashboard</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+</head>
+
+<body class="bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 text-white min-h-screen">
+
+<!-- LOGIN -->
+<div id="loginPage" class="flex items-center justify-center h-screen">
+    <div class="bg-gray-800 p-8 rounded-2xl shadow-xl w-96 animate-fade-in">
+        <h2 class="text-2xl font-bold mb-6 text-blue-400">GenAI VQA Login</h2>
+        <input id="username" placeholder="Username"
+            class="w-full p-3 mb-4 rounded bg-gray-700">
+        <button onclick="login()"
+            class="w-full bg-blue-600 p-3 rounded hover:bg-blue-700 transition">
+            Login
+        </button>
+    </div>
+</div>
+
+<!-- MAIN -->
+<div id="appContainer" class="hidden flex">
+
+    <!-- Sidebar -->
+    <div class="w-64 bg-gray-800 p-6 shadow-xl">
+        <h2 class="text-2xl font-bold mb-8 text-blue-400">GenAI VQA</h2>
+        <ul class="space-y-4">
+            <li onclick="showPage('dashboard')" class="cursor-pointer hover:text-blue-400">Dashboard</li>
+            <li onclick="showPage('analytics')" class="cursor-pointer hover:text-blue-400">Analytics</li>
+            <li onclick="showPage('logs')" class="cursor-pointer hover:text-blue-400">Logs</li>
+            <li id="adminMenu" onclick="showPage('admin')" class="cursor-pointer hover:text-blue-400 hidden">Admin</li>
+        </ul>
+    </div>
+
+    <!-- Content -->
+    <div class="flex-1 p-8">
+
+        <!-- DASHBOARD -->
+        <div id="dashboardPage">
+            <h1 class="text-3xl font-bold mb-6">Vision Question Answering</h1>
+
+            <input type="file" id="imageInput" class="mb-4">
+            <img id="previewImage" class="max-h-64 rounded mb-4 hidden">
+
+            <input id="questionInput"
+                placeholder="Ask a question..."
+                class="w-full p-3 rounded bg-gray-700 mb-4">
+
+            <div class="flex gap-4 mb-4">
+
+                <select id="modelSelect"
+                    class="p-3 bg-gray-700 rounded">
+  <option value="local">BLIP + FLAN</option>
+  <option value="gemini">Gemini AI</option>
+
+                </select>
+
+                <button id="micBtn"
+                    class="bg-purple-600 px-4 py-2 rounded hover:bg-purple-700 transition">
+                    🎤
+                </button>
+
+                <button onclick="askQuestion()"
+                    class="bg-blue-600 px-6 py-2 rounded hover:bg-blue-700 transition">
+                    Ask
+                </button>
+
+            </div>
+
+            <!-- LOADING -->
+            <div id="loadingSpinner" class="hidden">
+                <div class="animate-spin h-8 w-8 border-4 border-blue-400 border-t-transparent rounded-full"></div>
+            </div>
+
+            <!-- RESULTS -->
+            <div id="resultsSection" class="space-y-4 hidden mt-6">
+
+                <div class="bg-gray-800 p-4 rounded-xl shadow-lg">
+                    <h2 class="text-blue-400 font-semibold">Caption</h2>
+                    <p id="captionText"></p>
+                </div>
+
+                <div class="bg-gray-800 p-4 rounded-xl shadow-lg">
+                    <h2 class="text-green-400 font-semibold">Answer</h2>
+                    <p id="answerText"></p>
+                </div>
+
+                <div class="bg-gray-800 p-4 rounded-xl shadow-lg">
+                    <h2 class="text-yellow-400 font-semibold">Explanation</h2>
+                    <p id="explanationText"></p>
+                </div>
+
+            </div>
+        </div>
+
+        <!-- ANALYTICS -->
+        <div id="analyticsPage" class="hidden">
+            <h1 class="text-3xl font-bold mb-6">Analytics</h1>
+            <p>Total Requests: <span id="totalRequests">0</span></p>
+        </div>
+
+        <!-- LOGS -->
+        <div id="logsPage" class="hidden">
+            <h1 class="text-3xl font-bold mb-6">Logs</h1>
+            <p>Logs saved in backend/logs</p>
+        </div>
+
+        <!-- ADMIN -->
+        <div id="adminPage" class="hidden">
+            <h1 class="text-3xl font-bold mb-6">Admin Control</h1>
+            <p>External AI enabled</p>
+        </div>
+
+    </div>
+</div>
+
+<script src="/static/js/app.js"></script>
+</body>
+</html>

templates/index.html

@@ -0,0 +1,266 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>GenAI VQA System</title>
+    <link rel="stylesheet" href="/static/style.css?v=3">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+</head>
+<body class="dark-theme">
+
+    <!-- Login Overlay -->
+    <div id="login-overlay" class="login-overlay active">
+        <div class="login-box glass-panel fade-in">
+            <i class="fa-solid fa-brain" style="font-size: 50px; color: var(--accent); margin-bottom: 24px;"></i>
+            <h2>GenAI VQA Portal</h2>
+            <p style="margin-bottom: 24px; color: var(--text-secondary);">Enter your username to access the system</p>
+            <input type="text" id="login-input" placeholder="Username (e.g. vignesh)" autocomplete="off">
+            <button id="login-btn" class="primary-btn" style="width: 100%;">Enter System <i class="fa-solid fa-arrow-right"></i></button>
+        </div>
+    </div>
+
+    <!-- Image Zoom Modal -->
+    <div id="image-modal" class="modal hidden">
+        <span class="close-modal" id="close-modal">&times;</span>
+        <img class="modal-content" id="modal-img">
+    </div>
+
+    <div class="app-container hidden" id="main-app">
+        <!-- Mobile Header -->
+        <div class="mobile-header">
+            <div class="logo">
+                <i class="fa-solid fa-brain"></i>
+                <h2>GenAI VQA</h2>
+            </div>
+            <button id="mobile-menu-btn" class="icon-btn"><i class="fa-solid fa-bars"></i></button>
+        </div>
+
+        <!-- Sidebar -->
+        <aside class="sidebar" id="sidebar">
+            <div class="logo">
+                <i class="fa-solid fa-brain"></i>
+                <h2>GenAI VQA</h2>
+            </div>
+            
+            <nav class="menu">
+                <button class="menu-btn active" data-tab="dashboard">
+                    <i class="fa-solid fa-gauge"></i> Dashboard
+                </button>
+                <button class="menu-btn" data-tab="analytics">
+                    <i class="fa-solid fa-chart-line"></i> Analytics
+                </button>
+                <button class="menu-btn" data-tab="logs">
+                    <i class="fa-solid fa-list"></i> Logs
+                </button>
+                <button class="menu-btn" data-tab="admin" id="admin-tab-btn" style="display: none;">
+                    <i class="fa-solid fa-shield-halved"></i> Admin
+                </button>
+            </nav>
+
+            <div class="user-profile">
+                <div class="user-info">
+                    <i class="fa-solid fa-user-circle"></i>
+                    <span id="display-username" style="font-weight: 600;">guest</span>
+                    <button id="logout-btn" class="icon-btn" style="margin-left: auto; width: 32px; height: 32px; text-align: center;" title="Logout"><i class="fa-solid fa-right-from-bracket"></i></button>
+                </div>
+            </div>
+        </aside>
+
+        <!-- Main Content -->
+        <main class="main-content">
+            <!-- Dashboard Tab -->
+            <section id="dashboard" class="tab-content active">
+                <header>
+                    <h1>Vision Question Answering</h1>
+                    <p>Upload an image and ask any question to our AI models</p>
+                </header>
+
+                <div class="vqa-container">
+                    <!-- Left Column: Input -->
+                    <div class="input-section glass-panel">
+                        <div class="upload-area" id="drop-zone" title="Click to upload. If image exists, click it to zoom.">
+                            <input type="file" id="image-upload" accept="image/*" hidden>
+                            <div class="upload-placeholder" id="upload-placeholder">
+                                <i class="fa-solid fa-cloud-arrow-up"></i>
+                                <p>Drag & Drop or Click to Upload Image</p>
+                            </div>
+                            <img id="image-preview" class="hidden" alt="Preview" style="cursor: zoom-in;">
+                            <button id="clear-image-btn" class="hidden" title="Clear Image" style="position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,0.6); color: white; border: none; border-radius: 50%; width: 32px; height: 32px; cursor: pointer; z-index: 10; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); transition: background 0.2s;"><i class="fa-solid fa-xmark"></i></button>
+                        </div>
+
+                        <div class="controls">
+                            <div style="display: flex; gap: 16px;">
+                                <div class="control-group" style="flex: 1;">
+                                    <label><i class="fa-solid fa-microchip"></i> Select Model</label>
+                                    <select id="model-selector">
+                                        <option value="local">BLIP + FLAN (Local)</option>
+                                        <option value="gemini" id="gemini-option">Gemini 3.1 Flash Vision (High Quota)</option>
+                                    </select>
+                                </div>
+                                <div class="control-group" style="flex: 1;">
+                                    <label><i class="fa-solid fa-language"></i> Language</label>
+                                    <select id="lang-selector">
+                                        <option value="en">English</option>
+                                        <option value="ta">Tamil (தமிழ்)</option>
+                                        <option value="te">Telugu (తెలుగు)</option>
+                                        <option value="hi">Hindi (हिन्दी)</option>
+                                        <option value="es">Spanish (Español)</option>
+                                        <option value="fr">French (Français)</option>
+                                        <option value="zh-cn">Chinese (中文)</option>
+                                    </select>
+                                </div>
+                            </div>
+
+                            <div class="control-group">
+                                <label><i class="fa-solid fa-circle-question"></i> Your Question</label>
+                                <div class="input-wrapper">
+                                    <input type="text" id="question-input" placeholder="Type your question here...">
+                                    <button id="mic-btn" class="icon-btn" title="Click to speak"><i class="fa-solid fa-microphone"></i></button>
+                                </div>
+                            </div>
+
+                            <button id="ask-btn" class="primary-btn">
+                                <i class="fa-solid fa-wand-magic-sparkles"></i> Ask AI
+                            </button>
+                        </div>
+                    </div>
+
+                    <!-- Right Column: Output -->
+                    <div class="output-section">
+                        <!-- Welcome / Suggestions State -->
+                        <div id="welcome-state" class="glass-panel" style="padding: 30px; text-align: center;">
+                            <i class="fa-solid fa-wand-magic-sparkles" style="font-size: 44px; color: var(--accent); margin-bottom: 20px;"></i>
+                            <h2 style="margin-bottom: 12px; font-weight: 600;">AI Vision Explorer</h2>
+                            <p style="color: var(--text-secondary); margin-bottom: 30px; font-size: 15px;">Upload an image, select your language, and ask anything. Or, try one of the prompts below:</p>
+                            
+                            <div class="suggestions-grid">
+                                <button class="sug-card">
+                                    <i class="fa-solid fa-magnifying-glass" style="color: #10b981;"></i>
+                                    <span>What is happening in this image?</span>
+                                </button>
+                                <button class="sug-card">
+                                    <i class="fa-solid fa-language" style="color: #3b82f6;"></i>
+                                    <span>Translate any text in the image.</span>
+                                </button>
+                                <button class="sug-card">
+                                    <i class="fa-solid fa-face-smile" style="color: #f59e0b;"></i>
+                                    <span>Describe the overall theme and mood.</span>
+                                </button>
+                                <button class="sug-card">
+                                    <i class="fa-solid fa-shapes" style="color: #8b5cf6;"></i>
+                                    <span>Identify all objects and people.</span>
+                                </button>
+                            </div>
+                        </div>
+
+                        <!-- Loading State -->
+                        <div id="loading-indicator" class="hidden glass-panel">
+                            <div class="spinner"></div>
+                            <p>AI is analyzing the image...</p>
+                        </div>
+
+                        <!-- Results -->
+                        <div id="results-container" class="hidden">
+                            <div class="result-card glass-panel fade-in">
+                                <div class="card-header">
+                                    <h3><i class="fa-solid fa-quote-left"></i> Caption</h3>
+                                    <button class="tts-btn" data-target="out-caption" title="Read Aloud"><i class="fa-solid fa-volume-up"></i></button>
+                                </div>
+                                <div id="out-caption" class="typewriter-container"></div>
+                            </div>
+
+                            <div class="result-card glass-panel fade-in delay-1">
+                                <div class="card-header">
+                                    <h3><i class="fa-solid fa-check-double"></i> Final Answer</h3>
+                                    <button class="tts-btn" data-target="out-answer" title="Read Aloud"><i class="fa-solid fa-volume-up"></i></button>
+                                </div>
+                                <div id="out-answer" class="typewriter-container"></div>
+                            </div>
+
+                            <div class="result-card glass-panel fade-in delay-2">
+                                <div class="card-header">
+                                    <h3><i class="fa-solid fa-lightbulb"></i> Explanation</h3>
+                                    <button class="tts-btn" data-target="out-explanation" title="Read Aloud"><i class="fa-solid fa-volume-up"></i></button>
+                                </div>
+                                <div id="out-explanation" class="typewriter-container"></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </section>
+
+            <!-- Analytics Tab -->
+            <section id="analytics" class="tab-content" style="display: none;">
+                <header>
+                    <h1 id="analytics-title">Analytics Dashboard</h1>
+                    <p>System usage and model statistics</p>
+                </header>
+                <div class="stats-grid">
+                    <div class="stat-card glass-panel">
+                        <h3>Total Queries</h3>
+                        <div class="stat-value" id="stat-total">0</div>
+                    </div>
+                    <div class="stat-card glass-panel">
+                        <h3>Models Used</h3>
+                        <div class="stat-value" id="stat-models">0/0</div>
+                    </div>
+                </div>
+                <div class="chart-container glass-panel">
+                    <canvas id="modelChart"></canvas>
+                </div>
+            </section>
+
+            <!-- Logs Tab -->
+            <section id="logs" class="tab-content" style="display: none;">
+                <header>
+                    <h1 id="logs-title">System Logs</h1>
+                    <p>Recent API requests and activity</p>
+                </header>
+                <div class="filter-bar">
+                    <input type="text" id="log-search" placeholder="Search logs...">
+                    <button id="refresh-logs-btn" class="icon-btn" style="width: auto; padding: 0 15px; margin-left: 10px;"><i class="fa-solid fa-rotate-right"></i> Refresh</button>
+                </div>
+                <div class="glass-panel table-container">
+                    <table class="logs-table">
+                        <thead>
+                            <tr>
+                                <th>Timestamp</th>
+                                <th>User</th>
+                                <th>Model</th>
+                                <th>Question</th>
+                            </tr>
+                        </thead>
+                        <tbody id="logs-body">
+                            <!-- Logs injected via JS -->
+                        </tbody>
+                    </table>
+                </div>
+            </section>
+
+            <!-- Admin Tab -->
+            <section id="admin" class="tab-content" style="display: none;">
+                <header>
+                    <h1>Admin Control Panel</h1>
+                    <p>System configuration and overrides</p>
+                </header>
+                <div class="admin-grid">
+                    <div class="admin-card glass-panel">
+                        <h3><i class="fa-solid fa-cloud"></i> AI Models</h3>
+                        <div class="setting-row">
+                            <span>Enable Gemini Vision AI</span>
+                            <label class="switch">
+                                <input type="checkbox" id="toggle-gemini" checked>
+                                <span class="slider round"></span>
+                            </label>
+                        </div>
+                    </div>
+                </div>
+            </section>
+        </main>
+    </div>
+
+    <script src="/static/app.js?v=3"></script>
+</body>
+</html>