Direct standalone Gemini and Meta Graph API in studio.html
This commit is contained in:
+90
-51
@@ -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();
|
||||||
if (data.body) {
|
const text = data?.candidates?.[0]?.content?.parts?.[0]?.text;
|
||||||
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}`;
|
||||||
|
|||||||
Reference in New Issue
Block a user