2024-06-08 11:04:41 +02:00
|
|
|
let classificationResults = {}; // Dictionary to store classification results
|
2024-05-31 22:49:37 +02:00
|
|
|
|
2024-06-08 11:04:41 +02:00
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
loadClassificationResults(); // Load classification results on start
|
|
|
|
checkLoginState();
|
|
|
|
|
|
|
|
document.getElementById('loginButton').addEventListener('click', () => {
|
|
|
|
const email = document.getElementById('email').value;
|
2024-05-31 22:49:37 +02:00
|
|
|
const password = document.getElementById('password').value;
|
|
|
|
|
2024-06-08 11:04:41 +02:00
|
|
|
login(email, password);
|
2024-05-31 22:49:37 +02:00
|
|
|
});
|
|
|
|
|
2024-06-08 11:04:41 +02:00
|
|
|
document.getElementById('fetchEmails').addEventListener('click', () => {
|
|
|
|
fetchEmails();
|
2024-05-31 22:49:37 +02:00
|
|
|
});
|
|
|
|
|
2024-06-08 11:04:41 +02:00
|
|
|
document.getElementById('classifyEmail').addEventListener('click', () => {
|
|
|
|
const emailBody = document.getElementById('emailBody').value;
|
|
|
|
const emailId = getCurrentEmailId();
|
|
|
|
|
|
|
|
fetch('http://localhost:5000/classify-email', {
|
2024-05-31 22:49:37 +02:00
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json'
|
|
|
|
},
|
2024-06-08 11:04:41 +02:00
|
|
|
body: JSON.stringify({ body: emailBody })
|
2024-05-31 22:49:37 +02:00
|
|
|
})
|
|
|
|
.then(response => response.json())
|
|
|
|
.then(data => {
|
2024-06-08 11:04:41 +02:00
|
|
|
classificationResults[emailId] = data.result; // Store the result
|
|
|
|
saveClassificationResults(); // Save results to chrome storage
|
|
|
|
updateClassificationResult(emailId); // Update the displayed result
|
|
|
|
if (data.result === "Suspicious") {
|
|
|
|
showActions();
|
|
|
|
} else {
|
|
|
|
hideActions();
|
2024-05-31 22:49:37 +02:00
|
|
|
}
|
|
|
|
})
|
2024-06-08 11:04:41 +02:00
|
|
|
.catch(error => console.error('Error classifying email:', error));
|
|
|
|
});
|
|
|
|
|
|
|
|
document.getElementById('logout').addEventListener('click', () => {
|
|
|
|
chrome.storage.local.remove(['email', 'password', 'classificationResults'], () => {
|
|
|
|
console.log('Logged out');
|
|
|
|
clearEmailList(); // Clear the email list
|
|
|
|
clearCredentials(); // Clear the credentials
|
|
|
|
showLoginSection();
|
2024-05-31 22:49:37 +02:00
|
|
|
});
|
|
|
|
});
|
2024-06-08 11:04:41 +02:00
|
|
|
|
|
|
|
document.getElementById('markSafe').addEventListener('click', () => {
|
|
|
|
const emailId = getCurrentEmailId();
|
|
|
|
if (emailId) {
|
|
|
|
markEmailAsSafe(emailId);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
document.getElementById('deleteEmail').addEventListener('click', () => {
|
|
|
|
const emailId = getCurrentEmailId();
|
|
|
|
if (emailId) {
|
|
|
|
deleteEmail(emailId);
|
|
|
|
}
|
|
|
|
});
|
2024-05-31 22:49:37 +02:00
|
|
|
});
|
2024-06-08 11:04:41 +02:00
|
|
|
|
|
|
|
function login(email, password) {
|
|
|
|
chrome.storage.local.set({ email: email, password: password }, () => {
|
|
|
|
console.log('Credentials saved');
|
|
|
|
showLoggedInSection(email);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function fetchEmails() {
|
|
|
|
chrome.storage.local.get(['email', 'password'], (result) => {
|
|
|
|
if (result.email && result.password) {
|
|
|
|
fetch('http://localhost:5000/fetch-emails', {
|
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json'
|
|
|
|
},
|
|
|
|
body: JSON.stringify({ username: result.email, password: result.password })
|
|
|
|
})
|
|
|
|
.then(response => {
|
|
|
|
if (!response.ok) {
|
|
|
|
throw new Error('Login failed. Check your email and password.');
|
|
|
|
}
|
|
|
|
return response.json();
|
|
|
|
})
|
|
|
|
.then(data => {
|
|
|
|
updateEmailList(data);
|
|
|
|
})
|
|
|
|
.catch(error => console.error('Error fetching emails:', error));
|
|
|
|
} else {
|
|
|
|
alert("Login credentials not found.");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function checkLoginState() {
|
|
|
|
chrome.storage.local.get(['email', 'password'], (result) => {
|
|
|
|
if (result.email && result.password) {
|
|
|
|
showLoggedInSection(result.email);
|
|
|
|
} else {
|
|
|
|
showLoginSection();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function showLoginSection() {
|
|
|
|
document.getElementById('loginSection').style.display = 'block';
|
|
|
|
document.getElementById('loggedInSection').style.display = 'none';
|
|
|
|
document.getElementById('loggedInEmail').textContent = '';
|
|
|
|
document.getElementById('actions').style.display = 'none';
|
|
|
|
clearEmailList(); // Clear the email list when showing the login section
|
|
|
|
}
|
|
|
|
|
|
|
|
function showLoggedInSection(email) {
|
|
|
|
document.getElementById('loginSection').style.display = 'none';
|
|
|
|
document.getElementById('loggedInSection').style.display = 'block';
|
|
|
|
document.getElementById('loggedInEmail').textContent = email;
|
|
|
|
}
|
|
|
|
|
|
|
|
function showActions() {
|
|
|
|
document.getElementById('actions').style.display = 'block';
|
|
|
|
}
|
|
|
|
|
|
|
|
function hideActions() {
|
|
|
|
document.getElementById('actions').style.display = 'none';
|
|
|
|
}
|
|
|
|
|
|
|
|
function getCurrentEmailId() {
|
|
|
|
return document.getElementById('emailBody').dataset.emailId;
|
|
|
|
}
|
|
|
|
|
|
|
|
function markEmailAsSafe(emailId) {
|
|
|
|
fetch('http://localhost:5000/mark-safe', {
|
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json'
|
|
|
|
},
|
|
|
|
body: JSON.stringify({ email_id: emailId })
|
|
|
|
})
|
|
|
|
.then(response => response.json())
|
|
|
|
.then(data => {
|
|
|
|
classificationResults[emailId] = "Not suspicious (marked safe by user)"; // Update the classification result
|
|
|
|
saveClassificationResults(); // Save results to chrome storage
|
|
|
|
updateClassificationResult(emailId); // Update the displayed result
|
|
|
|
hideActions(); // Hide actions since it's now marked as safe
|
|
|
|
})
|
|
|
|
.catch(error => console.error('Error marking email as safe:', error));
|
|
|
|
}
|
|
|
|
|
|
|
|
function deleteEmail(emailId) {
|
|
|
|
chrome.storage.local.get(['email', 'password'], (result) => {
|
|
|
|
if (result.email && result.password) {
|
|
|
|
fetch('http://localhost:5000/delete-email', {
|
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json'
|
|
|
|
},
|
|
|
|
body: JSON.stringify({ email_id: emailId, username: result.email, password: result.password })
|
|
|
|
})
|
|
|
|
.then(response => response.json())
|
|
|
|
.then(data => {
|
|
|
|
alert(data.message);
|
|
|
|
removeEmailFromList(emailId); // Update the list and reindex
|
|
|
|
})
|
|
|
|
.catch(error => console.error('Error deleting email:', error));
|
|
|
|
} else {
|
|
|
|
alert("Login credentials not found.");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function removeEmailFromList(emailId) {
|
|
|
|
const emailList = document.getElementById('emailList');
|
|
|
|
const emailItems = emailList.getElementsByTagName('li');
|
|
|
|
for (let i = 0; i < emailItems.length; i++) {
|
|
|
|
if (emailItems[i].dataset.emailId === emailId) {
|
|
|
|
emailList.removeChild(emailItems[i]);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// Reindex the remaining emails
|
|
|
|
reindexEmailList();
|
|
|
|
document.getElementById('emailBody').value = ''; // Clear email body display
|
|
|
|
document.getElementById('result').textContent = ''; // Clear classification result message
|
|
|
|
hideActions(); // Hide actions
|
|
|
|
}
|
|
|
|
|
|
|
|
function reindexEmailList() {
|
|
|
|
const emailList = document.getElementById('emailList');
|
|
|
|
const emailItems = emailList.getElementsByTagName('li');
|
|
|
|
for (let i = 0; i < emailItems.length; i++) {
|
|
|
|
emailItems[i].textContent = `${i + 1}: ${emailItems[i].textContent.split(': ')[1]}`;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function updateClassificationResult(emailId) {
|
|
|
|
const resultDiv = document.getElementById('result');
|
|
|
|
if (classificationResults[emailId]) {
|
|
|
|
resultDiv.textContent = `This email is: ${classificationResults[emailId]}`;
|
|
|
|
if (classificationResults[emailId] === "Suspicious") {
|
|
|
|
showActions();
|
|
|
|
} else {
|
|
|
|
hideActions();
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
resultDiv.textContent = ''; // Clear message if not classified
|
|
|
|
hideActions();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function saveClassificationResults() {
|
|
|
|
chrome.storage.local.set({ classificationResults: classificationResults }, () => {
|
|
|
|
console.log('Classification results saved');
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function loadClassificationResults() {
|
|
|
|
chrome.storage.local.get(['classificationResults'], (result) => {
|
|
|
|
if (result.classificationResults) {
|
|
|
|
classificationResults = result.classificationResults;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function clearEmailList() {
|
|
|
|
document.getElementById('emailList').innerHTML = ''; // Clear the email list
|
|
|
|
document.getElementById('emailBody').value = ''; // Clear email body display
|
|
|
|
document.getElementById('result').textContent = ''; // Clear classification result message
|
|
|
|
}
|
|
|
|
|
|
|
|
function clearCredentials() {
|
|
|
|
document.getElementById('email').value = ''; // Clear email input field
|
|
|
|
document.getElementById('password').value = ''; // Clear password input field
|
|
|
|
}
|
|
|
|
|
|
|
|
function updateEmailList(emails) {
|
|
|
|
const emailList = document.getElementById('emailList');
|
|
|
|
emailList.innerHTML = '';
|
|
|
|
emails.forEach((email, index) => {
|
|
|
|
const li = document.createElement('li');
|
|
|
|
li.textContent = `${index + 1}: ${email.subject} (from ${email.name} <${email.email_address}>)`;
|
|
|
|
li.dataset.emailId = email.id; // Assuming email objects have an id property
|
|
|
|
li.addEventListener('click', () => {
|
|
|
|
document.getElementById('emailBody').value = email.body;
|
|
|
|
document.getElementById('emailBody').dataset.emailId = email.id; // Store the email ID
|
|
|
|
updateClassificationResult(email.id); // Update the displayed result
|
|
|
|
});
|
|
|
|
emailList.appendChild(li);
|
|
|
|
});
|
|
|
|
}
|