Skip to content

Commit 3813d94

Browse files
matte1782claude
andcommitted
feat(w49): Day 1 — Demo Hub v0.9.0 overhaul + W49 planning
- D1T1: Entity-RAG featured card + AI/RAG category section - D1T2: Filter Playground demoted to Core Features grid (3-col) - D1T3: Version bump v0.9.0, WCAG viewport fix, SIMD NEW badge removed - D1T4: 4th hero stat (8B PQ experimental) - D1T5: Responsive verified at 375px/768px/1024px/1440px - fix: GSAP animation bug — results #5-#10 invisible (gsap.from → gsap.fromTo) - Hostile review: R1 CONDITIONAL GO → all 4 findings fixed (M1 h2→h3, m1 LATEST badge, m2-m3 SVG fill) - W49 planning: WEEKLY_TASK_PLAN.md [APPROVED], planner prompt, mandatory addons Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent e685f06 commit 3813d94

5 files changed

Lines changed: 866 additions & 50 deletions

File tree

docs/demo/entity-rag/index.html

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1382,9 +1382,10 @@ <h1 class="hero__title glitch neon-pulse" data-text="ENTITY_RAG_INTERFACE">ENTIT
13821382

13831383
// Results cascade animation
13841384
if (!prefersReducedMotion && typeof gsap !== 'undefined') {
1385-
gsap.from('.result-card', {
1386-
opacity: 0, y: 30, duration: 0.35, stagger: 0.06, ease: 'power2.out'
1387-
});
1385+
gsap.fromTo('.result-card',
1386+
{ opacity: 0, y: 30 },
1387+
{ opacity: 1, y: 0, duration: 0.35, stagger: 0.06, ease: 'power2.out', clearProps: 'opacity,transform' }
1388+
);
13881389
}
13891390

13901391
} catch (err) {

docs/demo/hub.html

Lines changed: 95 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html lang="en" data-theme="dark">
33
<head>
44
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<meta name="description" content="EdgeVec Demo Hub - Interactive demos for the WASM-native vector database">
77
<title>EdgeVec // Demo Hub</title>
88
<link rel="icon" type="image/svg+xml" href="favicon.svg">
@@ -334,6 +334,11 @@
334334
color: #000;
335335
}
336336

