Update index.html

index.html

@@ -37,7 +37,7 @@
         @keyframes pulse-soft { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
         @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-15px);} 60% {transform: translateY(-7px);} }
 
-        /* PODCAST STUDIO VIEW EXACTLY AS ORIGINAL */
+        /* PODCAST STUDIO VIEW */
         .podcast-studio-container { width: 100%; animation: fadeIn 0.5s ease-out; }
         .podcast-studio-container .form-group-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.2rem; }
         .podcast-studio-container #project-speakers-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1.5rem; text-align: center; }
@@ -94,7 +94,6 @@
         .podcast-studio-container .loading-state-wrapper .loading-text { font-size: 0.85em; font-weight: 600; color: var(--accent-primary); white-space: nowrap; transition: all 0.3s; }
         .podcast-studio-container .turn-retry-btn { font-family: var(--app-font); font-size: 0.85em; font-weight: 600; background: none; border: 1px solid var(--input-border); color: var(--text-secondary); padding: 0.4rem 0.8rem; border-radius: var(--radius-btn); cursor: pointer; transition: var(--transition-smooth); margin-right: auto; display: flex; align-items: center; gap: 6px; }
         .podcast-studio-container .turn-retry-btn:hover { border-color: var(--accent-secondary); color: var(--accent-secondary); background: var(--accent-secondary-glow); }
