14  Products, brand and uptime

Every CalCOFI.io product is a card on calcofi.io, and the card is the record: its name, its section, where it lives, where its source is, its uptime history and its usage. This page lists them from that record and states the three small contracts that keep a product findable and recognisably CalCOFI’s. For the data team and anyone building a new one.

14.1 Every product

Table 14.1 is every card on the landing page, by section, with where the product lives, where its source is and how it is doing.

Table 14.1: The products on calcofi.io, by section, from the landing page’s cards (_data/products.yml in CalCOFI/CalCOFI.github.io). Usage per product is at calcofi.io/analytics.
key product status tech
Apps
ctd-viz CTD Explorer source uptime live R, Shiny, DuckDB, MapLibre
ctd-transects CTD Transects source uptime live DuckDB, Plotly, JavaScript
explore CalCOFI Explorer source uptime live DuckDB-WASM, TypeScript, MapLibre, deck.gl, Plotly
pollutants Pollutants Explorer source uptime live
db-viz-station Station Explorer source uptime live DuckDB, JavaScript, MapLibre
oceano Contour Explorer source uptime superseded by CalCOFI Explorer
db-viz-cruise Cruise Explorer source uptime superseded by CalCOFI Explorer R, Shiny, DuckDB
db-viz-hex Hexagon Explorer source uptime superseded by CalCOFI Explorer R, Shiny, DuckDB, H3, MapLibre
Access
calcofi4py calcofi4py source uptime live Python
calcofi4r calcofi4r source uptime live R
db-query db-query source uptime live SQL, DuckDB-WASM
erddap erddap source uptime live
storage storage source uptime live
Build
calcofi4db calcofi4db source uptime live R
db-schema db-schema source uptime live
workflows workflows source uptime live R, Quarto, DuckDB, Parquet
Docs
docs docs source uptime live Quarto, R, Mermaid
NA
capstone Capstone App source uptime archived
hypoxia-story Hypoxia Story source uptime archived
ucsb-larvae-dashboard Larvae Dashboard source uptime archived
marmam Marine Mammal App source uptime archived
saferseafood SaferSeafood App source uptime archived
ucsb-station-portal Station Data Portal source uptime archived
calcofi-75th-timeline 75th Anniversary Timeline source
live
ucla-monitoring-map CA Ocean & Coastal Monitoring Map source uptime live
offshore-wind-monitoring Offshore Wind Monitoring

live

14.2 The ship’s log

calcofi.io/news merges four kinds of entry into one history, newest first — releases, datasets entering the release, new products, and hand-written notes — generated by _plugins/news.rb in CalCOFI/CalCOFI.github.io and republished as the Atom feed /feed.xml; the header’s News link wears a dot while any entry is under 30 days old. Three of the four are read off records this book already reads; only the fourth — a feature, a change to the site, a paper — is typed by hand, in the site’s _data/news.yml. A hand-written row carrying version: or dataset_key: replaces the generated entry of that key, for when the generated title is not the story.

Table 14.2 is what each kind is: its source, who is responsible for it appearing, when it shows up, and where it sends a reader — with how many of each this snapshot carries.

Table 14.2: The ship’s log’s four kinds of entry, and how many of each this snapshot carries.
type count source who writes it when it appears where it links
release 32 versions.json + the first ## heading of the version's section in RELEASES.md the release runner, in RELEASES.md # Unreleased before the cut minutes after latest.txt is promoted (test_release.qmd dispatches refresh.yml), or the Monday cron RELEASES.html#v{version}
dataset 16 datasets[].since_version in the record nobody — the release that first carries the dataset with that release the dataset page
app 26 products.yml added: whoever adds the card on push the product
data · site · paper 4 _data/news.yml whoever has the story: a feature, a change to the site, a paper on push the row's url

14.3 The three-slug contract

A product is one thing in three places, and it is the same string in all of them:

  • its key in the landing page’s products.yml (the card);
  • its slug in CalCOFI/uptime’s monitor list (the status page at status.calcofi.io/history/<slug>);
  • its slug in CalCOFI/analytics’ registry (the usage report at calcofi.io/analytics/<slug>/).

When the names diverged, none of the three was findable from the others. Cards are named for the thing itself — the repository or application name used everywhere else — except student contributions, which keep their human titles. The card’s status is its lifecycle (interim, superseded, archived), not its uptime; a superseded card names what replaced it, and the Explore chapter reads exactly that.

14.4 The brand contract

Every product wears one theme, one header and one favicon, and the rule is checked weekly rather than assumed. The contract is calcofi.io/brand/v2 — the SIO look, light by default, UCSD’s palette, Source Sans 3 and Teko, the horizontal lockup — and in one breath:

  • ?theme=dark|light on any URL sets the theme, remembered across products only when a person chose it; a fresh visit is light.
  • The header is one bar: the lockup (the mark and the wordmark “CalCOFI.io”) at the far left links to calcofi.io, the product’s own name beside it (“Explorer”, “Query”, never “CalCOFI Query”) links to its own root, the theme toggle sits at the right. Where a framework owns the bar (Quarto, pkgdown, MkDocs, Shiny), the lockup goes in its brand slot and its toggle is bridged.
  • An application declares its scale (<meta name="cc-scale" content="app">); a page declares nothing and gets the reading rhythm. This book is a page.
  • ?tour=off suppresses any guided tour, so live_url?theme=<t>&tour=off is a deterministic screenshot; every card carries a light and a dark shot taken that way.

calcofi4r::cc_brand_head() and cc_brand_header() give a Shiny app the head block and the bar; the Quarto sites include the same head file; check_brand.py in the landing repository probes every product for the theme, the favicon, the home link, the toggle, the version and the default.

14.5 Adding a product

  1. Build it on the release: read through the catalog (Access the data), never a typed path; apply the quality predicate; cite through cc_cite().
  2. Wear the brand (above); honour ?theme= and ?tour=off; take the two screenshots.
  3. Add the card to products.yml with its section, its datasets (the keys it covers, or all) and, if it opens a dataset directly, the dataset_url template the dataset pages link through.
  4. Add the same slug to the uptime monitors and the analytics registry, and tag the page for analytics.
  5. Push; the landing page, the status page and the usage report rebuild themselves, and this table follows.