AG X v2.0.3 - Antigravity fork with multi-provider support
Features: - Welcome screen on first run (provider choice before LS starts) - 15+ AI providers (Google Gemini, OpenAI, Anthropic, DeepSeek, Ollama, etc.) - Provider config syncs to endpoints.json for translation proxy - Built-in Node.js translation proxy for non-native backends - Auto-update support, tray integration, URI scheme handler
This commit is contained in:
176
dist/provider/welcome.html
vendored
Normal file
176
dist/provider/welcome.html
vendored
Normal file
@@ -0,0 +1,176 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Welcome to AG X</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: linear-gradient(135deg, #0a0a1a 0%, #1a1a3e 50%, #0a0a1a 100%);
|
||||
color: #e0e0e0; min-height: 100vh;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.welcome-container {
|
||||
text-align: center; max-width: 620px; width: 100%; padding: 40px;
|
||||
}
|
||||
.logo { font-size: 64px; margin-bottom: 8px; }
|
||||
.app-name {
|
||||
font-size: 42px; font-weight: 800;
|
||||
background: linear-gradient(135deg, #e94560, #ff6b8a, #e94560);
|
||||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.app-version {
|
||||
font-size: 13px; color: #555; margin-bottom: 32px;
|
||||
letter-spacing: 2px; text-transform: uppercase;
|
||||
}
|
||||
.tagline {
|
||||
font-size: 16px; color: #8892b0; margin-bottom: 40px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.choice-grid {
|
||||
display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.choice-card {
|
||||
background: rgba(22, 33, 62, 0.8);
|
||||
border: 2px solid #2a2a4a; border-radius: 16px;
|
||||
padding: 28px 20px; cursor: pointer; transition: all 0.3s;
|
||||
text-align: center; position: relative; overflow: hidden;
|
||||
}
|
||||
.choice-card::before {
|
||||
content: ''; position: absolute; top: 0; left: 0; right: 0;
|
||||
height: 3px; background: transparent; transition: background 0.3s;
|
||||
}
|
||||
.choice-card:hover {
|
||||
border-color: #e94560; transform: translateY(-3px);
|
||||
box-shadow: 0 8px 30px rgba(233, 69, 96, 0.15);
|
||||
}
|
||||
.choice-card:hover::before { background: linear-gradient(90deg, #e94560, #ff6b8a); }
|
||||
.choice-card .icon { font-size: 40px; margin-bottom: 12px; }
|
||||
.choice-card h3 { font-size: 16px; color: #fff; margin-bottom: 8px; }
|
||||
.choice-card p { font-size: 12px; color: #8892b0; line-height: 1.5; }
|
||||
.choice-card .badge {
|
||||
display: inline-block; margin-top: 10px; padding: 3px 10px;
|
||||
border-radius: 10px; font-size: 10px; font-weight: 600;
|
||||
}
|
||||
.badge-easy { background: #1a3a1a; color: #4caf50; }
|
||||
.badge-power { background: #3a2a1a; color: #ffa726; }
|
||||
|
||||
.divider {
|
||||
display: flex; align-items: center; margin: 24px 0;
|
||||
color: #444; font-size: 12px; text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.divider::before, .divider::after {
|
||||
content: ''; flex: 1; height: 1px; background: #2a2a4a;
|
||||
}
|
||||
.divider span { padding: 0 16px; }
|
||||
|
||||
.footer {
|
||||
font-size: 11px; color: #444; margin-top: 20px;
|
||||
}
|
||||
.footer a { color: #e94560; text-decoration: none; }
|
||||
.footer a:hover { text-decoration: underline; }
|
||||
|
||||
/* Animation */
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(20px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.welcome-container > * {
|
||||
animation: fadeIn 0.5s ease forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
.welcome-container > *:nth-child(1) { animation-delay: 0.1s; }
|
||||
.welcome-container > *:nth-child(2) { animation-delay: 0.2s; }
|
||||
.welcome-container > *:nth-child(3) { animation-delay: 0.25s; }
|
||||
.welcome-container > *:nth-child(4) { animation-delay: 0.3s; }
|
||||
.welcome-container > *:nth-child(5) { animation-delay: 0.4s; }
|
||||
.welcome-container > *:nth-child(6) { animation-delay: 0.5s; }
|
||||
|
||||
/* Particles */
|
||||
.particles {
|
||||
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
|
||||
pointer-events: none; z-index: 0;
|
||||
}
|
||||
.particle {
|
||||
position: absolute; width: 2px; height: 2px;
|
||||
background: rgba(233, 69, 96, 0.3); border-radius: 50%;
|
||||
animation: float linear infinite;
|
||||
}
|
||||
@keyframes float {
|
||||
0% { transform: translateY(100vh) scale(0); opacity: 0; }
|
||||
10% { opacity: 1; }
|
||||
90% { opacity: 1; }
|
||||
100% { transform: translateY(-10vh) scale(1); opacity: 0; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="particles" id="particles"></div>
|
||||
|
||||
<div class="welcome-container">
|
||||
<div class="logo">⚡</div>
|
||||
<div class="app-name">AG X</div>
|
||||
<div class="app-version">AI-Powered Code Intelligence</div>
|
||||
<div class="tagline">
|
||||
Choose how you'd like to connect to AI.<br>
|
||||
You can always change this later from the menu.
|
||||
</div>
|
||||
|
||||
<div class="choice-grid">
|
||||
<div class="choice-card" id="choiceGoogle" onclick="chooseGoogle()">
|
||||
<div class="icon">🔮</div>
|
||||
<h3>Google Gemini</h3>
|
||||
<p>Sign in with your Google account for instant access to Gemini models. No API key needed.</p>
|
||||
<span class="badge badge-easy">Easiest — zero config</span>
|
||||
</div>
|
||||
<div class="choice-card" id="choiceProvider" onclick="chooseProvider()">
|
||||
<div class="icon">🔌</div>
|
||||
<h3>Another AI Provider</h3>
|
||||
<p>Use OpenAI, Anthropic, DeepSeek, Ollama, or 15+ other providers with your own API key.</p>
|
||||
<span class="badge badge-power">Power users</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
Provider settings are always available via <strong>Menu → AI Provider Settings</strong> or the <strong>tray icon</strong>.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const { ipcRenderer } = require('electron');
|
||||
|
||||
// Create particles
|
||||
(function() {
|
||||
const container = document.getElementById('particles');
|
||||
for (let i = 0; i < 30; i++) {
|
||||
const p = document.createElement('div');
|
||||
p.className = 'particle';
|
||||
p.style.left = Math.random() * 100 + '%';
|
||||
p.style.animationDuration = (8 + Math.random() * 12) + 's';
|
||||
p.style.animationDelay = Math.random() * 10 + 's';
|
||||
p.style.width = p.style.height = (1 + Math.random() * 3) + 'px';
|
||||
container.appendChild(p);
|
||||
}
|
||||
})();
|
||||
|
||||
function chooseGoogle() {
|
||||
document.getElementById('choiceGoogle').style.borderColor = '#e94560';
|
||||
document.getElementById('choiceGoogle').style.background = 'rgba(233,69,96,0.1)';
|
||||
ipcRenderer.send('welcome:choice', { provider: 'google_gemini' });
|
||||
}
|
||||
|
||||
function chooseProvider() {
|
||||
document.getElementById('choiceProvider').style.borderColor = '#ffa726';
|
||||
document.getElementById('choiceProvider').style.background = 'rgba(255,167,38,0.1)';
|
||||
ipcRenderer.send('welcome:choice', { provider: 'custom' });
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user