/* Effet de serre, PRP & climat — composition 60 s (1080x1080) */
(function () {
const { CompositionStage, useComposition, Captions, Easing, animate, interpolate, clamp,
useTweaks, TweaksPanel, TweakSection, TweakToggle } = window;
const C = {
blue: '#1b3a63', orange: '#ff6b35', ink: '#2b3440',
line: '#d8e1ea', card: '#ffffff',
ocean: '#2f6fa8', land: '#5d9c74', hot: '#e04a1f', sun: '#f4b942',
ozone: '#2f9ec4', green: '#2f8f5b',
};
const FT = "600 40px Calibri, Carlito, 'Segoe UI', sans-serif";
const FH = "bold 50px 'Trebuchet MS', 'Segoe UI', sans-serif";
const FL = "600 30px Calibri, Carlito, 'Segoe UI', sans-serif";
const MOTION = {
enter: (start, from, to, d) => animate({ from, to, start, end: start + (d || 0.8), ease: Easing.easeOutCubic }),
draw: (start, end, from, to) => animate({ from: from || 0, to: to == null ? 1 : to, start, end, ease: Easing.easeInOutCubic }),
pop: (start, from, to, d) => animate({ from, to, start, end: start + (d || 0.55), ease: Easing.easeOutBack }),
};
const CX = 540, CY = 1560, RE = 900, RB = 1180;
const rad = (a) => (a * Math.PI) / 180;
const onArc = (a, r) => ({ x: CX + r * Math.cos(rad(a)), y: CY + r * Math.sin(rad(a)) });
const fr = (n) => Math.round(n).toLocaleString('fr-FR');
function Arrow({ x, y, angle, len, color, thick, opacity, head }) {
const t = thick || 11, h = head || 24;
return (
);
}
function Earth({ heat }) {
const blobs = [
{ x: 0.28, y: 0.115, w: 0.26, h: 0.075, r: -12 },
{ x: 0.60, y: 0.145, w: 0.21, h: 0.065, r: 10 },
{ x: 0.42, y: 0.205, w: 0.34, h: 0.075, r: -4 },
];
return (
{blobs.map((b, i) => (
))}
{label}
);
}
function CardShell({ inP, outP, top, children }) {
const o = inP * (1 - outP);
if (o <= 0.002) return null;
return (
{children}
);
}
const PRP = [
{ n: 'CO₂', v: 1, cls: 'référence' },
{ n: 'R32', v: 675, cls: 'A2L' },
{ n: 'R134a', v: 1430, cls: 'A1' },
{ n: 'R404A', v: 3922, cls: 'A1' },
];
function PrpCard({ T, appear, leave }) {
return (
PRP — pouvoir de réchauffement
Effet de 1 kg de fluide, comparé à 1 kg de CO₂ (100 ans)
{PRP.map((r, i) => {
const g = MOTION.draw(appear + 0.5 + i * 0.42, appear + 1.5 + i * 0.42)(T);
const hot = r.n === 'R404A';
return (
);
})}
1 kg de R404A rejeté ≈ 3 922 kg de CO₂
Valeurs PRP AR4 — règlement (UE) 517/2014
);
}
const KM = [
{ n: 'R404A', v: 26100, cls: 'A1 — PRP 3 922', note: 'les deux tiers du tour de la Terre' },
{ n: 'R32', v: 4500, cls: 'A2L — PRP 675', note: '3 allers-retours Paris – Marseille' },
{ n: 'R290', v: 20, cls: 'A3 — PRP 3', note: 'la sortie de ville' },
];
function KmCard({ T, appear, leave }) {
return (
1 kg rejeté,
ça fait combien de kilomètres ?
La même quantité de CO₂, mais en voiture
{KM.map((r, i) => {
const g = MOTION.draw(appear + 0.6 + i * 1.4, appear + 2.2 + i * 1.4)(T);
const hot = r.n === 'R404A';
return (
);
})}
Base : 150 g CO₂/km (voiture moyenne du parc français, SDES) — ordre de grandeur.
);
}
function MiniGlobe({ hole, label, mark }) {
const segs = 22;
return (
{Array.from({ length: segs }).map((_, i) => {
const a = -170 + (i * 160) / (segs - 1);
const p = { x: 145 + 118 * Math.cos(rad(a)), y: 141 + 118 * Math.sin(rad(a)) };
const d = Math.abs(a + 90);
const gone = hole > 0 && d < hole;
return (
);
})}
{mark ? (
) : null}
{label}
);
}
function OzoneWin({ T, appear, leave }) {
const heal = MOTION.draw(appear + 1.4, appear + 3.4, 58, 6)(T);
return (
La couche d'ozone :
la preuve que ça marche.
Le monde entier a interdit les CFC en 1987. Le trou se referme.
Protocole de Montréal — retour au niveau de 1980 attendu vers 2066 au-dessus de l'Antarctique (OMM/PNUE, 2022).
);
}
function Stripes({ T, appear, leave }) {
const n = 42;
const wall = MOTION.enter(appear + 4.4, 0, 1, 0.8)(T);
return (
Le climat, lui,
n'a pas eu son Montréal.
En 1987, le monde entier a interdit les CFC : le trou dans la couche d'ozone se referme. Pour le climat, aucun accord de ce niveau.
{Array.from({ length: n }).map((_, i) => {
const k = i / (n - 1);
const on = MOTION.enter(appear + 0.8 + k * 3.2, 0, 1, 0.35)(T);
const r = Math.round(74 + k * 132), g = Math.round(128 - k * 92), b = Math.round(180 - k * 148);
return
;
})}
MUR
Réchauffement observé, puis projeté si rien ne change
Au rythme actuel, on continue tout droit.
);
}
function Gauge({ T, start, leave }) {
const o = MOTION.enter(start, 0, 1, 0.7)(T) * (1 - MOTION.draw(leave, leave + 0.6)(T));
if (o <= 0.002) return null;
const v = MOTION.draw(start + 0.4, start + 4.2, 0, 4)(T);
const h = 380;
return (
Température
moyenne
{[1.5, 3, 4].map((m) => (
))}
+{v.toFixed(1).replace('.', ',')} °C
scénario sans action
);
}
function Piece(props) {
const { T, CUES } = useComposition();
const t = props.t;
const K = CUES;
const camS = interpolate(
[0, K.Equilibre, K.Piege + 1.6, K.Rechauffement, K.PRP, K.Agir, K.Agir + 5],
[1.0, 1.03, 1.14, 1.05, 1.0, 1.0, 1.08], Easing.easeInOutCubic);
const camY = interpolate(
[0, K.Equilibre, K.Piege + 1.6, K.Rechauffement, K.PRP, K.Agir + 5],
[720, 690, 600, 700, 780, 800], Easing.easeInOutCubic);
const s = camS(T), fy = camY(T);
const trap = MOTION.draw(K.Piege - 0.3, K.Piege + 2.4)(T);
const bandA = MOTION.draw(K.Piege - 0.3, K.Piege + 2.2, 0, 0.9)(T);
const bandW = MOTION.draw(K.Piege, K.Rechauffement + 2, 30, 86)(T);
const heat = MOTION.draw(K.Rechauffement + 0.2, K.Rechauffement + 3.6, 0, 0.72)(T);
const skyHeat = MOTION.draw(K.Rechauffement + 0.2, K.Rechauffement + 3.6, 0, 0.16)(T);
const dx = CX - 255, dy = 900 - 233, L = Math.hypot(dx, dy);
const sunAng = (Math.atan2(dy, dx) * 180) / Math.PI;
const rays = [0, 0.33, 0.66].map((off, i) => {
const p = (((T * 0.42) + off) % 1);
const d = 190 + p * (L - 120);
return { x: 255 + (dx / L) * d, y: 233 + (dy / L) * d, o: Math.sin(Math.PI * p) * 0.95, k: i };
});
const irAngles = [-115, -100, -85, -70];
const irs = irAngles.map((a, i) => {
const p = (((T * 0.42) + i * 0.25) % 1);
const wave = clamp(Math.sin(Math.PI * p) * 1.7, 0, 1);
const esc = (i % 2 === 0) ? (1 - trap) : 0;
const up = p < 0.48;
const rise = up ? p / 0.48 : (1 - p) / 0.52;
return {
a, i, wave, esc,
rEsc: RE + 30 + p * (RB + 260 - RE - 30),
rBnc: RE + 30 + rise * (RB - 80 - RE - 30),
dir: up ? a : a + 180,
col: up ? '#c0553a' : C.hot,
};
});
const molecules = [
{ a: -108, l: 'CO₂' }, { a: -94, l: 'CH₄' }, { a: -80, l: 'HFC' },
];
const closing = MOTION.enter(K.Agir + 0.2, 0, 1, 0.8)(T);
return (
{rays.map((r) => (
))}
{irs.map((v) => {
const pe = onArc(v.a, v.rEsc), pb = onArc(v.a, v.rBnc);
return (
);
})}
{molecules.map((m, i) => {
const p = onArc(m.a, RB);
const sc = MOTION.pop(K.Piege + 0.5 + i * 0.16, 0, 1, 0.6)(T);
return
;
})}
L'ozone, on l'a réparé.
Le climat, ça se joue
maintenant.
Récupérer · Contrôler · Tracer
Effet de serre & PRP
par F. Henninot
{t.sousTitres ? (
) : null}
);
}
function SerrePiece() {
const tw = useTweaks(window.TWEAK_DEFAULTS);
const t = tw[0], setTweak = tw[1];
return (
setTweak('sousTitres', v)} />
setTweak('logo', v)} />
setTweak('motionEditor', v)} />
);
}
window.SerrePiece = SerrePiece;
})();