213 lines
12 KiB
JavaScript
213 lines
12 KiB
JavaScript
|
(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode('._wrapper_61dhl_1{--gc-bg: var(--color-bg, #0a0a0f);--gc-bg-secondary: var(--color-bg-secondary, #12121a);--gc-text: var(--color-text, #e8e8ec);--gc-text-muted: var(--color-text-muted, #9999a8);--gc-primary: var(--color-primary, #6366f1);--gc-accent: var(--color-accent, #22d3ee);--gc-border: var(--color-border, #2a2a3a);--gc-font-main: var(--font-main, "Iceland", -apple-system, BlinkMacSystemFont, sans-serif);--gc-font-display: var(--font-display, "Russo One", -apple-system, BlinkMacSystemFont, sans-serif);--gc-font-text: "VT323", var(--font-mono, monospace);width:100%}._frame_61dhl_15{position:relative;width:100%;height:100dvh;min-height:100vh;overflow:hidden;border:1px solid color-mix(in srgb,var(--gc-border) 60%,transparent);color:var(--gc-text);font-family:var(--gc-font-text);background:radial-gradient(circle at 18% 14%,color-mix(in srgb,var(--gc-accent) 18%,transparent),transparent 35%),radial-gradient(circle at 88% 2%,color-mix(in srgb,var(--gc-primary) 22%,transparent),transparent 30%),linear-gradient(165deg,var(--gc-bg),var(--gc-bg-secondary))}._scan_61dhl_30{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.18;mix-blend-mode:screen;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.1) 0,rgba(255,255,255,.1) 1px,transparent 1px,transparent 3px);animation:_scanDrift_61dhl_1 8s linear infinite}._stack_61dhl_47{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:22px 16px 18px}._meta_61dhl_57{display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gc-text-muted);font-family:var(--gc-font-main)}._progressTrack_61dhl_68{margin-top:8px;width:100%;height:3px;border-radius:999px;overflow:hidden;background:color-mix(in srgb,var(--gc-accent) 20%,transparent)}._progressFill_61dhl_77{height:100%;transition:width .24s ease;background:linear-gradient(90deg,var(--gc-accent),color-mix(in srgb,var(--gc-primary) 45%,var(--gc-accent)))}._slide_61dhl_87{flex:1;display:flex;flex-direction:column;justify-content:center;gap:20px}._title_61dhl_95{margin:0;width:fit-content;font-family:var(--gc-font-display);text-transform:uppercase;letter-spacing:.02em;line-height:1.04;font-size:clamp(28px,8.5vw,46px)}._rgbGlitch_61dhl_105{position:relative;display:inline-block}._rgbBase_61dhl_110{position:relative;z-index:1;color:color-mix(in srgb,var(--gc-text) 38%,#000)}._rgbLayer_61dhl_116{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;opacity:.2}._layerR_61dhl_124{color:#ff3737bf;animation:_layerRShift_61dhl_1 2.4s infinite steps(2,end)}._layerG_61dhl_129{color:#37ff5fbf;animation:_layerGShift_61dhl_1 2.1s infinite steps(2,end)}._layerB_61dhl_134{color:#4182ffbf;animation:_layerBShift_61dhl_1 2.7s infinite steps(2,end)}._content_61dhl_139{display:flex;flex-direction:column;gap:10px;font-family:var(--gc-font-text);font-size:clamp(16px,4.2vw,22px);line-height:1.45}._line_61dhl_148{margin:0;color:var(--gc-text)}._spacer_61dhl_153{margin:0;min-height:.6em}._list_61dhl_158{margin:3px 0 0;padding-left:1.1em;display:flex;flex-direction:column;gap:7px}._warning_61dhl_166{list-style:none;padding-left:0}._warning_61dhl_166 li:before{content:"- ";color:var(--gc-accent)}._cta_61dhl_176{margin-top:10px;width:fit-content;border:1px solid var(--gc-accent);background:color-mix(in srgb,var(--gc-accent) 8%,transparent);color:var(--gc-accent);font:inherit;letter-spacing:.06em;text-transform:uppercase;padding:10px 14px;cursor:pointer;font-family:var(--gc-font-main);transition:transform .14s ease,background-color .14s ease}._cta_61dhl_176:active{transform:scale(.98)}._controls_61dhl_195{display:grid;grid-template-columns:1fr 1fr;gap:8px}._navButton_61dhl_201{border:1px solid color-mix(in srgb,var(--gc-border) 70%,transparent);background:color-mix(in srgb,var(--gc-bg-secondary) 75%,transparent);color:var(--gc-text);font:inherit;text-t
|
||
|
|
import { jsx as t, jsxs as c } from "react/jsx-runtime";
|
||
|
|
import { useState as x, useRef as B, useMemo as $, useEffect as G, useCallback as u } from "react";
|
||
|
|
const L = "_wrapper_61dhl_1", E = "_frame_61dhl_15", F = "_scan_61dhl_30", C = "_stack_61dhl_47", R = "_meta_61dhl_57", Y = "_progressTrack_61dhl_68", I = "_progressFill_61dhl_77", W = "_slide_61dhl_87", M = "_title_61dhl_95", A = "_rgbGlitch_61dhl_105", D = "_rgbBase_61dhl_110", H = "_rgbLayer_61dhl_116", P = "_layerR_61dhl_124", j = "_layerG_61dhl_129", O = "_layerB_61dhl_134", q = "_content_61dhl_139", U = "_line_61dhl_148", z = "_spacer_61dhl_153", J = "_list_61dhl_158", K = "_warning_61dhl_166", Q = "_cta_61dhl_176", V = "_controls_61dhl_195", X = "_navButton_61dhl_201", e = {
|
||
|
|
wrapper: L,
|
||
|
|
frame: E,
|
||
|
|
scan: F,
|
||
|
|
stack: C,
|
||
|
|
meta: R,
|
||
|
|
progressTrack: Y,
|
||
|
|
progressFill: I,
|
||
|
|
slide: W,
|
||
|
|
title: M,
|
||
|
|
rgbGlitch: A,
|
||
|
|
rgbBase: D,
|
||
|
|
rgbLayer: H,
|
||
|
|
layerR: P,
|
||
|
|
layerG: j,
|
||
|
|
layerB: O,
|
||
|
|
content: q,
|
||
|
|
line: U,
|
||
|
|
spacer: z,
|
||
|
|
list: J,
|
||
|
|
warning: K,
|
||
|
|
cta: Q,
|
||
|
|
controls: V,
|
||
|
|
navButton: X
|
||
|
|
}, Z = 40, i = [
|
||
|
|
{
|
||
|
|
title: "The Premise",
|
||
|
|
lines: [
|
||
|
|
"This facility tests foundational assumptions.",
|
||
|
|
"",
|
||
|
|
"Not interpretations.",
|
||
|
|
"Assumptions."
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "The method",
|
||
|
|
lines: [
|
||
|
|
"This is math and philosophy.",
|
||
|
|
"Make assumption.",
|
||
|
|
"Pretend it's true.",
|
||
|
|
"Where does that lead?"
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "The law",
|
||
|
|
lines: [
|
||
|
|
"We make predictions.",
|
||
|
|
"If they fail, the idea fails."
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "The way",
|
||
|
|
lines: ["You will:"],
|
||
|
|
bullets: [
|
||
|
|
"Pass challenges",
|
||
|
|
"Collect paradoxes",
|
||
|
|
"Examine anomalies",
|
||
|
|
"Learn to think sharply"
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "Warning",
|
||
|
|
lines: ["You may feel:"],
|
||
|
|
bullets: [
|
||
|
|
"This is not a game!",
|
||
|
|
"Temporary confusion",
|
||
|
|
"The urge to defend existing physics!"
|
||
|
|
],
|
||
|
|
bulletStyle: "warning",
|
||
|
|
after: "Good. This is not for everyone."
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "How This Works",
|
||
|
|
lines: [
|
||
|
|
"Watch a short module",
|
||
|
|
"Pass the glitch gate",
|
||
|
|
"Unlock the next tech",
|
||
|
|
"That's it. For now."
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: "Proceed",
|
||
|
|
lines: [
|
||
|
|
"You may proceed as an investigator.",
|
||
|
|
"Begin at the intersection",
|
||
|
|
"Get briefed"
|
||
|
|
],
|
||
|
|
cta: "[ ENTER FACILITY ]"
|
||
|
|
}
|
||
|
|
];
|
||
|
|
function ae({
|
||
|
|
config: _,
|
||
|
|
onComplete: p,
|
||
|
|
onProgress: d,
|
||
|
|
theme: r,
|
||
|
|
className: m
|
||
|
|
}) {
|
||
|
|
const [n, g] = x(0), o = B(null), f = $(() => r ? {
|
||
|
|
"--gc-primary": r.primary,
|
||
|
|
"--gc-accent": r.accent,
|
||
|
|
"--gc-bg": r.bg,
|
||
|
|
"--gc-bg-secondary": r.bgSecondary,
|
||
|
|
"--gc-text": r.text,
|
||
|
|
"--gc-text-muted": r.textMuted,
|
||
|
|
"--gc-border": r.border
|
||
|
|
} : {}, [r]);
|
||
|
|
G(() => {
|
||
|
|
const a = (n + 1) / i.length * 100;
|
||
|
|
d == null || d(Math.round(a));
|
||
|
|
}, [n, d]);
|
||
|
|
const h = u((a) => {
|
||
|
|
if (a > 0 && n === i.length - 1) {
|
||
|
|
g(0);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const l = n + a;
|
||
|
|
l < 0 || l >= i.length || g(l);
|
||
|
|
}, [n]), N = u((a) => {
|
||
|
|
var l;
|
||
|
|
o.current = ((l = a.changedTouches[0]) == null ? void 0 : l.clientY) ?? null;
|
||
|
|
}, []), T = u((a) => {
|
||
|
|
var b;
|
||
|
|
if (o.current == null) return;
|
||
|
|
const l = ((b = a.changedTouches[0]) == null ? void 0 : b.clientY) ?? o.current, y = o.current - l;
|
||
|
|
Math.abs(y) > Z && h(y > 0 ? 1 : -1), o.current = null;
|
||
|
|
}, [h]), w = u(() => {
|
||
|
|
p({
|
||
|
|
success: !0,
|
||
|
|
score: 100,
|
||
|
|
data: {
|
||
|
|
sequence: "facility-slideshow",
|
||
|
|
configId: _.id,
|
||
|
|
completedAt: (/* @__PURE__ */ new Date()).toISOString()
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}, [_.id, p]), s = i[n], v = n === i.length - 1, S = (n + 1) / i.length * 100, k = m ? `${e.wrapper} ${m}` : e.wrapper;
|
||
|
|
return /* @__PURE__ */ t("div", { className: k, style: f, children: /* @__PURE__ */ c(
|
||
|
|
"section",
|
||
|
|
{
|
||
|
|
className: e.frame,
|
||
|
|
"aria-label": "Facility onboarding slideshow",
|
||
|
|
onTouchStart: N,
|
||
|
|
onTouchEnd: T,
|
||
|
|
children: [
|
||
|
|
/* @__PURE__ */ t("div", { className: e.scan, "aria-hidden": "true" }),
|
||
|
|
/* @__PURE__ */ c("div", { className: e.stack, children: [
|
||
|
|
/* @__PURE__ */ c("header", { children: [
|
||
|
|
/* @__PURE__ */ c("div", { className: e.meta, children: [
|
||
|
|
/* @__PURE__ */ t("span", { children: "Glitch Facility" }),
|
||
|
|
/* @__PURE__ */ c("span", { children: [
|
||
|
|
n + 1,
|
||
|
|
" / ",
|
||
|
|
i.length
|
||
|
|
] })
|
||
|
|
] }),
|
||
|
|
/* @__PURE__ */ t("div", { className: e.progressTrack, children: /* @__PURE__ */ t("div", { className: e.progressFill, style: { width: `${S}%` } }) })
|
||
|
|
] }),
|
||
|
|
/* @__PURE__ */ c("article", { className: e.slide, "aria-live": "polite", children: [
|
||
|
|
/* @__PURE__ */ t("h2", { className: e.title, children: /* @__PURE__ */ c("span", { className: e.rgbGlitch, children: [
|
||
|
|
/* @__PURE__ */ t("span", { className: e.rgbBase, children: s.title }),
|
||
|
|
/* @__PURE__ */ t("span", { className: `${e.rgbLayer} ${e.layerR}`, "aria-hidden": "true", children: s.title }),
|
||
|
|
/* @__PURE__ */ t("span", { className: `${e.rgbLayer} ${e.layerG}`, "aria-hidden": "true", children: s.title }),
|
||
|
|
/* @__PURE__ */ t("span", { className: `${e.rgbLayer} ${e.layerB}`, "aria-hidden": "true", children: s.title })
|
||
|
|
] }) }),
|
||
|
|
/* @__PURE__ */ c("div", { className: e.content, children: [
|
||
|
|
s.lines.map((a, l) => a === "" ? /* @__PURE__ */ t("p", { className: e.spacer, "aria-hidden": "true" }, `line-${l}`) : /* @__PURE__ */ t("p", { className: e.line, children: a }, `line-${l}`)),
|
||
|
|
s.bullets && /* @__PURE__ */ t("ul", { className: `${e.list} ${s.bulletStyle === "warning" ? e.warning : ""}`, children: s.bullets.map((a) => /* @__PURE__ */ t("li", { children: a }, a)) }),
|
||
|
|
s.after && /* @__PURE__ */ t("p", { className: e.line, children: s.after }),
|
||
|
|
s.cta && /* @__PURE__ */ t("button", { type: "button", className: e.cta, onClick: w, children: s.cta })
|
||
|
|
] })
|
||
|
|
] }),
|
||
|
|
/* @__PURE__ */ c("nav", { className: e.controls, "aria-label": "Slideshow controls", children: [
|
||
|
|
/* @__PURE__ */ t(
|
||
|
|
"button",
|
||
|
|
{
|
||
|
|
type: "button",
|
||
|
|
className: e.navButton,
|
||
|
|
onClick: () => h(-1),
|
||
|
|
disabled: n === 0,
|
||
|
|
children: "Previous"
|
||
|
|
}
|
||
|
|
),
|
||
|
|
/* @__PURE__ */ t(
|
||
|
|
"button",
|
||
|
|
{
|
||
|
|
type: "button",
|
||
|
|
className: e.navButton,
|
||
|
|
onClick: () => h(1),
|
||
|
|
children: v ? "Restart" : "Next"
|
||
|
|
}
|
||
|
|
)
|
||
|
|
] })
|
||
|
|
] })
|
||
|
|
]
|
||
|
|
}
|
||
|
|
) });
|
||
|
|
}
|
||
|
|
const se = {
|
||
|
|
name: "onboarding2",
|
||
|
|
displayName: "Facility Slideshow",
|
||
|
|
version: "1.0.0",
|
||
|
|
paramSchema: {},
|
||
|
|
defaultParams: {}
|
||
|
|
};
|
||
|
|
export {
|
||
|
|
ae as default,
|
||
|
|
se as metadata
|
||
|
|
};
|
||
|
|
//# sourceMappingURL=onboarding2.js.map
|