Wayfinder

May 17, 2026 · View on GitHub

Coverage Status

This is the next-generation OneBusAway web application, built on top of SvelteKit. It is designed to replace the onebusaway-enterprise-webapp project. This project is under active development!

Developing

npm install
cp .env.example .env
# edit .env with your editor of choice
npm run dev

.env File Keys

See .env.example for an example of the required keys and values.

Analytics

  • PUBLIC_ANALYTICS_PROVIDER - enum (optional): which backend to use. "none" (default — disabled), "plausible", or "umami".
  • PUBLIC_ANALYTICS_DOMAIN - string (optional): site identifier sent to the backend. For Plausible, this is the site domain registered in the account. For Umami, this is the literal hostname sent as payload.hostname.
  • PUBLIC_ANALYTICS_API_HOST - string (optional): upstream base URL (Plausible appends /api/event; Umami appends /api/send).
  • PUBLIC_ANALYTICS_WEBSITE_ID - string (optional): required at runtime when PUBLIC_ANALYTICS_PROVIDER="umami"; ignored otherwise.

Internationalization

  • PUBLIC_LANGUAGE_SWITCHER_ENABLED - string: (optional) Set to "false" to hide the language switcher in the navigation bar. Defaults to "true".
  • PUBLIC_LANGUAGE_SWITCHER_BUTTON_FORMAT - string: (optional) Format for displaying language in the top menu button. Options: "native" (default), "english", "native-english", "english-native", "code".
  • PUBLIC_LANGUAGE_SWITCHER_MENU_FORMAT - string: (optional) Format for displaying languages in the dropdown menu. Options: "native-english" (default), "native", "english", "english-native", "code".

Text and Images

  • PUBLIC_OBA_REGION_NAME - string: (required) displayed in the header.
  • PUBLIC_OBA_LOGO_URL - string: (required) The URL of your transit agency's logo.
  • OBA_LOGO_URL_DARK - string: (optional) The URL of your transit agency's logo for dark mode. Falls back to PUBLIC_OBA_LOGO_URL if not specified.
  • SHOW_REGION_NAME_IN_NAV_BAR - boolean: (optional) Set to "false" to hide the region name text in the navigation bar. Defaults to true.
  • PRIVATE_MANIFEST_ICON_192_URL - string: (optional) URL to the 192×192 Android manifest icon (used for Add to Home Screen). Defaults to /android-chrome-192x192.png if not specified.
  • PRIVATE_MANIFEST_ICON_512_URL - string: (optional) URL to the 512×512 Android manifest icon (used for Add to Home Screen). Defaults to /android-chrome-512x512.png if not specified.
  • PUBLIC_APPLE_TOUCH_ICON_URL - string: (optional) URL to the Apple touch icon used on iOS home screens. Defaults to /apple-touch-icon.png if not specified.
  • PUBLIC_FAVICON_URL - string: (optional) URL to the browser tab favicon. Defaults to /favicon.png if not specified.
  • PUBLIC_NAV_BAR_LINKS - JSON string: (required) A dictionary of the links displayed across the navigation bar.

Colors

Customize the application's color scheme via environment variables:

  • COLOR_BRAND_PRIMARY - string: (optional) Primary brand color for nav bar and buttons. Default: "#78aa36".
  • COLOR_BRAND_PRIMARY_FOREGROUND - string: (optional) Text color on brand-colored surfaces. Default: "#ffffff".
  • COLOR_BRAND_ACCENT - string: (optional) Accent color for links, selected states, focus rings. Default: "#486621".
  • COLOR_SURFACE - string: (optional) Background color for panels and surfaces. Default: "#ffffff".
  • COLOR_SURFACE_FOREGROUND - string: (optional) Text color on surfaces. Default: "#000000".

Note: Color variables (COLOR_*) are processed at build time by Tailwind CSS. After changing any color values, you must rebuild the application (npm run build) for changes to take effect.

Generated Primary Palette

A full 10-shade color palette is automatically generated from COLOR_BRAND_ACCENT for use with Flowbite components:

