Compare commits

...
14 Commits
Author SHA1 Message Date
LeoVasanko e0c1b37c0b {cards}: server-rendered previews, immediate-children semantics, */** globs
Preview: the editor render handler now returns the complete article HTML
({cards} tags expanded, children's cards appended when the page has no
tag) and the frontend swaps article.innerHTML wholesale — the old
detach/keep/re-append hack for .cards (which duplicated stacks) is gone.

Semantics: one card per item, no subtree flattening (stacks removed).
Bare {cards} lists immediate children (front page: the other top-level
items); a page-less item is represented by its first leaf page, the
nav-link logic. {cards: path} renders that page alone, path/* its
direct children, path/** all published descendants.
2026-09-18 19:36:44 +00:00
LeoVasanko b004fcd644 Upgrade fastapi-vue-setup 1.7.2. 2026-09-18 19:14:14 +00:00
LeoVasanko 0c7fe15635 Transition map: stable node colors — white external pills, always-black labels 2026-09-18 19:11:27 +00:00
LeoVasanko 2be3b32586 Referer badge: translucent theme-aware pill, compact UTM summary with click-to-copy 2026-09-18 18:52:35 +00:00
LeoVasanko 867132f26b Fix language-switch tracking ping; serve first matching Accept-Language
The language-switch trail ping read <html lang> before the view
transition applied the swap, so it reported the previous language (and
read pings never update trail-item languages server-side): multi-
language visits recorded as single-language trails and the analytics
flag combining had nothing to show. The switch ping now passes the
picked tag explicitly.

Language negotiation no longer prefers the article's original language
anywhere in the Accept-Language list — nearly every browser lists
English as a fallback, so translations were almost never served. The
first servable header language now wins, the original counting only in
its natural position.
2026-09-18 14:28:29 +00:00
LeoVasanko 4522b8fa40 Analytics: stronger chart fills, line specimen for the day legend
Area and bar fills at 0.6 opacity (were a near-invisible 0.15); the day
view's 'Last 24 hours' legend entry uses the same full-opacity accent
line as the other entries instead of a translucent bar swatch.
2026-09-18 13:54:33 +00:00
LeoVasanko 2d221f6204 Analytics: seasonal 'typical week' history curve on day and week views
Port the seasonal.py demo algorithm to JS (analytics/seasonal.js): the
smoothed 5-minute history is folded onto a weekly grid with exponential
age decay (7-day half-life for the time-of-day pattern, 42 days for
per-weekday deviations, shrunk by effective weeks of data), capped at
180 days of history where the weights become negligible.

Week view: the fading past-week overlays are replaced by the full
Monday-first 'Typical week' estimate. Day view gains the same estimate
cut to the rolling 24h window as a smooth muted 'Typical <weekday>'
curve behind the bars. Longer ranges are unchanged.
2026-09-18 13:45:51 +00:00
LeoVasanko 626dc1df8f Block directives: lone {name}/{name: args} lines expanded via render(directives=...); {dates} rebuilt on it, new {cards} / {cards: path path/* ...} for author-placed card stacks (suppresses the auto end-of-page cards) 2026-09-18 12:38:21 +00:00
LeoVasanko 02396f4482 Update fastapi-vue-setup 1.7.1, make use of its logging facilities. Mediapreview and kanta bumped to do so too. 2026-09-18 03:58:37 +00:00
LeoVasanko 7724290921 analytics viewer: referer + UTM as one neutral-grey badge
Favicon flush to the badge's left edge, then the referer host and UTM
summary in one link, with a single newline-formatted tooltip (origin,
then each utm_* pair). Fixed --badge-bg/--badge-text/--badge-muted
palette (defined in pagerite.css, deliberately unthemed) so transparent
favicons stay legible in both light and dark themes; own-article trail
links remain plain, lifting referer info visually apart from them.
Replaces the outlined utm-tag pill.
2026-09-15 05:20:57 +00:00
LeoVasanko 3b1804b093 analytics: record and show the rendered content language of page views
GETs store the resolved page language, activity pings carry <html lang>
(including a new ping on in-place language switches, which also keeps the
switch's GET out of crawler classification), and trail items/crawler hits
surface it. The viewer shows flags discreetly: nothing on single-language
sites or primary-language-only rows, one leading flag for uniform visits,
transition flags on mixed trails, a flag row per crawler.
2026-09-15 05:20:57 +00:00
LeoVasanko 4cd8dbfc73 Update fastapi-vue-setup 1.6.1 2026-09-15 05:20:57 +00:00
LeoVasanko dc4bdf6efc Avoid deprecation warning from pyvips; remove unnecessary logging config. 2026-09-15 05:20:57 +00:00
LeoVasanko a458bded09 Create the per-hostname data directory on first run 2026-09-15 05:20:57 +00:00
32 changed files with 1115 additions and 388 deletions
+47 -14
View File
@@ -38,6 +38,9 @@ Each `Get` record (one per served document):
(`x-pagerite-preload` header): never counted as a view, crawler hit or (`x-pagerite-preload` header): never counted as a view, crawler hit or
abuse — recorded only so a navigation later served from the in-memory page abuse — recorded only so a navigation later served from the in-memory page
cache (which issues no GET at all) can be attributed this GET's status, cache (which issues no GET at all) can be attributed this GET's status,
- `lang` — rendered content language of the served document (the resolved
language of a localized page), `""` for non-localized responses (404
probes, reserved paths),
- `client` — 6-byte blake3 hash referencing `Analytics.clients`. - `client` — 6-byte blake3 hash referencing `Analytics.clients`.
304 revalidation responses return before recording and are not logged. 304 revalidation responses return before recording and are not logged.
@@ -51,7 +54,9 @@ Each `Msg` record (one per pagerite.js activity message over `/_ws`):
- `to` — navigation target (validated at record time: internal slug path or - `to` — navigation target (validated at record time: internal slug path or
external https URL; anything else is dropped — sanitation, not external https URL; anything else is dropped — sanitation, not
classification), classification),
- `read` — active seconds spent on `fr` since the previous report. - `read` — active seconds spent on `fr` since the previous report,
- `lang` — rendered language reported by the client for the page the
activity happened on (the page's `<html lang>`; `""` from old clients).
Each `Client` record (shared by every event, keyed by hash): Each `Client` record (shared by every event, keyed by hash):
@@ -104,7 +109,11 @@ The client (`pagerite.js`) keeps a WebSocket connection to `/_ws` for the
whole browsing session and sends activity messages over it — JSON text whole browsing session and sends activity messages over it — JSON text
frames matching the server's `Ping` msgspec struct with the fields `fr` frames matching the server's `Ping` msgspec struct with the fields `fr`
(source path), `to` (navigation target), `read` (active seconds on `fr` (source path), `to` (navigation target), `read` (active seconds on `fr`
since the last report) and `hide`; falsy fields are omitted. One channel since the last report), `lang` (the rendered language of the page the
activity happened on — its `<html lang>`, except the language-switch
navigation ping, which passes the picked tag explicitly because the view
transition applies the new `<html lang>` only after the ping goes out) and
`hide`; falsy fields are omitted. One channel
follows the session, so the activity of a visit stays tied together, and follows the session, so the activity of a visit stays tied together, and
while the user is active the accumulated reading time is flushed every few while the user is active the accumulated reading time is flushed every few
seconds: the times are incremental, so a disconnection simply leaves the seconds: the times are incremental, so a disconnection simply leaves the
@@ -173,10 +182,16 @@ for misses.
(`_SESSION_GAP`). A fresh page load with an already-open visit (second (`_SESSION_GAP`). A fresh page load with an already-open visit (second
tab) extends it, logging a `(direct)` transition. The visit's trail holds tab) extends it, logging a `(direct)` transition. The visit's trail holds
first-seen targets in order; `read` updates accumulate active seconds on first-seen targets in order; `read` updates accumulate active seconds on
the trail item matching `fr`. Each trail item's HTTP status comes from the trail item matching `fr` (preferring the item whose language matches
the report, so seconds after a language switch land on the new-language
step). Each trail item's HTTP status comes from
the client's latest GET for that path — preloads included, which is what the client's latest GET for that path — preloads included, which is what
allows 404 pages to render red in the viewer even when the navigation allows 404 pages to render red in the viewer even when the navigation
itself was served from the page cache. The entry page's referer and itself was served from the page cache. Each trail item also carries the
rendered language: the client's report, for the entry page falling back
to its GET's rendered language (old clients don't send one); a page
re-visited in a different language becomes a distinct trail step instead
of merging into the existing item. The entry page's referer and
`utm_*` tags come from the GET that loaded it (within 10 s before the `utm_*` tags come from the GET that loaded it (within 10 s before the
first message). first message).
- **Crawler hits**: a document GET no activity message matched within - **Crawler hits**: a document GET no activity message matched within
@@ -232,6 +247,10 @@ to tell misses from real pages at a glance.
The `Display` payload contains the derived `visits`, `crawlers` and `abuse` The `Display` payload contains the derived `visits`, `crawlers` and `abuse`
rows (structs `Visit`/`Nav`/`TrailItem`, `CrawlerHit`, `AbuseHit` — display rows (structs `Visit`/`Nav`/`TrailItem`, `CrawlerHit`, `AbuseHit` — display
DTOs only, never persisted), the visible `clients`, the fetched `favicons`, DTOs only, never persisted), the visible `clients`, the fetched `favicons`,
the site language context (`multilingual` — translation languages are
configured, so the viewer can suppress language UI on single-language
sites — and `primary_lang` — the front page's primary language, so the
viewer can skip the primary-language default case),
and the aggregates below. and the aggregates below.
Each derived `Visit`: Each derived `Visit`:
@@ -243,8 +262,9 @@ Each derived `Visit`:
- `trail` — the entry page and everything seen afterwards, keyed by the - `trail` — the entry page and everything seen afterwards, keyed by the
timestamp of first sight (insertion order = first-seen order). Each item timestamp of first sight (insertion order = first-seen order). Each item
holds `to` (page path or external exit URL), the accumulated active holds `to` (page path or external exit URL), the accumulated active
reading time in seconds (`read`) and the most recent HTTP status seen reading time in seconds (`read`), the most recent HTTP status seen
for the target (`status`), for the target (`status`) and the rendered language (`lang`; a page
seen in two languages within one visit gets one item per language),
- `navs` — every navigation (`fr`, `to`), keyed by its timestamp, repeats - `navs` — every navigation (`fr`, `to`), keyed by its timestamp, repeats
included. The aggregates are computed from this log, included. The aggregates are computed from this log,
- `utm``utm_*` query parameters from the landing URL, as a dict. - `utm``utm_*` query parameters from the landing URL, as a dict.
@@ -257,7 +277,8 @@ Each derived `CrawlerHit`:
- `referer` — external https origin of the request, `""` for direct/none, - `referer` — external https origin of the request, `""` for direct/none,
- `query` — raw query string of the request, - `query` — raw query string of the request,
- `status` — HTTP status of the served response (200 for a real page, 404 - `status` — HTTP status of the served response (200 for a real page, 404
for a category placeholder or missing page). for a category placeholder or missing page),
- `lang` — rendered content language of the served document (from the GET).
Each derived `AbuseHit`: Each derived `AbuseHit`:
@@ -343,13 +364,25 @@ Axes always start at 0 and end at a multiple of a 1-2-5 major step (max 5
labeled intervals, minor lines at fifths when integral; the minimum y-axis labeled intervals, minor lines at fifths when integral; the minimum y-axis
range is 10 so tiny values such as a single visit are not stretched to a range is 10 so tiny values such as a single visit are not stretched to a
fractional scale). fractional scale).
The week range is aligned to Monday 00:00 UTC and overlays up to 8 previous The week range is aligned to Monday 00:00 UTC (the current week keeps the
weeks in the muted color at decreasing opacity (the current week keeps the accent color and is truncated at the current bucket, never drawing fake
accent color and is zeroes for the future). Both the week and day views overlay a **"typical"
truncated at the current bucket, never drawing fake zeroes for the future); history curve** in the muted color (`analytics/seasonal.js`, a port of
a compact legend inside the top right of the visits chart marks the current `seasonal.py`): the whole recorded history is densified to 5-minute bins,
ISO week in accent and the overlaid past weeks as "Week M" or "Week MN" on smoothed with the same Gaussian as the week view, then folded onto a weekly
a muted specimen. Its x labels are weekday names centered at midday UTC, without grid with exponential decay over age — a 7-day half-life for the average
time-of-day pattern and a 42-day half-life for per-weekday deviations from
it, the deviation shrunk by the effective number of weeks behind each bin
(`n_eff / (n_eff + 3)`) so the estimate falls back to the common daily
pattern when history is short. History is capped at the most recent 180
days, beyond which even the slow kernel's weight is negligible (~5%). The
week view draws the full Monday-first
estimate as "Typical week" (future included); the day view cuts the rolling
24-hour window's bins from the same estimate and labels them by the weekday
("Typical Saturday"). A compact legend inside the top right of the visits
chart marks the current data in accent (ISO week label, or a bar specimen
for "Last 24 hours") and the typical curve on a muted specimen. The week
view's x labels are weekday names centered at midday UTC, without
vertical grid vertical grid
lines (day boundaries would be misleading in the viewer's timezone). The lines (day boundaries would be misleading in the viewer's timezone). The
month view labels days the same lineless way — day numbers at noon UTC, month view labels days the same lineless way — day numbers at noon UTC,
+1 -1
View File
@@ -26,7 +26,7 @@ msgspec Structs for the kanta database. See `docs/content-model.md` for the full
## `markdown.py` ## `markdown.py`
markdown-it-py renderer (html passthrough + attrs, footnote, deflist, tasklists, admon, gfm_autolink, sub/superscript plugins; typographer + breaks on). In bodies with at least three top-level h1/h2 headings (nested ones, e.g. inside `::: aside`, never participate), each gets a slug id (`python-slugify`, mirroring the editor's `slugify.js` — unicode folds to ASCII, separators become single hyphens) unless the author set `{#id}`, and their text is wrapped in a self-link (`a.anchor`) so section links are copyable; anchored headings also carry `data-line` with their markdown source line (the page editor's section pens and piecewise scroll sync key off it); the first in-body h1 is the article title — when the markdown has no h1, `render(title=...)` injects it as `# {title}` so implicit and explicit titles take the same path — it gets no id and doesn't count toward the three, its self-link is `href=""` (scroll to top); shorter articles stay anchor-free, h3+ is never navigable, and duplicates get `-2`/`-3` suffixes. Custom image rule: relative srcs resolve against the page path; an image standing alone in its paragraph becomes a figure (captioned when titled), while inline-with-text images and raw `<img>` HTML stay plain. A `{dates}` line expands to the article's published/updated dateline (`p.dateline`, from `Node.created`/`modified`; left literal in previews of unsaved pages). Code fences take pandoc-style brace attributes on the info line (` ```{.python .wide #id key=val} ` — the first class is the language when no bare language word precedes the braces) as well as a trailing `{...}` line; both land on the `<pre>`, the `<code>` keeps only the language class. markdown-it-py renderer (html passthrough + attrs, footnote, deflist, tasklists, admon, gfm_autolink, sub/superscript plugins; typographer + breaks on). In bodies with at least three top-level h1/h2 headings (nested ones, e.g. inside `::: aside`, never participate), each gets a slug id (`python-slugify`, mirroring the editor's `slugify.js` — unicode folds to ASCII, separators become single hyphens) unless the author set `{#id}`, and their text is wrapped in a self-link (`a.anchor`) so section links are copyable; anchored headings also carry `data-line` with their markdown source line (the page editor's section pens and piecewise scroll sync key off it); the first in-body h1 is the article title — when the markdown has no h1, `render(title=...)` injects it as `# {title}` so implicit and explicit titles take the same path — it gets no id and doesn't count toward the three, its self-link is `href=""` (scroll to top); shorter articles stay anchor-free, h3+ is never navigable, and duplicates get `-2`/`-3` suffixes. Custom image rule: relative srcs resolve against the page path; an image standing alone in its paragraph becomes a figure (captioned when titled), while inline-with-text images and raw `<img>` HTML stay plain. A lone `{name}` / `{name: args}` line is a block directive: a core rule turns it into a `directive` token (render instance only — the verbatim parser keeps the plain paragraph so segments/chunks see the placeholder source), and the render rule delegates to the resolvers passed as `render(directives=...)`, leaving the source literal where no resolver applies (e.g. the editor preview of a page that does not exist yet). Built in: `{dates}` expands to the article's published/updated dateline (`p.dateline`, from `Node.created`/`modified`, registered by `render()` when `created` is given); views.py resolves `{cards}` — the page's published children, one card each (on the front page: the other top-level pages) — and `{cards: path path/* path/** ...}` (space-separated: a plain path renders that page alone, `path/*` its published children, `path/**` all published descendant pages; a page-less item is represented by its first leaf page, the nav-link logic) into the same card-row markup as category pages (`.cards.wide`, a boundary block outside the column segments). A page with any `{cards}` tag drops the automatic end-of-page child cards; multiple tags each render their own row. Code fences take pandoc-style brace attributes on the info line (` ```{.python .wide #id key=val} ` — the first class is the language when no bare language word precedes the braces) as well as a trailing `{...}` line; both land on the `<pre>`, the `<code>` keeps only the language class.
`render()` returns a `Rendered(html, multicol)`: the article content segmented for the column layout (there is no wrapper div — segments and bare blocks are direct `<article>` children) — h1/h2 headings and `.wide` blocks stand bare, the runs between them become `<div class="colseg">` (margin-breakout boxes — `.margin`, `::: aside` — stay inside the segment at their anchor point; the CSS positions them out of flow into the side zone) (plus `.cols` on segments with enough text in at least two paragraphs or one long enough to split across columns, `::: nocols` opting out; in column segments, paragraphs past `BREAKABLE_TEXT` visible characters are marked `.breakable` so they may split across columns), and `multicol` flags bodies long enough to columnize (visible-text thresholds, code excluded). `views.py` puts the class on the article; pagerite.css takes it from there (at most two columns, the left-margin breakout, all viewport adaptation). `render()` returns a `Rendered(html, multicol)`: the article content segmented for the column layout (there is no wrapper div — segments and bare blocks are direct `<article>` children) — h1/h2 headings and `.wide` blocks stand bare, the runs between them become `<div class="colseg">` (margin-breakout boxes — `.margin`, `::: aside` — stay inside the segment at their anchor point; the CSS positions them out of flow into the side zone) (plus `.cols` on segments with enough text in at least two paragraphs or one long enough to split across columns, `::: nocols` opting out; in column segments, paragraphs past `BREAKABLE_TEXT` visible characters are marked `.breakable` so they may split across columns), and `multicol` flags bodies long enough to columnize (visible-text thresholds, code excluded). `views.py` puts the class on the article; pagerite.css takes it from there (at most two columns, the left-margin breakout, all viewport adaptation).
+3 -8
View File
@@ -33,14 +33,9 @@ Deliberately simple — **q-values are ignored**:
- Selection rule (`select_language` in `pagerite/i18n.py`): - Selection rule (`select_language` in `pagerite/i18n.py`):
1. If `?lang=<tag>` is present, use it (if a translation exists; otherwise 1. If `?lang=<tag>` is present, use it (if a translation exists; otherwise
fall through to header logic). fall through to header logic).
2. If the article's original language appears anywhere in the header list, 2. Otherwise walk the header list in order and use the first language that
use the **original**. Rationale: an AI translation is strictly worse can be served — the original, or one with an available translation.
than the original for anyone who has that language configured at all 3. Fall back to the original.
(e.g. `fi-FI, fi, en-US, en` gets English, not machine-translated
Finnish).
3. Otherwise walk the header list in order and use the first language for
which a translation exists.
4. Fall back to the original.
Region tags normalize to their base subtag (`fi-FI``fi`). Region tags normalize to their base subtag (`fi-FI``fi`).
+47 -15
View File
@@ -23,6 +23,7 @@ import {
formatVisitRows, formatVisitRows,
} from './analytics/format.js' } from './analytics/format.js'
import TrailLink from './TrailLink.vue' import TrailLink from './TrailLink.vue'
import RefererBadge from './RefererBadge.vue'
import VisitorCell from './VisitorCell.vue' import VisitorCell from './VisitorCell.vue'
import TransitionGraph from './TransitionGraph.vue' import TransitionGraph from './TransitionGraph.vue'
import VisitorCharts from './VisitorCharts.vue' import VisitorCharts from './VisitorCharts.vue'
@@ -133,7 +134,8 @@ onUnmounted(() => {
const window = computed(() => rangeWindow(range.value)) const window = computed(() => rangeWindow(range.value))
// All non-chart stats follow the selected range; the charts keep their own // All non-chart stats follow the selected range; the charts keep their own
// range-specific x windows (week overlays previous weeks aligned to Monday). // range-specific x windows (week aligned to Monday, overlaid with the
// seasonal "typical week" curve).
const rangeData = computed(() => { const rangeData = computed(() => {
if (!data.value) return null if (!data.value) return null
const { t0, t1 } = window.value const { t0, t1 } = window.value
@@ -160,9 +162,15 @@ watch(range, (r) => {
const clients = computed(() => data.value?.clients || {}) const clients = computed(() => data.value?.clients || {})
const favicons = computed(() => data.value?.favicons || {}) const favicons = computed(() => data.value?.favicons || {})
const visitRows = computed(() => formatVisitRows(visits.value, clients.value, pageTree.value, now.value)) // Site language context from the payload: drives the discreet rendered-
// language markers in the visit/crawler rows (multilingual sites only).
const site = computed(() => ({
multilingual: !!data.value?.multilingual,
primaryLang: data.value?.primary_lang || '',
}))
const visitRows = computed(() => formatVisitRows(visits.value, clients.value, pageTree.value, now.value, site.value))
const crawlers = computed(() => rangeData.value?.crawlers || []) const crawlers = computed(() => rangeData.value?.crawlers || [])
const crawlerRows = computed(() => formatCrawlerRows(crawlers.value, clients.value, pageTree.value, now.value)) const crawlerRows = computed(() => formatCrawlerRows(crawlers.value, clients.value, pageTree.value, now.value, site.value))
const abuseRows = computed(() => formatAbuseRows(rangeData.value?.abuse || [], clients.value, pageTree.value, now.value)) const abuseRows = computed(() => formatAbuseRows(rangeData.value?.abuse || [], clients.value, pageTree.value, now.value))
</script> </script>
@@ -209,9 +217,9 @@ const abuseRows = computed(() => formatAbuseRows(rangeData.value?.abuse || [], c
<tbody> <tbody>
<tr v-for="(v, i) in visitRows" :key="i"> <tr v-for="(v, i) in visitRows" :key="i">
<td class="trail"> <td class="trail">
<TrailLink v-if="v.refererStep" :step="v.refererStep" :favicons="favicons" @close="$emit('close')" /> <RefererBadge v-if="v.refererBadge" :badge="v.refererBadge" :favicons="favicons" />
<span v-if="v.utm && v.utm !== '—'" class="utm-tag small muted" :title="v.utmTitle">{{ v.utm }}</span> <span v-if="v.rowFlag" class="flag" v-html="v.rowFlag" :title="v.rowFlagTitle"></span>
<TrailLink v-for="(s, si) in v.trail" :key="si" :step="s" :favicons="favicons" @close="$emit('close')" /> <TrailLink v-for="(s, si) in v.trail" :key="si" :step="s" :favicons="favicons" :flags="s.langFlags" @close="$emit('close')" />
</td> </td>
<VisitorCell <VisitorCell
:ip="v.ip" :ip="v.ip"
@@ -246,8 +254,9 @@ const abuseRows = computed(() => formatAbuseRows(rangeData.value?.abuse || [], c
<tbody> <tbody>
<tr v-for="(c, i) in crawlerRows" :key="i"> <tr v-for="(c, i) in crawlerRows" :key="i">
<td class="trail"> <td class="trail">
<TrailLink v-if="c.refererStep" :step="c.refererStep" :favicons="favicons" @close="$emit('close')" /> <RefererBadge v-if="c.refererBadge" :badge="c.refererBadge" :favicons="favicons" />
<TrailLink v-for="(s, si) in c.pages" :key="si" :step="s" :count="s.count" @close="$emit('close')" /> <TrailLink v-for="(s, si) in c.pages" :key="si" :step="s" :count="s.count" @close="$emit('close')" />
<span v-for="(f, fi) in c.readFlags" :key="fi" class="flag" v-html="f.flag" :title="f.name"></span>
</td> </td>
<VisitorCell <VisitorCell
:ip="c.ip" :ip="c.ip"
@@ -472,16 +481,39 @@ const abuseRows = computed(() => formatAbuseRows(rangeData.value?.abuse || [], c
color: var(--error, #c00); color: var(--error, #c00);
} }
.visit-table .utm-tag { /* The referer badge outgrows the 8rem trail-link cap (it carries the UTM
display: inline-block; summary too); keep the inline-flex layout from the component. The
generic trail-link rule above would otherwise clip the badge (overflow:
hidden, hiding the absolutely positioned favicon) and cap its inner
link — the link is display: contents, so its parts lay out as badge
flex items. */
.visit-table .trail .referer-badge {
display: inline-flex;
max-width: 100%; max-width: 100%;
padding: 0.05rem 0.4rem; overflow: visible;
border: 1px solid var(--line); }
border-radius: 0.25rem;
white-space: nowrap; .visit-table .trail .referer-badge a.badge-link {
display: contents;
}
/* Same flag chip as the visitor cells (VisitorCell.vue); the flags here
mark the language the page was read in. */
.visit-table .flag {
display: inline-flex;
width: 18px;
height: 12px;
border-radius: 2px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; border: 1px solid var(--line);
vertical-align: bottom; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
vertical-align: middle;
}
.visit-table .flag :deep(svg) {
width: 100%;
height: 100%;
display: block;
} }
.visit-table .clickable-list { .visit-table .clickable-list {
+5 -7
View File
@@ -736,17 +736,15 @@ function previewIntoArticle(html, multicol) {
if (!article) return if (!article) return
// The server render owns the article completely — the injected title h1, // The server render owns the article completely — the injected title h1,
// the column layout (.multicol on the article, the .colseg/.cols // the column layout (.multicol on the article, the .colseg/.cols
// segments) — so the whole article content swaps as one. Only the edit // segments), the card stacks ({cards} tags expanded, or the children's
// pen and the category cards survive: detach them before innerHTML wipes // cards appended when the page has no tag) — so the whole article
// them. pagerite.js re-places the pen into the first visible h1 on // content swaps as one. Only the edit pen survives: detach it before
// pagerite:preview. // innerHTML wipes it. pagerite.js re-places the pen into the first
// visible h1 on pagerite:preview.
article.classList.toggle('multicol', multicol) article.classList.toggle('multicol', multicol)
const pen = article.querySelector('button.edit-link') const pen = article.querySelector('button.edit-link')
if (pen) pen.remove() if (pen) pen.remove()
const cards = article.querySelector(':scope > .cards')
if (cards) cards.remove()
article.innerHTML = html article.innerHTML = html
if (cards) article.append(cards)
runScripts(article) runScripts(article)
dispatchEvent(new CustomEvent('pagerite:preview')) dispatchEvent(new CustomEvent('pagerite:preview'))
} }
+113
View File
@@ -0,0 +1,113 @@
<script setup>
// Referer + UTM as one badge in the analytics visit/crawler tables: the
// referer's favicon flush on the left, its host as the link text, then the
// UTM summary smaller/muted inside the same badge. Only the favicon and
// host are the link (external, new tab) — everything else, padding and
// UTM text included, copies the full utm tag list to the clipboard. The
// link is display: contents so its parts lay out as badge flex items.
// The badge carries a single one-fact-per-line tooltip (badge.title:
// origin, then each utm pair) — no titles on the inner elements.
// Referers are external, so there is no close event.
import { computed } from 'vue'
import { copyList } from './analytics/format.js'
const props = defineProps({
badge: { type: Object, required: true },
favicons: { type: Object, default: null },
})
const favicon = computed(() => (props.badge.origin ? props.favicons?.[props.badge.origin] : null))
</script>
<template>
<span class="referer-badge"
:class="{ 'with-icon': favicon, copyable: badge.utm }"
:title="badge.title"
@click="badge.utm && copyList(badge.utmCopy, $event)">
<a v-if="badge.href" class="badge-link" :href="badge.href"
target="_blank" rel="noopener" @click.stop>
<img v-if="favicon" class="badge-favicon" :src="favicon" alt="" />
<span v-if="badge.label">{{ badge.label }}</span>
</a>
<template v-else>
<img v-if="favicon" class="badge-favicon" :src="favicon" alt="" />
<span v-if="badge.label">{{ badge.label }}</span>
</template>
<small v-if="badge.utm" class="small">{{ badge.utm }}</small>
</span>
</template>
<style scoped>
/* Browser-chrome chip on a translucent neutral wash (--badge-* in
pagerite.css, deliberately unthemed): black-on-transparent and
white-on-transparent favicons both stay legible on it. Colors go on the
inner elements, so the theme's link color rules cannot cascade in. The
padding is matched by negative margins so the chip's content stays
exactly where the bare text would sit without the badge — except on the
right, which keeps a small positive margin so the next trail item does
not abut the chip. */
.referer-badge {
position: relative;
display: inline-flex;
align-items: center;
gap: 0.35em;
/* Fixed line-height: the bar height is then exactly 1.2em + padding =
1.6em, so the icon below can be sized to match precisely (an
absolutely positioned replaced element cannot derive its height from
top/bottom offsets — its aspect ratio wins and bottom is dropped). */
line-height: 1.2;
padding: 0.2em 0.5em;
margin: -0.2em 0.25em -0.2em -0.2em;
/* Fully rounded: the bar is exactly 1.6em tall, so a 0.8em radius makes
both ends semicircles — a pill, with a full circle around the favicon
on the left. */
border-radius: 0.8em;
background: var(--badge-bg);
color: var(--badge-text);
white-space: nowrap;
}
/* Room for the absolutely positioned icon (its 1.6em width plus the gap). */
.referer-badge.with-icon {
padding-left: 1.95em;
}
/* Exactly the bar's height (1.6em, see line-height above), flush to the
top/left/bottom borders. The badge does not clip it (no overflow:
hidden): the icon may stick out past the bar's rounded corners.
Absolute on purpose: an in-flow image is the flex
container's first item and would supply the badge's baseline (an image's
baseline is its bottom edge), pushing the badge text above the baseline
of the trail items that follow. Out of flow, the badge's baseline comes
from its text, so baselines match. */
.badge-favicon {
position: absolute;
top: 0;
left: 0;
width: 1.6em;
height: 1.6em;
object-fit: cover;
}
/* The link is display: contents: the favicon and label lay out as flex
items of the badge itself, and only their actual boxes are clickable. */
.badge-link {
display: contents;
}
/* Click-to-copy affordance on everything outside the link (the UTM text
and the surrounding padding). */
.referer-badge.copyable {
cursor: pointer;
}
.referer-badge span,
.referer-badge small {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
}
.referer-badge span { color: var(--badge-text); }
.referer-badge small { color: var(--badge-muted); }
</style>
+21
View File
@@ -6,6 +6,7 @@ const props = defineProps({
step: { type: Object, required: true }, step: { type: Object, required: true },
count: { type: Number, default: 0 }, count: { type: Number, default: 0 },
favicons: { type: Object, default: null }, favicons: { type: Object, default: null },
flags: { type: Array, default: () => [] },
}) })
defineEmits(['close']) defineEmits(['close'])
@@ -38,6 +39,7 @@ const title = computed(() => {
<small v-if="count > 1" class="muted">{{ formatCount(count) }}×</small> <small v-if="count > 1" class="muted">{{ formatCount(count) }}×</small>
<img v-if="favicon" class="favicon" :src="favicon" alt="" /> <img v-if="favicon" class="favicon" :src="favicon" alt="" />
<span>{{ step.slug }}</span> <span>{{ step.slug }}</span>
<span v-for="(f, fi) in flags" :key="fi" class="flag" v-html="f"></span>
</a> </a>
</template> </template>
@@ -48,4 +50,23 @@ const title = computed(() => {
margin-right: 0.25em; margin-right: 0.25em;
vertical-align: -0.1em; vertical-align: -0.1em;
} }
/* Same flag chip as the visitor cells (VisitorCell.vue). */
.flag {
display: inline-flex;
width: 18px;
height: 12px;
margin-left: 0.25em;
border-radius: 2px;
overflow: hidden;
border: 1px solid var(--line);
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
vertical-align: middle;
}
.flag :deep(svg) {
width: 100%;
height: 100%;
display: block;
}
</style> </style>
+13 -7
View File
@@ -257,11 +257,14 @@ const countLabel = (n) =>
filter: drop-shadow(0 0 2.5px var(--accent)); filter: drop-shadow(0 0 2.5px var(--accent));
} }
.tmap .txnode { .tmap .txnode {
fill: var(--text); /* External source/exit pills: plain white on every theme, with a hairline
stroke: none; so the pill stays visible on a white page. */
fill: #fff;
stroke: var(--line, rgba(128, 128, 128, 0.4));
stroke-width: 1;
} }
.tmap .txnode-source { fill: var(--text); } .tmap .txnode-source { fill: #fff; }
.tmap .txnode-exit { fill: var(--text); } .tmap .txnode-exit { fill: #fff; }
/* Branch lanes: one wide concentric arc per path prefix, running behind /* Branch lanes: one wide concentric arc per path prefix, running behind
the node pills around the fan's circle center; parent levels sit one the node pills around the fan's circle center; parent levels sit one
indent (radius step) outward. Each lane's label follows a short guide indent (radius step) outward. Each lane's label follows a short guide
@@ -289,15 +292,18 @@ const countLabel = (n) =>
stroke: none; stroke: none;
} }
/* Text sizes are viewBox units: they shrink along with the graph on /* Text sizes are viewBox units: they shrink along with the graph on
narrow panels. Overlong labels are clipped at the pill border. */ narrow panels. Overlong labels are clipped at the pill border. The text
is always black, on accent (internal pills) and white (external pills)
alike — black stands out from any accent color, so the coloring stays
stable across themes and light/dark modes. */
.tmap .tnodeslug { .tmap .tnodeslug {
fill: var(--bg, Canvas); fill: #000;
font-size: 19px; font-size: 19px;
text-anchor: start; text-anchor: start;
} }
.tmap a { cursor: pointer; } .tmap a { cursor: pointer; }
.tmap .tnodecount { .tmap .tnodecount {
fill: var(--bg, Canvas); fill: #000;
opacity: 0.75; opacity: 0.75;
font-size: 15px; font-size: 15px;
text-anchor: middle; text-anchor: middle;
+41 -28
View File
@@ -4,6 +4,7 @@
*/ */
import { computed, onMounted, onUnmounted, ref } from 'vue' import { computed, onMounted, onUnmounted, ref } from 'vue'
import { makeSeries } from './analytics/time.js' import { makeSeries } from './analytics/time.js'
import { typicalWeek, weekBinIndex } from './analytics/seasonal.js'
import { import {
CHART_H, CHART_H,
CHART_W, CHART_W,
@@ -35,9 +36,6 @@ const allViews = computed(() => {
return all return all
}) })
const visitSeries = computed(() => makeSeries(props.data?.site_visits, props.range))
const viewSeries = computed(() => makeSeries(allViews.value, props.range))
function freqLabel(unit) { function freqLabel(unit) {
return unit === '5min' ? '5 min' : unit === 'hour' ? 'hourly' : 'daily' return unit === '5min' ? '5 min' : unit === 'hour' ? 'hourly' : 'daily'
} }
@@ -47,12 +45,6 @@ function axisLabel(unit, ylabel) {
return unit === '5min' ? `${ylabel} / 5 min` : `${freqLabel(unit)} ${ylabel}` return unit === '5min' ? `${ylabel} / 5 min` : `${freqLabel(unit)} ${ylabel}`
} }
/** Legend label for the overlaid past weeks: "Week M" or "Week MN". */
function pastLabel(series) {
const oldest = series.at(-1).label.slice(5) // strip "Week "
return series.length > 2 ? `Week ${oldest}${series[1].label.slice(5)}` : `Week ${oldest}`
}
const now = ref(Date.now()) const now = ref(Date.now())
let refreshInterval = null let refreshInterval = null
onMounted(() => { onMounted(() => {
@@ -62,8 +54,29 @@ onUnmounted(() => {
if (refreshInterval) clearInterval(refreshInterval) if (refreshInterval) clearInterval(refreshInterval)
}) })
const visitChart = computed(() => buildChart(visitSeries.value, now.value)) /**
const viewChart = computed(() => buildChart(viewSeries.value, now.value)) * Series for the current range plus, on the day and week views, the
* seasonal "typical week" history curve (all history up to now, already
* smoothed). Week view: the full Monday-first week. Day view: the rolling
* window's bins looked up from the same estimate, labeled by the weekday.
*/
function withTypical(buckets) {
const input = makeSeries(buckets, props.range)
if (props.range !== 'day' && props.range !== 'week') return input
const estimate = typicalWeek(buckets, now.value)
if (!estimate) return input
if (props.range === 'week') {
return { ...input, typical: { values: [...estimate], label: 'Typical week' } }
}
const values = input.series[0].points.map((p) => estimate[weekBinIndex(p.t)])
const weekday = new Date(now.value).toLocaleDateString(undefined, {
weekday: 'long', timeZone: 'UTC',
})
return { ...input, typical: { values, label: `Typical ${weekday}` } }
}
const visitChart = computed(() => buildChart(withTypical(props.data?.site_visits), now.value))
const viewChart = computed(() => buildChart(withTypical(allViews.value), now.value))
</script> </script>
<template> <template>
@@ -75,8 +88,7 @@ const viewChart = computed(() => buildChart(viewSeries.value, now.value))
<svg class="chart" :viewBox="`${-MARGIN_L} 0 ${VIEW_W} ${VIEW_H}`" <svg class="chart" :viewBox="`${-MARGIN_L} 0 ${VIEW_W} ${VIEW_H}`"
:style="{ maxWidth: `${VIEW_W}px`, marginLeft: CHART_MARGIN }" :style="{ maxWidth: `${VIEW_W}px`, marginLeft: CHART_MARGIN }"
role="img" :aria-label="axisLabel(c.chart.unit, c.ylabel)"> role="img" :aria-label="axisLabel(c.chart.unit, c.ylabel)">
<!-- Clip the plot curves to the chart area: past-week overlays can <!-- Clip the plot curves to the chart area; the svg itself is
run far above the autoscaled y range, and the svg itself is
overflow: visible for the axis labels. --> overflow: visible for the axis labels. -->
<clipPath :id="`plot-${c.ylabel}`"> <clipPath :id="`plot-${c.ylabel}`">
<rect x="0" y="0" :width="CHART_W" :height="CHART_H" /> <rect x="0" y="0" :width="CHART_W" :height="CHART_H" />
@@ -88,17 +100,17 @@ const viewChart = computed(() => buildChart(viewSeries.value, now.value))
class="minor vertical" /> class="minor vertical" />
</template> </template>
<g :clip-path="`url(#plot-${c.ylabel})`"> <g :clip-path="`url(#plot-${c.ylabel})`">
<!-- The muted "typical" history curve under the current data. -->
<path v-if="c.chart.typical" :d="c.chart.typical.line" class="line past" />
<template v-if="c.chart.bars"> <template v-if="c.chart.bars">
<rect v-for="(b, i) in c.chart.bars" :key="'b' + i" <rect v-for="(b, i) in c.chart.bars" :key="'b' + i"
:x="b.x" :y="b.y" :width="b.width" :height="b.height" class="bar" /> :x="b.x" :y="b.y" :width="b.width" :height="b.height" class="bar" />
<path :d="c.chart.skyline" class="line" /> <path :d="c.chart.skyline" class="line" />
</template> </template>
<template v-else> <template v-else>
<!-- Oldest overlay weeks first so the current week paints on top. --> <template v-for="(s, i) in c.chart.series" :key="i">
<template v-for="(s, i) in [...c.chart.series].reverse()" :key="i">
<path v-if="s.area" :d="s.area" class="area" /> <path v-if="s.area" :d="s.area" class="area" />
<path :d="s.line" class="line" :class="{ past: s.past }" <path :d="s.line" class="line" />
:style="{ opacity: s.opacity }" />
</template> </template>
</template> </template>
</g> </g>
@@ -111,16 +123,17 @@ const viewChart = computed(() => buildChart(viewSeries.value, now.value))
class="yaxis-label">{{ axisLabel(c.chart.unit, c.ylabel) }}</text> class="yaxis-label">{{ axisLabel(c.chart.unit, c.ylabel) }}</text>
<text v-for="t in c.chart.xticks" :key="'x' + t.x" :x="t.x" :y="CHART_H + MARGIN_B - 8" <text v-for="t in c.chart.xticks" :key="'x' + t.x" :x="t.x" :y="CHART_H + MARGIN_B - 8"
text-anchor="middle" class="xlab">{{ t.label }}</text> text-anchor="middle" class="xlab">{{ t.label }}</text>
<!-- Week overlay legend, top right inside the plot: current week in <!-- Legend, top right inside the plot: current data in accent
accent, one muted specimen for the whole past range. --> (week label, or "Last 24 hours" on the day view) and the
<g v-if="c.legend && c.chart.series.length > 1"> typical history curve in muted. -->
<line :x1="CHART_W - 98" :x2="CHART_W - 78" y1="10" y2="10" class="line" /> <g v-if="c.legend && c.chart.typical">
<text :x="CHART_W - 72" y="10" dominant-baseline="middle" <line :x1="CHART_W - 118" :x2="CHART_W - 98" y1="10" y2="10" class="line" />
class="leglab">{{ c.chart.series[0].label }}</text> <text :x="CHART_W - 92" y="10" dominant-baseline="middle"
<line :x1="CHART_W - 98" :x2="CHART_W - 78" y1="25" y2="25" class="leglab">{{ c.chart.bars ? 'Last 24 hours' : c.chart.series[0].label }}</text>
<line :x1="CHART_W - 118" :x2="CHART_W - 98" y1="25" y2="25"
class="line past" style="opacity: 0.6" /> class="line past" style="opacity: 0.6" />
<text :x="CHART_W - 72" y="25" dominant-baseline="middle" <text :x="CHART_W - 92" y="25" dominant-baseline="middle"
class="leglab">{{ pastLabel(c.chart.series) }}</text> class="leglab">{{ c.chart.typical.label }}</text>
</g> </g>
</svg> </svg>
</template> </template>
@@ -183,12 +196,12 @@ const viewChart = computed(() => buildChart(viewSeries.value, now.value))
.chart .area { .chart .area {
fill: var(--accent); fill: var(--accent);
opacity: 0.15; opacity: 0.6;
} }
.chart .bar { .chart .bar {
fill: var(--accent); fill: var(--accent);
opacity: 0.15; opacity: 0.6;
} }
.chart .line { .chart .line {
+31 -8
View File
@@ -181,16 +181,21 @@ export function spline(pts) {
export function buildChart(input, now = Date.now()) { export function buildChart(input, now = Date.now()) {
if (!input || !input.series.length) return null if (!input || !input.series.length) return null
if (input.unit === '5min') return buildDayChart(input, now) if (input.unit === '5min') return buildDayChart(input, now)
const { series, t0, t1, rate, binMinutes, unitMinutes, unit } = input const { series, t0, t1, rate, binMinutes, unitMinutes, unit, typical } = input
// Values are per-unit rates (hour on the week view, day on month+); the // Values are per-unit rates (hour on the week view, day on month+); the
// y max is derived from the *smoothed* curves so random single-bucket // y max is derived from the *smoothed* curves so random single-bucket
// spikes don't blow up the scale. Smoothing works on raw counts (its edge // spikes don't blow up the scale. Smoothing works on raw counts (its edge
// detector thresholds are count-based), the result is scaled back to rates. // detector thresholds are count-based), the result is scaled back to rates.
const smoothed = series.map((s) => const smoothed = series.map((s) =>
smooth(s.points.map((p) => p.count), binMinutes, unitMinutes).map((v) => v * rate)) smooth(s.points.map((p) => p.count), binMinutes, unitMinutes).map((v) => v * rate))
// Scale from the current/primary series only; older overlay weeks are drawn // The "typical week" seasonal estimate is already smooth: one value per
// with the same scale and allowed to overflow if they are busier. // bin spanning the full week (future included), drawn in the muted color.
const highest = Math.max(0, ...smoothed[0]) const typicalRates = typical
? [...typical.values].map((v) => v * rate)
: null
// Scale from the current series plus the typical curve; both are smooth,
// and neither should be clipped in normal traffic.
const highest = Math.max(0, ...smoothed[0], ...(typicalRates || []))
const { max, step, minor } = yScale(highest) const { max, step, minor } = yScale(highest)
const x = (t) => ((t - t0) / (t1 - t0)) * CHART_W const x = (t) => ((t - t0) / (t1 - t0)) * CHART_W
const y = (v) => PAD_TOP + (1 - Math.max(0, v) / max) * (CHART_H - PAD_TOP) const y = (v) => PAD_TOP + (1 - Math.max(0, v) / max) * (CHART_H - PAD_TOP)
@@ -205,6 +210,12 @@ export function buildChart(input, now = Date.now()) {
area: s.area ? `${line}L${last.x},${CHART_H}L${first.x},${CHART_H}Z` : null, area: s.area ? `${line}L${last.x},${CHART_H}L${first.x},${CHART_H}Z` : null,
} }
}) })
let typicalLine = null
if (typicalRates) {
const binMs = (t1 - t0) / typicalRates.length
const pts = typicalRates.map((v, i) => ({ x: x(t0 + i * binMs), y: y(v) }))
typicalLine = { line: spline(pts), label: typical.label }
}
// Major (labeled) and minor (hairline) y grid ticks. // Major (labeled) and minor (hairline) y grid ticks.
const majors = [] const majors = []
const minors = [] const minors = []
@@ -256,16 +267,19 @@ export function buildChart(input, now = Date.now()) {
x: x(t), label: fmtTick(t, t1 - t0), line: true, x: x(t), label: fmtTick(t, t1 - t0), line: true,
})) }))
} }
return { max, majors, minors, series: drawn, xticks, unit } return { max, majors, minors, series: drawn, typical: typicalLine, xticks, unit }
} }
/** /**
* Day view: 5-minute bars for the last 24 hours. Bars are drawn at raw * Day view: 5-minute bars for the last 24 hours. Bars are drawn at raw
* counts; the skyline uses a projected full-bucket value for the still-open * counts; the skyline uses a projected full-bucket value for the still-open
* final bucket. The y scale is derived from the projected skyline maximum. * final bucket. The y scale is derived from the projected skyline maximum.
* The optional "typical day" curve (per-bin counts aligned to the window's
* bins, cut from the typical-week estimate) overlays the bars as a smooth
* muted line and also feeds the y scale.
*/ */
export function buildDayChart(input, now = Date.now()) { export function buildDayChart(input, now = Date.now()) {
const { series, t0, t1 } = input const { series, t0, t1, typical } = input
const points = series[0]?.points || [] const points = series[0]?.points || []
const n = points.length const n = points.length
if (!n) return null if (!n) return null
@@ -285,7 +299,7 @@ export function buildDayChart(input, now = Date.now()) {
const share = elapsed / bucketMs const share = elapsed / bucketMs
return p.count + prevRaw * (1 - share) return p.count + prevRaw * (1 - share)
}) })
const highest = Math.max(0, ...projected) const highest = Math.max(0, ...projected, ...(typical ? typical.values : []))
const { max, step, minor } = yScale(highest) const { max, step, minor } = yScale(highest)
const y = (v) => PAD_TOP + (1 - Math.max(0, v) / max) * (CHART_H - PAD_TOP) const y = (v) => PAD_TOP + (1 - Math.max(0, v) / max) * (CHART_H - PAD_TOP)
@@ -313,6 +327,15 @@ export function buildDayChart(input, now = Date.now()) {
} }
} }
let typicalLine = null
if (typical) {
const pts = points.map((p, i) => ({
x: (i + 0.5) * bucketWidth,
y: y(typical.values[i] || 0),
}))
typicalLine = { line: spline(pts), label: typical.label }
}
const majors = [] const majors = []
const minors = [] const minors = []
const nMajor = Math.round(max / step) const nMajor = Math.round(max / step)
@@ -338,7 +361,7 @@ export function buildDayChart(input, now = Date.now()) {
line: false, line: false,
}) })
} }
return { bars, skyline: skyline.trim(), max, majors, minors, xticks, unit: '5min', series: [] } return { bars, skyline: skyline.trim(), typical: typicalLine, max, majors, minors, xticks, unit: '5min', series: [] }
} }
/** X ticks for year/all: Monday boundaries up to a quarter, UTC month /** X ticks for year/all: Monday boundaries up to a quarter, UTC month
+118 -22
View File
@@ -2,6 +2,7 @@
* Formatters and aggregators for summary sections: totals and the recent * Formatters and aggregators for summary sections: totals and the recent
* visit trail. * visit trail.
*/ */
import { flagFor, langName } from '../langs.js'
/** /**
* IPv4 unchanged, IPv6 returns the /64 network prefix in compact form. * IPv4 unchanged, IPv6 returns the /64 network prefix in compact form.
@@ -176,6 +177,55 @@ function stepOf(path, titles) {
return null return null
} }
/**
* Badge data combining a visit's/crawler's external referer origin with the
* visit's UTM tags: the origin as the badge link/label (the favicon is
* looked up by origin in the component), a compact UTM summary (the few
* most informative values) as ``utm`` with the full ``utm_*=value`` list
* as ``utmCopy`` for click-to-copy, and a one-fact-per-line tooltip — the
* full origin URL on the first line, then every ``utm_*=value`` pair.
* Null when there is no external referer and no UTM tag (a plain direct
* visit).
*/
function refererBadgeOf(referer, titles, utmTags = {}) {
const step = stepOf(referer, titles)
const external = step?.external ? step : null
// Compact UTM summary, in display order source, campaign, content, term:
// source only when no referer is known (it just repeats where the visitor
// came from), content only as a stand-in when there is no term. The
// remaining tags (medium and any nonstandard utm_*) fill in only when
// fewer than three of these more useful items exist — and never when a
// term is present (the term alone says enough). The tooltip keeps
// every tag, one pair per line.
const useful = []
if (utmTags.utm_source && !referer) useful.push(utmTags.utm_source)
if (utmTags.utm_campaign) useful.push(utmTags.utm_campaign)
if (utmTags.utm_content && !utmTags.utm_term) useful.push(utmTags.utm_content)
if (utmTags.utm_term) useful.push(utmTags.utm_term)
const rest = useful.length < 3 && !utmTags.utm_term
? Object.keys(utmTags)
.filter((k) => !['utm_source', 'utm_campaign', 'utm_content', 'utm_term'].includes(k))
.map((k) => utmTags[k])
.filter(Boolean)
: []
const utm = [...useful, ...rest].join(' · ')
if (!external && !utm) return null
const utmCopy = Object.entries(utmTags)
.map(([k, value]) => `${k}=${value}`)
.join('\n')
return {
href: external?.origin || '',
label: external?.slug || '',
origin: external?.origin || '',
utm,
utmCopy,
title: [
...(external ? [external.origin] : []),
...Object.entries(utmTags).map(([k, value]) => `${k}=${value}`),
].join('\n'),
}
}
/** /**
* Human-readable relative timestamp. Adapted from cista-storage: uses * Human-readable relative timestamp. Adapted from cista-storage: uses
* ``Intl.RelativeTimeFormat`` for short intervals and a compact date for * ``Intl.RelativeTimeFormat`` for short intervals and a compact date for
@@ -368,12 +418,13 @@ export function mainDomain(host, limit = 24) {
/** /**
* Group raw crawler hits by client hash and format each group as a row showing * Group raw crawler hits by client hash and format each group as a row showing
* every internal page that crawler visited. Rows are sorted by most recent hit * every internal page that crawler visited. Rows are sorted by most recent hit
* first, with total hits as a tie-breaker. The group's ``refererStep`` is the * first, with total hits as a tie-breaker. The group's ``refererBadge`` is
* latest external referer seen for the crawler — spiders often advertise * the latest external referer seen for the crawler — spiders often advertise
* their own site there — rendered with its favicon like visit referers. * their own site there — rendered as a badge with its favicon like visit
* referers.
* ``clients`` maps client hashes to client records. * ``clients`` maps client hashes to client records.
*/ */
export function formatCrawlerRows(crawlers, clients, pageTree, now = Date.now()) { export function formatCrawlerRows(crawlers, clients, pageTree, now = Date.now(), site = { multilingual: false, primaryLang: '' }) {
const titles = buildTitleMap(pageTree) const titles = buildTitleMap(pageTree)
const groups = new Map() const groups = new Map()
for (const c of crawlers || []) { for (const c of crawlers || []) {
@@ -384,10 +435,12 @@ export function formatCrawlerRows(crawlers, clients, pageTree, now = Date.now())
lastStart: 0, lastStart: 0,
referer: '', referer: '',
pages: new Map(), pages: new Map(),
langs: new Set(),
} }
const start = new Date(c.start).getTime() const start = new Date(c.start).getTime()
if (start > g.lastStart) g.lastStart = start if (start > g.lastStart) g.lastStart = start
if (c.referer) g.referer = c.referer if (c.referer) g.referer = c.referer
if (c.lang) g.langs.add(c.lang)
if (c.entry?.startsWith('/')) { if (c.entry?.startsWith('/')) {
const existing = g.pages.get(c.entry) || { count: 0, status: c.status || 200 } const existing = g.pages.get(c.entry) || { count: 0, status: c.status || 200 }
existing.count += 1 existing.count += 1
@@ -408,14 +461,22 @@ export function formatCrawlerRows(crawlers, clients, pageTree, now = Date.now())
const client = g.client || {} const client = g.client || {}
const host = client.host || '' const host = client.host || ''
const isHost = !!host const isHost = !!host
// Rendered languages read, shown only when they say something the
// primary language alone would not (multilingual sites only).
const langs = [...g.langs].sort()
const showLangs =
site.multilingual && (langs.length > 1 || (langs[0] && langs[0] !== site.primaryLang))
return { return {
lastSeen: formatWhen(g.lastStart, now), lastSeen: formatWhen(g.lastStart, now),
lastSeenIso: formatWhenIso(g.lastStart), lastSeenIso: formatWhenIso(g.lastStart),
lastSeenLocal: formatWhenLocal(g.lastStart), lastSeenLocal: formatWhenLocal(g.lastStart),
refererStep: stepOf(g.referer, titles), refererBadge: refererBadgeOf(g.referer, titles),
pages: [...g.pages.entries()] pages: [...g.pages.entries()]
.sort((a, b) => b[1].count - a[1].count) .sort((a, b) => b[1].count - a[1].count)
.map(([path, info]) => ({ ...stepOf(path, titles), count: info.count, status: info.status })), .map(([path, info]) => ({ ...stepOf(path, titles), count: info.count, status: info.status })),
readFlags: showLangs
? langs.map((l) => ({ flag: flagFor(l), name: langName(l) })).filter((f) => f.flag)
: [],
ip: client.ip || '', ip: client.ip || '',
ipDisplay: isHost ? mainDomain(host) : hostIP(client.ip) || client.ip || '—', ipDisplay: isHost ? mainDomain(host) : hostIP(client.ip) || client.ip || '—',
isHost, isHost,
@@ -548,42 +609,57 @@ export function formatAbuseRows(abuse, clients, pageTree, now = Date.now()) {
/** /**
* Format raw visit records as rows for a technical table. Returns objects * Format raw visit records as rows for a technical table. Returns objects
* with display strings; missing values become "—". ``trail`` starts with the * with display strings; missing values become "—". The external referer
* external referer (when present), then the entry page and any further internal * (when present) and the UTM tags ride along as ``refererBadge``; ``trail``
* pages or external exit origins. Only the 20 most recent visits are shown. * holds the entry page and any further internal pages or external exit
* ``clients`` maps client hashes to client records. * origins; consecutive views of the same page (e.g. a
* language switch re-view) merge into one step that keeps the
* consecutive-distinct rendered languages, summed read time, and the latest
* status. On multilingual sites the rendered languages surface as flag
* icons: a visit read entirely in one non-primary language gets ``rowFlag``,
* and a visit spanning languages gets per-step ``langFlags`` markers where
* the language begins or changes. Only the 20 most recent visits are shown.
* ``clients`` maps client hashes to client records; ``site`` carries the
* payload's multilingual/primary-language context.
*/ */
export function formatVisitRows(visits, clients, pageTree, now = Date.now()) { export function formatVisitRows(visits, clients, pageTree, now = Date.now(), site = { multilingual: false, primaryLang: '' }) {
const titles = buildTitleMap(pageTree) const titles = buildTitleMap(pageTree)
return [...(visits || [])].reverse().slice(0, 20).map((v) => { return [...(visits || [])].reverse().slice(0, 20).map((v) => {
const client = (clients || {})[v.client] || {} const client = (clients || {})[v.client] || {}
const trail = Object.values(v.trail || {}) const steps = Object.values(v.trail || {})
.map((item) => { .map((item) => {
const step = stepOf(item.to, titles) const step = stepOf(item.to, titles)
if (step) { if (step) {
if (item.read) step.readSeconds = item.read if (item.read) step.readSeconds = item.read
if (item.status) step.status = item.status if (item.status) step.status = item.status
if (item.lang) step.lang = item.lang
} }
return step return step
}) })
.filter(Boolean) .filter(Boolean)
const utmKeys = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content'] const trail = []
const utmValues = utmKeys.map((k) => (v.utm || {})[k]).filter(Boolean) for (const step of steps) {
const utm = utmValues.length ? utmValues.join(' · ') : '' const prev = trail[trail.length - 1]
const utmTitle = Object.entries(v.utm || {}) if (prev && prev.path === step.path) {
.map(([k, value]) => `${k}=${value}`) if (step.lang && step.lang !== prev.langs[prev.langs.length - 1]) prev.langs.push(step.lang)
.join(', ') if (step.readSeconds) prev.readSeconds = (prev.readSeconds || 0) + step.readSeconds
if (step.status) prev.status = step.status
} else {
step.langs = step.lang ? [step.lang] : []
trail.push(step)
}
}
const distinctLangs = new Set(trail.flatMap((s) => s.langs))
const dash = (s) => (s || '—') const dash = (s) => (s || '—')
const host = client.host || '' const host = client.host || ''
const isHost = !!host const isHost = !!host
return { const row = {
lastSeen: formatWhen(v.start, now), lastSeen: formatWhen(v.start, now),
lastSeenIso: formatWhenIso(v.start), lastSeenIso: formatWhenIso(v.start),
lastSeenLocal: formatWhenLocal(v.start), lastSeenLocal: formatWhenLocal(v.start),
langDisplay: formatLang(client.lang), langDisplay: formatLang(client.lang),
trail, trail,
refererStep: stepOf(v.referer, titles), refererBadge: refererBadgeOf(v.referer, titles, v.utm),
referer: dash(v.referer),
ip: client.ip || '', ip: client.ip || '',
ipDisplay: isHost ? mainDomain(host) : hostIP(client.ip) || client.ip || '—', ipDisplay: isHost ? mainDomain(host) : hostIP(client.ip) || client.ip || '—',
isHost, isHost,
@@ -593,8 +669,28 @@ export function formatVisitRows(visits, clients, pageTree, now = Date.now()) {
ua: client.uarite?.pretty || client.ua || '—', ua: client.uarite?.pretty || client.ua || '—',
uaRaw: client.ua || '', uaRaw: client.ua || '',
uaUrl: client.uarite?.url || '', uaUrl: client.uarite?.url || '',
utm: utm || '—',
utmTitle,
} }
if (site.multilingual && distinctLangs.size) {
if (distinctLangs.size === 1) {
const [tag] = distinctLangs
const flag = flagFor(tag)
if (flag && tag !== site.primaryLang) {
row.rowFlag = flag
row.rowFlagTitle = langName(tag)
}
} else {
// Flag the steps where the rendered language begins or changes;
// lang-less steps keep the comparison chain going, they never flag.
let lastLang = null
for (const step of trail) {
if (!step.langs.length) continue
if (!lastLang || step.langs[step.langs.length - 1] !== lastLang) {
step.langFlags = step.langs.map(flagFor).filter(Boolean)
}
lastLang = step.langs[step.langs.length - 1]
}
}
}
return row
}) })
} }
+109
View File
@@ -0,0 +1,109 @@
/**
* Seasonal "typical week" estimate from the full visit history.
*
* Port of the seasonal.py demo algorithm: the whole smoothed 5-minute
* history is collapsed onto a weekly grid with exponential decay over age —
* a fast kernel (half-life 7 days) for the average time-of-day pattern and
* a slow one (half-life 42 days) for per-weekday deviations from it. The
* deviation is shrunk by the effective number of weeks behind each bin
* (n_eff / (n_eff + 3)), so with little history the estimate falls back to
* the common daily pattern and weekday character emerges as data accrues.
* Bins before the first recorded bucket are treated as missing.
*/
import { DAY, MIN5, mondayUTC, rawTimes } from './time.js'
import { smooth } from './chart.js'
export const BINS_PER_DAY = 288
export const BINS_PER_WEEK = 7 * BINS_PER_DAY
// History cap: at 180 days the slow kernel's weight is 2^(-180/42) ≈ 5%
// (and the fast kernel's utterly negligible), so older data cannot move
// this noisy estimate — skipping it keeps the smoothing pass O(1).
const MAX_HISTORY_DAYS = 180
/**
* Estimate the typical week from a dense 5-minute count series (oldest
* first; non-finite values count as missing). endWeekBin is the week bin
* (Monday-first) just past the last sample. Returns BINS_PER_WEEK counts
* per 5-minute bin, starting Monday 00:00.
*/
export function seasonalCurve(counts, {
endWeekBin,
binsPerDay = BINS_PER_DAY,
recentHalfLife = 7,
weekdayHalfLife = 42,
shrinkWeeks = 3,
} = {}) {
const n = counts.length
const binsPerWeek = 7 * binsPerDay
const recentW = new Float64Array(binsPerDay)
const recentX = new Float64Array(binsPerDay)
const dayW = new Float64Array(binsPerDay)
const dayX = new Float64Array(binsPerDay)
const weekW = new Float64Array(binsPerWeek)
const weekX = new Float64Array(binsPerWeek)
const weekW2 = new Float64Array(binsPerWeek)
for (let i = 0; i < n; i++) {
const x = counts[i]
if (!Number.isFinite(x)) continue
let weekBin = (endWeekBin - n + i) % binsPerWeek
if (weekBin < 0) weekBin += binsPerWeek
const dayBin = weekBin % binsPerDay
const ageDays = (n - 1 - i) / binsPerDay
const recent = 2 ** (-ageDays / recentHalfLife)
const slow = 2 ** (-ageDays / weekdayHalfLife)
recentW[dayBin] += recent
recentX[dayBin] += recent * x
dayW[dayBin] += slow
dayX[dayBin] += slow * x
weekW[weekBin] += slow
weekX[weekBin] += slow * x
weekW2[weekBin] += slow * slow
}
const estimate = new Float64Array(binsPerWeek)
for (let wb = 0; wb < binsPerWeek; wb++) {
const db = wb % binsPerDay
const recentMean = recentW[db] > 0 ? recentX[db] / recentW[db] : NaN
const dayMean = dayW[db] > 0 ? dayX[db] / dayW[db] : NaN
const weekMean = weekW[wb] > 0 ? weekX[wb] / weekW[wb] : 0
const nEff = weekW2[wb] > 0 ? (weekW[wb] * weekW[wb]) / weekW2[wb] : 0
const shrink = nEff / (nEff + shrinkWeeks)
const base = Number.isFinite(recentMean)
? recentMean
: Number.isFinite(dayMean) ? dayMean : 0
const deviation = Number.isFinite(dayMean) ? weekMean - dayMean : 0
estimate[wb] = base + shrink * deviation
}
return estimate
}
/** Week bin (0 = Monday 00:0000:05 UTC) containing timestamp t. */
export function weekBinIndex(t) {
return Math.floor((t - mondayUTC(t)) / MIN5)
}
/**
* Typical-week estimate from sparse 5-minute buckets, using history up to
* tEnd (default now): bins are densified from the first recorded bucket
* (capped at MAX_HISTORY_DAYS back), smoothed with the same Gaussian the
* week view uses, then folded by seasonalCurve. Returns BINS_PER_WEEK
* counts per 5-minute bin starting Monday, or null when there is less than
* a day of history.
*/
export function typicalWeek(buckets, tEnd = Date.now()) {
const raw = rawTimes(buckets)
const times = Object.keys(raw).map(Number)
if (!times.length) return null
const end = Math.floor(tEnd / MIN5) * MIN5
const start = Math.max(Math.min(...times), end - MAX_HISTORY_DAYS * DAY)
const n = Math.floor((end - start) / MIN5)
if (n < BINS_PER_DAY) return null
const counts = new Array(n)
for (let i = 0; i < n; i++) counts[i] = raw[start + i * MIN5] || 0
const smoothed = smooth(counts, 5, 60)
return seasonalCurve(smoothed, { endWeekBin: weekBinIndex(end) })
}
+11 -47
View File
@@ -3,8 +3,8 @@
* *
* Raw data comes as sparse 5-minute buckets; the range picks the x window * Raw data comes as sparse 5-minute buckets; the range picks the x window
* and a coarser bucket size to keep point counts sane. The week range is * and a coarser bucket size to keep point counts sane. The week range is
* aligned to Monday 00:00 UTC and overlays previous weeks' curves (fading * aligned to Monday 00:00 UTC; a "typical week" seasonal estimate
* with age), so weekly patterns compare directly. * (seasonal.js) is overlaid on the week and day views by the chart builder.
*/ */
export const MIN5 = 5 * 60e3 export const MIN5 = 5 * 60e3
@@ -51,60 +51,24 @@ export function sumRange(raw, t0, t1) {
} }
/** /**
* One series per overlaid week: [this week, 1 week ago, ...], at native * The current week at native 5-minute resolution, truncated at the current
* 5-minute resolution, up to 8 weeks back (and only weeks that overlap the * bucket — no fake zeroes drawn for the future. Counts are rates per hour
* recorded data at all). Each older week's timestamps are shifted forward
* onto the current week's axis so all curves overlay inside the plot.
* The current week is truncated at the current bucket
* — no fake zeroes drawn for the future. Counts are rates per hour
* (bucket count * 12): a lone visit in a 5-minute bucket reads as "12/h". * (bucket count * 12): a lone visit in a 5-minute bucket reads as "12/h".
* The coarser ranges use per-day rates instead (unitMinutes = 24*60). * The coarser ranges use per-day rates instead (unitMinutes = 24*60).
* Previous weeks are no longer overlaid; the "typical week" seasonal
* estimate (seasonal.js) takes their place as the history reference.
*/ */
export function weeklySeries(buckets) { export function weeklySeries(buckets) {
const raw = rawTimes(buckets) const raw = rawTimes(buckets)
const times = Object.keys(raw).map(Number)
const now = Date.now() const now = Date.now()
const thisMonday = mondayUTC(now) const thisMonday = mondayUTC(now)
if (!times.length) { const points = []
const points = [] const end = Math.min(thisMonday + WEEK, Math.floor(now / MIN5) * MIN5 + MIN5)
const end = Math.min(thisMonday + WEEK, Math.floor(now / MIN5) * MIN5 + MIN5) for (let t = thisMonday; t < end; t += MIN5) {
for (let t = thisMonday; t < end; t += MIN5) { points.push({ t, count: raw[t] || 0 })
points.push({ t, count: 0 })
}
return {
series: [{ points, label: `Week ${isoWeek(thisMonday)}`, opacity: 1, area: true }],
t0: thisMonday,
t1: thisMonday + WEEK,
rate: HOUR / MIN5,
binMinutes: 5,
unitMinutes: 60,
unit: 'hour',
}
}
const oldest = Math.min(...times)
// Weeks back as far as the data reaches: difference in Monday indices.
const available = (thisMonday - mondayUTC(oldest)) / WEEK + 1
const count = Math.min(available, 8)
const out = []
for (let back = 0; back < count; back++) {
const start = thisMonday - back * WEEK
const end = back === 0
? Math.min(start + WEEK, Math.floor(now / MIN5) * MIN5 + MIN5)
: start + WEEK
const points = []
for (let t = start; t < end; t += MIN5) {
points.push({ t: t + back * WEEK, count: raw[t] || 0 })
}
out.push({
points,
label: `Week ${isoWeek(start)}`,
opacity: Math.max(0.15, 1 - back * 0.25),
past: back > 0,
area: back === 0,
})
} }
return { return {
series: out, series: [{ points, label: `Week ${isoWeek(thisMonday)}`, opacity: 1, area: true }],
t0: thisMonday, t0: thisMonday,
t1: thisMonday + WEEK, t1: thisMonday + WEEK,
rate: HOUR / MIN5, rate: HOUR / MIN5,
+23 -20
View File
@@ -26,6 +26,15 @@
/* Selection fill for page text and the CodeMirror editors; themes /* Selection fill for page text and the CodeMirror editors; themes
override when the accent tint clashes with accent-colored text. */ override when the accent tint clashes with accent-colored text. */
--selection-bg: color-mix(var(--accent) 30%, transparent); --selection-bg: color-mix(var(--accent) 30%, transparent);
/* Referer-badge chip in the analytics viewer: a translucent neutral wash,
deliberately NOT themed — the chip sits behind transparent favicons, so
black-on-transparent and white-on-transparent glyphs must both stay
legible on every theme (a slight whitening keeps black glyphs readable
on dark bars without a glaring solid-white chip). Being translucent, it
takes the page's tone, so its text follows the theme's colors. */
--badge-bg: #aaaaaa44;
--badge-text: var(--text);
--badge-muted: var(--muted);
/* Code highlighting palette, consumed by pygments.css: complete light and /* Code highlighting palette, consumed by pygments.css: complete light and
dark sets (background included), resolved by light-dark() from the dark sets (background included), resolved by light-dark() from the
used color-scheme. A theme picks a set simply by declaring used color-scheme. A theme picks a set simply by declaring
@@ -472,19 +481,20 @@ main {
container-type: inline-size; container-type: inline-size;
} }
/* Child-entry card stacks: a category page (and the content-less category /* Child-entry cards: a category page (and the content-less category
404) lists its published children after the markdown content — one column 404) lists its published children after the markdown content — one
per child, the child's whole subtree flattened into the column in menu card per child (a child without a page of its own is represented by
order (see _cards in views.py). The row bleeds to full page width its first leaf page; see _cards in views.py). The row bleeds to full
(div.wide): the columns first grow to fill it, then shrink rather than page width (div.wide): the cards first grow to fill it, then shrink
wrap. Every card has the same fixed 16/10 shape, covered entirely by the rather than wrap. Every card has the same fixed 16/10 shape, covered
entirely by the
page's share image (og:image heuristics, as a background — a gradient page's share image (og:image heuristics, as a background — a gradient
placeholder when it has none) with the title overlaid on a translucent placeholder when it has none) with the title overlaid on a translucent
band at the bottom. The card is one <a> holding only phrasing-level band at the bottom. The card is one <a> holding only phrasing-level
spans; the spans lay out as blocks. */ spans; the spans lay out as blocks. */
.cards { .cards {
display: flex; display: flex;
/* Stacks stop growing at their cap; center the row in the bleed then. */ /* Cards stop growing at their cap; center the row in the bleed then. */
justify-content: center; justify-content: center;
gap: 1.25rem; gap: 1.25rem;
margin-top: 2.5rem; margin-top: 2.5rem;
@@ -493,18 +503,7 @@ main {
padding-inline: 1.25rem; padding-inline: 1.25rem;
} }
.cards .stack { /* Phones: the cards stack vertically instead of shrinking to slivers.
/* Grow to fill the row (up to the cap — full-width rows would make huge
cards), shrink (not wrap) when there are too many. */
flex: 1 1 0;
max-width: 24rem;
min-width: 0;
display: flex;
flex-direction: column;
gap: 1.25rem;
}
/* Phones: the columns stack vertically instead of shrinking to slivers.
Text-only cards (gradient cover + description) then fit their content — Text-only cards (gradient cover + description) then fit their content —
the fixed 16/10 shape only makes sense for image covers. */ the fixed 16/10 shape only makes sense for image covers. */
@media (max-width: 48rem) { @media (max-width: 48rem) {
@@ -518,12 +517,16 @@ main {
} }
.card { .card {
/* Grow to fill the row (up to the cap — full-width rows would make huge
cards), shrink (not wrap) when there are too many. */
flex: 1 1 0;
max-width: 24rem;
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
aspect-ratio: 16 / 10; aspect-ratio: 16 / 10;
/* Allow shrinking below the text's min-content width: without this the /* Allow shrinking below the text's min-content width: without this the
text cards hold their stack wider than the image-only stacks. */ text cards hold their row wider than the image-only cards. */
min-width: 0; min-width: 0;
overflow: hidden; overflow: hidden;
border: 1px solid var(--line); border: 1px solid var(--line);
+11 -1
View File
@@ -628,7 +628,7 @@ import { reconnectPolicy, socketSlot, watchConnecting } from "./reconnect";
wsQueue.push(msg); wsQueue.push(msg);
} }
function ping({ to, fr = currentPath, read = 0 } = {}) { function ping({ to, fr = currentPath, read = 0, lang } = {}) {
// Reading-time updates from the analytics page itself are not tracked // Reading-time updates from the analytics page itself are not tracked
// (/_a is admin machinery; the server would reject the path anyway). // (/_a is admin machinery; the server would reject the path anyway).
if (!to && currentPath === "/_a") return; if (!to && currentPath === "/_a") return;
@@ -637,6 +637,11 @@ import { reconnectPolicy, socketSlot, watchConnecting } from "./reconnect";
if (to) msg.to = to; if (to) msg.to = to;
const secs = Math.round(read / 1000); const secs = Math.round(read / 1000);
if (secs > 0) msg.read = secs; if (secs > 0) msg.read = secs;
// The rendered language: normally the live <html lang>, but a language
// switch passes it explicitly — the swap that updates <html> runs inside
// the view-transition callback, after the switch ping goes out.
lang = lang || document.documentElement.lang;
if (lang) msg.lang = lang;
if (!msg.to && !msg.read) return; if (!msg.to && !msg.read) return;
report(msg); report(msg);
} }
@@ -815,6 +820,11 @@ import { reconnectPolicy, socketSlot, watchConnecting } from "./reconnect";
const y = scrollY; // a language switch is not a navigation: keep scroll const y = scrollY; // a language switch is not a navigation: keep scroll
await load(currentPath, false); await load(currentPath, false);
scrollTo(0, y); scrollTo(0, y);
// Log the switch as a trail event in the new language (load() updated
// <html lang>, but possibly inside a still-pending view transition, so
// pass the tag explicitly): the ping matches the switch's GET
// server-side, so it is not misclassified as a crawler hit.
ping({ to: currentPath, lang: tag });
}); });
// --- Fetch navigation ------------------------------------------------ // --- Fetch navigation ------------------------------------------------
+5 -5
View File
@@ -8,11 +8,11 @@
* - Disables Vite's screen clearing on startup * - Disables Vite's screen clearing on startup
* *
* Options: * Options:
* paths - Array of paths to proxy (default: ["/api"]) * paths - Array of paths to proxy (default: ['/api'])
*/ */
export default function fastapiVue({ paths = ["/api"] } = {}) { export default function fastapiVue({ paths = ['/api'] } = {}) {
const backendUrl = process.env.PAGERITE_BACKEND_URL || "http://localhost:8210" const backendUrl = process.env.PAGERITE_BACKEND_URL || 'http://localhost:8210'
// Build proxy configuration for each path // Build proxy configuration for each path
const proxy = {} const proxy = {}
@@ -25,12 +25,12 @@ export default function fastapiVue({ paths = ["/api"] } = {}) {
} }
return { return {
name: "vite-plugin-fastapi-pagerite", name: 'vite-plugin-fastapi-pagerite',
config: () => ({ config: () => ({
clearScreen: false, clearScreen: false,
server: { proxy }, server: { proxy },
build: { build: {
outDir: "../pagerite/frontend-build", outDir: '../pagerite/frontend-build',
emptyOutDir: true, emptyOutDir: true,
}, },
}), }),
+1 -1
View File
@@ -5,7 +5,7 @@ import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools' import vueDevTools from 'vite-plugin-vue-devtools'
const backendUrl = process.env.PAGERITE_BACKEND_URL || 'http://localhost:3200' const backendUrl = process.env.PAGERITE_BACKEND_URL || 'http://localhost:8210'
// Proxy everything except Vite's own dev-time paths and the backend machinery // Proxy everything except Vite's own dev-time paths and the backend machinery
// to the FastAPI backend in dev. /_api, /_f, /_themes, /_fonts and /_a are // to the FastAPI backend in dev. /_api, /_f, /_themes, /_fonts and /_a are
+13 -3
View File
@@ -5,12 +5,12 @@ import os
from pathlib import Path from pathlib import Path
import msgspec import msgspec
from fastapi_vue import server from fastapi_vue import env, server
from pagerite.config import Config from pagerite.config import Config
DEFAULT_PORT = 8100 DEFAULT_PORT = 8100
DEVMODE = os.getenv("PAGERITE_DEV") == "1" os.environ["FASTAPI_VUE"] = "PAGERITE"
def main() -> None: def main() -> None:
@@ -54,7 +54,17 @@ def main() -> None:
listen=args.listen, listen=args.listen,
default_port=DEFAULT_PORT, default_port=DEFAULT_PORT,
server_header=False, server_header=False,
reload=Path(__file__).parent if DEVMODE else False, reload=Path(__file__).parent if env.dev else False,
# Partial log config, merged over uvicorn's default by fastapi-vue:
# root prints at WARNING in production / INFO in dev. Keep our own
# loggers audible in production, and silence httpx's per-request INFO
# (tracking._schedule_favicon_fetch logs its own one-line summary).
log_config={
"loggers": {
"pagerite": {"level": "INFO"},
"httpx": {"level": "WARNING"},
}
},
**run_args, **run_args,
) )
+114 -24
View File
@@ -2,8 +2,9 @@
Raw recording, display-time classification. Every document GET is appended Raw recording, display-time classification. Every document GET is appended
to ``Analytics.gets`` as a raw access-log line (path with query string, true to ``Analytics.gets`` as a raw access-log line (path with query string, true
HTTP status, external referer origin, preload flag) and every pagerite.js HTTP status, external referer origin, preload flag, rendered content
activity message from the /_ws WebSocket is appended to ``Analytics.msgs`` language) and every pagerite.js activity message from the /_ws WebSocket is
appended to ``Analytics.msgs``
(navigations ``fr`` -> ``to`` and active reading-time updates). Nothing is (navigations ``fr`` -> ``to`` and active reading-time updates). Nothing is
classified when it is recorded: whether a client turns out to be a reader, classified when it is recorded: whether a client turns out to be a reader,
a crawler or a scanner is decided by ``Store.display()`` from the raw a crawler or a scanner is decided by ``Store.display()`` from the raw
@@ -92,6 +93,9 @@ class Ping(msgspec.Struct, omit_defaults=True):
read: int = 0 read: int = 0
#: Admin client: record but hide everything from the statistics. #: Admin client: record but hide everything from the statistics.
hide: bool = False hide: bool = False
#: Rendered language of the page the activity happened on (the page's
#: ``<html lang>``, sent by pagerite.js).
lang: str = ""
class Get(msgspec.Struct, omit_defaults=True): class Get(msgspec.Struct, omit_defaults=True):
@@ -115,6 +119,9 @@ class Get(msgspec.Struct, omit_defaults=True):
#: never counted as a view/crawler/abuse hit; recorded only so a later #: never counted as a view/crawler/abuse hit; recorded only so a later
#: cache-served navigation can be attributed this GET's status. #: cache-served navigation can be attributed this GET's status.
pre: bool = False pre: bool = False
#: Rendered content language of the served document; "" for
#: non-localized responses (404 probes, reserved paths).
lang: str = ""
class Msg(msgspec.Struct, omit_defaults=True): class Msg(msgspec.Struct, omit_defaults=True):
@@ -135,6 +142,9 @@ class Msg(msgspec.Struct, omit_defaults=True):
to: str = "" to: str = ""
#: Active reading time (seconds) spent on ``fr`` since the last report. #: Active reading time (seconds) spent on ``fr`` since the last report.
read: int = 0 read: int = 0
#: Rendered language reported by the client for the page the activity
#: happened on.
lang: str = ""
class Client(msgspec.Struct, omit_defaults=True): class Client(msgspec.Struct, omit_defaults=True):
@@ -191,6 +201,8 @@ class TrailItem(msgspec.Struct, omit_defaults=True):
``read`` accumulates active reading time (seconds) across the whole ``read`` accumulates active reading time (seconds) across the whole
visit; ``status`` is the most recent HTTP status seen for the target. visit; ``status`` is the most recent HTTP status seen for the target.
A page seen in two rendered languages within one visit (a mid-article
language switch) gets one item per language.
""" """
to: str to: str
@@ -198,6 +210,10 @@ class TrailItem(msgspec.Struct, omit_defaults=True):
read: int = 0 read: int = 0
#: Most recent HTTP status of the response (200 or 404). #: Most recent HTTP status of the response (200 or 404).
status: int = 200 status: int = 200
#: Rendered language of the target: the client's report, for the entry
#: page falling back to its GET's rendered language; "" when unknown
#: (old clients or data from before language recording).
lang: str = ""
class Visit(msgspec.Struct, omit_defaults=True): class Visit(msgspec.Struct, omit_defaults=True):
@@ -206,8 +222,9 @@ class Visit(msgspec.Struct, omit_defaults=True):
``trail`` holds the entry page and everything seen afterwards, keyed by ``trail`` holds the entry page and everything seen afterwards, keyed by
the timestamp of first sight (insertion order = first-seen order); the timestamp of first sight (insertion order = first-seen order);
re-visiting an already seen target updates its item instead of re-visiting an already seen target updates its item instead of
appending. Client metadata is held in ``Analytics.clients`` keyed by appending — unless the client reports a different rendered language for
``client``. it, which appends a distinct item (a mid-article language switch).
Client metadata is held in ``Analytics.clients`` keyed by ``client``.
""" """
start: datetime start: datetime
@@ -241,6 +258,8 @@ class CrawlerHit(msgspec.Struct, omit_defaults=True):
query: str = "" query: str = ""
#: HTTP status of the served response (200 or 404 for content pages). #: HTTP status of the served response (200 or 404 for content pages).
status: int = 200 status: int = 200
#: Rendered content language of the served document (from the GET).
lang: str = ""
class AbuseHit(msgspec.Struct, omit_defaults=True): class AbuseHit(msgspec.Struct, omit_defaults=True):
@@ -319,6 +338,12 @@ class Display(msgspec.Struct, omit_defaults=True):
views: dict[str, dict[str, int]] = {} views: dict[str, dict[str, int]] = {}
#: New visits per 5-minute bucket: bucket ISO -> count (sparse). #: New visits per 5-minute bucket: bucket ISO -> count (sparse).
site_visits: dict[str, int] = {} site_visits: dict[str, int] = {}
#: Site context: true when translation languages are configured, so the
#: viewer can suppress language UI on single-language sites.
multilingual: bool = False
#: The site's primary language (the front page's), so the viewer can
#: skip the primary-language default case.
primary_lang: str = ""
def _bucket(now: datetime) -> str: def _bucket(now: datetime) -> str:
@@ -594,22 +619,25 @@ class Store:
referer: str = "", referer: str = "",
accept_language: str = "", accept_language: str = "",
pre: bool = False, pre: bool = False,
lang: str = "",
) -> bytes | None: ) -> bytes | None:
"""Append one document GET to the raw log. """Append one document GET to the raw log.
``path`` is the full request path, query string included; ``status`` ``path`` is the full request path, query string included; ``status``
the true HTTP status of the response; ``referer`` the raw Referer the true HTTP status of the response; ``referer`` the raw Referer
header (reduced here to an external https origin, "" when internal header (reduced here to an external https origin, "" when internal
or absent); ``pre`` marks idle-time preloads from pagerite.js. or absent); ``pre`` marks idle-time preloads from pagerite.js;
``lang`` the rendered content language of the served document (""
for non-localized responses such as 404 probes and reserved paths).
Returns the client hash when the client record was just created (so Returns the client hash when the client record was just created (so
the caller can schedule async enrichment), else None. the caller can schedule async enrichment), else None.
""" """
lang, country = _parse_accept_language(accept_language) client_lang, country = _parse_accept_language(accept_language)
client_hash = _client_hash(ip, ua, lang) client_hash = _client_hash(ip, ua, client_lang)
new = client_hash not in self.data.clients new = client_hash not in self.data.clients
if new: if new:
self._ensure_client(ip, ua, lang, country=country) self._ensure_client(ip, ua, client_lang, country=country)
self.data.gets.append( self.data.gets.append(
Get( Get(
t=datetime.now(UTC), t=datetime.now(UTC),
@@ -618,6 +646,7 @@ class Store:
status=status, status=status,
ref=_origin(referer) or "", ref=_origin(referer) or "",
pre=pre, pre=pre,
lang=lang,
) )
) )
self._save() self._save()
@@ -632,6 +661,7 @@ class Store:
accept_language: str = "", accept_language: str = "",
hide: bool = False, hide: bool = False,
read: int = 0, read: int = 0,
lang: str = "",
) -> bytes | None: ) -> bytes | None:
"""Append one client activity message (``Ping`` from pagerite.js) to """Append one client activity message (``Ping`` from pagerite.js) to
the raw log. the raw log.
@@ -642,16 +672,18 @@ class Store:
stored raw and filtered at display time, so future rule changes lose stored raw and filtered at display time, so future rule changes lose
nothing. ``hide`` flags the client record as an admin; the message nothing. ``hide`` flags the client record as an admin; the message
itself is recorded normally and hidden at display time like itself is recorded normally and hidden at display time like
everything else the client ever did. everything else the client ever did. ``lang`` is the rendered
language reported by the client for the page the activity happened
on.
Returns the client hash when the client record was just created (so Returns the client hash when the client record was just created (so
the caller can schedule async enrichment), else None. the caller can schedule async enrichment), else None.
""" """
lang, country = _parse_accept_language(accept_language) client_lang, country = _parse_accept_language(accept_language)
client_hash = _client_hash(ip, ua, lang) client_hash = _client_hash(ip, ua, client_lang)
new = client_hash not in self.data.clients new = client_hash not in self.data.clients
if new: if new:
self._ensure_client(ip, ua, lang, country=country) self._ensure_client(ip, ua, client_lang, country=country)
if hide: if hide:
self.data.clients[client_hash].hide = True self.data.clients[client_hash].hide = True
fr = (_internal_path(fr) or "") if fr else "" fr = (_internal_path(fr) or "") if fr else ""
@@ -663,7 +695,14 @@ class Store:
target = _external_target(to) or "" target = _external_target(to) or ""
if target or read > 0: if target or read > 0:
self.data.msgs.append( self.data.msgs.append(
Msg(t=datetime.now(UTC), client=client_hash, fr=fr, to=target, read=read) Msg(
t=datetime.now(UTC),
client=client_hash,
fr=fr,
to=target,
read=read,
lang=lang,
)
) )
if target or read > 0 or hide: if target or read > 0 or hide:
self._save() self._save()
@@ -700,7 +739,13 @@ class Store:
self.data.favicons[origin] = Favicon(file=file, fetched=datetime.now(UTC)) self.data.favicons[origin] = Favicon(file=file, fetched=datetime.now(UTC))
self._save() self._save()
def display(self, in_menu: Callable[[str], bool] | None = None) -> Display: def display(
self,
in_menu: Callable[[str], bool] | None = None,
*,
multilingual: bool = False,
primary_lang: str = "",
) -> Display:
"""Build the viewer payload from the raw events. """Build the viewer payload from the raw events.
All classification happens here, so the stored data is independent All classification happens here, so the stored data is independent
@@ -722,10 +767,17 @@ class Store:
- visits: the remaining messages, grouped per client with a new - visits: the remaining messages, grouped per client with a new
visit after ``_SESSION_GAP`` of inactivity. Trail statuses come visit after ``_SESSION_GAP`` of inactivity. Trail statuses come
from the client's GETs (preloads included — a cache-served from the client's GETs (preloads included — a cache-served
navigation's only GET is its preload); the entry referer and UTM navigation's only GET is its preload); trail languages come from
tags from the GET that loaded the entry page. the client's messages (the entry item falling back to its GET's
rendered language), and a page re-visited in a different rendered
language becomes a distinct trail step. The entry referer and
UTM tags come from the GET that loaded the entry page.
Hidden (admin) clients are excluded from every list and aggregate. Hidden (admin) clients are excluded from every list and aggregate.
``multilingual`` and ``primary_lang`` are site context (translation
languages configured, the front page's primary language) copied
onto the payload so the viewer can suppress language UI on
single-language sites and skip the primary-language default case.
""" """
in_menu = in_menu or (lambda path: False) in_menu = in_menu or (lambda path: False)
data = self.data data = self.data
@@ -836,7 +888,11 @@ class Store:
g.path.split("?", 1)[1] if "?" in g.path else "" g.path.split("?", 1)[1] if "?" in g.path else ""
) )
visit.trail[m.t] = TrailItem( visit.trail[m.t] = TrailItem(
to=m.to, status=status_at(h, m.to, m.t) to=m.to,
status=status_at(h, m.to, m.t),
# The client's report wins; the entry GET fills
# in for old clients that don't send lang.
lang=m.lang or (g.lang if g is not None else ""),
) )
visits.append(visit) visits.append(visit)
else: else:
@@ -844,18 +900,40 @@ class Store:
visit.navs[m.t] = Nav(fr=fr, to=m.to) visit.navs[m.t] = Nav(fr=fr, to=m.to)
status = status_at(h, m.to, m.t) status = status_at(h, m.to, m.t)
# First-seen only: repeat pages and repeated exits # First-seen only: repeat pages and repeated exits
# update the existing trail item instead of appending. # update the existing trail item instead of
# appending — but a repeat in a different rendered
# language (a mid-article language switch) becomes
# a distinct step.
for item in visit.trail.values(): for item in visit.trail.values():
if item.to == m.to: if item.to == m.to:
item.status = status if m.lang and item.lang and m.lang != item.lang:
visit.trail[m.t] = TrailItem(
to=m.to, status=status, lang=m.lang
)
else:
item.status = status
if not item.lang:
item.lang = m.lang
break break
else: else:
visit.trail[m.t] = TrailItem(to=m.to, status=status) visit.trail[m.t] = TrailItem(
to=m.to, status=status, lang=m.lang
)
if m.read > 0 and m.fr and visit is not None: if m.read > 0 and m.fr and visit is not None:
# A page appears in the trail once per language seen:
# land the seconds on the matching-language step when
# the client reports one, else on the first-seen item.
read_item: TrailItem | None = None
for item in visit.trail.values(): for item in visit.trail.values():
if item.to == m.fr: if item.to != m.fr:
item.read += m.read continue
if read_item is None:
read_item = item
if m.lang and item.lang == m.lang:
read_item = item
break break
if read_item is not None:
read_item.read += m.read
last_t = m.t last_t = m.t
# --- crawler hits: document GETs no message matched # --- crawler hits: document GETs no message matched
@@ -889,6 +967,7 @@ class Store:
referer=g.ref, referer=g.ref,
query=query, query=query,
status=g.status, status=g.status,
lang=g.lang,
) )
) )
@@ -912,6 +991,7 @@ class Store:
referer=visit.referer if first else "", referer=visit.referer if first else "",
query=query if first else "", query=query if first else "",
status=item.status, status=item.status,
lang=item.lang,
) )
) )
first = False first = False
@@ -938,6 +1018,8 @@ class Store:
for origin, f in data.favicons.items() for origin, f in data.favicons.items()
if f.file if f.file
}, },
multilingual=multilingual,
primary_lang=primary_lang,
) )
for visit in kept: for visit in kept:
bucket = _bucket(visit.start) bucket = _bucket(visit.start)
@@ -959,6 +1041,14 @@ class Store:
nbuckets[nb] = nbuckets.get(nb, 0) + 1 nbuckets[nb] = nbuckets.get(nb, 0) + 1
return display return display
def display_json(self, in_menu: Callable[[str], bool] | None = None) -> str: def display_json(
self,
in_menu: Callable[[str], bool] | None = None,
*,
multilingual: bool = False,
primary_lang: str = "",
) -> str:
"""The ``display()`` payload as a JSON string for the WebSocket.""" """The ``display()`` payload as a JSON string for the WebSocket."""
return msgspec.json.encode(self.display(in_menu)).decode() return msgspec.json.encode(
self.display(in_menu, multilingual=multilingual, primary_lang=primary_lang)
).decode()
+25 -1
View File
@@ -19,6 +19,7 @@ from fastapi import (
WebSocket, WebSocket,
WebSocketDisconnect, WebSocketDisconnect,
) )
from html5tagger import E
from pydantic import BaseModel from pydantic import BaseModel
from pagerite import i18n, views from pagerite import i18n, views
@@ -495,6 +496,11 @@ async def editor_ws(ws: WebSocket) -> None:
markdown = msg.get("markdown", "") markdown = msg.get("markdown", "")
chain = resolve(data.menu, path) chain = resolve(data.menu, path)
node = chain[-1] if chain else None node = chain[-1] if chain else None
# Expand {cards} like page_content does, so the preview
# shows real cards, not the literal tag. No translation
# context: the preview has no lang of its own, so cards
# render in their originals.
has_cards_tag = views._CARDS_TAG_RE.search(markdown) is not None
rendered = render( rendered = render(
markdown, markdown,
path, path,
@@ -511,12 +517,30 @@ async def editor_ws(ws: WebSocket) -> None:
if node if node
else None else None
), ),
directives=(
{
"cards": lambda args, _env: views._cards_tag(
data.menu, data, node, path, args
)
}
if node is not None and has_cards_tag
else None
),
) )
html = rendered.html
if node is not None and not has_cards_tag:
# Without a {cards} tag page_content appends the
# children's cards after the content — the preview
# replaces the whole article, so include them here.
doc = E.div
with doc:
views._cards(doc, data.menu, data, node, path)
html += str(doc)
await ws.send_json( await ws.send_json(
{ {
"type": "html", "type": "html",
"path": path, "path": path,
"html": rendered.html, "html": html,
# Column-layout flag: the preview toggles the # Column-layout flag: the preview toggles the
# article's .multicol class and swaps in the # article's .multicol class and swaps in the
# segmented (.colseg/.cols) article html. # segmented (.colseg/.cols) article html.
+2 -3
View File
@@ -36,11 +36,10 @@ from pathlib import Path
from fastapi import FastAPI, Request from fastapi import FastAPI, Request
from fastapi.responses import Response from fastapi.responses import Response
from fastapi_vue import Frontend from fastapi_vue import Frontend, env
from starlette.types import ASGIApp, Receive, Scope, Send from starlette.types import ASGIApp, Receive, Scope, Send
from pagerite import api, files, pages, tracking from pagerite import api, files, pages, tracking
from pagerite.__main__ import DEVMODE
from pagerite.files import file_store from pagerite.files import file_store
from pagerite.state import analytics_store, config, kanta from pagerite.state import analytics_store, config, kanta
@@ -99,7 +98,7 @@ async def lifespan(_app: FastAPI) -> AsyncGenerator:
# is not meant to be browsable by the public anyway. # is not meant to be browsable by the public anyway.
app = FastAPI( app = FastAPI(
title="Pagerite", title="Pagerite",
debug=DEVMODE, debug=env.dev,
lifespan=lifespan, lifespan=lifespan,
docs_url=None, docs_url=None,
redoc_url=None, redoc_url=None,
+2 -7
View File
@@ -39,10 +39,6 @@ from pagerite.state import (
logger = logging.getLogger(__name__) logger = logging.getLogger(__name__)
# mediapreview logs pyvips noise ("VipsForeignSaveJpegTarget argument strip is
# deprecated", "threadpool completed with N workers") at INFO; keep warnings.
logging.getLogger("mediapreview").setLevel(logging.WARNING)
router = APIRouter() router = APIRouter()
@@ -159,14 +155,13 @@ def _svg_to_png(body: bytes, maxsize: int) -> bytes | None:
def _avif_to_format(avif: bytes, suffix: str, quality: int) -> bytes: def _avif_to_format(avif: bytes, suffix: str, quality: int) -> bytes:
"""Re-encode the AVIF derivative into a fallback format (WebP/JPEG) """Re-encode the AVIF derivative into a fallback format (WebP/JPEG)
via pyvips. JPEG has no alpha, so it is flattened onto white; via pyvips. JPEG has no alpha, so it is flattened onto white."""
``strip`` keeps metadata (EXIF) out of the fallbacks."""
import pyvips import pyvips
img = pyvips.Image.new_from_buffer(avif, "") img = pyvips.Image.new_from_buffer(avif, "")
if suffix == ".jpg" and img.hasalpha(): if suffix == ".jpg" and img.hasalpha():
img = img.flatten(background=[255, 255, 255]) img = img.flatten(background=[255, 255, 255])
return img.write_to_buffer(suffix, Q=quality, strip=True) return img.write_to_buffer(suffix, Q=quality, keep="none")
def _image_derivatives( def _image_derivatives(
+5 -10
View File
@@ -87,21 +87,16 @@ def select_language(
1. ``?lang=`` wins when a translation exists for it (otherwise falls 1. ``?lang=`` wins when a translation exists for it (otherwise falls
through to the header logic). through to the header logic).
2. The original language anywhere in the header list wins — an AI 2. Otherwise the first header language that can be served — the
translation is strictly worse than the original for anyone who has original, or one with an available translation.
English configured at all. 3. Fall back to the original.
3. Otherwise the first header language with an available translation.
4. Fall back to the original.
""" """
if query_lang: if query_lang:
tag = base_tag(query_lang) tag = base_tag(query_lang)
if tag == original or (tag and is_available(tag)): if tag == original or (tag and is_available(tag)):
return tag return tag
langs = parse_accept_language(accept_language or "") for lang in parse_accept_language(accept_language or ""):
if original in langs: if lang == original or is_available(lang):
return original
for lang in langs:
if lang != original and is_available(lang):
return lang return lang
return original return original
+79 -5
View File
@@ -56,9 +56,15 @@ becomes a block `<figure>` — with `<figcaption>` when it has a title.
Images inline with other content stay plain inline `<img>`, as does raw Images inline with other content stay plain inline `<img>`, as does raw
`<img>` HTML written by the author. Positioning is done with attribute `<img>` HTML written by the author. Positioning is done with attribute
classes, e.g. `![alt](photo.avif "Caption"){.right}`. classes, e.g. `![alt](photo.avif "Caption"){.right}`.
A lone `{name}` or `{name: args}` line is a block directive, expanded by
the caller through render(directives=...) — `{dates}` (built in) expands
to the article's dateline, `{cards}` / `{cards: path ...}` to card rows
of other pages (views.py). Unresolved tags render as the literal source.
""" """
import re import re
from collections.abc import Callable
from datetime import datetime, timedelta from datetime import datetime, timedelta
from typing import NamedTuple from typing import NamedTuple
@@ -505,6 +511,64 @@ def anchor_ids(text: str, title: str | None = None) -> list[str]:
] ]
#: A lone {...} paragraph: a block directive like {dates} or
#: {cards: docs/* news} — name, then optional ":"-separated argument text.
_DIRECTIVE_RE = re.compile(r"\{([a-z][a-z0-9_-]*)(?::([^{}\n]*))?\}")
def _directives(state) -> None:
"""Turn lone ``{name}`` / ``{name: args}`` paragraphs into directive tokens.
The expansion is not markdown.py's business: _directive_rule delegates
to the resolvers render() put in env["directives"], falling back to the
literal source when the tag is unknown in the context (e.g. the editor
preview of a page that does not exist yet). The ``cards`` directive gets .wide so it
stands alone as a full-width block outside the column segments (the
card markup never flows in columns). Runs on the render instance only —
the verbatim parser keeps the plain paragraph so segments/chunks see
the placeholder source.
"""
tokens = state.tokens
out = []
i = 0
while i < len(tokens):
if (
i + 2 < len(tokens)
and tokens[i].type == "paragraph_open"
and tokens[i + 1].type == "inline"
and tokens[i + 2].type == "paragraph_close"
):
inline = tokens[i + 1]
children = inline.children or []
if len(children) == 1 and children[0].type == "text":
m = _DIRECTIVE_RE.fullmatch(children[0].content.strip())
if m:
token = Token("directive", "", 0)
token.level = tokens[i].level
token.map = tokens[i].map
token.content = m.group(0)
token.meta = {"name": m.group(1), "args": (m.group(2) or "").strip()}
if m.group(1) == "cards":
token.attrSet("class", "wide")
out.append(token)
i += 3
continue
out.append(tokens[i])
i += 1
state.tokens = out
def _directive_rule(self: RendererHTML, tokens, idx: int, options, env: dict) -> str:
"""Render a directive token via env["directives"][name](args, env);
unresolved tags render as the literal source paragraph."""
token = tokens[idx]
resolver = (env.get("directives") or {}).get(token.meta["name"])
html = resolver(token.meta["args"], env) if resolver else None
if html is None:
return f"<p>{escapeHtml(token.content)}</p>\n"
return html + "\n"
def make_md(*, verbatim: bool = False) -> MarkdownIt: def make_md(*, verbatim: bool = False) -> MarkdownIt:
"""A fully configured parser. The module-level ``md`` (below) is the """A fully configured parser. The module-level ``md`` (below) is the
render instance; ``verbatim=True`` builds the segmentation instance for render instance; ``verbatim=True`` builds the segmentation instance for
@@ -539,6 +603,7 @@ def make_md(*, verbatim: bool = False) -> MarkdownIt:
) )
parser.add_render_rule("image", _image_rule) parser.add_render_rule("image", _image_rule)
parser.add_render_rule("fence", _fence_rule) parser.add_render_rule("fence", _fence_rule)
parser.add_render_rule("directive", _directive_rule)
# GFM alerts (`> [!NOTE]` etc.), built into markdown-it-py's blockquote rule. # GFM alerts (`> [!NOTE]` etc.), built into markdown-it-py's blockquote rule.
parser.options["alerts"] = True parser.options["alerts"] = True
# Block attrs must be stripped before the typographer curlifies their quotes. # Block attrs must be stripped before the typographer curlifies their quotes.
@@ -548,6 +613,8 @@ def make_md(*, verbatim: bool = False) -> MarkdownIt:
parser.core.ruler.push("tag_task_checkboxes", _tag_task_checkboxes) parser.core.ruler.push("tag_task_checkboxes", _tag_task_checkboxes)
parser.core.ruler.push("shorten_autolinks", _shorten_autolinks) parser.core.ruler.push("shorten_autolinks", _shorten_autolinks)
parser.core.ruler.push("heading_ids", _heading_ids) parser.core.ruler.push("heading_ids", _heading_ids)
if not verbatim:
parser.core.ruler.push("directives", _directives)
return parser return parser
@@ -661,6 +728,7 @@ def render(
modified: datetime | None = None, modified: datetime | None = None,
title: str | None = None, title: str | None = None,
anchors_from: tuple[str, str] | None = None, anchors_from: tuple[str, str] | None = None,
directives: dict[str, Callable[[str, dict], str | None]] | None = None,
) -> Rendered: ) -> Rendered:
"""Render Markdown text to the article body's HTML and layout flags. """Render Markdown text to the article body's HTML and layout flags.
@@ -682,11 +750,19 @@ def render(
classes. classes.
A ``{dates}`` line expands to the article's published/updated dateline A ``{dates}`` line expands to the article's published/updated dateline
(needs ``created``/``modified``; left as-is in contexts without them, (needs ``created``/``modified``). Block directives in general — a lone
e.g. the editor preview). Position is the author's choice — typically ``{name}`` or ``{name: args}`` line — are expanded by the resolvers
passed as ``directives`` (name → (args, env) → HTML or None), with
``dates`` built in when ``created`` is given; unresolved tags render as
the literal source (e.g. in the editor preview of a not-yet-created
page).
Position is the author's choice — the dateline typically goes
right after the article's h1. right after the article's h1.
""" """
env = {"page_path": page_path, "line_offset": 0} directives = dict(directives or {})
if created is not None:
directives.setdefault("dates", lambda _args, _env: _dateline(created, modified))
env = {"page_path": page_path, "line_offset": 0, "directives": directives}
if anchors_from is not None: if anchors_from is not None:
env["anchor_ids"] = anchor_ids(*anchors_from) env["anchor_ids"] = anchor_ids(*anchors_from)
if title and not has_h1(text): if title and not has_h1(text):
@@ -732,8 +808,6 @@ def render(
html = marked html = marked
parts.append(f'<div class="colseg{cols}">{html}</div>') parts.append(f'<div class="colseg{cols}">{html}</div>')
html = "".join(parts) html = "".join(parts)
if created is not None and "<p>{dates}</p>" in html:
html = html.replace("<p>{dates}</p>", _dateline(created, modified))
return Rendered(html, total > MULTICOL_TEXT) return Rendered(html, total > MULTICOL_TEXT)
+4 -3
View File
@@ -152,7 +152,8 @@ async def show_page(request: Request, path: str) -> Response:
if node is not None and node.published and node.chunks is not None: if node is not None and node.published and node.chunks is not None:
# Language selection (docs/localization.md): ?lang= wins when a # Language selection (docs/localization.md): ?lang= wins when a
# translation exists, else header logic. Analytics keep the raw # translation exists, else header logic. Analytics keep the raw
# Accept-Language header regardless of the selection. # Accept-Language header regardless of the selection, and record
# the resolved language as the GET's rendered language.
query_lang = request.query_params.get("lang") query_lang = request.query_params.get("lang")
lang = i18n.select_language( lang = i18n.select_language(
query_lang, query_lang,
@@ -175,7 +176,7 @@ async def show_page(request: Request, path: str) -> Response:
if request.headers.get("if-none-match") == etag: if request.headers.get("if-none-match") == etag:
return Response(status_code=304) return Response(status_code=304)
if _is_trackable_path(path): if _is_trackable_path(path):
_record_get(request) _record_get(request, lang=lang)
return _html_response( return _html_response(
request, request,
"page", "page",
@@ -205,7 +206,7 @@ async def show_page(request: Request, path: str) -> Response:
) )
link_lang = i18n.base_tag(query_lang or "") link_lang = i18n.base_tag(query_lang or "")
if _is_trackable_path(path): if _is_trackable_path(path):
_record_get(request, status=404) _record_get(request, status=404, lang=lang)
return _html_response( return _html_response(
request, request,
"category", "category",
+6 -2
View File
@@ -22,11 +22,11 @@ from pathlib import Path
import blake3 import blake3
from fastapi import HTTPException, Request from fastapi import HTTPException, Request
from fastapi.responses import Response from fastapi.responses import Response
from fastapi_vue import env
from kanta import Kanta from kanta import Kanta
from zstandard import ZstdCompressor from zstandard import ZstdCompressor
from pagerite import analytics, i18n, seed, translate, views from pagerite import analytics, i18n, seed, translate, views
from pagerite.__main__ import DEVMODE
from pagerite.chunks import store_chunks from pagerite.chunks import store_chunks
from pagerite.config import load from pagerite.config import load
from pagerite.data import ( from pagerite.data import (
@@ -56,6 +56,10 @@ DB_PATH = os.getenv("PAGERITE_DB", str(SITE_DIR / "content.kantadb"))
# Visit analytics go to their own JSON file, not the kanta database. # Visit analytics go to their own JSON file, not the kanta database.
ANALYTICS_PATH = Path(os.getenv("PAGERITE_ANALYTICS", str(SITE_DIR / "analytics.json"))) ANALYTICS_PATH = Path(os.getenv("PAGERITE_ANALYTICS", str(SITE_DIR / "analytics.json")))
# The per-hostname data directory may not exist yet on first run; kanta
# creates the database file but not its parent directory.
Path(DB_PATH).parent.mkdir(parents=True, exist_ok=True)
ANALYTICS_PATH.parent.mkdir(parents=True, exist_ok=True)
analytics_store = analytics.Store(ANALYTICS_PATH) analytics_store = analytics.Store(ANALYTICS_PATH)
# Content-addressed file store (uploads, seed assets, fetched favicons): # Content-addressed file store (uploads, seed assets, fetched favicons):
@@ -226,7 +230,7 @@ def _html_response(
# Absolute social/canonical URLs use the site's public origin; on # Absolute social/canonical URLs use the site's public origin; on
# localhost (varying ports) fall back to the request's own base URL. # localhost (varying ports) fall back to the request's own base URL.
base_url = SITE_URL or str(request.base_url).rstrip("/") base_url = SITE_URL or str(request.base_url).rstrip("/")
if DEVMODE: if env.dev:
identity = _render_html(kind, path, base_url, lang, link_lang).encode() identity = _render_html(kind, path, base_url, lang, link_lang).encode()
body = _zstd.compress(identity) if zstd else identity body = _zstd.compress(identity) if zstd else identity
else: else:
+25 -10
View File
@@ -28,17 +28,13 @@ from fastapi import APIRouter, Request, WebSocket, WebSocketDisconnect
from fastapi.responses import Response from fastapi.responses import Response
from uarite import uaparse from uarite import uaparse
from pagerite import analytics from pagerite import analytics, i18n
from pagerite.data import resolve from pagerite.data import resolve
from pagerite.files import _hash_name, file_store from pagerite.files import _hash_name, file_store
from pagerite.state import SITE_URL, _html_response, analytics_store, data from pagerite.state import SITE_URL, _html_response, analytics_store, data
logger = logging.getLogger(__name__) logger = logging.getLogger(__name__)
# httpx logs every request at INFO (e.g. the favicon fetches below); our own
# one-line summary in _schedule_favicon_fetch replaces that noise.
logging.getLogger("httpx").setLevel(logging.WARNING)
router = APIRouter() router = APIRouter()
# Live WebSocket clients for the analytics stream. # Live WebSocket clients for the analytics stream.
@@ -334,7 +330,7 @@ async def _broadcast_analytics() -> None:
"""Send the current analytics snapshot to every connected WS client.""" """Send the current analytics snapshot to every connected WS client."""
if not _analytics_ws_clients: if not _analytics_ws_clients:
return return
payload = analytics_store.display_json(_in_menu) payload = _display_json()
closed = set() closed = set()
for ws in _analytics_ws_clients: for ws in _analytics_ws_clients:
try: try:
@@ -370,12 +366,29 @@ def _in_menu(path: str) -> bool:
return resolve(data.menu, path.strip("/")) is not None return resolve(data.menu, path.strip("/")) is not None
def _record_get(request: Request, *, status: int = 200) -> None: def _display_json() -> str:
"""The current analytics snapshot as JSON for the admin stream.
Adds the site's language context: ``multilingual`` (translation
languages configured) lets the viewer suppress language UI on
single-language sites, ``primary_lang`` (the front page's) lets it skip
the primary-language default case.
"""
return analytics_store.display_json(
_in_menu,
multilingual=bool(data.translate_langs),
primary_lang=i18n.primary_lang(data.menu, ""),
)
def _record_get(request: Request, *, status: int = 200, lang: str = "") -> None:
"""Record the document GET as one raw access-log line in analytics. """Record the document GET as one raw access-log line in analytics.
Nothing is classified here — the true HTTP status, the full request path Nothing is classified here — the true HTTP status, the full request path
(query included), an external referer origin and the preload flag are (query included), an external referer origin, the preload flag and the
stored, and visitor/crawler/abuse classification happens at display time rendered content language (``lang``, "" for non-localized responses such
as 404 probes and reserved paths) are stored, and
visitor/crawler/abuse classification happens at display time
(see analytics.Store.display). Idle-time preloads from pagerite.js (see analytics.Store.display). Idle-time preloads from pagerite.js
(``x-pagerite-preload`` header) are recorded with ``pre=True``: never (``x-pagerite-preload`` header) are recorded with ``pre=True``: never
counted, but a navigation later served from the in-memory page cache is counted, but a navigation later served from the in-memory page cache is
@@ -403,6 +416,7 @@ def _record_get(request: Request, *, status: int = 200) -> None:
referer=referer, referer=referer,
accept_language=request.headers.get("accept-language", ""), accept_language=request.headers.get("accept-language", ""),
pre=bool(request.headers.get("x-pagerite-preload")), pre=bool(request.headers.get("x-pagerite-preload")),
lang=lang,
) )
if client_hash is not None: if client_hash is not None:
_schedule_client_enrichment([client_hash]) _schedule_client_enrichment([client_hash])
@@ -462,6 +476,7 @@ async def activity_ws(ws: WebSocket) -> None:
accept_language, accept_language,
hide=msg.hide, hide=msg.hide,
read=msg.read, read=msg.read,
lang=msg.lang,
) )
if new_client is not None: if new_client is not None:
_schedule_client_enrichment([new_client]) _schedule_client_enrichment([new_client])
@@ -478,7 +493,7 @@ async def analytics_websocket(ws: WebSocket) -> None:
endpoint. Powers the analytics viewer rendered at /_a. endpoint. Powers the analytics viewer rendered at /_a.
""" """
await ws.accept() await ws.accept()
await ws.send_text(analytics_store.display_json(_in_menu)) await ws.send_text(_display_json())
_analytics_ws_clients.add(ws) _analytics_ws_clients.add(ws)
try: try:
while True: while True:
+141 -29
View File
@@ -21,6 +21,7 @@ import json
import os import os
import re import re
from fastapi_vue import env
from html5tagger import HTML, Document, E, Template from html5tagger import HTML, Document, E, Template
from platformdirs import site_data_dir, user_data_path from platformdirs import site_data_dir, user_data_path
@@ -337,7 +338,7 @@ def _layout(
) -> Template: ) -> Template:
"""Page layout template with standard assets and ES-module scripts. """Page layout template with standard assets and ES-module scripts.
In dev (PAGERITE_VITE_URL set) assets are linked from the Vite dev In dev (Vite dev-server URL set) assets are linked from the Vite dev
server and stylesheets use ``blocking="render"`` so the browser waits server and stylesheets use ``blocking="render"`` so the browser waits
for them before showing the page, avoiding a flash of unstyled content. for them before showing the page, avoiding a flash of unstyled content.
In production all page assets are inlined into the document: stylesheets In production all page assets are inlined into the document: stylesheets
@@ -394,7 +395,7 @@ def _layout(
# dev-server URLs as meta tags (Vite serves the modules and injects # dev-server URLs as meta tags (Vite serves the modules and injects
# their CSS for hot reloads); production inlines all page assets and # their CSS for hot reloads); production inlines all page assets and
# carries the on-demand URLs in one JSON script instead. # carries the on-demand URLs in one JSON script instead.
vite_url = os.environ.get("PAGERITE_VITE_URL") vite_url = env.vite_url
editor_scripts, editor_css = _editor_assets() editor_scripts, editor_css = _editor_assets()
langselect_scripts, langselect_css = _langselect_assets() langselect_scripts, langselect_css = _langselect_assets()
config = { config = {
@@ -790,7 +791,10 @@ def page_content(
"""Render the contents of the #main element for a page. """Render the contents of the #main element for a page.
A page with published children (a category page) lists them as cards A page with published children (a category page) lists them as cards
after the markdown content. With a translation, its Markdown goes after the markdown content — unless the content has a ``{cards}`` tag,
which places card rows itself (bare: the children; with paths:
those pages, ``path/*`` their children, ``path/**`` all descendants),
one row per tag. With a translation, its Markdown goes
through the same render pipeline; missing pieces (markdown=None, absent through the same render pipeline; missing pieces (markdown=None, absent
title entries) fall back to the original. ``lang`` feeds the cards' title entries) fall back to the original. ``lang`` feeds the cards'
per-target localization. per-target localization.
@@ -812,8 +816,24 @@ def page_content(
) )
# The title is injected into the markdown (as # title when it has no # The title is injected into the markdown (as # title when it has no
# h1 of its own), so title and content render as one article. # h1 of its own), so title and content render as one article.
# A {cards} tag places the card rows itself (possibly several);
# without one the children are appended after the content as before.
has_cards_tag = _CARDS_TAG_RE.search(content) is not None
directives = None
if has_cards_tag:
directives = {
"cards": lambda args, _env: _cards_tag(
menu, data, node, path, args, translation, link_lang, lang
)
}
rendered = render( rendered = render(
content, path, node.created, node.modified, title=title, anchors_from=anchors_from content,
path,
node.created,
node.modified,
title=title,
anchors_from=anchors_from,
directives=directives,
) )
# Long articles get .multicol: the article column cap lifts (see the # Long articles get .multicol: the article column cap lifts (see the
# #content grid in pagerite.css) and the .cols segments lay out in at # #content grid in pagerite.css) and the .cols segments lay out in at
@@ -822,10 +842,25 @@ def page_content(
doc = E.article(class_="multicol") if rendered.multicol else E.article doc = E.article(class_="multicol") if rendered.multicol else E.article
with doc: with doc:
doc(HTML(rendered.html)) doc(HTML(rendered.html))
_cards(doc, menu, data, node, path, translation, link_lang, lang) if not has_cards_tag:
_cards(doc, menu, data, node, path, translation, link_lang, lang)
return HTML(str(doc)) return HTML(str(doc))
def _represent(node: Node, path: str) -> tuple[str, Node] | None:
"""The (path, node) a card for this menu item points at: the item
itself when it has a page, else its first published leaf page,
recursively — the same logic as nav links (first_leaf)."""
if node.chunks:
return path, node
for slug, child in sorted_nodes(node.children):
if child.published:
cpath = f"{path}/{slug}" if path else slug
if r := _represent(child, cpath):
return r
return None
def _cards( def _cards(
doc, doc,
menu: dict[str, Node], menu: dict[str, Node],
@@ -836,38 +871,107 @@ def _cards(
link_lang: str = "", link_lang: str = "",
lang: str = "", lang: str = "",
) -> None: ) -> None:
"""Card stacks of the node's published children (nothing when childless). """Cards of the node's published children (nothing when childless).
One column per direct child, all in a single full-width row (the .wide One card per direct child, all in a single full-width row (the .wide
breakout): the columns grow to fill the page and shrink rather than breakout): the cards grow to fill the page and shrink rather than
wrap. A column holds the child's whole subtree flattened in menu order wrap. A child without a page of its own is represented by its first
— nesting levels are not split out — starting with the first page that leaf page (_represent, the nav-link logic). Each card is one <a>
has actual content (the child itself when it does, its first leaf showing the page's share
otherwise, recursively). Each card is one <a> showing the page's share
image (the same heuristics as og:image) as the cover and its title; image (the same heuristics as og:image) as the cover and its title;
image-less cards get a gradient cover and also show the description. image-less cards get a gradient cover and also show the description.
Only phrasing-level elements (spans) go inside the <a>: as a formatting Only phrasing-level elements (spans) go inside the <a>: as a formatting
element it would be cloned by the HTML parser around any block-level element it would be cloned by the HTML parser around any block-level
child, splitting one card into several links. child, splitting one card into several links.
""" """
items = [(s, c) for s, c in sorted_nodes(node.children) if c.published] items = [
r
for s, c in sorted_nodes(node.children)
if c.published
for r in [_represent(c, f"{path}/{s}" if path else s)]
if r
]
if not items: if not items:
return return
with doc.div(class_="cards wide"): with doc.div(class_="cards wide"):
for slug, child in items: for cpath, cnode in items:
cpath = f"{path}/{slug}" if path else slug _card(doc, data, cnode, cpath, translation, link_lang, lang)
entries = list(_walk(child, cpath))
if not entries:
continue #: A lone {cards} or {cards: ...} line in the markdown: card rows placed
with doc.div(class_="stack"): #: by the author. Any such tag suppresses the automatic end-of-page cards.
for epath, enode in entries: _CARDS_TAG_RE = re.compile(r"^\{cards(?::[^{}\n]*)?\}[ \t]*$", re.M)
_card(doc, data, enode, epath, translation, link_lang, lang)
def _cards_tag(
menu: dict[str, Node],
data: Data,
node: Node,
path: str,
args: str,
translation: Translation | None = None,
link_lang: str = "",
lang: str = "",
) -> str:
"""Expand a ``{cards}`` directive to a card row (the same markup as
_cards, so author-placed cards look like category cards).
A bare ``{cards}`` lists the page's own published children — what
page_content appends when the tag is absent — or, on the front page,
the other top-level pages (the front page is a top-level item itself,
not the parent of the others). Arguments are space-separated page
paths: a plain path renders that page alone (never its children),
``path/*`` its published children and ``path/**`` all published
descendant pages. One card per item; a page-less item is represented
by its first leaf page (_represent). Unresolvable paths are skipped;
a tag that ends up with nothing renders as nothing.
"""
items: list[tuple[str, Node]] = []
specs = args.split()
def children(base: str, parent: Node):
for s, c in sorted_nodes(parent.children):
if c.published:
if r := _represent(c, f"{base}/{s}" if base else s):
items.append(r)
if not specs:
if path:
children(path, node)
else:
for s, c in sorted_nodes(menu):
if c.published and s:
if r := _represent(c, s):
items.append(r)
else:
for spec in specs:
spec = spec.strip("/")
if spec.endswith("/**"):
base = spec[:-3].rstrip("/")
if chain := resolve(menu, base):
for s, c in sorted_nodes(chain[-1].children):
if c.published:
items.extend(_walk(c, f"{base}/{s}" if base else s))
elif spec.endswith("/*"):
base = spec[:-2].rstrip("/")
if chain := resolve(menu, base):
children(base, chain[-1])
elif chain := resolve(menu, spec):
if r := _represent(chain[-1], spec):
items.append(r)
if not items:
return ""
doc = E.div(class_="cards wide")
with doc:
for cpath, cnode in items:
_card(doc, data, cnode, cpath, translation, link_lang, lang)
return str(doc)
def _walk(node: Node, path: str): def _walk(node: Node, path: str):
"""Published content pages of a subtree, pre-order in menu order: the """Published content pages of a subtree, pre-order in menu order: the
node itself first when it has content (the stack's landing card), then node itself first when it has content, then its descendants
its descendants (content-less nodes contribute only their subtree).""" (content-less nodes contribute only their subtree)."""
if node.chunks: if node.chunks:
yield path, node yield path, node
for slug, child in sorted_nodes(node.children): for slug, child in sorted_nodes(node.children):
@@ -884,7 +988,7 @@ def _card(
link_lang: str = "", link_lang: str = "",
lang: str = "", lang: str = "",
) -> None: ) -> None:
"""One card in a stack: cover + title, plus the description when the """One card: cover + title, plus the description when the
page has no image (its card shows a gradient cover instead). page has no image (its card shows a gradient cover instead).
The card text localizes per target article where that page is The card text localizes per target article where that page is
@@ -897,7 +1001,15 @@ def _card(
md = node_markdown(data, node) or "" md = node_markdown(data, node) or ""
if lang and lang in node.langs: if lang and lang in node.langs:
md = i18n.hybrid_markdown(data, node, path, lang) md = i18n.hybrid_markdown(data, node, path, lang)
html = render(md, path, node.created, node.modified).html html = render(
md,
path,
node.created,
node.modified,
# Card heuristics only mine the prose: nested {cards} rows
# would just be noise in the description extraction.
directives={"cards": lambda _args, _env: ""},
).html
image, _ = _media(html) image, _ = _media(html)
if not image: if not image:
description = _description(html, 150) description = _description(html, 150)
@@ -1226,7 +1338,7 @@ def _page_assets() -> tuple[list[str], list[str]]:
by the entry (e.g. overlayscrollbars.css) is extracted by Vite and must by the entry (e.g. overlayscrollbars.css) is extracted by Vite and must
be linked separately. be linked separately.
""" """
vite_url = os.environ.get("PAGERITE_VITE_URL") vite_url = env.vite_url
if vite_url: if vite_url:
return [f"{vite_url}/src/pagerite.js"], [] return [f"{vite_url}/src/pagerite.js"], []
if "page" not in _asset_cache: if "page" not in _asset_cache:
@@ -1244,7 +1356,7 @@ def _editor_assets() -> tuple[list[str], str | None]:
The shared CSS is already linked on the page, so the pen only needs the The shared CSS is already linked on the page, so the pen only needs the
editor-specific stylesheet. editor-specific stylesheet.
""" """
vite_url = os.environ.get("PAGERITE_VITE_URL") vite_url = env.vite_url
if vite_url: if vite_url:
return [f"{vite_url}/@vite/client", f"{vite_url}/src/main.js"], None return [f"{vite_url}/@vite/client", f"{vite_url}/src/main.js"], None
if "editor" not in _asset_cache: if "editor" not in _asset_cache:
@@ -1256,7 +1368,7 @@ def _editor_assets() -> tuple[list[str], str | None]:
def _analytics_assets() -> tuple[list[str], list[str]]: def _analytics_assets() -> tuple[list[str], list[str]]:
"""Script and stylesheet URLs for the analytics page entry.""" """Script and stylesheet URLs for the analytics page entry."""
vite_url = os.environ.get("PAGERITE_VITE_URL") vite_url = env.vite_url
if vite_url: if vite_url:
return [f"{vite_url}/src/analytics-main.js"], [] return [f"{vite_url}/src/analytics-main.js"], []
if "analytics" not in _asset_cache: if "analytics" not in _asset_cache:
@@ -1270,7 +1382,7 @@ def _analytics_assets() -> tuple[list[str], list[str]]:
def _langselect_assets() -> tuple[list[str], list[str]]: def _langselect_assets() -> tuple[list[str], list[str]]:
"""Script and stylesheet URLs for the on-demand public language selector.""" """Script and stylesheet URLs for the on-demand public language selector."""
vite_url = os.environ.get("PAGERITE_VITE_URL") vite_url = env.vite_url
if vite_url: if vite_url:
return [f"{vite_url}/src/langselect-main.js"], [] return [f"{vite_url}/src/langselect-main.js"], []
if "langselect" not in _asset_cache: if "langselect" not in _asset_cache:
+3 -3
View File
@@ -17,15 +17,15 @@ readme = "README.md"
requires-python = ">=3.14" requires-python = ">=3.14"
dependencies = [ dependencies = [
"blake3>=1.0.9", "blake3>=1.0.9",
"fastapi-vue~=1.4.2", "fastapi-vue~=1.7.2",
"fastapi[standard]>=0.141.1", "fastapi[standard]>=0.141.1",
"html5tagger>=2.0.0", "html5tagger>=2.0.0",
"httpx>=0.28.1", "httpx>=0.28.1",
"kanta>=0.9.0", "kanta>=0.9.2",
"markdown-it-py>=4.2.0", "markdown-it-py>=4.2.0",
"maxminddb>=3.1.1", "maxminddb>=3.1.1",
"mdit-py-plugins>=0.6.1", "mdit-py-plugins>=0.6.1",
"mediapreview[standard]>=0.2.3", "mediapreview[standard]>=0.2.5",
"platformdirs>=4.11.5", "platformdirs>=4.11.5",
"pygments>=2.20.0", "pygments>=2.20.0",
"python-slugify>=8.0.4", "python-slugify>=8.0.4",
+10 -5
View File
@@ -1,11 +1,12 @@
#!/usr/bin/env -S uv run #!/usr/bin/env -S uv run
# auto-upgrade@fastapi-vue-setup - remove this if you modify this file
"""Run Vite development server for Vue app and FastAPI backend with auto-reload.""" """Run Vite development server for Vue app and FastAPI backend with auto-reload."""
import argparse import argparse
import asyncio import asyncio
import os import os
import subprocess
import sys import sys
from contextlib import suppress
from pathlib import Path from pathlib import Path
import tracerite import tracerite
@@ -47,11 +48,11 @@ async def run_devserver(
os.environ["PAGERITE_DEV"] = "1" os.environ["PAGERITE_DEV"] = "1"
async with ProcessGroup() as pg: async with ProcessGroup() as pg:
pg.create_task(check_ports_free(viteurl, backurl))
npm_i = await pg.spawn(*npm_install, cwd=front) npm_i = await pg.spawn(*npm_install, cwd=front)
await check_ports_free(viteurl, backurl) await pg.spawn(*pagerite, *(extra_args or []), vital=True)
await pg.spawn(*pagerite, *(extra_args or []))
await pg.wait(npm_i, ready(backurl, path=HEALTH)) await pg.wait(npm_i, ready(backurl, path=HEALTH))
await pg.spawn(*vite, cwd=front) await pg.spawn(*vite, cwd=front, vital=True)
def main() -> None: def main() -> None:
@@ -74,8 +75,12 @@ def main() -> None:
help=f"FastAPI (default: localhost:{DEFAULT_DEV_PORT})", help=f"FastAPI (default: localhost:{DEFAULT_DEV_PORT})",
) )
args, extra_args = parser.parse_known_args() args, extra_args = parser.parse_known_args()
with suppress(KeyboardInterrupt): try:
asyncio.run(run_devserver(args.listen, args.backend, extra_args)) asyncio.run(run_devserver(args.listen, args.backend, extra_args))
except* KeyboardInterrupt:
pass # user stopped the devserver: normal exit
except* subprocess.SubprocessError, RuntimeError:
raise SystemExit(1) from None # logged in devutil already; exit 1
HELP_EPILOG = """ HELP_EPILOG = """
+11 -4
View File
@@ -11,20 +11,27 @@ from pathlib import Path
MIN_NODE_VERSION = 20 MIN_NODE_VERSION = 20
class _PrefixFormatter(logging.Formatter): class _Formatter(logging.Formatter):
"""Formatter that adds prefix based on log level.""" """Prefix formatter, intentionally different from fastapi_vue.logging.
INFO and below pass through unprefixed so messages can use their own
markings (>>>, ###); WARNING and above get an emoji prefix.
"""
def format(self, record: logging.LogRecord) -> str: def format(self, record: logging.LogRecord) -> str:
if record.levelno >= logging.ERROR:
return f"🛑 {record.getMessage()}"
if record.levelno >= logging.WARNING: if record.levelno >= logging.WARNING:
return f"⚠️ {record.getMessage()}" return f"💣 {record.getMessage()}"
return record.getMessage() return record.getMessage()
_handler = logging.StreamHandler() _handler = logging.StreamHandler()
_handler.setFormatter(_PrefixFormatter()) _handler.setFormatter(_Formatter())
logger = logging.getLogger("fastapi-vue") logger = logging.getLogger("fastapi-vue")
logger.addHandler(_handler) logger.addHandler(_handler)
logger.setLevel(logging.INFO) logger.setLevel(logging.INFO)
logger.propagate = False # own handler; do not double-print via a configured root
def _check_node_version(node_path: str) -> None: def _check_node_version(node_path: str) -> None:
+75 -95
View File
@@ -1,108 +1,87 @@
# ruff: noqa: INP001 # ruff: noqa: INP001
"""Utilities meant for devserver script, used only in source repository with dev deps.""" """Utilities meant for devserver script, used only in source repository with dev deps."""
from __future__ import annotations
import asyncio import asyncio
import subprocess
import sys import sys
from asyncio.subprocess import Process
from contextlib import suppress from contextlib import suppress
from pathlib import Path from pathlib import Path
from typing import TYPE_CHECKING, Any, Self from subprocess import CalledProcessError
from typing import TYPE_CHECKING, Any
from urllib.parse import urlsplit from urllib.parse import urlsplit
from buildutil import find_dev_tool, find_install_tool, logger from buildutil import find_dev_tool, find_install_tool, logger
from fastapi_vue.hostutil import parse_endpoint from fastapi_vue.hostutil import parse_endpoint
if TYPE_CHECKING: if TYPE_CHECKING:
from collections.abc import Coroutine from collections.abc import Awaitable
class ProcessGroup: class ProcessGroup(asyncio.TaskGroup):
"""Manage async subprocesses with automatic cleanup, like TaskGroup for processes.""" """TaskGroup with structured ownership of async subprocesses."""
def __init__(self) -> None: def __init__(self, *, terminate_timeout: float = 10) -> None:
"""Initialize empty process tracking.""" """Set the grace period before terminate() escalates to kill()."""
self._procs: list[asyncio.subprocess.Process] = [] super().__init__()
self._cmds: dict[int, str] = {} # pid -> command name self._terminate_timeout = terminate_timeout
self._cmds: dict[Process, tuple[str, ...]] = {}
async def spawn( async def spawn(
self, self, *cmd: str, cwd: str | None = None, vital: bool = False
*cmd: str, ) -> Process:
cwd: str | None = None, """Spawn and own a subprocess. If a vital process exits, the group cancels."""
) -> asyncio.subprocess.Process:
"""Spawn a subprocess and track it."""
cmd_name = Path(cmd[0]).stem
logger.info(">>> %s", " ".join([cmd_name, *cmd[1:]]))
proc = await asyncio.create_subprocess_exec(*cmd, cwd=cwd)
self._procs.append(proc)
self._cmds[proc.pid] = cmd_name
return proc
async def wait( async def run() -> None:
self, name = Path(cmd[0]).stem
*waitables: "asyncio.subprocess.Process | Coroutine[Any, Any, Any]", logger.info(">>> %s", " ".join([name, *cmd[1:]]))
) -> None: try:
"""Wait for processes/coroutines to complete, raise SystemExit on failure.""" proc = await asyncio.create_subprocess_exec(*cmd, cwd=cwd)
self._cmds[proc] = cmd
started.set_result(proc)
except Exception as e: # noqa: BLE001
started.set_exception(e)
return
async def wait_proc(proc: asyncio.subprocess.Process) -> None: try:
returncode = await proc.wait() returncode = await proc.wait()
if returncode != 0: finally:
cmd_name = self._cmds.get(proc.pid, "unknown")
raise subprocess.CalledProcessError(returncode, cmd_name)
tasks = [
wait_proc(w) if isinstance(w, asyncio.subprocess.Process) else w
for w in waitables
]
try:
await asyncio.gather(*tasks)
except subprocess.CalledProcessError as e:
logger.warning("%s failed with exit status %d", e.cmd, e.returncode)
raise SystemExit(1) from None
async def __aenter__(self) -> Self:
"""Enter the async context manager."""
return self
async def __aexit__(self, exc_type: type[BaseException] | None, *_: object) -> None:
"""Wait for one process to exit, terminate others, then wait for all."""
await self._cleanup(immediate=exc_type is not None)
async def _cleanup(self, *, immediate: bool = False) -> None:
running = [p for p in self._procs if p.returncode is None]
if not running:
return
if not immediate:
# Wait for any one process to exit
with suppress(asyncio.CancelledError):
await asyncio.wait(
[asyncio.create_task(p.wait()) for p in running],
return_when=asyncio.FIRST_COMPLETED,
)
# Terminate remaining processes
for p in self._procs:
if p.returncode is None:
with suppress(ProcessLookupError): with suppress(ProcessLookupError):
p.terminate() proc.terminate()
# Wait for all to finish (with overall timeout), shielded from cancellation
still_running = [p for p in self._procs if p.returncode is None]
if still_running:
with suppress(asyncio.CancelledError):
try: try:
await asyncio.shield( await asyncio.wait_for(proc.wait(), self._terminate_timeout)
asyncio.wait_for(
asyncio.gather(*[p.wait() for p in still_running]),
timeout=10,
),
)
except TimeoutError: except TimeoutError:
for p in self._procs: with suppress(ProcessLookupError):
if p.returncode is None: proc.kill()
with suppress(ProcessLookupError): await proc.wait()
p.kill()
await p.wait() if vital:
logger.warning("Vital process %s exited", name)
raise CalledProcessError(returncode, cmd)
started = asyncio.get_running_loop().create_future()
self.create_task(run())
return await asyncio.shield(started)
async def wait(self, *waitables: Process | Awaitable) -> tuple[Any, ...]:
"""Wait concurrently and return results in argument order."""
async def task(w: Process | Awaitable) -> Any: # noqa: ANN401
if not isinstance(w, Process):
return await w
if retcode := await w.wait():
cmd = self._cmds[w]
logger.warning(
"Process %s exited with status %d", Path(cmd[0]).stem, retcode
)
raise CalledProcessError(retcode, cmd)
return retcode
async with asyncio.TaskGroup() as group:
tasks = [group.create_task(task(w)) for w in waitables]
return tuple(task.result() for task in tasks)
async def http_get_server(url: str, timeout: float) -> str | None: # noqa: ASYNC109 async def http_get_server(url: str, timeout: float) -> str | None: # noqa: ASYNC109
@@ -128,42 +107,43 @@ async def http_get_server(url: str, timeout: float) -> str | None: # noqa: ASYN
writer.close() writer.close()
except OSError, EOFError, ValueError, TimeoutError: except OSError, EOFError, ValueError, TimeoutError:
return None return None
for line in data.decode("latin-1").split("\r\n"): for line in data.decode(errors="replace").split("\r\n"):
if line.lower().startswith("server:"): if line.lower().startswith("server:"):
return line.split(":", 1)[1].strip() return line[7:].strip()
return "" return ""
async def check_ports_free(*urls: str) -> None: async def check_ports_free(*urls: str) -> None:
"""Verify URLs are not responding (ports are free). Raise SystemExit if any respond.""" """Verify URLs are not responding (ports are free).
async def check(url: str) -> None: Meant to run as a task inside a TaskGroup. Logs the conflict and raises
server = await http_get_server(url, timeout=0.1) RuntimeError (handled like a failed process) if any URL responds.
"""
servers = await asyncio.gather(*(http_get_server(url, timeout=0.1) for url in urls))
for url, server in zip(urls, servers, strict=True):
if server is not None: if server is not None:
logger.warning( logger.error(
"Conflicting %s already running at %s", server or "server", url "Conflicting %s already running at %s", server or "server", url
) )
raise SystemExit(1) raise RuntimeError(url)
await asyncio.gather(*[check(url) for url in urls])
async def ready(url: str, path: str = "", max_attempts: int = 50) -> None: async def ready(url: str, path: str = "", max_attempts: int = 50) -> None:
"""Wait for the server to be ready by polling an endpoint. """Wait for the server to be ready by polling an endpoint.
Use empty path to disable the check and make this return immediately. Use empty path to disable the check and make this return immediately.
Raises SystemExit(1) if server doesn't start in time. Logs, then raises RuntimeError if the server doesn't start in time.
""" """
if not path: if not path:
return return
for attempt in range(max_attempts): for attempt in range(max_attempts):
if await http_get_server(f"{url}{path}", timeout=1.0) is not None: if await http_get_server(f"{url}{path}", timeout=1.0) is not None:
logger.info(" Backend ready!") logger.info("🟢 Backend ready!")
return return
if attempt == max_attempts - 1: if attempt == max_attempts - 1:
logger.warning("Backend didn't start in time") logger.error("Backend at %s didn't start in time", url)
raise SystemExit(1) raise RuntimeError(url)
await asyncio.sleep(0.1) await asyncio.sleep(0.1)