File size: 3,957 Bytes
46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 ade9c99 46c31f6 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>SentimentScope • Cosmic AI Analyzer 🚀</title>
<!-- Plotly -->
<link rel="preconnect" href="https://cdn.plot.ly" />
<script src="https://cdn.plot.ly/plotly-2.32.0.min.js" defer></script>
<!-- CSS -->
<link rel="stylesheet" href="/static/style.css" />
</head>
<body>
<!-- Background layers -->
<div class="bg-gradient"></div>
<div class="stars"></div>
<div class="nebula"></div>
<div class="planets">
<div class="planet p1"></div>
<div class="planet p2"></div>
<div class="planet p3"></div>
</div>
<div class="shooting-stars"></div>
<div id="parallax-cursor"></div>
<!-- HEADER -->
<header class="container fade-in-up">
<h1 class="logo neon-glow">Sentiment<span>Scope</span></h1>
<p class="subtitle">✨ Generate posts with <span class="highlight">Gemini</span>, analyze them with Transformers, and watch insights come alive across the cosmos ✨</p>
</header>
<!-- MAIN -->
<main class="container">
<section class="card glass-card zoom-in">
<div class="card-head">
<div class="icon pulse">#</div>
<h2>Analyze a hashtag</h2>
</div>
<!-- FORM -->
<form id="analyze-form" class="grid">
<div class="form-group float-up">
<label for="hashtag">Hashtag</label>
<input id="hashtag" type="text" placeholder="#gla" required />
</div>
<div class="form-group float-up">
<label for="count">Posts (max 50)</label>
<input id="count" type="number" min="1" max="50" value="20" />
</div>
<div class="form-group col-span">
<button class="btn cosmic-btn" type="submit">
<span class="btn-glow"></span>
<span class="btn-label">🚀 Generate & Analyze</span>
</button>
</div>
</form>
<!-- STATUS LOADER -->
<div id="status" class="status hidden fade-in">
<div class="spinner"></div>
<p>🌌 Summoning Gemini and crunching cosmic sentiments<span class="dots"></span></p>
</div>
<!-- META DATA -->
<div id="meta" class="meta hidden slide-in">
<div class="meta-item">
<div class="meta-label">Hashtag</div>
<div class="meta-value cosmic-text" id="m-hashtag">—</div>
</div>
<div class="meta-item">
<div class="meta-label">Generated by</div>
<div class="meta-value">
<span id="m-gemini" class="chip chip-gemini glow">Gemini: 0</span>
<span id="m-fallback" class="chip chip-fallback glow">Fallback: 0</span>
</div>
</div>
<div class="meta-item">
<div class="meta-label">Models</div>
<div class="meta-value cosmic-text" id="m-models">—</div>
</div>
</div>
<!-- CHARTS -->
<div class="charts">
<div class="chart-card holo-card">
<h3>🌠 Sentiment Distribution</h3>
<div id="pie" class="chart-animate"></div>
</div>
<div class="chart-card holo-card">
<h3>🌌 Rolling Mood</h3>
<div id="line" class="chart-animate"></div>
</div>
</div>
<!-- TABLE -->
<div class="table-card holo-card">
<div class="table-head">
<h3>📜 Posts</h3>
<div class="legend">
<span class="chip chip-gemini">Gemini</span>
<span class="chip chip-fallback">Fallback</span>
</div>
</div>
<div id="table" class="table fade-in-up"></div>
</div>
</section>
</main>
<!-- FOOTER -->
<footer class="footer">
<p class="signature">Made with <span class="heart pulse">💜</span> by <span class="kavya neon-glow">Kavya</span></p>
</footer>
<!-- JS -->
<script src="/static/script.js" defer></script>
</body>
</html>
|