SACGF / SACGF/variantgrid

loading animation refinements

Open
#1,624 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Python
Stars
30
Forks
3
Avg merge
9h 28m
Merged PRs (30d)
42

Description

🤖 Written by Claude

We added a set of DNA/genomics-themed loading animations that play while an analysis node grid loads (replacing the lone double-helix). They're user-selectable in **User Settings → Grid Loading Animations**, shown at random.

Public preview page (no login): **`/loading_animations`** — handy for tinkering and as a front-page/docs easter egg.

**Already built:** double-helix (classic, also the fallback), Read Pulse, Base FX (Matrix / Ripple / Wave), Flowcell, Read Pileup.

This issue tracks further ideas. None are started.

## New animation ideas

- **Sanger trace / electropherogram** — the classic 4-colour chromatogram: smooth coloured peaks (A/C/G/T) scrolling, base calls underneath. Analog peaks rather than discrete flashes.
- **Coverage track building** — a depth histogram filling left→right as reads land, the skyline rising into a coverage profile with a sweep line.
- **Replication fork (helix unzip)** — the double strand unzips down the middle and complementary bases fill in on each side (A↔T, C↔G with connecting rungs). A more "alive" upgrade to the spinning helix.
- **Translation / ribosome** — base triplets slide through a reading head; each codon emits an amino-acid bead/3-letter code onto a growing peptide chain.
- **Gel electrophoresis** — fragment bands start in wells and migrate down lanes at size-dependent speeds; a loading bar that's literally a gel running.
- **Lollipop sweep** — a transcript bar with domains; mutation "lollipops" pop up along it one by one.
- **Manhattan plot rain** — points scatter upward across chromosome-coloured bands, a few crossing a significance line and flaring.
- **Codon colourise** (quick) — reuse the frozen GATC field but tint every third base (reading frame) and shift the frame.
- **Methylation toggle** (quick) — sparse CpG sites blink between methylated/unmethylated states.
- **Contig assembly** (quick) — fragments slide together and fuse into one long sequence, overlaps briefly highlighted.

## Refinements to existing animations

- **Clear-on-white palette** — the analysis overlay renders dark-theme glyphs on a clear/white background, but the dark palette's *lit* colour is lighter than its *resting* colour, so the ripple highlight reads as a gentle lightening rather than a bright pulse. A palette tuned specifically for white backgrounds would make ripple (and others) pop.
- **Per-animation tuning** of speeds/density once seen in real grid loads.

## Implementation notes

Loaders live in `variantgrid/static_files/default_static/js/lib/loaders/` and self-register via `VGLoaders.register(id, {label, start(container, opts) → stop()})`. They support `opts.theme` (`dark`/`light`) and `opts.clearBackground`. To add one to the official set: drop the `*.loader.js`, include it in `analysis/templates/analysis/analysis_includes.html`, and add it to `GridLoadingAnimation` + the `LOADER_IDS` map in `analysis.js` (and to `DEFAULT_GRID_LOADING_ANIMATIONS` if on by default).

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.