....انشاء فيديو
بواسطة 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 = "N2lVS1w4EtoT3dr4eOWO"; // معرف الصوت
let audioUrlToDownload = null; // متغير لتخزين رابط الصوت للتنزيل
// دالة إنشاء السكريبت باستخدام Gemini (لم تتغير)
async function generateScript(topic, duration) {
const prompt = `أريد سكريبت فيديو مدته ${duration} ثانية عن موضوع "${topic}". ابدأ السكريبت ببداية شيقة ومثيرة للاهتمام لجذب انتباه المشاهدين. اجعل باقي السكريبت يتضمن حقائق غامضة ومثيرة للاهتمام. اختم السكريبت بطلب الاشتراك في القناة.
مهم جدا: *لا تستخدم علامات النجمة (*) أو أي تنسيقات مثل "مشهد 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
انا مهتم بمجال التقنية والربح من الانترنت واتطلع لنشر المزيد من المقالات التي تفيدكم
تعليقات
إرسال تعليق