Skip to content

Repository files navigation

fireworks

Svelte package and demo app for rendering animated fireworks. It exposes reusable Svelte components and JavaScript functions that other local projects can use for celebratory UI moments.

Live usage

The fireworks can be viewed live on charlieyaris.com by clicking the fireworks button on the top left of the navigation bar. They are also incorporated into the profile photo on the home page and into Mastermind, which can be played on the project page.

What it does

  • Renders a full-window SVG fireworks canvas
  • Launches randomized firework bursts using D3 transitions, timers, easing, and color palettes
  • Provides a FireworkShow component that starts a configurable main show and finale
  • Exports both component and function entry points for other Svelte apps

Project layout

src/lib/components/   FireworkCanvas and FireworkShow components
src/lib/functions/    Firework launch/show functions
src/lib/static/       Firework color palettes
src/routes/           Local Svelte demo route
dist/                 Generated package output

Development

Install dependencies from this directory:

npm install

Start the local Vite dev server:

npm run dev

Build and package:

npm run build
npm run rollup

Run validation:

npm run check
npm run lint
npm run format:check

Local usage

Projects in this workspace use the package through a local file dependency, for example:

"fireworks": "file:../fireworks"

Import the Svelte component when an app needs a ready-made show:

<script>
  import { FireworkShow } from "fireworks/components"
</script>

<div class="fixed left-0 top-0">
  <FireworkShow totalFireworksMain={75} totalFireworksFinale={25} />
</div>

The lower-level functions are also available from fireworks/functions.

Credits

The firework burst process is adapted from this D3 blocks example: http://bl.ocks.org/s2t2/53e96654487b4b0ef6e5. This package keeps the core idea while expanding and improving on it, with adjustments for local preferences and package-version differences.

GitHub Actions Workflows

These local wrappers inherit their reusable implementations from cyaris/shared-automation. Shared workflow behavior, inputs, and secrets are documented in the shared-automation workflow reference.

.github/workflows/auto-create-dev-pr.yml

The Auto-create dev pull request workflow runs on pushes to dev and calls the shared auto-create-dev-pr workflow.

.github/workflows/rollup.yml

The Rollup workflow runs on pushes to main, pull requests, and manual dispatch, then calls the shared rollup workflow. Shared CI runs for every trigger; uploads run on main pushes or manual dispatches to build the rollup bundles and upload them to s3://cyaris.github.io/fireworks/. This project uploads both bundle.* and bundle2.* artifacts.

This workflow checks out svelte-lib at the latest main commit as a local dependency. The shared workflow resolves that branch to an exact commit SHA before checkout.

.github/workflows/auto-release.yml

The Auto release workflow runs from manual dispatch only and calls the shared auto-release workflow. This repository contributes .github/release-policy.yml overrides; manual runs read the shared release policy from main. Release creation or existing-release updates require reviewing the generated plan and explicitly enabling publication for an approved run.

.github/workflows/workflow-validation.yml

The Workflow validation workflow runs on local workflow and automation configuration changes, then calls the shared workflow-validation workflow to validate rollup upload wrapper logic, release-policy configuration, and Renovate configuration.

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages