Create app.py

app.py

@@ -0,0 +1,72 @@
+import gradio as gr
+import torch
+from PIL import Image
+from transformers import AutoProcessor, AutoModelForImageTextToText
+
+# 1. تحديد المعالج والنموذج
+model_id = "gijl/gemma-4-E4B-it"
+device = "cuda" if torch.cuda.is_available() else "cpu"
+
+# تحميل المعالج
+processor = AutoProcessor.from_pretrained(model_id)
+
+# تحميل النموذج مع ضبط الدقة لتوفير الذاكرة وتفعيل التوزيع التلقائي على كرت الشاشة
+model = AutoModelForImageTextToText.from_pretrained(
+    model_id,
+    torch_dtype=torch.float16 if device == "cuda" else torch.float32,
+    device_map="auto"
+)
+
+# 2. دالة المحادثة (التي ستقوم بتوليد الردود)
+def chat_with_model(message, history):
+    # الواجهة متعددة الوسائط تعطينا رسالة كقاموس يحتوي على نص وملفات (صور)
+    text = message.get("text", "")
+    files = message.get("files", [])
+    
+    # قراءة الصور إذا تم رفعها
+    images = [Image.open(f).convert("RGB") for f in files] if files else None
+
+    # بناء سياق المحادثة (History)
+    conversation = []
+    for user_msg, bot_msg in history:
+        # إذا كانت الرسالة السابقة تحتوي على صورة (يتم تمريرها كـ Tuple في Gradio)
+        if isinstance(user_msg, tuple):
+            user_msg = "[صورة مرفقة]"
+        
+        conversation.append({"role": "user", "content": user_msg})
+        if bot_msg:
+            conversation.append({"role": "assistant", "content": bot_msg})
+
+    # إضافة رسالة المستخدم الحالية
+    # بعض النماذج تتطلب وضع وسم خاص بالصورة، لكننا سنفترض النص الافتراضي
+    conversation.append({"role": "user", "content": text if text else "[تحليل الصورة]"})
+
+    # تحضير المدخلات باستخدام القالب الخاص بالنموذج (Chat Template)
+    prompt = processor.apply_chat_template(conversation, tokenize=False, add_generation_prompt=True)
+    
+    # دمج النص والصور ومعالجتها للنموذج
+    inputs = processor(text=prompt, images=images, return_tensors="pt").to(model.device)
+
+    # 3. توليد الرد
+    with torch.no_grad():
+        outputs = model.generate(**inputs, max_new_tokens=1024)
+        
+    # استخراج النص المولد فقط (تجاهل نص الإدخال)
+    input_length = inputs["input_ids"].shape[-1]
+    response = processor.decode(outputs[0][input_length:], skip_special_tokens=True)
+    
+    return response
+
+# 4. بناء واجهة المستخدم باستخدام Gradio
+demo = gr.ChatInterface(
+    fn=chat_with_model,
+    multimodal=True, # تفعيل خيار رفع الصور
+    title="Gemma-4 Vision Chatbot",
+    description="واجهة دردشة متقدمة لنموذج `gijl/gemma-4-E4B-it`. يمكنك الدردشة النصية أو رفع صور ليقوم النموذج بتحليلها.",
+    theme=gr.themes.Soft(),
+    textbox=gr.MultimodalTextbox(placeholder="اكتب رسالتك هنا أو قم برفع صورة...", scale=7)
+)
+
+# تشغيل التطبيق
+if __name__ == "__main__":
+    demo.launch()