AI Email Marketing Suite
About Noble Core AI
Version 2.1.0 • Built with modern AI technology for sophisticated email marketing campaigns.
Features intelligent content generation, advanced analytics, and seamless integration capabilities.
Creating...
Sending...
✅ All Contacts (0)
No campaigns sent yet. Create your first campaign!
';
return;
}
historyDiv.innerHTML = this.campaigns.slice(-5).reverse().map(function(campaign) {
return '
'
' +
'
' +
'
';
}).join('');
},
getStorageSize: function() {
const data = JSON.stringify(localStorage);
return Math.round(data.length / 1024) + 'KB';
}
};
// Initialize EmailJS
function initializeEmailJS() {
const publicKey = EmailSuite.settings.emailjsPublicKey;
if (publicKey && typeof emailjs !== 'undefined') {
emailjs.init(publicKey);
document.getElementById('apiStatus').textContent = '✅';
document.getElementById('apiStatus').style.color = '#10B981';
return true;
}
return false;
}
// Tab Management
function showTab(tabName) {
document.querySelectorAll('.tab-content').forEach(function(content) {
content.classList.remove('active');
});
document.querySelectorAll('.tab').forEach(function(tab) {
tab.classList.remove('active');
});
document.getElementById(tabName).classList.add('active');
event.target.classList.add('active');
}
// AI Template Generation with Real OpenAI API
function generateTemplate() {
const prompt = document.getElementById('promptInput').value;
const campaignType = document.getElementById('campaignType').value;
const apiKey = EmailSuite.settings.openaiKey;
if (!prompt.trim()) {
showErrorMessage('Please enter a campaign description');
return;
}
// Show loading state
document.getElementById('generateText').classList.add('hidden');
document.getElementById('generateLoading').classList.remove('hidden');
document.getElementById('generateBtn').disabled = true;
document.getElementById('aiProgress').classList.remove('hidden');
// Progress animation
let progress = 0;
const progressInterval = setInterval(function() {
progress += Math.random() * 15;
if (progress > 90) progress = 90;
document.getElementById('progressFill').style.width = progress + '%';
}, 200);
setTimeout(function() {
try {
let template;
if (apiKey) {
// Use real OpenAI API
fetch('https://api.openai.com/v1/chat/completions', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + apiKey
},
body: JSON.stringify({
model: "gpt-3.5-turbo",
messages: [{
role: "user",
content: 'Create a professional HTML email template for: "' + prompt + '". Make it responsive with inline CSS, include a clear call-to-action button, and make it look modern and engaging. The email type is: ' + campaignType + '.'
}],
max_tokens: 1500,
temperature: 0.7
})
})
.then(function(response) {
if (!response.ok) {
throw new Error('OpenAI API request failed');
}
return response.json();
})
.then(function(data) {
template = data.choices[0].message.content;
displayTemplate(template);
})
.catch(function(error) {
console.error('Error with OpenAI:', error);
template = generateFallbackTemplate(prompt, campaignType);
displayTemplate(template);
showErrorMessage('Using fallback template. Check your OpenAI API key in Settings.');
});
} else {
// Use fallback template
template = generateFallbackTemplate(prompt, campaignType);
displayTemplate(template);
showErrorMessage('Add OpenAI API key in Settings for AI generation. Using fallback template.');
}
function displayTemplate(template) {
// Complete progress and show result
clearInterval(progressInterval);
document.getElementById('progressFill').style.width = '100%';
document.getElementById('emailPreview').innerHTML = template;
document.getElementById('templatePreview').classList.remove('hidden');
document.getElementById('sendBtn').disabled = false;
showSuccessMessage('✨ Template generated successfully!');
// Reset button state
document.getElementById('generateText').classList.remove('hidden');
document.getElementById('generateLoading').classList.add('hidden');
document.getElementById('generateBtn').disabled = false;
setTimeout(function() {
document.getElementById('aiProgress').classList.add('hidden');
document.getElementById('progressFill').style.width = '0%';
}, 1000);
}
} catch (error) {
console.error('Error generating template:', error);
clearInterval(progressInterval);
// Use fallback template on error
const template = generateFallbackTemplate(prompt, campaignType);
document.getElementById('emailPreview').innerHTML = template;
document.getElementById('templatePreview').classList.remove('hidden');
document.getElementById('sendBtn').disabled = false;
showErrorMessage('Using fallback template. Add OpenAI API key in Settings for AI generation.');
// Reset button state
document.getElementById('generateText').classList.remove('hidden');
document.getElementById('generateLoading').classList.add('hidden');
document.getElementById('generateBtn').disabled = false;
setTimeout(function() {
document.getElementById('aiProgress').classList.add('hidden');
document.getElementById('progressFill').style.width = '0%';
}, 1000);
}
}, 2000);
}
// Fallback template generator
function generateFallbackTemplate(prompt, type) {
const templates = {
promotional: '
',
newsletter: '
📰 Noble Core Newsletter
Your weekly dose of insights
This Week\'s Highlights
Here\'s what\'s happening this week regarding ' + prompt.toLowerCase() + '.
📈 Industry Insights
Latest trends and developments that matter to your business growth.
🔧 Product Updates
New features and improvements to enhance your experience.
',
announcement: '
🎉 Big Announcement!
Something exciting is here
We\'re thrilled to share...
We\'re excited to announce ' + prompt.toLowerCase() + '! This represents a major step forward in our mission.
🌟 What This Means for You
Revolutionary features that will transform your workflow and boost productivity.
'
};
return templates[type] || templates.promotional;
}
// Contact Management
function addSingleContact() {
const email = document.getElementById('singleEmail').value.trim();
const name = document.getElementById('singleName').value.trim();
if (!email || !email.includes('@')) {
showErrorMessage('Please enter a valid email address');
return;
}
// Check for duplicates
if (EmailSuite.contacts.find(function(c) { return c.email.toLowerCase() === email.toLowerCase(); })) {
showErrorMessage('Contact already exists!');
return;
}
// Add to storage
const contact = {
id: Date.now(),
email: email.toLowerCase(),
name: name || 'Unknown',
dateAdded: new Date().toISOString(),
opens: 0,
clicks: 0,
lastActivity: null
};
EmailSuite.contacts.push(contact);
EmailSuite.saveContacts();
// Update UI
renderContactsList();
// Clear inputs
document.getElementById('singleEmail').value = '';
document.getElementById('singleName').value = '';
showSuccessMessage('✅ Contact added successfully!');
}
function deleteContact(contactId) {
if (confirm('Are you sure you want to delete this contact?')) {
EmailSuite.contacts = EmailSuite.contacts.filter(function(c) { return c.id !== contactId; });
EmailSuite.saveContacts();
renderContactsList();
showSuccessMessage('Contact deleted successfully');
}
}
function renderContactsList() {
const contactsList = document.getElementById('contactsList');
const emptyDiv = document.getElementById('emptyContacts');
if (EmailSuite.contacts.length === 0) {
emptyDiv.style.display = 'block';
contactsList.innerHTML = '
';
return;
}
emptyDiv.style.display = 'none';
contactsList.innerHTML = EmailSuite.contacts.map(function(contact) {
return '
'' +
'
' +
'
' +
'
' +
'
';
}).join('');
}
// CSV File Upload
function handleFileUpload(input) {
const file = input.files[0];
if (!file) return;
if (!file.name.toLowerCase().endsWith('.csv')) {
showErrorMessage('Please upload a CSV file');
return;
}
showSuccessMessage('📁 Processing ' + file.name + '...');
const reader = new FileReader();
reader.onload = function(e) {
try {
const csv = e.target.result;
const lines = csv.split('\n').filter(function(line) { return line.trim(); });
if (lines.length < 2) { showErrorMessage('CSV file must contain headers and at least one contact'); return; } const headers = lines[0].split(',').map(function(h) { return h.trim().toLowerCase(); }); const emailIndex = headers.findIndex(function(h) { return h.includes('email'); }); const nameIndex = headers.findIndex(function(h) { return h.includes('name') || h.includes('first'); }); if (emailIndex === -1) { showErrorMessage('CSV file must contain an email column'); return; } let imported = 0; let duplicates = 0; for (let i = 1; i < lines.length; i++) { const values = lines[i].split(',').map(function(v) { return v.trim().replace(/"/g, ''); }); const email = values[emailIndex]; const name = nameIndex >= 0 ? values[nameIndex] : 'Unknown';
if (email && email.includes('@')) {
// Check for duplicates
if (!EmailSuite.contacts.find(function(c) { return c.email.toLowerCase() === email.toLowerCase(); })) {
const contact = {
id: Date.now() + i,
email: email.toLowerCase(),
name: name || 'Unknown',
dateAdded: new Date().toISOString(),
opens: 0,
clicks: 0,
lastActivity: null
};
EmailSuite.contacts.push(contact);
imported++;
} else {
duplicates++;
}
}
}
EmailSuite.saveContacts();
renderContactsList();
let message = '✅ Successfully imported ' + imported + ' contacts!';
if (duplicates > 0) {
message += ' (' + duplicates + ' duplicates skipped)';
}
showSuccessMessage(message);
} catch (error) {
console.error('Error processing CSV:', error);
showErrorMessage('Error processing CSV file. Please check the format.');
}
};
reader.readAsText(file);
}
// Template Actions
function copyTemplate() {
const template = document.getElementById('emailPreview').innerHTML;
if (!template) {
showErrorMessage('No template to copy');
return;
}
navigator.clipboard.writeText(template).then(function() {
showSuccessMessage('📋 Template copied to clipboard!');
}).catch(function(err) {
console.error('Could not copy text: ', err);
showErrorMessage('Failed to copy template');
});
}
function downloadTemplate() {
const template = document.getElementById('emailPreview').innerHTML;
if (!template) {
showErrorMessage('No template to download');
return;
}
const fullHTML = '\n\n
\n \n \n const blob = new Blob([fullHTML], { type: 'text/html' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'email-template.html';
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
showSuccessMessage('💾 Template downloaded!');
}
function testEmail() {
showSuccessMessage('📤 Test email feature - Configure EmailJS in Settings to enable');
}
// Settings Management
function saveSettings() {
EmailSuite.settings = {
openaiKey: document.getElementById('openaiKey').value,
emailjsPublicKey: document.getElementById('emailjsPublicKey').value,
emailjsServiceId: document.getElementById('emailjsServiceId').value,
emailjsTemplateId: document.getElementById('emailjsTemplateId').value,
defaultFromName: document.getElementById('defaultFromName').value,
defaultFromEmail: document.getElementById('defaultFromEmail').value,
emailSignature: document.getElementById('emailSignature').value
};
EmailSuite.saveSettings();
// Test EmailJS connection
if (EmailSuite.settings.emailjsPublicKey) {
initializeEmailJS();
}
showSuccessMessage('💾 Settings saved successfully!');
}
function resetSettings() {
document.getElementById('defaultFromName').value = 'Noble Core Team';
document.getElementById('defaultFromEmail').value = 'hello@noblecore.com';
document.getElementById('emailSignature').value = '';
document.getElementById('openaiKey').value = '';
document.getElementById('emailjsPublicKey').value = '';
document.getElementById('emailjsServiceId').value = '';
document.getElementById('emailjsTemplateId').value = '';
showSuccessMessage('🔄 Settings reset to defaults!');
}
function exportData() {
const data = {
contacts: EmailSuite.contacts,
campaigns: EmailSuite.campaigns,
stats: EmailSuite.stats,
exportDate: new Date().toISOString()
};
const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'noble-core-data.json';
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
showSuccessMessage('📤 Data exported successfully!');
}
function clearAllData() {
if (confirm('Are you sure you want to clear ALL data? This cannot be undone!')) {
if (confirm('This will delete all contacts, campaigns, and statistics. Are you absolutely sure?')) {
localStorage.removeItem('noble_contacts');
localStorage.removeItem('noble_campaigns');
localStorage.removeItem('noble_stats');
EmailSuite.contacts = [];
EmailSuite.campaigns = [];
EmailSuite.stats = {sent: 0, opened: 0, clicked: 0, revenue: 0};
// Update all UI elements
EmailSuite.updateContactCounts();
EmailSuite.updateDashboardStats();
EmailSuite.updateCampaignHistory();
renderContactsList();
showSuccessMessage('🗑️ All data cleared successfully!');
}
}
}
// Campaign Sending
function sendCampaign() {
const subject = document.getElementById('subjectInput').value;
const template = document.getElementById('emailPreview').innerHTML;
if (!subject.trim()) {
showErrorMessage('Please enter an email subject line');
return;
}
if (!template) {
showErrorMessage('Please generate an email template first');
return;
}
if (EmailSuite.contacts.length === 0) {
showErrorMessage('Please add contacts before sending a campaign');
return;
}
// Show loading state
document.getElementById('sendText').classList.add('hidden');
document.getElementById('sendLoading').classList.remove('hidden');
document.getElementById('sendBtn').disabled = true;
setTimeout(function() {
try {
// Simulate campaign sending
const audience = document.getElementById('targetAudience').value;
let recipientCount = EmailSuite.contacts.length;
if (audience === 'vip') {
recipientCount = Math.floor(EmailSuite.contacts.length * 0.1);
} else if (audience === 'new') {
recipientCount = Math.floor(EmailSuite.contacts.length * 0.3);
}
// Save campaign to history
const campaign = {
id: Date.now(),
subject: subject,
recipients: recipientCount,
date: new Date().toISOString(),
openRate: Math.floor(Math.random() * 30) + 30,
clickRate: Math.floor(Math.random() * 15) + 5
};
EmailSuite.campaigns.push(campaign);
EmailSuite.saveCampaigns();
// Update stats
EmailSuite.stats.sent += recipientCount;
EmailSuite.stats.opened += Math.floor(recipientCount * (campaign.openRate / 100));
EmailSuite.stats.clicked += Math.floor(recipientCount * (campaign.clickRate / 100));
EmailSuite.stats.revenue += Math.floor(Math.random() * 1000) + 500;
EmailSuite.saveStats();
showSuccessMessage('🚀 Campaign sent successfully to ' + recipientCount + ' recipients!');
} catch (error) {
console.error('Error sending campaign:', error);
showErrorMessage('Error sending campaign. Please try again.');
} finally {
// Reset button state
document.getElementById('sendText').classList.remove('hidden');
document.getElementById('sendLoading').classList.add('hidden');
document.getElementById('sendBtn').disabled = false;
}
}, 2000);
}
// Utility Functions
function showSuccessMessage(message) {
showMessage(message, 'success-alert');
}
function showErrorMessage(message) {
showMessage(message, 'error-alert');
}
function showMessage(message, className) {
// Remove existing alerts
const existingAlerts = document.querySelectorAll('.success-alert, .error-alert');
existingAlerts.forEach(function(alert) { alert.remove(); });
// Create new alert
const alert = document.createElement('div');
alert.className = className;
alert.textContent = message;
// Insert after hero section
const heroSection = document.querySelector('.hero-section');
heroSection.insertAdjacentElement('afterend', alert);
// Remove after 5 seconds
setTimeout(function() {
alert.remove();
}, 5000);
}
function quickAction() {
const actions = [
function() { showTab('compose'); showSuccessMessage('⚡ Switched to AI Composer'); },
function() { showTab('contacts'); showSuccessMessage('⚡ Switched to Contacts'); },
function() { showTab('analytics'); showSuccessMessage('⚡ Switched to Analytics'); },
function() { document.getElementById('promptInput').focus(); showSuccessMessage('⚡ Ready to create!'); }
];
const randomAction = actions[Math.floor(Math.random() * actions.length)];
randomAction();
}
// Load settings on page load
function loadSettings() {
if (EmailSuite.settings.defaultFromName) {
document.getElementById('defaultFromName').value = EmailSuite.settings.defaultFromName;
}
if (EmailSuite.settings.defaultFromEmail) {
document.getElementById('defaultFromEmail').value = EmailSuite.settings.defaultFromEmail;
}
if (EmailSuite.settings.emailSignature) {
document.getElementById('emailSignature').value = EmailSuite.settings.emailSignature;
}
if (EmailSuite.settings.openaiKey) {
document.getElementById('openaiKey').value = EmailSuite.settings.openaiKey;
}
if (EmailSuite.settings.emailjsPublicKey) {
document.getElementById('emailjsPublicKey').value = EmailSuite.settings.emailjsPublicKey;
initializeEmailJS(); // Initialize if key exists
}
if (EmailSuite.settings.emailjsServiceId) {
document.getElementById('emailjsServiceId').value = EmailSuite.settings.emailjsServiceId;
}
if (EmailSuite.settings.emailjsTemplateId) {
document.getElementById('emailjsTemplateId').value = EmailSuite.settings.emailjsTemplateId;
}
}
// Update recipient count based on audience selection
document.getElementById('targetAudience').addEventListener('change', function() {
const total = EmailSuite.contacts.length;
const counts = {
'all': total,
'vip': Math.floor(total * 0.1),
'new': Math.floor(total * 0.3)
};
document.getElementById('recipientCount').textContent = counts[this.value] || total;
});
// Initialize application
document.addEventListener('DOMContentLoaded', function() {
console.log('Noble Core AI Email Suite loaded successfully!');
// Load saved data
EmailSuite.updateContactCounts();
EmailSuite.updateDashboardStats();
EmailSuite.updateCampaignHistory();
renderContactsList();
loadSettings();
// Update storage usage
document.getElementById('storageUsed').textContent = EmailSuite.getStorageSize();
// Check API status
if (EmailSuite.settings.emailjsPublicKey) {
initializeEmailJS();
}
// Auto-save settings when changed
const settingsFields = ['openaiKey', 'emailjsPublicKey', 'emailjsServiceId', 'emailjsTemplateId', 'defaultFromName', 'defaultFromEmail', 'emailSignature'];
settingsFields.forEach(function(id) {
const element = document.getElementById(id);
if (element) {
element.addEventListener('change', saveSettings);
}
});
});
// Periodic storage update
setInterval(function() {
document.getElementById('storageUsed').textContent = EmailSuite.getStorageSize();
}, 5000);