this repo has no description
feat: remove a bunch of stats and simplify
+4
-170
+2
-105
public/app.js
+2
-105
public/app.js
···
14
14
frontPageCount: 0,
15
15
avgPeakPoints: 0,
16
16
totalCount: 0,
17
+
timestamp: 0,
17
18
};
18
19
19
20
// Performance metrics elements
···
25
26
const avgFrontpageTimeEl = document.getElementById("avg-frontpage-time");
26
27
let totalStoriesCount = 0; // Track total stories count
27
28
28
-
// Verified user analytics elements
29
-
const verifiedUserCountEl = document.getElementById("verified-user-count");
30
-
const verifiedSuccessRateEl = document.getElementById(
31
-
"verified-success-rate",
32
-
);
33
-
const verifiedTopAuthorEl = document.getElementById("verified-top-author");
34
-
const verifiedAvgPointsEl = document.getElementById("verified-avg-points");
35
-
36
-
// Initialize performance stats
29
+
// Initialize stats
37
30
updatePerformanceMetrics([]);
38
-
updateVerifiedUserAnalytics([]);
39
31
40
32
// For calculating durations
41
33
const now = Date.now();
···
123
115
.then((response) => response.json())
124
116
.then((data) => {
125
117
verifiedUserStats = data;
126
-
updateTopRowStats();
127
118
})
128
119
.catch((error) => {
129
120
console.error("Error fetching verified user stats:", error);
···
165
156
166
157
// Update UI with filtered stories
167
158
displayStories(filteredStories);
168
-
updateStats(filteredStories);
169
159
updatePerformanceMetrics(allStories); // Always use all stories for this analysis
170
-
updateVerifiedUserAnalytics(allStories); // Update verified user analytics
171
-
updateTopRowStats(); // Make sure top row always shows verified user stats
172
160
}
173
161
174
162
// Display stories in the UI
···
399
387
});
400
388
}
401
389
402
-
// Update statistics
403
-
// Update top row stats based on verified user data
404
-
function updateTopRowStats() {
405
-
// Update the top row with verified user stats with staggered animation
406
-
totalAlertsEl.textContent = verifiedUserStats.frontPageCount || "0";
407
-
totalAlertsEl.style.animationDelay = "0s";
408
-
409
-
avgPeakPointsEl.textContent = verifiedUserStats.avgPeakPoints || "0";
410
-
avgPeakPointsEl.style.animationDelay = "0.1s";
411
-
412
-
verifiedCountEl.textContent = verifiedUserStats.totalCount || "0";
413
-
verifiedCountEl.style.animationDelay = "0.2s";
414
-
}
415
-
416
-
function updateStats(stories) {
417
-
if (!stories || stories.length === 0) {
418
-
return;
419
-
}
420
-
421
-
// Don't update the top row stats here anymore
422
-
// They're now populated from the verified-users API
423
-
}
424
-
425
390
// Update performance metrics
426
391
function updatePerformanceMetrics(stories) {
427
392
if (!stories || stories.length === 0) {
···
484
449
}
485
450
}
486
451
487
-
// Update verified user analytics
488
-
function updateVerifiedUserAnalytics(stories) {
489
-
if (!stories || stories.length === 0) {
490
-
verifiedUserCountEl.textContent = "0";
491
-
verifiedSuccessRateEl.textContent = "0%";
492
-
verifiedTopAuthorEl.textContent = "None";
493
-
verifiedAvgPointsEl.textContent = "0";
494
-
return;
495
-
}
496
-
497
-
// Get verified user stories
498
-
const verifiedStories = stories.filter(
499
-
(story) => story.isFromMonitoredUser,
500
-
);
501
-
502
-
if (verifiedStories.length === 0) {
503
-
verifiedUserCountEl.textContent = "0";
504
-
verifiedSuccessRateEl.textContent = "0%";
505
-
verifiedTopAuthorEl.textContent = "None";
506
-
verifiedAvgPointsEl.textContent = "0";
507
-
return;
508
-
}
509
-
510
-
// Count unique verified users
511
-
const uniqueVerifiedUsers = new Set(
512
-
verifiedStories.map((story) => story.by),
513
-
);
514
-
verifiedUserCountEl.textContent = uniqueVerifiedUsers.size;
515
-
516
-
// Calculate success rate (% of verified users' stories that reached top 10)
517
-
const topTenVerifiedStories = verifiedStories.filter(
518
-
(story) => story.peakRank <= 10,
519
-
);
520
-
const successRate = Math.round(
521
-
(topTenVerifiedStories.length / verifiedStories.length) * 100,
522
-
);
523
-
verifiedSuccessRateEl.textContent = `${successRate}%`;
524
-
525
-
// Find top verified author (with most stories)
526
-
const authorCounts = {};
527
-
for (const story of verifiedStories) {
528
-
authorCounts[story.by] = (authorCounts[story.by] || 0) + 1;
529
-
}
530
-
531
-
let topAuthor = "None";
532
-
let maxStories = 0;
533
-
534
-
for (const [author, count] of Object.entries(authorCounts)) {
535
-
if (count > maxStories) {
536
-
maxStories = count;
537
-
topAuthor = author;
538
-
}
539
-
}
540
-
541
-
verifiedTopAuthorEl.textContent = topAuthor;
542
-
543
-
// Calculate average peak points for verified users
544
-
const totalPeakPoints = verifiedStories.reduce(
545
-
(sum, s) => sum + (s.peakPoints || s.points),
546
-
0,
547
-
);
548
-
const avgPeakPoints = Math.round(totalPeakPoints / verifiedStories.length);
549
-
verifiedAvgPointsEl.textContent = avgPeakPoints;
550
-
}
551
-
552
452
// Event listeners
553
453
// Add event listeners
554
454
refreshButton.addEventListener("click", fetchStories);
···
601
501
}
602
502
`;
603
503
document.head.appendChild(style);
604
-
605
-
// Set initial placeholder values
606
-
updateTopRowStats();
607
504
608
505
// Initial data fetch
609
506
fetchStories();
+2
-65
public/index.html
+2
-65
public/index.html
···
57
57
display: flex;
58
58
align-items: center;
59
59
justify-content: space-between;
60
-
margin-bottom: 2rem;
61
60
}
62
61
63
62
.header img {
···
448
447
}
449
448
450
449
.performance-summary {
451
-
margin: 2rem 0;
452
-
}
453
-
454
-
.performance-summary h2 {
455
-
margin-bottom: 1.5rem;
456
-
border-bottom: 2px solid var(--hn-orange);
457
-
padding-bottom: 0.8rem;
458
-
font-size: 1.6rem;
459
-
letter-spacing: 0.02em;
460
-
position: relative;
450
+
margin-bottom: 2rem;
461
451
}
462
452
463
453
.section-icon {
···
653
643
/>
654
644
</div>
655
645
656
-
<div class="stats">
657
-
<div class="stat-card">
658
-
<div class="stat-icon">🏆</div>
659
-
<div class="stat-number" id="total-alerts">-</div>
660
-
<div class="stat-label">Verified FP Stories</div>
661
-
</div>
662
-
<div class="stat-card">
663
-
<div class="stat-icon">⭐</div>
664
-
<div class="stat-number" id="avg-peak-points">-</div>
665
-
<div class="stat-label">Verified Avg Points</div>
666
-
</div>
667
-
<div class="stat-card">
668
-
<div class="stat-icon">📈</div>
669
-
<div class="stat-number" id="verified-count">-</div>
670
-
<div class="stat-label">Total Verified Stories</div>
671
-
</div>
672
-
</div>
673
-
674
646
<div class="performance-summary">
675
-
<h2><span class="section-icon">📊</span> Performance Dashboard</h2>
676
647
<div class="performance-metrics-container">
677
648
<div class="performance-metric" style="--i: 1">
678
649
<div class="metric-label">Total Stories</div>
···
701
672
</div>
702
673
</div>
703
674
704
-
<div class="performance-summary">
705
-
<h2>
706
-
<span class="section-icon">🔍</span> Verified User Analytics
707
-
</h2>
708
-
<div class="performance-metrics-container">
709
-
<div class="performance-metric" style="--i: 1">
710
-
<div class="metric-label">Verified Users</div>
711
-
<div class="metric-value" id="verified-user-count">-</div>
712
-
<div class="metric-description">
713
-
Unique verified authors
714
-
</div>
715
-
</div>
716
-
<div class="performance-metric" style="--i: 2">
717
-
<div class="metric-label">Success Rate</div>
718
-
<div class="metric-value" id="verified-success-rate">-</div>
719
-
<div class="metric-description">% reaching top 10</div>
720
-
</div>
721
-
<div class="performance-metric" style="--i: 3">
722
-
<div class="metric-label">Top Performer</div>
723
-
<div class="metric-value" id="verified-top-author">-</div>
724
-
<div class="metric-description">
725
-
Most successful verified user
726
-
</div>
727
-
</div>
728
-
<div class="performance-metric" style="--i: 4">
729
-
<div class="metric-label">Average Peak Points</div>
730
-
<div class="metric-value" id="verified-avg-points">-</div>
731
-
<div class="metric-description">
732
-
For verified user stories
733
-
</div>
734
-
</div>
735
-
</div>
736
-
</div>
737
-
738
675
<div class="controls">
739
676
<button class="refresh-button" id="refresh-data">
740
677
Refresh Data
···
743
680
<label class="toggle-switch">
744
681
<input type="checkbox" id="verified-only-toggle" />
745
682
<span class="toggle-slider"></span>
746
-
<span class="toggle-label">Verified Users Only</span>
683
+
<span class="toggle-label">Tracked Users Only</span>
747
684
</label>
748
685
</div>
749
686
</div>