Skip to content

Navigation Menu

Sign in
Sign up

Repository files navigation

Hitter Protocol

A daily volleyball training app that runs entirely in the browser, works offline, and installs to your home screen like a native app. One routine, every day. The routine never changes, only the dial does.

Built with vanilla JavaScript, HTML, and CSS. No framework, no build step, no dependencies.

What it does

Hitter Protocol guides a volleyball hitter through a full daily session: warm-up, strength, jump power, conditioning, and cooldown. The design rejects rest days in favor of a "Dial": if you are sick or exhausted, you run the same routine at half the reps and half the jump effort, rather than skipping. Showing up is what the streak measures.

  • Pre-flight check gates each session with four honest questions (illness, pain, sleep, fuel) and recommends the Dial when something is off.
  • A dynamic routine engine builds the full session, halving every rep and interval when the Dial is on.
  • A guided run screen walks through each step with countdown rings, interval timers, audio cues, and haptic feedback.
  • Streak tracking with a correct calendar model (a streak stays alive one day, then resets), plus best-streak and total-session counters.
  • Sleep advisory on the home screen showing ideal wake times for 7, 8, and 9 hours from now.

Technical highlights

This is a Progressive Web App built to feel like a real installed application, not a web page.

  • Offline-first service worker. Core files are precached on install; Google Fonts use a separate runtime cache. Navigations fall back to the cached shell, so the app opens with no network.
  • Installable PWA. Web app manifest with maskable icons, standalone display, and iOS-specific meta tags. Once added to the home screen it launches full-screen with no browser chrome.
  • Screen Wake Lock. The screen stays awake during a session and re-acquires the lock when the app returns to the foreground.
  • Web Audio cues. Work, rest, and completion tones are synthesized with the Web Audio API rather than shipped as audio files, keeping the app tiny.
  • Haptics. Vibration patterns mark transitions on supported devices.
  • Local persistence with backup. Progress is stored in localStorage and can be exported and re-imported as plain text, so data survives a reinstall.
  • Built for real phones. Safe-area insets handle the iPhone notch, and a reduced-motion media query respects accessibility preferences.

Running it

No installation or build is required.

  1. Serve the folder over HTTP (a service worker needs a real origin, not the file:// scheme). Any static server works:

    npx serve .
    
  2. Open the printed URL in a browser.

  3. On a phone, use the browser's "Add to Home Screen" option to install it. Open it from the icon for the full offline app.

Files

File Role
index.html Markup and all styles
app.js Routine engine, timers, streak logic, PWA wiring
sw.js Service worker (offline caching)
manifest.webmanifest Install metadata
icon-*.png App and maskable icons

The three laws

  • Reserve. End every set able to do two more reps.
  • Quiet. Jumps count only if the landing is silent.
  • Dial. Sick or wrecked? Same routine, half the reps.

About

Hitter Protocol: offline-first installable PWA for daily volleyball hitting practice. Service worker caching, Web Audio cues, Wake Lock, streak tracking. No framework.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

AltStyle によって変換されたページ (->オリジナル) /