Files
landing/templates/index.html
2026-05-17 21:18:09 -05:00

417 lines
15 KiB
HTML

{{define "title"}}RideAware - Smart Cycling Training Platform{{end}}
{{define "content"}}
<!-- Hero Section -->
<section class="hero">
<div class="hero-container">
<div class="hero-content">
<h1>Elevate Your Cycling Journey</h1>
<p class="subtitle">
The ultimate smart training platform for cyclists who demand
excellence in every ride.
</p>
<div class="cta-section">
<div class="beta-badge">
<span class="badge-icon"></span>
<span class="badge-text">Development Build Available</span>
</div>
<h3>Join Our Newsletter</h3>
<p>Get updates on new features and development progress</p>
<div class="email-form">
<input
type="email"
class="email-input"
id="email-input"
placeholder="Enter your email address"
required
/>
<button class="notify-btn" id="notify-button">Subscribe</button>
</div>
<div class="beta-notice">
<p>
<strong>Note:</strong> This is an early development build. Not all features are fully functional yet.
Your feedback helps us build better! 🚀
</p>
</div>
</div>
</div>
<div class="hero-visual">
<div class="phone-mockup">
<div class="screen">
<div class="app-interface">
<div class="app-brand">
<img
src="/static/assets/32x32.png"
alt="RideAware icon"
class="app-brand-icon"
width="32"
height="32"
decoding="async"
/>
<div class="app-logo">RideAware</div>
</div>
<div class="stats-grid">
<div class="stat-card">
<div class="stat-number">24.5</div>
<div class="stat-label">KM/H AVG</div>
</div>
<div class="stat-card">
<div class="stat-number">45</div>
<div class="stat-label">MINUTES</div>
</div>
<div class="stat-card">
<div class="stat-number">285</div>
<div class="stat-label">CALORIES</div>
</div>
<div class="stat-card">
<div class="stat-number">18.2</div>
<div class="stat-label">DISTANCE</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Features Section -->
{{if .IsHome}}
<section class="features" id="features">
<div class="features-container">
<div class="section-header">
<h2>Powerful Features for Every Cyclist</h2>
<p>
From beginners to professionals, RideAware provides comprehensive
tools to optimize your training and performance.
</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-calendar-alt"></i>
</div>
<h3>Smart Training Plans</h3>
<ul class="feature-list">
<li>
<strong>AI-Powered Planning:</strong> Customized training plans
based on your goals and fitness level
</li>
<li>
<strong>Adaptive Scheduling:</strong> Smart workout scheduling
with automated reminders
</li>
<li>
<strong>Goal Tracking:</strong> Set and monitor your cycling
objectives in real-time
</li>
</ul>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-chart-line"></i>
</div>
<h3>Advanced Analytics</h3>
<ul class="feature-list">
<li>
<strong>Detailed Logging:</strong> Track exercises, sets, reps,
and performance metrics
</li>
<li>
<strong>Data Visualization:</strong> Interactive charts, graphs,
and progress statistics
</li>
<li>
<strong>Progress Insights:</strong> Monitor your improvement
over time with AI analysis
</li>
</ul>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-bicycle"></i>
</div>
<h3>Virtual Training</h3>
<ul class="feature-list">
<li>
<strong>Expert Coaching:</strong> Professional guidance to
achieve your cycling goals
</li>
<li>
<strong>Immersive Rides:</strong> Virtual training experiences
to boost performance
</li>
<li>
<strong>Structured Workouts:</strong> Designed programs for
fitness and performance gains
</li>
</ul>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-heart"></i>
</div>
<h3>Health & Recovery</h3>
<ul class="feature-list">
<li>
<strong>Nutrition Tracking:</strong> Plan and monitor your
dietary intake for optimal performance
</li>
<li>
<strong>Recovery Optimization:</strong> Tools and resources for
effective rest and recovery
</li>
<li>
<strong>Injury Prevention:</strong> Proactive measures to
prevent and manage injuries
</li>
</ul>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-users"></i>
</div>
<h3>Community & Social</h3>
<ul class="feature-list">
<li>
<strong>Social Sharing:</strong> Share achievements and progress
on social platforms
</li>
<li>
<strong>Active Community:</strong> Connect with fellow cyclists
and share experiences
</li>
<li>
<strong>Competitive Leaderboards:</strong> Challenge yourself
against the community
</li>
</ul>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-sync-alt"></i>
</div>
<h3>Smart Integration</h3>
<ul class="feature-list">
<li>
<strong>Wearable Sync:</strong> Connect with fitness trackers
and smart devices
</li>
<li>
<strong>Music Integration:</strong> Seamlessly sync with your
favorite music services
</li>
<li>
<strong>Data Portability:</strong> Easy import/export to other
cycling platforms
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Roadmap Section -->
<section class="development-status" id="roadmap">
<div class="status-container">
<div class="section-header">
<div class="section-label">
<span class="pulse-dot"></span>
Development Roadmap
</div>
<h2>Current Development Status</h2>
<p class="status-intro">
RideAware is actively being built. This development build lets you experience the platform early
and help us refine it. Here's where we stand across all feature areas.
</p>
</div>
<div class="status-grid">
<!-- PHASE 1: Authentication & User Management ✅ -->
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>User Authentication</h4>
<p>Signup, login, JWT tokens, password recovery, user profiles with bio, zones, FTP & weight</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Equipment Management</h4>
<p>Bike/gear CRUD, auto mileage tracking, service intervals & reminders</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Training Zones</h4>
<p>7-zone power model (Recovery → Neuromuscular) with color-coded visualization</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Workout Planning & Builder</h4>
<p>Structured interval builder (warmup/main/cooldown), %FTP targets, cadence, repeats, live chart preview</p>
</div>
<!-- PHASE 2: Templates & Export ✅ -->
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Workout Templates Library</h4>
<p>11 built-in templates (Recovery → Ramp Test) with category browsing & instant scheduling</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Workout Export</h4>
<p>Export to .zwo (Zwift) and FIT (Garmin-compatible) formats</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Activity Import</h4>
<p>Import FIT/TCX/GPX files with metric extraction (power, HR, cadence, elevation)</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Device Integrations</h4>
<p>Garmin Connect (OAuth2 PKCE), Wahoo Cloud API, Intervals.icu — push workouts & sync activities</p>
</div>
<!-- PHASE 3: Analytics & Goals ✅ -->
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Performance Analytics</h4>
<p>Summary, weekly, monthly stats, personal bests, TSS/IF calculation, training load (CTL/ATL/TSB)</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Goal Setting & Tracking</h4>
<p>SMART goals (distance, frequency, power, weight, custom) with real-time progress tracking</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Race/Event Planner</h4>
<p>Target events with taper builder, distance, priority, and gear checklist</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Nutrition Planning</h4>
<p>BMR/TDEE calculation, macro targets, weekly meal planning with workout calorie adjustment</p>
</div>
<!-- PHASE 4: AI & Advanced ✅ -->
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>AI-Powered Training Plans</h4>
<p>DeepSeek integration generates personalized plans based on goals, fitness level, events & nutrition context</p>
</div>
<div class="status-item ready">
<span class="status-badge">✓ Live</span>
<h4>Workout Library</h4>
<p>Browse, search, filter workouts; favorites, star ratings, custom workout creation</p>
</div>
<div class="status-item in-progress">
<span class="status-badge">🔨 In Progress</span>
<h4>OAuth Login</h4>
<p>Google & Apple sign-in — Garmin & Wahoo OAuth complete, Google/Apple/Strava pending</p>
</div>
<div class="status-item in-progress">
<span class="status-badge">🔨 In Progress</span>
<h4>Tags & Notes System</h4>
<p>RPE & Notes fields implemented; mood, conditions, injuries & tag system pending</p>
</div>
<!-- PLANNED -->
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Platform Sync</h4>
<p>Strava activity sync, TrainingPeaks calendar sync, COROS / Apple Health / Google Fit</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Coaching & Athlete Management</h4>
<p>Coach portal, athlete assignments, plan reviews, messaging & comments</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Virtual Training</h4>
<p>Zwift/Rouvy/RGT integration, video routes, real-time ride simulation</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Community & Social</h4>
<p>Social sharing, community forum, leaderboards, clubs/groups, challenges & streaks</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Gamification</h4>
<p>Achievements, badges, milestones, rewards store, partner discounts</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Notifications</h4>
<p>Email/push/SMS reminders, weekly digests, real-time overtraining & weather alerts</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Mobile & PWA</h4>
<p>Offline mode, native app shell, background sync, wearable bridge</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Admin & Billing</h4>
<p>Admin console, Stripe subscriptions (Free/Pro/Coach), feature flags, audit logs</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Content Library</h4>
<p>Exercise library (strength/mobility), knowledge base, route library with GPX planner</p>
</div>
<div class="status-item planned">
<span class="status-badge">📋 Planned</span>
<h4>Accessibility & i18n</h4>
<p>WCAG 2.2 AA compliance, localization framework, imperial/metric units, color-blind safe palettes</p>
</div>
</div>
<div class="feedback-cta">
<h3>Ready to Try RideAware?</h3>
<p>
Access the development build and start testing RideAware today. Your feedback helps us build the ultimate cycling training platform.
</p>
<a href="https://dev.rideaware.org" class="action-btn primary" target="_blank">
<i class="fas fa-rocket"></i>
Access Development Build
</a>
</div>
</div>
</section>
{{end}}
{{end}}