${allMessages.map((div, index) => {
const isAI = div.classList.contains('_4f9bf79');
const type = isAI ? 'ai' : 'user';
const label = isAI ? texts.aiMessage : texts.userMessage;
let content;
if (isAI) {
content = div.textContent.trim();
} else {
// For user messages, remove ai-export-button and afb1eea3
const tempDiv = div.cloneNode(true);
const exportButton = tempDiv.querySelector('.ai-export-button');
if (exportButton) exportButton.remove();
const afb1eea3 = tempDiv.querySelector('.afb1eea3');
if (afb1eea3) afb1eea3.remove();
content = tempDiv.textContent.trim();
}
if (content.length > 60) content = content.substring(0, 57) + '...';
return `
${label}
`;
}).join('')}
`;
document.body.appendChild(modal);
modal.querySelector('#ai-select-all').addEventListener('click', () => {
modal.querySelectorAll('.ai-chat-checkbox').forEach(checkbox => {
checkbox.checked = true;
});
});
modal.querySelector('#ai-deselect-all').addEventListener('click', () => {
modal.querySelectorAll('.ai-chat-checkbox').forEach(checkbox => {
checkbox.checked = false;
});
});
modal.querySelector('#ai-cancel-btn').addEventListener('click', () => {
document.body.removeChild(modal);
});
modal.querySelector('#ai-continue-btn').addEventListener('click', () => {
const selectedIndices = [];
modal.querySelectorAll('.ai-chat-checkbox').forEach((checkbox, i) => {
if (checkbox.checked) {
const itemIndex = parseInt(checkbox.closest('.ai-chat-item').dataset.index);
selectedIndices.push(itemIndex);
}
});
if (selectedIndices.length === 0) {
alert(texts.noItemsSelected);
return;
}
const selectedDivs = selectedIndices.map(index => allMessages[index]);
document.body.removeChild(modal);
showColorSchemeModal(selectedDivs, true);
});
}
// Show color scheme modal
function showColorSchemeModal(selectedDivs, isMultiSelect) {
const modal = document.createElement('div');
modal.className = 'ai-color-scheme-modal';
let selectedSchemeIndex = 0;
let creatorName = '';
let addCreatorInfo = false;
let addUserAvatar = false;
const profileNameElement = document.querySelector('.ds-dropdown-menu-option__label');
const defaultCreatorName = profileNameElement ? profileNameElement.textContent.trim() : '';
modal.innerHTML = `
`;
document.body.appendChild(modal);
const schemeOptions = modal.querySelectorAll('.ai-scheme-option');
schemeOptions.forEach(option => {
option.addEventListener('click', () => {
schemeOptions.forEach(opt => opt.classList.remove('selected'));
option.classList.add('selected');
selectedSchemeIndex = parseInt(option.dataset.index);
});
});
const creatorCheckbox = modal.querySelector('.ai-creator-checkbox');
const creatorInput = modal.querySelector('.ai-creator-input');
const avatarCheckbox = modal.querySelector('.ai-avatar-checkbox');
creatorCheckbox.addEventListener('change', () => {
addCreatorInfo = creatorCheckbox.checked;
creatorInput.disabled = !addCreatorInfo;
creatorInput.style.display = addCreatorInfo ? 'block' : 'none';
});
avatarCheckbox.addEventListener('change', () => {
addUserAvatar = avatarCheckbox.checked;
});
addCreatorInfo = creatorCheckbox.checked;
creatorInput.style.display = addCreatorInfo ? 'block' : 'none';
if (isMultiSelect) {
modal.querySelector('#ai-back-btn').addEventListener('click', () => {
document.body.removeChild(modal);
showMultiSelectModal();
});
}
modal.querySelector('#ai-cancel-btn').addEventListener('click', () => {
document.body.removeChild(modal);
});
modal.querySelector('#ai-export-btn').addEventListener('click', async () => {
creatorName = creatorInput.value.trim();
document.body.removeChild(modal);
await generateAndDownloadImage(selectedDivs, texts.colorSchemes[selectedSchemeIndex], texts, addCreatorInfo, creatorName, addUserAvatar);
});
}
// Default SVG avatar (centered)
const defaultAvatarSVG = `