-        .podcast-studio-container .turn-retry-btn svg { width: 16px; height: 16px; fill: currentColor; }
         .podcast-studio-container .replace-success-message, .podcast-studio-container .main-update-message { font-family: var(--app-font); font-size: 0.85em; font-weight: 600; padding: 0.4rem 0.8rem; border-radius: var(--radius-btn); white-space: nowrap; display: none; align-items: center; justify-content: center; margin-right: auto; }
         .podcast-studio-container .replace-success-message { background-color: var(--accent-secondary-glow); color: var(--accent-secondary); }
         .podcast-studio-container .main-update-message { background: linear-gradient(90deg, #e6fffa, #b2f5ea); color: #2c7a7b; border: 1px solid #81e6d9; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
@@ -272,7 +271,7 @@
                     <div class="form-group">
                         <label for="text-input-standard">📝 متن اصلی</label>
                         <textarea id="text-input-standard" rows="5" placeholder="متن خود را برای تبدیل به گفتار اینجا وارد کنید..."></textarea>
-                        <div class="char-counter-wrapper"><span id="char-count">0</span> نویسه</div>
+                        <div class="char-counter-wrapper"><span id="char-count">0</span> / <span id="char-max">80000</span> نویسه</div>
                     </div>
                     <div class="form-group">
                         <label for="prompt-input-standard">🗣️ توصیف لحن و احساس (اختیاری)</label>
@@ -416,7 +415,7 @@
     </div>
 </section>
 
-<footer class="site-footer"><p>&copy; 1404 - تمام حقوق برای Ai Sada محفوظ است.</p></footer>
+<footer class="site-footer"><p>&copy; 1404 - تمام حقوق برای <a href="#">Ai Sada</a> محفوظ است.</p></footer>
 </div>
 
 <!-- ======================================================================= -->
@@ -443,7 +442,7 @@ document.addEventListener('DOMContentLoaded', () => {
     let isMainSelectorAction = false; 
     let currentPodcastMode = null; 
 
-    // لیست کامل و اصلی گویندگان به همراه 4 فایل صوتی و متن
+    // دریافت کامل آرایه اسپیکرها با ۴ فایل و ۴ متن از کد اصلی
     const allSpeakers =[
         { id: "Charon", name: "شهاب (مرد)", gender: "male", desc: "صدایی قدرمند و رسا", imgUrl: "https://uploadkon.ir/uploads/a18705_25IMG-۲۰۲۵۰۷۰۵-۱۱۰۵۴۹.jpg", samples:["https://uploadkon.ir/uploads/c17c06_26شهاب-یک-2-.mp3", "https://uploadkon.ir/uploads/af0d06_26شهاب-دو-2-.mp3", "https://uploadkon.ir/uploads/9e2806_26شهاب-سه-2-.mp3", "https://uploadkon.ir/uploads/35bd06_26شهاب-چهار-2-.mp3"], sampleTexts:["", "", "هاهاها ﺗﺒﺪﯾﻞ  متن (خنده زیاد) شما ﺑﻪ ﺻﺪﺍﯾﯽ ﮐﻪ ﻫﻤﺪﻟﯽ ﻭ ﺩﺭﮎ ﺭﺍ ﺑﺮﻣﯽ‌ﺍﻧﮕﯿﺰﺩ.(خنده)", "ﺗﺒﺪﯾﻞ ﻣﺘﻦ ﺷﻤﺎﺑﻪ ﺻﺪﺍﯾﯽ ﮐﻪ ﻫﻤﺪﻟﯽ ﻭ ﺩﺭﮎ ﺭﺍ ﺑﺮﻣﯽ‌ﺍﻧﮕﯿﺰﺩ.(متن با صدای ترس و لرز بخون)"] },
         { id: "Zephyr", name: "آوا (زن)", gender: "female", desc: "لطیف و دلنشین", imgUrl: "https://uploadkon.ir/uploads/029605_25IMG-۲۰۲۵۰۷۰۵-۱۱۱۲۵۲.jpg", samples:["https://uploadkon.ir/uploads/920e06_26آوا-یک-2-.mp3", "https://uploadkon.ir/uploads/f50c06_26آوا-دو-2-.mp3", "https://uploadkon.ir/uploads/bc8e06_26آوا-سه-2-.mp3", "https://uploadkon.ir/uploads/1b2e06_26آوا-چهار-2-.mp3"], sampleTexts:["", "", "هاهاها ﺗﺒﺪﯾﻞ ﻣﺘﻦ ﺷﻤﺎ(خنده زیاد) ﺑﻪ ﺻﺪﺍﯾﯽ ﮐﻪ ﻫﻤﺪﻟﯽ ﻭ ﺩﺭﮎ ﺭﺍ ﺑﺮﻣﯽ‌ﺍﻧﮕﯿﺰﺩ.(خنده)", "وای ﺗﺒﺪﯾﻞ ﻣﺘﻦ ﺷﻤﺎﺑﻪ ﺻﺪﺍﯾﯽ ﮐﻪ ﻫﻤﺪﻟﯽ ﻭ ﺩﺭﮎ ﺭﺍ ﺑﺮﻣﯽ‌ﺍﻧﮕﯿﺰﺩ.(با تعجب و هیجان زیاد)"] },
@@ -763,7 +762,7 @@ document.addEventListener('DOMContentLoaded', () => {
             </div>
             <button type="button" id="clear-history-btn-podcast">
                 <svg viewBox="0 0 24 24"><path d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z"></path></svg>
-                حذف کامل پروژه و شروع مجدد
+                حذف کامل پروژه و بازگشت
             </button>
         `;
         container.appendChild(studioContainer);
@@ -821,36 +820,20 @@ document.addEventListener('DOMContentLoaded', () => {
         const turnDiv = document.createElement('div');
         turnDiv.className = 'script-turn';
         const turnIndex = container.children.length;
-        
         turnDiv.innerHTML = `
-            <div class="turn-speaker-selector">
-                <div class="custom-select-container" data-selected-id="${speakerId}">
-                    <div class="custom-select-trigger"></div>
-                    <div class="custom-select-options"></div>
-                </div>
-            </div>
+            <div class="turn-speaker-selector"><div class="custom-select-container" data-selected-id="${speakerId}"><div class="custom-select-trigger"></div><div class="custom-select-options"></div></div></div>
             <div class="turn-content">
                 <textarea>${text || ''}</textarea>
                 <div class="turn-player-container">
-                    <button type="button" class="turn-play-btn">
-                        <svg viewBox="0 0 24 24" class="play-icon"><path d="M8 5v14l11-7z"></path></svg>
-                        <svg viewBox="0 0 24 24" class="pause-icon"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"></path></svg>
-                    </button>
+                    <button type="button" class="turn-play-btn"><svg viewBox="0 0 24 24" class="play-icon"><path d="M8 5v14l11-7z"></path></svg><svg viewBox="0 0 24 24" class="pause-icon"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"></path></svg></button>
                     <audio class="turn-audio" style="display:none;"></audio>
-                    <div class="loading-state-wrapper" style="display:none;">
-                        <div class="spinner"></div>
-                        <span class="loading-text">در حال جایگزینی...</span>
-                    </div>
-                    <button type="button" class="turn-retry-btn">
-                        <svg viewBox="0 0 24 24"><path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"></path></svg>
-                        جایگزین قطعه
-                    </button>
-                    <span class="replace-success-message">فایل جدید جایگزین شد</span>
+                    <div class="loading-state-wrapper" style="display:none;"><div class="spinner"></div><span class="loading-text">در حال جایگزینی...</span></div>
+                    <button type="button" class="turn-retry-btn"><svg viewBox="0 0 24 24"><path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"></path></svg> جایگزین قطعه</button>
+                    <span class="replace-success-message">جایگزین شد</span>
                     <span class="main-update-message">فایل اصلی بروز شد</span>
                 </div>
             </div>
             <button type="button" class="remove-turn-btn" title="حذف نوبت">×</button>`;
-            
         container.appendChild(turnDiv);
         
         turnDiv.querySelector('textarea').addEventListener('input', triggerSave);
@@ -890,7 +873,7 @@ document.addEventListener('DOMContentLoaded', () => {
     async function initiateAiPodcastGeneration(userText) {
         hideModal(longTextModal);
         await clearProjectState(); 
-        activePodcastSpeakers = [];
+        activePodcastSpeakers =[];
         podcastMasterAudioBlobs =[];
         
         showLoadingState(mainOutputSection, "در حال اتصال به هوش مصنوعی...");
@@ -1303,9 +1286,16 @@ document.addEventListener('DOMContentLoaded', () => {
 
     (function() {
         const form = document.getElementById('standard-tts-form'); if (!form) return;
-        const textInput = form.querySelector('#text-input-standard'), promptInput = form.querySelector('#prompt-input-standard'), generateBtn = form.querySelector('#generate-btn-standard'), btnText = generateBtn.querySelector('.btn-text'), btnSpinner = generateBtn.querySelector('.spinner'), outputSection = document.getElementById('output-section-standard'), statusMessage = outputSection.querySelector('#status-message-standard'), loadingAnimation = outputSection.querySelector('#loading-animation-wrapper-standard'), playerContent = outputSection.querySelector('#audio-player-content-standard'), charCount = form.querySelector('#char-count');
+        const textInput = form.querySelector('#text-input-standard'), promptInput = form.querySelector('#prompt-input-standard'), generateBtn = form.querySelector('#generate-btn-standard'), btnText = generateBtn.querySelector('.btn-text'), btnSpinner = generateBtn.querySelector('.spinner'), outputSection = document.getElementById('output-section-standard'), statusMessage = outputSection.querySelector('#status-message-standard'), loadingAnimation = outputSection.querySelector('#loading-animation-wrapper-standard'), playerContent = outputSection.querySelector('#audio-player-content-standard'), charCount = form.querySelector('#char-count'), charMax = form.querySelector('#char-max');
 
-        textInput.addEventListener('input', () => { charCount.textContent = textInput.value.length.toLocaleString('fa-IR'); });
+        const MAX_CHARS = 80000;
+        if(charMax) charMax.textContent = MAX_CHARS.toLocaleString('fa-IR');
+
+        textInput.addEventListener('input', () => { 
+            const len = textInput.value.length;
+            charCount.textContent = len.toLocaleString('fa-IR'); 
+            charCount.style.color = len > MAX_CHARS ? 'red' : 'var(--accent-primary)'; 
+        });
         
         const showResultState = (isSuccess, msg = '') => { 
             loadingAnimation.style.display = 'none'; 
@@ -1355,7 +1345,8 @@ document.addEventListener('DOMContentLoaded', () => {
     })();
 
     // Events
-    function setupEventListeners() {[changeSpeakerBtn, selectedSpeakerCard].forEach(el => el && el.addEventListener('click', () => { isMainSelectorAction = true; createSpeakerCardsInModal(); showModal(speakerModal); }));
+    function setupEventListeners() {
+        [changeSpeakerBtn, selectedSpeakerCard].forEach(el => el && el.addEventListener('click', () => { isMainSelectorAction = true; createSpeakerCardsInModal(); showModal(speakerModal); }));
         document.querySelectorAll('.modal-overlay').forEach(o => o.addEventListener('click', (e) => (e.target === o) && hideModal(o)));
         document.querySelectorAll('.close-modal-btn').forEach(b => b.addEventListener('click', () => hideModal(b.closest('.modal-overlay'))));
         
@@ -1410,4 +1401,4 @@ document.addEventListener('DOMContentLoaded', () => {
 });
 </script>
 </body>
-</html>
+</html>