From 7c05b0d9ab6ee3d6138fefce8ace4a4d665b947a Mon Sep 17 00:00:00 2001
From: Hamza-Ayed <hamzaayedflutter@gmail.com>
Date: Fri, 24 Jul 2026 17:18:11 +0300
Subject: [PATCH] Direct standalone Gemini and Meta Graph API in studio.html

---
 marketing/studio.html | 143 +++++++++++++++++++++++++++---------------
 1 file changed, 91 insertions(+), 52 deletions(-)

diff --git a/marketing/studio.html b/marketing/studio.html
index 8614c07..48023db 100644
--- a/marketing/studio.html
+++ b/marketing/studio.html
@@ -548,6 +548,19 @@
   </div>
 
   <script>
+    // Verified Credentials & Endpoints
+    const GEMINI_KEY = 'AIzaSyDHp0yXCGWqnd4ynlCCWzDz9Un1EJOKeW8';
+    const GEMINI_MODEL = 'gemini-2.0-flash';
+    const META_PAGE_ID = '1047354938453381';
+    const META_TOKEN = 'EAAM8GXpb76wBSGusXKgwOlrbwHrsDRZBnbESt2Vy1Ti1Y6HMHiSjY2ROspoafa1PT1cCZBISocivZA5eLnM2jafdcvmXhqmLZAnWBi2PTo2wDBwImxQhX0A7IQDG3eF9KeEsw0lqBXw5XnibgppSJZA2aK7f1qvoS9whRO7bYHNcnIQfyP9yDVbSoWLS3AuQ1C6Pj28bPBIgloYxkl7hqBCaf6pXvmaPvpA6RQzkZD';
+
+    // Preset Image Graphics
+    const presetImages = {
+      graphic_security: 'https://images.unsplash.com/photo-1563986768609-322da13575f3?auto=format&fit=crop&w=1000&q=80',
+      graphic_calculator: 'https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?auto=format&fit=crop&w=1000&q=80',
+      graphic_brand: 'https://images.unsplash.com/photo-1549317661-bd32c8ce0db2?auto=format&fit=crop&w=1000&q=80'
+    };
+
     // Elements
     const btnRecord = document.getElementById('btnRecord');
     const micIcon = document.getElementById('micIcon');
@@ -566,13 +579,6 @@
     const alertSuccess = document.getElementById('alertSuccess');
     const alertError = document.getElementById('alertError');
 
-    // Preset Image Graphics
-    const presetImages = {
-      graphic_security: 'https://images.unsplash.com/photo-1563986768609-322da13575f3?auto=format&fit=crop&w=1000&q=80',
-      graphic_calculator: 'https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?auto=format&fit=crop&w=1000&q=80',
-      graphic_brand: 'https://images.unsplash.com/photo-1549317661-bd32c8ce0db2?auto=format&fit=crop&w=1000&q=80'
-    };
-
     // Toggle custom image URL field
     imageChoice.addEventListener('change', () => {
       if (imageChoice.value === 'custom_url') {
@@ -589,79 +595,103 @@
       }
     });
 
-    // Web Audio MediaRecorder
-    let mediaRecorder;
-    let audioChunks = [];
+    // Web Speech API + Audio Recording
+    let recognition;
     let isRecording = false;
 
+    if ('webkitSpeechRecognition' in window || 'SpeechRecognition' in window) {
+      const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+      recognition = new SpeechRecognition();
+      recognition.lang = 'ar-SA';
+      recognition.continuous = true;
+      recognition.interimResults = true;
+
+      recognition.onresult = (event) => {
+        let transcript = '';
+        for (let i = event.resultIndex; i < event.results.length; i++) {
+          transcript += event.results[i][0].transcript;
+        }
+        if (transcript.trim()) {
+          topicInput.value = transcript.trim();
+        }
+      };
+
+      recognition.onerror = (event) => {
+        recordStatus.textContent = 'حدث تنبيه أثناء تحويل الصوت، يمكنك الكتابة في المربع مباشرة.';
+      };
+    }
+
     btnRecord.addEventListener('click', async () => {
       if (!isRecording) {
         try {
-          const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-          mediaRecorder = new MediaRecorder(stream);
-          audioChunks = [];
-
-          mediaRecorder.ondataavailable = event => {
-            audioChunks.push(event.data);
-          };
-
-          mediaRecorder.onstop = () => {
-            const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
-            const audioUrl = URL.createObjectURL(audioBlob);
-            audioPlayback.src = audioUrl;
-            audioPlayback.style.display = 'block';
-            recordStatus.textContent = 'تم تسجيل الصوت بنجاح! يمكنك الاستماع أو الضغط على توليد المنشور.';
-            recordStatus.style.color = '#10b981';
-          };
-
-          mediaRecorder.start();
+          if (recognition) {
+            recognition.start();
+          }
           isRecording = true;
           btnRecord.classList.add('recording');
           micIcon.className = 'fa-solid fa-stop';
-          recordStatus.textContent = 'جاري تسجيل الصوت الآن... (اضغط مجدداً لإيقاف التسجيل)';
+          recordStatus.textContent = '🎙️ جاري الاستماع لصوتك الآن وتحويله لكتابة مباشرة... (اضغط مجدداً للإيقاف)';
           recordStatus.style.color = '#ef4444';
         } catch (err) {
-          alert('يرجى منح إذن الميكروفون للبدء بالتسجيل الصوتى.');
+          alert('يرجى منح إذن استخدام الميكروفون بالمتصفح.');
         }
       } else {
-        mediaRecorder.stop();
+        if (recognition) {
+          recognition.stop();
+        }
         isRecording = false;
         btnRecord.classList.remove('recording');
         micIcon.className = 'fa-solid fa-microphone';
+        recordStatus.textContent = '✅ تم تحويل الصوت إلى نص بنجاح! يمكنك مراجعة النص والضغط على زر التوليد بـ Gemini AI.';
+        recordStatus.style.color = '#10b981';
       }
     });
 
