أداة إنشاء سكريبت فيديو
بواسطة morbah |
لم تفهم نقطة معينة؟
اسأل المساعد الذكي وسيجيبك بناءً على محتوى هذا المقال.
<!--DOCTYPE html-->
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>أداة إنشاء سكريبت فيديو</title>
<style>
/* (نفس CSS السابق - لم يتغير) */
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
margin: 0;
padding: 20px;
}
.container {
width: 100%;
max-width: 800px;
background-color: white;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
padding: 20px;
box-sizing: border-box;
}
h1 {
text-align: center;
color: #333;
}
label {
display: block;
margin-top: 10px;
font-weight: bold;
}
input[type="text"],
select,
textarea {
width: 100%;
padding: 10px;
margin-top: 5px;
border: 1px solid #ddd;
border-radius: 5px;
box-sizing: border-box;
font-size: 16px;
}
textarea {
height: 200px;
resize: vertical;
}
button {
padding: 10px 15px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 10px;
font-size: 16px;
}
button:disabled {
background-color: #cccccc;
cursor: not-allowed;
}
#audio-container {
margin-top: 20px;
display: none; /* إخفاء افتراضيًا */
align-items: center; /* محاذاة رأسية */
gap: 10px;
}
#audio-player{
width: 100%;
}
#download-button {
background-color: #2196F3; /* لون مختلف لزر التنزيل */
}
</style>
</head>
<body>
<div class="container">
<h1>أداة إنشاء سكريبت فيديو</h1>
<label for="topic">موضوع الفيديو:</label>
<input type="text" id="topic" placeholder="مثال: الأهرامات المصرية">
<label for="duration">مدة الفيديو:</label>
<select id="duration">
<option value="30">30 ثانية</option>
<option value="60">1 دقيقة</option>
<option value="90">1.5 دقيقة</option>
<option value="120">2 دقيقة</option>
<option value="150">2.5 دقيقة</option>
<option value="180">3 دقائق</option>
</select>
<button id="generate-button">إنشاء السكريبت</button>
<button id="reset-button">إعادة تعيين</button>
<label for="script">السكريبت:</label>
<textarea id="script" readonly></textarea>
<button id="tts-button" style="display: none;">تحويل إلى صوت</button>
<div id="audio-container">
<label>الصوت:</label>
<audio id="audio-player" controls></audio>
<button id="download-button">تنزيل الصوت</button>
</div>
</div>
<script>
const topicInput = document.getElementById('topic');
const durationSelect = document.getElementById('duration');
const generateButton = document.getElementById('generate-button');
const scriptTextarea = document.getElementById('script');
const ttsButton = document.getElementById('tts-button');
const audioContainer = document.getElementById('audio-container');
const audioPlayer = document.getElementById('audio-player');
const resetButton = document.getElementById('reset-button');
const downloadButton = document.getElementById('download-button'); // زر التنزيل
const geminiApiKey = "AIzaSyBUdo1qj5L4CKzOO47935nKPPe8mMZ2Ha0"; // استبدله بمفتاح Gemini API الخاص بك
const elevenLabsApiKey = "sk_3785d4dae4542fa20aaa68ee502450e837ebd8bd3ecfc3e1"; // استبدله بمفتاح ElevenLabs API الخاص بك
const elevenLabsVoiceId = "yrPIy5b3iLnVLIBfUSw8"; // معرف الصوت
let audioUrlToDownload = null; // متغير لتخزين رابط الصوت للتنزيل
// دالة إنشاء السكريبت باستخدام Gemini (لم تتغير)
async function generateScript(topic, duration) {
const prompt = `أريد سكريبت فيديو مدته ${duration} ثانية عن موضوع "${topic}". ابدأ السكريبت ببداية شيقة ومثيرة للاهتمام لجذب انتباه المشاهدين وبلغه العاميه المصريه. ولا تستخدم كلمه يا جدعان او اي ده وكلام دا مش عيزه ابدا الاسكربت بحاجه تخص الموضع لكن صعب تتصدق بحيث يكمل المشاهد مع عللامات التوقف وجعل الاسكربت علي 3 اجزاء اجعل باقي السكريبت يتضمن حقائق غامضة ومثيرة للاهتمام. اختم السكريبت بطلب الاشتراك في القناة.
مهم جدا: *لا تستخدم علامات النجمة (*) أو أي تنسيقات مثل "مشهد 1:" أو أقواس. أريد نص السكريبت فقط.*`;
const url = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent?key=${geminiApiKey}`;
const data = {
contents: [{
parts: [{ text: prompt }]
}]
};
try {
const response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
});
if (!response.ok) {
const errorData = await response.json();
throw new Error(`Gemini API error! Status: ${response.status}, Body: ${JSON.stringify(errorData)}`);
}
const result = await response.json();
if (result.candidates && result.candidates[0] && result.candidates[0].content && result.candidates[0].content.parts && result.candidates[0].content.parts[0] && result.candidates[0].content.parts[0].text) {
return result.candidates[0].content.parts[0].text;
}else{
return "لا يمكنني توليد الاسكربت, حاول مره اخري.";
}
} catch (error) {
console.error("Error fetching from Gemini API:", error);
alert("حدث خطأ أثناء إنشاء السكريبت. حاول مرة أخرى لاحقًا.");
return null;
}
}
// دالة تحويل النص إلى صوت باستخدام ElevenLabs (لم تتغير)
async function textToSpeech(text) {
const url = `https://api.elevenlabs.io/v1/text-to-speech/${elevenLabsVoiceId}`;
const data = {
text: text,
model_id: "eleven_multilingual_v2",
voice_settings: {
stability: 0.5,
similarity_boost: 0.5
}
};
try {
const response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'xi-api-key': elevenLabsApiKey
},
body: JSON.stringify(data)
});
if (!response.ok) {
const errorText = await response.text();
let errorMessage = `ElevenLabs API error! Status: ${response.status}`;
try {
const errorJson = JSON.parse(errorText);
errorMessage += `, Detail: ${errorJson.detail.message}`;
} catch (parseError) {
errorMessage += `, Body: ${errorText}`;
}
throw new Error(errorMessage);
}
const audioBlob = await response.blob();
const audioUrl = URL.createObjectURL(audioBlob);
audioPlayer.src = audioUrl;
audioContainer.style.display = 'flex';
audioUrlToDownload = audioUrl; // حفظ الرابط في المتغير
return audioUrl;
} catch (error) {
console.error("Error fetching from ElevenLabs API:", error);
alert("حدث خطأ أثناء تحويل النص إلى صوت: " + error.message);
return null;
}
}
// معالج حدث النقر على زر "إنشاء السكريبت"
generateButton.addEventListener('click', async () => {
const topic = topicInput.value;
const duration = durationSelect.value;
if (!topic) {
alert("الرجاء إدخال موضوع الفيديو.");
return;
}
generateButton.disabled = true;
generateButton.textContent = "جاري الإنشاء...";
const script = await generateScript(topic, duration);
if (script) {
scriptTextarea.value = script;
ttsButton.style.display = 'block';
}
generateButton.disabled = false;
generateButton.textContent = "إنشاء السكريبت";
});
// معالج حدث النقر على زر "تحويل إلى صوت"
ttsButton.addEventListener('click', async () => {
ttsButton.disabled = true;
ttsButton.textContent = "جاري التحويل...";
const script = scriptTextarea.value;
const audioUrl = await textToSpeech(script);
if(!audioUrl){
ttsButton.disabled = false;
ttsButton.textContent = "تحويل إلى صوت";
}
});
// معالج حدث النقر على زر "إعادة تعيين"
resetButton.addEventListener('click', () => {
topicInput.value = '';
durationSelect.value = '30';
scriptTextarea.value = '';
ttsButton.style.display = 'none';
audioContainer.style.display = 'none';
audioPlayer.src = '';
audioUrlToDownload = null; // مسح رابط التنزيل
generateButton.disabled = false;
generateButton.textContent = "إنشاء السكريبت";
ttsButton.disabled = false;
ttsButton.textContent = "تحويل إلى صوت";
});
// معالج حدث النقر على زر "تنزيل الصوت"
downloadButton.addEventListener('click', () => {
if (audioUrlToDownload) {
const a = document.createElement('a');
a.href = audioUrlToDownload;
a.download = 'script_audio.mp3'; // اسم الملف عند التنزيل
document.body.appendChild(a); // إضافة العنصر إلى الصفحة
a.click(); // محاكاة النقر لتنزيل الملف
document.body.removeChild(a); // إزالة العنصر من الصفحة
}
});
</script>
</body>
</html>
![Author](data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="240" height="240" viewBox="0 0 240 240" role="img" aria-label="Default profile avatar"%3E%3Cdefs%3E%3ClinearGradient id="g" x1="0" x2="1" y1="0" y2="1"%3E%3Cstop offset="0" stop-color="%236db3f2"/%3E%3Cstop offset="1" stop-color="%234a90e2"/%3E%3C/linearGradient%3E%3Cfilter id="soft" x="-50%25" y="-50%25" width="200%25" height="200%25"%3E%3CfeDropShadow dx="0" dy="6" stdDeviation="12" flood-opacity="0.12"/%3E%3C/filter%3E%3C/defs%3E%3Cg transform="translate(120,120)"%3E%3Ccircle r="108" fill="url(%23g)" filter="url(%23soft)"/%3E%3Ccircle r="88" fill="rgba(255,255,255,0.06)"/%3E%3C/g%3E%3Cg transform="translate(120,120)"%3E%3Ccircle cx="0" cy="-24" r="28" fill="%23ffffff" fill-opacity="0.95"/%3E%3Cpath d="M-56,64 C-56,36 -36,16 0,16 C36,16 56,36 56,64 L56,76 C56,88 44,100 0,100 C-44,100 -56,88 -56,76 Z" fill="%23ffffff" fill-opacity="0.95"/%3E%3Cellipse cx="0" cy="72" rx="52" ry="12" fill="%23000" opacity="0.04"/%3E%3C/g%3E%3C/svg%3E){kind=avatar}
الكاتب : morbah
انا مهتم بمجال التقنية والربح من الانترنت واتطلع لنشر المزيد من المقالات التي تفيدكم
تعليقات
إرسال تعليق