ShadeDescription
primary-50Very light (95% white)
primary-100Light (90% white)
primary-200Light (75% white)
primary-300Light-medium (60% white)
primary-400Slightly lighter than base (30% white)
primary-500Base color (equals COLOR_BRAND_ACCENT)
primary-600Slightly darker (15% black)
primary-700Medium-dark (30% black)
primary-800Dark (45% black)
primary-900Very dark (60% black)

Use these in Tailwind classes: bg-primary-500, text-primary-700, border-primary-300, etc.

Calendar Configuration

  • PUBLIC_CALENDAR_FIRST_DAY_OF_WEEK - number: (optional) Sets the first day of the week for calendar components. Use 0 for Monday, 1 for Tuesday, 2 for Wednesday, 3 for Thursday, 4 for Friday, 5 for Saturday, 6 for Sunday. Defaults to 0 (Monday).

OBA Server

  • PUBLIC_OBA_SERVER_URL - string: (required) Your OBA API server's URL.
  • PUBLIC_OBA_REGION_CENTER_LAT - float: (required) The region's center latitude.
  • PUBLIC_OBA_REGION_CENTER_LNG - float: (required) The region's center longitude.
  • PRIVATE_OBA_API_KEY - string: (required) Your OneBusAway REST API server key.
  • PRIVATE_OBACO_API_BASE_URL - string: (optional) Your OneBusAway.co server base URL, including the path prefix `/api/v1.
  • PRIVATE_REGION_ID - string: (required if OBACO_API_BASE_URL provided).
  • PRIVATE_OBACO_SHOW_TEST_ALERTS - boolean: (optional) Show test alerts on the website. Don't set this value in production.
  • PRIVATE_OBA_AGENCY_FILTER - string: (optional) Comma-separated agency IDs to restrict this instance to a subset of agencies. Leave empty to show all agencies (default). Affects search results, stop listings, arrivals, schedules, and alerts.

Maps

  • PUBLIC_OBA_GOOGLE_MAPS_API_KEY - string: (optional) Your Google API key.
  • PUBLIC_OBA_MAP_PROVIDER - string: Use "osm" for OpenStreetMap or "google" for Google Maps.

Geocoding

  • PRIVATE_OBA_GEOCODER_API_KEY - string: (optional) Your Geocoder service's API key. Ensure that the Geocoder and Places API permissions are enabled.
  • PRIVATE_OBA_GEOCODER_PROVIDER - string: (required) Your Geocoder service. We currently only support the Google Places SDK (value: "google").

Trip Planner

  • PUBLIC_OTP_SERVER_URL - string: (optional) Your OpenTripPlanner 1.x-compatible trip planner server URL.
  • PUBLIC_OBA_TIMEZONE - string: (required) IANA timezone for the transit region (e.g. "America/Los_Angeles"). Dates and times in the trip planner are expressed in this timezone so they match the transit agency's schedule, regardless of the user's or server's local timezone.
  • PUBLIC_DISTANCE_UNIT - string: (optional) Default distance unit for the trip planner. Use "metric" for kilometers/meters or "imperial" for miles/feet. If not set, auto-detects from the user's browser locale (US browsers get imperial, others get metric). Users can override this in Trip Options.

URL Parameters

You can link directly to a specific location on the map using URL query parameters:

ParameterDescriptionExample
latLatitude of the initial map center47.6062
lngLongitude of the initial map center-122.3321

Example URL:

https://your-wayfinder-instance.com/?lat=47.6062&lng=-122.3321

Validation rules:

  • Both lat and lng must be provided together
  • Latitude must be between -90 and 90
  • Longitude must be between -180 and 180
  • Coordinates must be within 200km of the configured region center (PUBLIC_OBA_REGION_CENTER_LAT/PUBLIC_OBA_REGION_CENTER_LNG)

When valid coordinates are provided, the map will center on that location and place a location marker there. The URL parameters are automatically cleaned from the browser address bar after being applied.

Building

To create a production version of your app:

npm run build

You can preview the production build with npm run preview.

To deploy your app, you may need to install an adapter for your target environment.

Contributing

Want to contribute? Check out CONTRIBUTING.md for guidelines on finding issues, opening PRs, and code style.