📄 Source: index_simple.php
<?php
session_name('INBOXZERO');
session_start();
require_once 'vendor/autoload.php';
$client = new Google\Client();
$client->setClientId('1082083393389-c5uekspcp2boc1gd0n0gr3v1a5vbb3jg.apps.googleusercontent.com');
$client->setClientSecret('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');
$client->setRedirectUri("http://createcraftweb.playit.plus/AgentAIv3/oauth2callback.php");
$client->addScope('https://www.googleapis.com/auth/gmail.readonly');
$client->setAccessType('offline');
$client->setPrompt('consent');
$isLoggedIn = isset($_SESSION['access_token']);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>InboxZero AI v3</title>
<style>
body { font-family: Arial; margin: 20px; background: #f0f2f5; }
.container { max-width: 1200px; margin: auto; background: white; border-radius: 10px; overflow: hidden; }
.header { background: #667eea; color: white; padding: 15px 20px; }
.content { display: flex; min-height: 500px; }
.sidebar { width: 300px; background: #f8f9fa; padding: 15px; border-right: 1px solid #ddd; }
.chat-area { flex: 1; display: flex; flex-direction: column; }
.messages { flex: 1; padding: 15px; overflow-y: auto; min-height: 400px; background: white; }
.input-area { padding: 15px; border-top: 1px solid #ddd; display: flex; gap: 10px; }
.input-area input { flex: 1; padding: 10px; border: 1px solid #ddd; border-radius: 20px; }
.input-area button { padding: 10px 20px; background: #667eea; color: white; border: none; border-radius: 20px; cursor: pointer; }
.message { margin-bottom: 10px; padding: 10px; border-radius: 10px; max-width: 80%; }
.user-message { background: #667eea; color: white; margin-left: auto; }
.ai-message { background: #f1f3f4; color: #333; margin-right: auto; }
.login-btn { background: white; color: #667eea; padding: 10px 20px; text-decoration: none; border-radius: 20px; display: inline-block; }
.logout-btn { background: #dc3545; color: white; padding: 8px; border: none; border-radius: 10px; cursor: pointer; width: 100%; margin-bottom: 10px; }
.email-list { list-style: none; padding: 0; margin: 0; max-height: 400px; overflow-y: auto; }
.email-item { padding: 8px; margin-bottom: 5px; background: white; border-radius: 8px; border: 1px solid #ddd; cursor: pointer; }
.loading { text-align: center; padding: 20px; color: #999; }
</style>
</head>
<body>
<div class="container">
<div class="header">
<h1>📧 InboxZero AI v3</h1>
<p>Your intelligent email assistant</p>
</div>
<div class="content">
<div class="sidebar">
<h3>📬 Your Inbox</h3>
<?php if ($isLoggedIn): ?>
<button onclick="logout()" class="logout-btn">🚪 Logout</button>
<div id="emailList" class="loading">📥 Loading your emails...</div>
<?php else: ?>
<p>🔐 Login to access your Gmail inbox</p>
<a href="<?php echo $client->createAuthUrl(); ?>" class="login-btn">🔑 Sign in with Google</a>
<?php endif; ?>
</div>
<div class="chat-area">
<div class="messages" id="messages">
<div class="message ai-message">🤖 Hello! I'm InboxZero AI v3. Ask me about your emails!</div>
</div>
<?php if ($isLoggedIn): ?>
<div class="input-area">
<input type="text" id="userInput" placeholder="Ask about your emails..." onkeypress="if(event.key==='Enter') sendMessage()">
<button onclick="sendMessage()">📤 Send</button>
</div>
<?php endif; ?>
</div>
</div>
</div>
<script>
let currentConversationId = null;
async function sendMessage() {
const input = document.getElementById('userInput');
const message = input.value.trim();
if (!message) return;
addMessage('user', message);
input.value = '';
try {
const response = await fetch('chat_handler.php', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ query: message, conversation_id: currentConversationId })
});
const data = await response.json();
addMessage('ai', data.reply);
if (data.conversation_id && !currentConversationId) {
currentConversationId = data.conversation_id;
}
if (data.emails && data.emails.length > 0) {
displayEmails(data.emails);
}
} catch (error) {
addMessage('ai', 'Error: ' + error.message);
}
}
function addMessage(role, text) {
const messagesDiv = document.getElementById('messages');
const div = document.createElement('div');
div.className = `message ${role === 'user' ? 'user-message' : 'ai-message'}`;
div.innerHTML = (role === 'user' ? '👤 ' : '🤖 ') + text.replace(/\n/g, '<br>');
messagesDiv.appendChild(div);
messagesDiv.scrollTop = messagesDiv.scrollHeight;
}
async function loadEmails() {
try {
const response = await fetch('fetch_emails.php');
const emails = await response.json();
if (emails.error) {
document.getElementById('emailList').innerHTML = `<div class="loading">❌ ${emails.error}</div>`;
} else {
displayEmails(emails);
}
} catch (error) {
document.getElementById('emailList').innerHTML = '<div class="loading">❌ Failed to load emails</div>';
}
}
function displayEmails(emails) {
if (!emails || emails.length === 0) {
document.getElementById('emailList').innerHTML = '<div class="loading">📭 No emails found</div>';
return;
}
let html = '<ul class="email-list">';
for (let i = 0; i < Math.min(emails.length, 15); i++) {
const email = emails[i];
html += `<li class="email-item" onclick="viewEmail('${email.id}', '${email.threadId}')">
<div class="email-from">📨 ${escapeHtml(email.from.substring(0, 40))}</div>
<div class="email-subject">${escapeHtml(email.subject.substring(0, 50))}</div>
<div class="email-date">📅 ${escapeHtml(email.date)}</div>
</li>`;
}
html += '</ul>';
document.getElementById('emailList').innerHTML = html;
}
async function viewEmail(emailId, threadId) {
addMessage('ai', '📖 Opening email...');
try {
const response = await fetch('get_email.php', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email_id: emailId })
});
const data = await response.json();
if (data.content) {
addMessage('ai', data.content);
} else {
addMessage('ai', '❌ Could not load email content.');
}
} catch (error) {
addMessage('ai', '❌ Failed to load email.');
}
}
function logout() {
fetch('logout.php').then(() => window.location.reload());
}
function escapeHtml(text) {
if (!text) return '';
const div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
// Initialize
loadEmails();
</script>
</body>
</html>
← Back