337+
.card__badge--latest {
338+
background: linear-gradient(135deg, var(--cyan), var(--cyan-dim));
339+
color: #000;
340+
}
341+
337342
.card__badge--featured {
338343
background: linear-gradient(135deg, var(--magenta), var(--purple));
339344
color: #fff;
@@ -473,6 +478,7 @@
473478
/* Responsive */
474479
@media (min-width: 600px) {
475480
.grid--2 { grid-template-columns: repeat(2, 1fr); }
481+
.grid--3 { grid-template-columns: repeat(3, 1fr); }
476482
.card { padding: 24px; }
477483
.card--featured { padding: 32px; }
478484
.hero { padding: 140px 24px 80px; }
@@ -487,12 +493,21 @@
487493
@media (max-width: 599px) {
488494
.header__nav { display: none; }
489495
}
496+
497+
@media (prefers-reduced-motion: reduce) {
498+
*, *::before, *::after {
499+
animation-duration: 0.01ms !important;
500+
animation-iteration-count: 1 !important;
501+
transition-duration: 0.01ms !important;
502+
}
503+
#matrix { display: none; }
504+
}
490505
</style>
491506
</head>
492507
<body>
493508
<!-- Matrix Rain Canvas -->
494-
<canvas id="matrix"></canvas>
495-
<div class="gradient-overlay"></div>
509+
<canvas id="matrix" aria-hidden="true"></canvas>
510+
<div class="gradient-overlay" aria-hidden="true"></div>
496511

497512
<!-- Header -->
498513
<header class="header">
@@ -501,23 +516,23 @@
501516
<span class="header__brand">EDGEVEC</span>
502517
<span class="header__tag">DEMO HUB</span>
503518
</div>
504-
<nav class="header__nav">
505-
<a href="https://github.com/matte1782/edgevec" class="header__link" target="_blank">GITHUB</a>
506-
<a href="https://www.npmjs.com/package/edgevec" class="header__link" target="_blank">NPM</a>
507-
<a href="https://crates.io/crates/edgevec" class="header__link" target="_blank">CRATES.IO</a>
519+
<nav class="header__nav" aria-label="External links">
520+
<a href="https://github.com/matte1782/edgevec" class="header__link" target="_blank" rel="noopener">GITHUB</a>
521+
<a href="https://www.npmjs.com/package/edgevec" class="header__link" target="_blank" rel="noopener">NPM</a>
522+
<a href="https://crates.io/crates/edgevec" class="header__link" target="_blank" rel="noopener">CRATES.IO</a>
508523
</nav>
509524
</div>
510525
</header>
511526

512527
<!-- Hero -->
513528
<section class="hero">
514529
<p class="hero__eyebrow">
515-
<span class="hero__dot"></span>
530+
<span class="hero__dot" aria-hidden="true"></span>
516531
WASM-NATIVE VECTOR DATABASE
517532
</p>
518533
<h1 class="hero__title">DEMO_HUB</h1>
519534
<p class="hero__subtitle">
520-
Explore EdgeVec capabilities. From visual filter building to performance benchmarks.
535+
Explore EdgeVec capabilities. From entity-enhanced RAG to performance benchmarks — all running in-browser via WASM.
521536
</p>
522537
<div class="hero__stats">
523538
<div class="hero__stat">
@@ -532,30 +547,75 @@ <h1 class="hero__title">DEMO_HUB</h1>
532547
<div class="hero__stat-value">&lt;1ms</div>
533548
<div class="hero__stat-label">Latency</div>
534549
</div>
550+
<div class="hero__stat">
551+
<div class="hero__stat-value">8B</div>
552+
<div class="hero__stat-label">PQ (exp.)</div>
553+
</div>
535554
</div>
536555
</section>
537556

538557
<!-- Main -->
539558
<main class="main">
540559

541-
<!-- Featured -->
542-
<div class="category">
560+
<!-- AI / RAG -->
561+
<section class="category">
562+
<div class="category__header">
563+
<div class="category__icon" aria-hidden="true">
564+
<svg viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="3"/><circle cx="5" cy="5" r="1.5"/><circle cx="19" cy="5" r="1.5"/><circle cx="5" cy="19" r="1.5"/><circle cx="19" cy="19" r="1.5"/><path d="M9.5 9.5L6.5 6.5M14.5 9.5l3-3M9.5 14.5l-3 3M14.5 14.5l3 3"/></svg>
565+
</div>
566+
<h2 class="category__title">AI / RAG</h2>
567+
</div>
543568
<div class="grid">
544-
<a href="index.html" class="card card--featured">
569+
<a href="entity-rag/index.html" class="card card--featured">
545570
<div class="card__header">
546571
<div class="card__badges">
547-
<span class="card__badge card__badge--version">v0.7.0</span>
548-
<span class="card__badge card__badge--new">LATEST</span>
572+
<span class="card__badge card__badge--version">v0.9.0</span>
573+
<span class="card__badge card__badge--latest">LATEST</span>
574+
<span class="card__badge card__badge--new">NEW</span>
549575
<span class="card__badge card__badge--featured">FEATURED</span>
550576
</div>
551577
<div class="card__arrow">
552-
<svg viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
578+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
553579
</div>
554580
</div>
555-
<div class="card__icon">
581+
<div class="card__icon" aria-hidden="true">
582+
<svg viewBox="0 0 24 24" fill="none"><circle cx="12" cy="5" r="2.5"/><circle cx="5" cy="19" r="2.5"/><circle cx="19" cy="19" r="2.5"/><circle cx="12" cy="12" r="1.5"/><path d="M12 7.5v3M10 13l-3.5 4.5M14 13l3.5 4.5"/></svg>
583+
</div>
584+
<h3 class="card__title">ENTITY_RAG</h3>
585+
<p class="card__desc">Entity-enhanced RAG running entirely in-browser. MetadataBoost search on 1000 SQuAD paragraphs with named entity recognition — zero API calls.</p>
586+
<p class="card__meta">March 2026 // MetadataBoost // WASM</p>
587+
<div class="card__features">
588+
<span class="card__feature">Entity NER</span>
589+
<span class="card__feature">MetadataBoost</span>
590+
<span class="card__feature">SQuAD Dataset</span>
591+
<span class="card__feature">Live WASM</span>
592+
</div>
593+
</a>
594+
</div>
595+
</section>
596+
597+
<!-- Core Features -->
598+
<section class="category">
599+
<div class="category__header">
600+
<div class="category__icon" aria-hidden="true">
601+
<svg viewBox="0 0 24 24"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>
602+
</div>
603+
<h2 class="category__title">Core Features</h2>
604+
</div>
605+
<div class="grid grid--3">
606+
<a href="index.html" class="card">
607+
<div class="card__header">
608+
<div class="card__badges">
609+
<span class="card__badge card__badge--version">v0.7.0</span>
610+
</div>
611+
<div class="card__arrow">
612+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
613+
</div>
614+
</div>
615+
<div class="card__icon" aria-hidden="true">
556616
<svg viewBox="0 0 24 24"><path d="M22 3H2l8 9.46V19l4 2v-8.54L22 3z"/></svg>
557617
</div>
558-
<h2 class="card__title">FILTER_PLAYGROUND</h2>
618+
<h3 class="card__title">FILTER_PLAYGROUND</h3>
559619
<p class="card__desc">Build SQL-like metadata queries visually. Test in real-time with WASM. Copy production-ready code.</p>
560620
<p class="card__meta">December 2024 // SIMD Acceleration</p>
561621
<div class="card__features">
@@ -565,31 +625,20 @@ <h2 class="card__title">FILTER_PLAYGROUND</h2>
565625
<span class="card__feature">Code Snippets</span>
566626
</div>
567627
</a>
568-
</div>
569-
</div>
570628

571-
<!-- Core Features -->
572-
<div class="category">
573-
<div class="category__header">
574-
<div class="category__icon">
575-
<svg viewBox="0 0 24 24"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>
576-
</div>
577-
<span class="category__title">Core Features</span>
578-
</div>
579-
<div class="grid grid--2">
580629
<a href="cyberpunk.html" class="card">
581630
<div class="card__header">
582631
<div class="card__badges">
583632
<span class="card__badge card__badge--version">v0.6.0</span>
584633
</div>
585634
<div class="card__arrow">
586-
<svg viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
635+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
587636
</div>
588637
</div>
589-
<div class="card__icon">
638+
<div class="card__icon" aria-hidden="true">
590639
<svg viewBox="0 0 24 24"><path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/></svg>
591640
</div>
592-
<h2 class="card__title">CYBERPUNK_DEMO</h2>
641+
<h3 class="card__title">CYBERPUNK_DEMO</h3>
593642
<p class="card__desc">Binary Quantization vs F32. Memory pressure. Performance benchmarks.</p>
594643
<p class="card__meta">Binary Quantization // 32x Memory</p>
595644
<div class="card__features">
@@ -605,13 +654,13 @@ <h2 class="card__title">CYBERPUNK_DEMO</h2>
605654
<span class="card__badge card__badge--version">v0.7.0</span>
606655
</div>
607656
<div class="card__arrow">
608-
<svg viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
657+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
609658
</div>
610659
</div>
611-
<div class="card__icon">
660+
<div class="card__icon" aria-hidden="true">
612661
<svg viewBox="0 0 24 24"><path d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
613662
</div>
614-
<h2 class="card__title">SOFT_DELETE</h2>
663+
<h3 class="card__title">SOFT_DELETE</h3>
615664
<p class="card__desc">O(1) delete with tombstones. Compaction.</p>
616665
<p class="card__meta">Tombstones // Compaction</p>
617666
<div class="card__features">
@@ -621,31 +670,30 @@ <h2 class="card__title">SOFT_DELETE</h2>
621670
</div>
622671
</a>
623672
</div>
624-
</div>
673+
</section>
625674

626675
<!-- Performance -->
627-
<div class="category">
676+
<section class="category">
628677
<div class="category__header">
629-
<div class="category__icon">
678+
<div class="category__icon" aria-hidden="true">
630679
<svg viewBox="0 0 24 24"><path d="M12 20V10M18 20V4M6 20v-4"/></svg>
631680
</div>
632-
<span class="category__title">Performance</span>
681+
<h2 class="category__title">Performance</h2>
633682
</div>
634683
<div class="grid grid--2">
635684
<a href="simd_benchmark.html" class="card">
636685
<div class="card__header">
637686
<div class="card__badges">
638687
<span class="card__badge card__badge--version">v0.7.0</span>
639-
<span class="card__badge card__badge--new">NEW</span>
640688
</div>
641689
<div class="card__arrow">
642-
<svg viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
690+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
643691
</div>
644692
</div>
645-
<div class="card__icon">
693+
<div class="card__icon" aria-hidden="true">
646694
<svg viewBox="0 0 24 24"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg>
647695
</div>
648-
<h2 class="card__title">SIMD_BENCHMARK</h2>
696+
<h3 class="card__title">SIMD_BENCHMARK</h3>
649697
<p class="card__desc">Measure WASM SIMD128 acceleration. Includes @jsonMartin's 8.75x faster Hamming distance.</p>
650698
<p class="card__meta">SIMD128 // 2x+ Speedup // Contribution</p>
651699
<div class="card__features">
@@ -661,13 +709,13 @@ <h2 class="card__title">SIMD_BENCHMARK</h2>
661709
<span class="card__badge card__badge--version">v0.7.0</span>
662710
</div>
663711
<div class="card__arrow">
664-
<svg viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
712+
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
665713
</div>
666714
</div>
667-
<div class="card__icon">
715+
<div class="card__icon" aria-hidden="true">
668716
<svg viewBox="0 0 24 24"><path d="M3 3v18h18M18.7 8l-5.1 5.2-2.8-2.7L7 14.3"/></svg>
669717
</div>
670-
<h2 class="card__title">BENCHMARK_DASHBOARD</h2>
718+
<h3 class="card__title">BENCHMARK_DASHBOARD</h3>
671719
<p class="card__desc">Insert, search, memory at scale.</p>
672720
<p class="card__meta">Scaling Analysis // Charts</p>
673721
<div class="card__features">
@@ -676,13 +724,13 @@ <h2 class="card__title">BENCHMARK_DASHBOARD</h2>
676724
</div>
677725
</a>
678726
</div>
679-
</div>
727+
</section>
680728

681729
</main>
682730

683731
<!-- Footer -->
684732
<footer class="footer">
685-
<div class="footer__brand">EDGEVEC v0.7.0</div>
733+
<div class="footer__brand">EDGEVEC v0.9.0</div>
686734
<div class="footer__links">
687735
<a href="https://github.com/matte1782/edgevec" class="footer__link">GitHub</a>
688736
<a href="https://www.npmjs.com/package/edgevec" class="footer__link">npm</a>
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
# W49 Mandatory Add-ons
2+
3+
## Status: [DRAFT]
4+
5+
These tasks are **mandatory carry-forward items** that MUST be completed in W49, in addition to whatever the weekly plan defines.
6+
7+
---
8+
9+
## M1: Demo Hub Update (P0 — Day 1)
10+
11+
### Context
12+
The Demo Hub (`docs/demo/hub.html`) has not been updated since **v0.7.0**. The current version is **v0.9.0**. Three full feature weeks (W46 PQ, W47 PQ Validation, W48 Growth/MetadataBoost) are missing from the hub.
13+
14+
**Live URL:** https://matte1782.github.io/edgevec/demo/hub.html
15+
16+
### Requirements
17+
18+
**Version Updates:**
19+
- [ ] All version badges: v0.7.0 -> v0.9.0
20+
- [ ] Footer brand: `EDGEVEC v0.7.0` -> `EDGEVEC v0.9.0`
21+
- [ ] Remove stale "NEW" badge from SIMD Benchmark card (shipped in v0.7.0, no longer new)
22+
23+
**New Featured Card: Entity-RAG Demo**
24+
- [ ] Add Entity-RAG demo as the new **FEATURED** card (replaces Filter Playground as top card)
25+
- [ ] Link: `entity-rag/index.html`
26+
- [ ] Version badge: v0.9.0
27+
- [ ] Badges: LATEST, NEW, FEATURED
28+
- [ ] Features: Entity NER, MetadataBoost, SQuAD Dataset, Live WASM
29+
- [ ] Description highlighting entity-enhanced RAG in the browser
30+
- [ ] Date: March 2026
31+
32+
**Demote Filter Playground:**
33+
- [ ] Move Filter Playground from featured section to Core Features grid
34+
- [ ] Remove LATEST/FEATURED badges, keep v0.7.0 version badge
35+
- [ ] Keep all existing content
36+
37+
**Hero Stats Update:**
38+
- [ ] Consider adding PQ compression stat (e.g., "12x PQ Compress" or "8B/vec PQ")
39+
- [ ] Verify existing stats still accurate (32x Memory, 2x+ SIMD, <1ms Latency)
40+
41+
**Optional — New Category: AI/RAG**
42+
- [ ] Consider adding an "AI / RAG" category section for Entity-RAG
43+
- [ ] Or place Entity-RAG in a renamed "Featured Demos" category
44+
45+
### Quality Constraints
46+
- **UI quality MUST match existing cyberpunk aesthetic** — same design language, animations, card styles
47+
- Consistent with Orbitron + JetBrains Mono font stack
48+
- Responsive: must look good on mobile (test at 375px width)
49+
- Matrix rain background, gradient overlay, hover effects — all preserved
50+
- Card hover animations (translateY, glow, top-line reveal) — maintained
51+
- New cards must have appropriate SVG icons matching the style
52+
53+
### Acceptance Criteria
54+
- [ ] Hub loads with no console errors
55+
- [ ] Entity-RAG card links correctly to `entity-rag/index.html`
56+
- [ ] All version references say v0.9.0
57+
- [ ] No "NEW" badge on anything older than v0.9.0
58+
- [ ] Mobile responsive (375px - 1200px+)
59+
- [ ] Visual consistency with existing cards (hostile reviewer will check)
60+
- [ ] Passes `/review docs/demo/hub.html`
61+
62+
### Estimated Effort
63+
4-6 hours (HTML/CSS only, no JS changes needed beyond existing matrix rain)

0 commit comments

Comments
 (0)