-    // AI Generation Trigger
+    // Direct Gemini AI Content Generator
     btnGenerate.addEventListener('click', async () => {
-      const topic = topicInput.value.trim() || 'اكتب منشور عن أمان السائقين والركاب وتدقيق الوثائق التلقائي بالذكاء الاصطناعي مع حاسبة التوفير';
+      const userPrompt = topicInput.value.trim() || 'اكتب منشور عن أمان السائقين والركاب وتدقيق الوثائق التلقائي بالذكاء الاصطناعي مع حاسبة التوفير';
       
+      alertSuccess.style.display = 'none';
+      alertError.style.display = 'none';
       loaderOverlay.style.display = 'flex';
-      loaderStatus.textContent = 'جاري تحليل الأوامر والتسجيل الصوتي بـ Gemini AI...';
+      loaderStatus.textContent = 'جاري تحليل الأوامر وصياغة المنشور بـ Gemini 2.0 Flash...';
+
+      const systemPrompt = `أنت مدير تسويق ومحرر إعلاني محترف لمنصة Tripz (منصة SaaS عالمية لإطلاق تطبيقات نقل الركاب وإدارة أساطيل التكسي بعلامة المشغّل التجارية).
+قواعد التسويق الحاكمة:
+1. الملكية: علامتك أنت، وتطبيقك باسمك وشعارك، وبياناتك تبقى لك بعقد تصدير مكتوب.
+2. الشفافية: أسعارنا معلنة بالكامل دون أسرار ولا مفاجآت في الفاتورة.
+3. السرعة: إطلاق خلال 30 يوماً من التوقيع على آبل وجوجل.
+4. الإثبات: محرك مجرّب منذ 2019 يخدم أكثر من 6,000 سائق نشط.
+5. دعوة للإجراء (CTA): رابط حاسبة التوفير (https://tripz-egypt.com/apps/) ورابط واتساب المباشر (https://wa.me/962798583052).
+
+اكتب منشوراً جذاباً جداً باللغة العربية، منسقاً بالإيموجيات والعناوين والنقاط الواضحة والهاشتاغات المناسبة عن الفكرة التالية:\n${userPrompt}`;
 
       try {
-        const res = await fetch('/admin/marketing/generate-content', {
+        const url = `https://generativelanguage.googleapis.com/v1beta/models/${GEMINI_MODEL}:generateContent?key=${GEMINI_KEY}`;
+        const res = await fetch(url, {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ prompt: topic })
+          body: JSON.stringify({
+            contents: [{ parts: [{ text: systemPrompt }] }]
+          })
         });
 
-        if (res.ok) {
-          const data = await res.json();
-          if (data.body) {
-            fbContentPreview.innerText = data.body;
-          }
+        const data = await res.json();
+        const text = data?.candidates?.[0]?.content?.parts?.[0]?.text;
+        
+        if (text) {
+          fbContentPreview.innerText = text.trim();
         } else {
-          // Client-side fallback template generator
-          fbContentPreview.innerText = `🚨 **هل تخاطر بسمعة شركتك في كل رحلة؟ أمن السائقين والركاب هو الأساس!** 🛑\n\nمع منصة **Tripz**، نضع بين يديك نظام أمان متطور مدعوم بالذكاء الاصطناعي لتدقيق الوثائق ومطابقة الوجه آلياً لحماية عملك على مدار الساعة! 🤖✨\n\n🔹 **تطبيقك باسمك وشعارك 100%**\n🔹 **بياناتك ملكك بعقد تصدير مكتوب**\n🔹 **إطلاق خلال 30 يوماً فقط على آبل وجوجل**\n\n📊 احسب أرباحك وتوفيرك الآن عبر حاسبة التوفير:\n👉 https://tripz-egypt.com/apps/\n\n💬 تواصل معنا مباشرة عبر واتساب:\n👉 https://wa.me/962798583052\n\n#Tripz #تطبيقات_التوصيل #أمان_الركاب #الذكاء_الاصطناعي #SaaS`;
+          throw new Error('لم يرجع Gemini استجابة نصية.');
         }
-      } catch (e) {
-        fbContentPreview.innerText = `🚗 **كيف تحمي ركابك وسائقيك وتضمن أمان رحلاتك بنسبة 100% مع منصة Tripz؟** 🛡️\n\nنظامنا الفوري المعتمد بالذكاء الاصطناعي يتحقق من رخص القيادة والوثائق في ثوانٍ معدودة، ليضمن بيئة نقل آمنة وموثوقة.\n\n✅ ملكية كاملة لبياناتك بعقد مكتوب\n✅ أسعار معلنة ومحرك مجرّب منذ 2019\n✅ إطلاق تطبيقك خلال 30 يوماً فقط!\n\n📊 حاسبة التوفير: https://tripz-egypt.com/apps/\n💬 واتساب المباشر: https://wa.me/962798583052`;
+      } catch (err) {
+        fbContentPreview.innerText = `🚨 **هل تخاطر بسمعة شركتك في كل رحلة؟ أمن السائقين والركاب هو الأساس!** 🛑\n\nمع منصة **Tripz**، نضع بين يديك نظام أمان متطور مدعوم بالذكاء الاصطناعي لتدقيق الوثائق ومطابقة الوجه آلياً لحماية عملك على مدار الساعة! 🤖✨\n\n🔹 **تطبيقك باسمك وشعارك 100%**\n🔹 **بياناتك ملكك بعقد تصدير مكتوب**\n🔹 **إطلاق خلال 30 يوماً فقط على آبل وجوجل**\n\n📊 احسب أرباحك وتوفيرك الآن عبر حاسبة التوفير:\n👉 https://tripz-egypt.com/apps/\n\n💬 تواصل معنا مباشرة عبر واتساب:\n👉 https://wa.me/962798583052\n\n#Tripz #تطبيقات_التوصيل #أمان_الركاب #الذكاء_الاصطناعي #SaaS`;
       } finally {
         loaderOverlay.style.display = 'none';
       }
     });
 
-    // Live Facebook Publishing Trigger
+    // Direct Meta Graph API Publisher
     btnPublish.addEventListener('click', async () => {
       const message = fbContentPreview.innerText.trim();
       const imageUrl = (imageChoice.value === 'custom_url' && customImageUrl.value.trim()) 
@@ -676,21 +706,30 @@
       alertSuccess.style.display = 'none';
       alertError.style.display = 'none';
       loaderOverlay.style.display = 'flex';
-      loaderStatus.textContent = 'جاري إطلاق المنشور والصورة لايف على صفحة فيسبوك...';
+      loaderStatus.textContent = 'جاري إطلاق المنشور لايف على صفحة فيسبوك الرسمية لـ Tripz...';
 
       try {
-        const res = await fetch('/admin/marketing/publish-facebook', {
+        const endpoint = imageUrl ? `${META_PAGE_ID}/photos` : `${META_PAGE_ID}/feed`;
+        const metaUrl = `https://graph.facebook.com/v19.0/${endpoint}`;
+        
+        const payload = imageUrl
+          ? { access_token: META_TOKEN, caption: message, url: imageUrl }
+          : { access_token: META_TOKEN, message: message };
+
+        const res = await fetch(metaUrl, {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ topic: message, imageUrl: imageUrl })
+          body: JSON.stringify(payload)
         });
 
         const data = await res.json();
-        if (res.ok && data.ok) {
-          alertSuccess.innerHTML = `<i class="fa-solid fa-circle-check"></i> تم إطلاق ونشر البوست بنجاح على فيسبوك! (معرّف المنشور: <strong>${data.postId}</strong>)`;
+
+        if (res.ok && (data.id || data.post_id)) {
+          const postId = data.id || data.post_id;
+          alertSuccess.innerHTML = `<i class="fa-solid fa-circle-check"></i> تم إطلاق ونشر البوست بنجاح على فيسبوك! (معرّف المنشور المباشر: <strong>${postId}</strong>)`;
           alertSuccess.style.display = 'block';
         } else {
-          throw new Error(data.message || 'فشلت عملية النشر على ميتا.');
+          throw new Error(data.error?.message || 'فشلت عملية النشر على ميتا.');
         }
       } catch (err) {
         alertError.innerHTML = `<i class="fa-solid fa-triangle-exclamation"></i> فشل النشر: ${err.message}`;