Gift&Go Delivery Dash — Angular 21

Three-lane pixel art driving game using the Gift&Go navy and orange palette. An elevated rear view shows your original Gift&Go logo on the cargo doors. Steer around detailed cones, barricades, traffic drums and potholes. Collect gift boxes to earn gift points, spend them on upgrades at roadside shops, and grab the rare golden coupon for a free power-up. The scenery reuses the original loading animation’s trees, layered hills and clouds.

Use in Angular

Copy the eleven files in src/ into src/app/shared/delivery-dash/, the five .mp3 files in assets/music/ and assets/sfx/ferrari-pass.mp3 into your app's served assets (by default the game loads them from assets/music/ and assets/sfx/; see musicBase and sfxBase). Import the standalone DeliveryDashComponent in your page's imports.

import { Component } from '@angular/core';
import { DeliveryDashComponent } from './shared/delivery-dash/delivery-dash.component';

@Component({
  selector: 'app-tracking-page',
  standalone: true,
  imports: [DeliveryDashComponent],
  template: `<app-delivery-dash [width]="480" (finished)="onFinished($event)" />`,
})
export class TrackingPageComponent {
  onFinished(result: { score: number; distance: number; gifts: number; giftPoints: number; coupons: number }): void {
    console.log('Run finished', result);
  }
}

Adjust the relative import for your page's location. The finished output is optional. An NgModule-based page can import this standalone component in its NgModule. The component is separate from the shipment loader; show it where appropriate while waiting or as an optional game. Your existing shipment request and its success/error handling determine when the loading area is removed.

API	Description
width	Defaults to 480px. Sets the host width, with a minimum of 240px; CSS shrinks it to fit its parent. The inner game is capped at 480px.
musicBase	Defaults to assets/music/. URL folder the soundtrack .mp3 files are served from.
sfxBase	Defaults to assets/sfx/. URL folder ferrari-pass.mp3 is served from. If it is missing, a synthesised engine and horn play instead.
finished	Emits { score, distance, gifts, giftPoints, coupons, spent, duration, maxMultiplier, deliveries, deliveriesMissed } once when a run ends in a collision. Score and distance are rounded down to whole numbers (distance in metres).

Play

• Start using the Start driving button.
• Start driving opens the driver select screen. Pick the GnG Van or Joe in his silver Ferrari, then Drive! The choice is remembered under giftgo-delivery-dash-driver; after a crash, Change driver reopens the screen. Drivers differ (delivery-dash.characters.ts): the van boosts 1.6× from a 3s tank, refills in 8s, changes lane in 0.16s, banks every gift point and starts with a shield. Joe boosts 1.7× from a 2s tank, refills in 9s, changes lane in 0.12s, banks half the gift points for shops (score is unaffected) and has no shield. Both stay inside the v0.2 leaderboard's distance ceiling. Swagger is cosmetic. When Joe drives, the rare oncoming car is the GnG Van instead of his Ferrari.
• Arrow Left/Right or A/D changes one lane per key press.
• The arrow buttons also work with mouse, touch, or keyboard.
• Hold ↑ or W (or the BOOST button on touch) to go 1.6× faster. The nitro meter drains in about 3 seconds (up to 6 with shop upgrades) and recharges in about 8; once empty it must refill to 25% before it can be used again. Boosting gives rows less time to arrive, so steer carefully; it does not add score by itself, but it is how you beat a delivery clock (see below). On touch, hold BOOST with one thumb and steer with the arrows or by swiping with the other.
• On the road, tap its left or right half to change one lane, or swipe horizontally.
• Some route gifts are coloured: blue pays double, green refills the nitro tank, purple pays five times and pink pays double and adds a shield (you can hold one). They count towards the chain like any other gift.
• Pause, P, or Escape freezes the game; Resume drive continues it.
• Music. The soundtrack (five tracks in assets/music/, MUSIC_TRACKS in delivery-dash.music.ts) starts with the first Start driving, plays in a shuffled loop through the menus, and stops while paused or when the page is hidden. The speaker button in the header opens the volume sliders; music defaults to 40% (on a squared loudness curve) and is stored locally under giftgo-delivery-dash-volume. At 0% nothing is downloaded or played.
• Sound effects (delivery-dash.sfx.ts) are synthesised with Web Audio, so there are no extra files: a quiet tick for each gift, a chime for coloured gifts and coupons, a jingle for a delivery, one shared "setback" sound for a lost streak or a missed delivery, a thud when a shield takes a hit, and a crash. The oncoming Ferrari roars up, pans with its lane, honks twice and drops in pitch as it passes: a bit-crushed mix of two CC0 BigSoundBank recordings, "Acceleration Aston Martin" (#0600) and "Car Honking at 90 km/h #3" (#3438). The volume panel has a separate slider (default 50%, stored under ).

This is the beginning of the README. Read the rest at the original. Read the full README ↗