Direct standalone Gemini and Meta Graph API in studio.html

This commit is contained in:
Hamza-Ayed
2026-07-24 17:18:11 +03:00
parent 6fe7a093a9
commit 7c05b0d9ab
+91 -52
View File
@@ -548,6 +548,19 @@
</div> </div>
<script> <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 // Elements
const btnRecord = document.getElementById('btnRecord'); const btnRecord = document.getElementById('btnRecord');
const micIcon = document.getElementById('micIcon'); const micIcon = document.getElementById('micIcon');
@@ -566,13 +579,6 @@
const alertSuccess = document.getElementById('alertSuccess'); const alertSuccess = document.getElementById('alertSuccess');
const alertError = document.getElementById('alertError'); 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 // Toggle custom image URL field
imageChoice.addEventListener('change', () => { imageChoice.addEventListener('change', () => {
if (imageChoice.value === 'custom_url') { if (imageChoice.value === 'custom_url') {
@@ -589,79 +595,103 @@
} }
}); });
// Web Audio MediaRecorder // Web Speech API + Audio Recording
let mediaRecorder; let recognition;
let audioChunks = [];
let isRecording = false; 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 () => { btnRecord.addEventListener('click', async () => {
if (!isRecording) { if (!isRecording) {
try { try {
const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); if (recognition) {
mediaRecorder = new MediaRecorder(stream); recognition.start();
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();
isRecording = true; isRecording = true;
btnRecord.classList.add('recording'); btnRecord.classList.add('recording');
micIcon.className = 'fa-solid fa-stop'; micIcon.className = 'fa-solid fa-stop';
recordStatus.textContent = 'جاري تسجيل الصوت الآن... (اضغط مجدداً لإيقاف التسجيل)'; recordStatus.textContent = '🎙️ جاري الاستماع لصوتك الآن وتحويله لكتابة مباشرة... (اضغط مجدداً للإيقاف)';
recordStatus.style.color = '#ef4444'; recordStatus.style.color = '#ef4444';
} catch (err) { } catch (err) {
alert('يرجى منح إذن الميكروفون للبدء بالتسجيل الصوتى.'); alert('يرجى منح إذن استخدام الميكروفون بالمتصفح.');
} }
} else { } else {
mediaRecorder.stop(); if (recognition) {
recognition.stop();
}
isRecording = false; isRecording = false;
btnRecord.classList.remove('recording'); btnRecord.classList.remove('recording');
micIcon.className = 'fa-solid fa-microphone'; 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 () => { 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'; 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 { 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', method: 'POST',
headers: { 'Content-Type': 'application/json' }, 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();
const data = await res.json(); const text = data?.candidates?.[0]?.content?.parts?.[0]?.text;
if (data.body) {
fbContentPreview.innerText = data.body; if (text) {
} fbContentPreview.innerText = text.trim();
} else { } else {
// Client-side fallback template generator throw new Error('لم يرجع Gemini استجابة نصية.');
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`;
} }
} catch (e) { } catch (err) {
fbContentPreview.innerText = `🚗 **كيف تحمي ركابك وسائقيك وتضمن أمان رحلاتك بنسبة 100% مع منصة Tripz؟** 🛡️\n\nنظامنا الفوري المعتمد بالذكاء الاصطناعي يتحقق من رخص القيادة والوثائق في ثوانٍ معدودة، ليضمن بيئة نقل آمنة وموثوقة.\n\n✅ ملكية كاملة لبياناتك بعقد مكتوب\n✅ أسعار معلنة ومحرك مجرّب منذ 2019\n✅ إطلاق تطبيقك خلال 30 يوماً فقط!\n\n📊 حاسبة التوفير: https://tripz-egypt.com/apps/\n💬 واتساب المباشر: https://wa.me/962798583052`; 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 { } finally {
loaderOverlay.style.display = 'none'; loaderOverlay.style.display = 'none';
} }
}); });
// Live Facebook Publishing Trigger // Direct Meta Graph API Publisher
btnPublish.addEventListener('click', async () => { btnPublish.addEventListener('click', async () => {
const message = fbContentPreview.innerText.trim(); const message = fbContentPreview.innerText.trim();
const imageUrl = (imageChoice.value === 'custom_url' && customImageUrl.value.trim()) const imageUrl = (imageChoice.value === 'custom_url' && customImageUrl.value.trim())
@@ -676,21 +706,30 @@
alertSuccess.style.display = 'none'; alertSuccess.style.display = 'none';
alertError.style.display = 'none'; alertError.style.display = 'none';
loaderOverlay.style.display = 'flex'; loaderOverlay.style.display = 'flex';
loaderStatus.textContent = 'جاري إطلاق المنشور والصورة لايف على صفحة فيسبوك...'; loaderStatus.textContent = 'جاري إطلاق المنشور لايف على صفحة فيسبوك الرسمية لـ Tripz...';
try { 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', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ topic: message, imageUrl: imageUrl }) body: JSON.stringify(payload)
}); });
const data = await res.json(); 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'; alertSuccess.style.display = 'block';
} else { } else {
throw new Error(data.message || 'فشلت عملية النشر على ميتا.'); throw new Error(data.error?.message || 'فشلت عملية النشر على ميتا.');
} }
} catch (err) { } catch (err) {
alertError.innerHTML = `<i class="fa-solid fa-triangle-exclamation"></i> فشل النشر: ${err.message}`; alertError.innerHTML = `<i class="fa-solid fa-triangle-exclamation"></i> فشل النشر: ${err.message}`;