Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

media-treatment: no canonical way to treat a frame that has no <img>/<video>

Aperta
  • Qualcosa non va?
#3,997 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
35/100
Tipo di issue
Funzionalità
Chiarezza
Da chiarire
Stato di attività
Attiva
Stack tecnologico
css, html, typescript
Ambito
frontend, web-dev

Direzione di ricerca

Start by running media-treatment --capabilities --json and reviewing the --selector behavior described in the issue. Read references/media-treatments.md and the media-use guidance before deciding which proposed target model is supported. Done means a canonical treatment path for code-drawn frames, or a documented recipe guaranteed to match the shader output.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

triage/needs-triage
What I'm trying to do

Apply the canonical finishing treatments — details.vignette, details.grain — to a code-drawn
frame that contains no <img> or <video>.

Why it doesn't work today

media-treatment --capabilities --json on 0.8.41 reports:

"targetTags": ["img", "video"]

and --selector is documented as "Unique CSS selector for one <img> or <video>". The realtime
shader binds a texture from the media element, so there is nothing to attach a treatment to when the
frame is CSS/DOM — typography, an SVG chart, a drawn diagram, a solid colour field.

The media-use skill is explicit that recreating these in CSS is the wrong answer
(references/media-treatments.md): "Use the canonical details/effects fields for vignette,
grain, blur, pixelate, and related primitives. Do not duplicate them with CSS filters, SVG
turbulence, opacity, or decorative DOM overlays." For a media-bearing frame, agreed and adopted.
For a frame with no media, there is no canonical path, so the only way to give a code-drawn scene
the same film grain and edge falloff as the shot next to it is the thing the skill tells us not to
do.

Concrete case

A composition whose scenes alternate between a full-bleed <video> and a code-drawn chart, both
wanting the same 0.18 grain and 0.3 vignette so the two read as one film. The video scene can have
it; the chart scene cannot, and matching it in CSS drifts from the shader's look (different noise
function, different falloff curve) and is invisible to Studio.

What would help

Any one of these, roughly in order of preference:

  1. media-treatment --selector accepting an ordinary element and treating its rendered subtree
    (html2canvas-style or a compositor pass) for the finishing family at least.
  2. A frame- or scene-level treatment target — a treatment declared once on .clip or on the
    composition, applied over everything inside it.
  3. A documented, blessed CSS recipe for details.vignette / details.grain that is guaranteed to
    match the shader's output, so recreating them in CSS stops being an anti-pattern for the one case
    where the shader cannot reach.
Environment

hyperframes 0.8.41, local render route, Chrome from hyperframes browser.

Lingua principale
TypeScript
Stelle
54.1k
Fork
4.9k
Merge medio
7h 2m
PR unite (30g)
782

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di heygen-com/hyperframes

Tutte le issue di heygen-com/hyperframes

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.