`); printWin.document.close(); printWin.onload = () => { printWin.focus(); printWin.print(); }; }// ═══════════════════════════════════════════════ // PERSONA MANAGEMENT SYSTEM // ═══════════════════════════════════════════════const STORAGE_KEY = 'adbuilder_personas'; let activePersonaId = null; let selectedPersonaForPrompt = null;// ── All input/select/textarea field IDs ── const FIELD_IDS = [ 'p-name','p-platform','p-desc', 'd-age','d-gender','d-status','d-location','d-area','d-nationality', 'd-edu','d-job','d-sector','d-income', 'c-aware','c-decision','c-freq','c-factor','c-screen','c-time', 'c-content','c-plat','c-living', 'ls-day','ls-hobbies-x','ls-asp','ls-inf','ls-social', 'c-hobbies','c-values','c-persona', 'c-tone','c-lang', 'ls-trends', 'pr-name','pr-cat','pr-usp','pr-guar', 'b1','b2','b3', 'pr-price','pr-offer','pr-fomo', 'pain-b','pain-a','pain-block' ];const CHIP_IDS = [ 'c-aware','c-decision','c-freq','c-factor','c-screen','c-time', 'c-content','c-plat','c-living','c-hobbies','c-values','c-persona', 'c-tone','c-lang' ];const TAG_GROUPS = [ {id:'pos-tags', type:'pos'}, {id:'neg-tags', type:'neg'}, {id:'em-tags', type:'em'} ];function collectAllData() { const data = { fields:{}, chips:{}, tags:{} };// Text inputs, selects, textareas FIELD_IDS.forEach(id => { const el = G(id); if(!el) return; if(el.tagName === 'SELECT' || el.tagName === 'INPUT' || el.tagName === 'TEXTAREA') { data.fields[id] = el.value; } });// Chip groups — save which chip texts are active CHIP_IDS.forEach(id => { const container = G(id); if(!container) return; data.chips[id] = [...container.querySelectorAll('.chip.on')].map(c => c.textContent.trim()); });// Tag groups — save tag texts and types TAG_GROUPS.forEach(({id, type}) => { const container = G(id); if(!container) return; data.tags[id] = [...container.children].map(t => ({ text: t.textContent.replace('✕','').trim(), type })); });return data; }function applyAllData(data) { if(!data) return;// Restore text fields if(data.fields) { Object.entries(data.fields).forEach(([id, val]) => { const el = G(id); if(el) el.value = val || ''; }); }// Restore chips if(data.chips) { Object.entries(data.chips).forEach(([id, activeTexts]) => { const container = G(id); if(!container) return; container.querySelectorAll('.chip').forEach(chip => { const isOn = activeTexts.includes(chip.textContent.trim()); chip.classList.toggle('on', isOn); }); }); }// Restore tags if(data.tags) { Object.entries(data.tags).forEach(([id, tagArr]) => { const container = G(id); if(!container) return; container.innerHTML = ''; tagArr.forEach(({text, type}) => makeTag(text, id, type)); }); }tick(); }// ── localStorage helpers ── function getPersonas() { try { return JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]'); } catch { return []; } } function setPersonas(arr) { localStorage.setItem(STORAGE_KEY, JSON.stringify(arr)); }// ── Save modal ── function openSaveModal() { // Pre-fill with persona name if available const pName = V('p-name'); G('save-persona-name').value = pName || ''; G('save-modal').classList.add('open'); document.body.style.overflow = 'hidden'; setTimeout(() => G('save-persona-name').focus(), 200); } function closeSaveModal() { G('save-modal').classList.remove('open'); document.body.style.overflow = ''; } function confirmSave() { const name = G('save-persona-name').value.trim(); if(!name) { G('save-persona-name').style.borderColor='#E11D48'; return; } G('save-persona-name').style.borderColor='';const personas = getPersonas(); const data = collectAllData(); const timestamp = new Date().toLocaleString('ar-SA',{year:'numeric',month:'long',day:'numeric'});if(activePersonaId) { // Update existing const idx = personas.findIndex(p => p.id === activePersonaId); if(idx > -1) { personas[idx] = {...personas[idx], name, data, updatedAt: timestamp}; } else { activePersonaId = null; } } if(!activePersonaId) { // Create new const id = 'p_' + Date.now(); personas.push({ id, name, data, createdAt: timestamp }); activePersonaId = id; }setPersonas(personas); renderSavedPersonas(); renderTab2(); closeSaveModal(); showToast('✅ تم حفظ البيرسونا بنجاح', 'success'); }// ── Load persona ── function loadPersona(id) { const personas = getPersonas(); const persona = personas.find(p => p.id === id); if(!persona) return; activePersonaId = id; applyAllData(persona.data); renderSavedPersonas(); showToast('📂 تم تحميل: ' + persona.name, 'success'); // Scroll to top G('main-content').scrollTo({top:0, behavior:'smooth'}); }// ── Delete persona ── function deletePersona(id, e) { e.stopPropagation(); const personas = getPersonas(); const persona = personas.find(p => p.id === id); if(!persona) return; if(!confirm('حذف البيرسونا "' + persona.name + '"؟ لا يمكن التراجع.')) return; const filtered = personas.filter(p => p.id !== id); setPersonas(filtered); if(activePersonaId === id) activePersonaId = null; renderSavedPersonas(); showToast('🗑️ تم حذف البيرسونا', 'error'); }// ── New empty persona ── function newPersona() { if(!confirm('هل تريد بدء بيرسونا جديدة فارغة؟ سيتم مسح الحقول الحالية.')) return; activePersonaId = null; clearAllFields(); renderSavedPersonas(); const mc = G('main-content'); if(mc) mc.scrollTo({top:0, behavior:'smooth'}); showToast('✨ جاهز لبيرسونا جديدة', 'success'); }function clearAllFields() { FIELD_IDS.forEach(id => { const el = G(id); if(!el) return; if(el.tagName === 'SELECT' || el.tagName === 'INPUT' || el.tagName === 'TEXTAREA') { el.value = ''; } }); CHIP_IDS.forEach(id => { const container = G(id); if(!container) return; container.querySelectorAll('.chip').forEach(c => c.classList.remove('on')); }); TAG_GROUPS.forEach(({id}) => { const container = G(id); if(container) container.innerHTML = ''; }); tick(); }// ── Update badge count ── function updateBadge() { const personas = getPersonas(); const badge = G('personas-count'); if(!badge) return; if(personas.length > 0) { badge.textContent = personas.length; badge.style.display = 'inline-block'; } else { badge.style.display = 'none'; } }// ── Render Tab 2 personas grid ── function renderTab2() { const personas = getPersonas(); const grid = G('tab2-personas-grid'); if(!grid) return; const avatars = ['👤','👩','🧑','👨','👩‍💼','👨‍💼','🧑‍💼','👩‍🎓','👨‍🎓','🎯'];if(personas.length === 0) { grid.innerHTML = ``; return; }grid.innerHTML = ``; }// ── Render Tab 3 selector ── function renderTab3Selector() { const personas = getPersonas(); const grid = G('tab3-persona-grid'); if(!grid) return; const avatars = ['👤','👩','🧑','👨','👩‍💼','👨‍💼','🧑‍💼','👩‍🎓','👨‍🎓','🎯'];if(personas.length === 0) { grid.innerHTML = ``; return; } grid.innerHTML = personas.map((p, i) => ``).join(''); }function selectPersonaForPrompt(id, name) { selectedPersonaForPrompt = id; renderTab3Selector(); const label = G('tab3-selected-label'); if(label) label.innerHTML = `البيرسونا المختارة: ${name}`; const btn = G('btn-gen-tab3'); if(btn) { btn.style.opacity='1'; btn.style.cursor='pointer'; btn.disabled=false; } // Reset prompt output const out = G('prompt-out-tab3'); if(out) { out.textContent = '← اضغط "توليد البروبمت" لإنشاء البروبمت لهذه البيرسونا'; out.classList.add('empty'); } }function selectAndGoPrompt(id) { const personas = getPersonas(); const p = personas.find(x => x.id === id); if(!p) return; // Switch to tab3 document.querySelectorAll('.tab-panel').forEach(p => p.classList.remove('active')); document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active')); G('tab3').classList.add('active'); document.querySelectorAll('.tab-btn')[2].classList.add('active'); renderTab3Selector(); selectPersonaForPrompt(id, p.name); }function editPersonaFromTab2(id) { loadPersona(id); // Switch to tab1 document.querySelectorAll('.tab-panel').forEach(p => p.classList.remove('active')); document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active')); G('tab1').classList.add('active'); document.querySelectorAll('.tab-btn')[0].classList.add('active'); }function deletePersonaFromTab2(id) { const personas = getPersonas(); const persona = personas.find(p => p.id === id); if(!persona) return; if(!confirm('حذف البيرسونا "' + persona.name + '"؟ لا يمكن التراجع.')) return; setPersonas(personas.filter(p => p.id !== id)); if(activePersonaId === id) activePersonaId = null; if(selectedPersonaForPrompt === id) selectedPersonaForPrompt = null; renderTab2(); updateBadge(); showToast('🗑️ تم حذف البيرسونا', 'error'); }// ── Render sidebar list (kept for reference but sidebar no longer shows personas) ── function renderSavedPersonas() { updateBadge(); // Update current persona label in save bar const personas = getPersonas(); const label = G('current-persona-label'); if(label) { if(activePersonaId) { const p = personas.find(x => x.id === activePersonaId); label.textContent = p ? '✏️ ' + p.name : 'بيرسونا جديدة'; } else { label.textContent = 'بيرسونا جديدة'; } } }// ── Toast ── function showToast(msg, type='') { const t = G('toast'); t.textContent = msg; t.className = 'toast ' + type; t.classList.add('show'); setTimeout(() => t.classList.remove('show'), 2800); }function viewPersonaFromModal(id) { const personas = getPersonas(); const persona = personas.find(p => p.id === id); if(!persona) return; openPersonaSummary(persona.data); }document.addEventListener('DOMContentLoaded', () => { renderSavedPersonas(); renderTab2(); });