aboutsummaryrefslogtreecommitdiffstats
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/routes/IndexPage.svelte17
-rw-r--r--src/routes/anim-gen.ts50
-rw-r--r--src/routes/shared.ts2
3 files changed, 36 insertions, 33 deletions
diff --git a/src/routes/IndexPage.svelte b/src/routes/IndexPage.svelte
index c2d07eb..fec5d44 100644
--- a/src/routes/IndexPage.svelte
+++ b/src/routes/IndexPage.svelte
@@ -23,7 +23,7 @@
type TTYText,
} from './shared';
import { onDestroy, onMount } from 'svelte';
- import { base } from '$app/paths';
+ import { resolve } from '$app/paths';
const initTagLine = `line flex flex-row flex-wrap gap-3 justify-between`;
@@ -42,8 +42,8 @@
skipAnimation?: boolean;
} = $props();
onMount(() => {
- if (skipAnimation && location.pathname !== base + '/skip-animation')
- history.replaceState({}, '', base + '/skip-animation');
+ if (skipAnimation && location.pathname !== resolve('/skip-animation'))
+ history.replaceState({}, '', resolve('/skip-animation'));
});
let isScripted = $state(false);
@@ -111,7 +111,7 @@
{#if section.url.startsWith('newtab:')}
{@const url = section.url.substring(7)}
<a
- href={url.startsWith('/') ? base + url : url}
+ href={url.startsWith('/') ? resolve(url as unknown as '/') : url}
target="_blank"
rel="noopener noreferrer"
class="no-underline text-inherit"
@@ -120,7 +120,7 @@
{:else if section.url.startsWith('currenttab:')}
{@const url = section.url.substring(11)}
<a
- href={url.startsWith('/') ? base + url : url}
+ href={url.startsWith('/') ? resolve(url as unknown as '/') : url}
class="no-underline text-inherit"
download={section.dl}>{@render ttyTextInnerRenderer(section)}</a
>
@@ -170,9 +170,12 @@
</div>
<div
- class="fixed top-0 left-0 w-screen h-screen font-mono"
+ class={{
+ 'fixed top-0 left-0 w-screen h-screen font-mono': true,
+ 'skip-animation': skipAnimation,
+ anmroot: !skipAnimation,
+ }}
id="app"
- class:skip-animation={skipAnimation}
>
{#if !skipAnimation}
<div
diff --git a/src/routes/anim-gen.ts b/src/routes/anim-gen.ts
index fcbb23d..1aaaa37 100644
--- a/src/routes/anim-gen.ts
+++ b/src/routes/anim-gen.ts
@@ -20,12 +20,12 @@ import esbuild from 'esbuild';
const anim = new Animation();
let ttyCtr = 0;
const stages = [
- anim.selector('#bios'),
- anim.selector('#grub'),
- anim.selector('#grub-term'),
- anim.selector('#openrc'),
+ anim.selector('.anmroot #bios'),
+ anim.selector('.anmroot #grub'),
+ anim.selector('.anmroot #grub-term'),
+ anim.selector('.anmroot #openrc'),
...ttyLines.flatMap((v) =>
- v.kind === 'clear' ? [anim.selector('#tty-' + ttyCtr++)] : [],
+ v.kind === 'clear' ? [anim.selector('.anmroot #tty-' + ttyCtr++)] : [],
),
];
const visibleStageStyles = `margin-top: 0;
@@ -92,7 +92,7 @@ const biosStepHandlers: Step[] = [
},
// Show Start boot option
(next) => {
- const s = anim.selector('#bios .start-text');
+ const s = anim.selector('.anmroot #bios .start-text');
s.style(hiddenStyles);
anim._internal_timeline.now += 1;
s.style(visibleStyles);
@@ -103,7 +103,7 @@ const biosStepHandlers: Step[] = [
.fill(
(quantity: number, lastQuantity: number, index: number) =>
(next: () => void) => {
- const s = anim.selector(`#bios .bar`);
+ const s = anim.selector(`.anmroot #bios .bar`);
s.style(`${index === 0 ? hiddenStyles : visibleStyles}
width: ${lastQuantity * 100}vw;`);
anim._internal_timeline.now += 1;
@@ -115,8 +115,8 @@ width: ${quantity * 100}vw;`);
.map((v, i, a) => v((i + 1) / a.length, i / a.length, i)),
// Show bdsdxe
(next) => {
- const s1 = anim.selector('#bios .bdsdxe-load');
- const s2 = anim.selector('#bios .bdsdxe-start');
+ const s1 = anim.selector('.anmroot #bios .bdsdxe-load');
+ const s2 = anim.selector('.anmroot #bios .bdsdxe-start');
s1.style(hiddenStyles);
s2.style(hiddenStyles);
anim._internal_timeline.now += 1;
@@ -135,8 +135,8 @@ const grubStepHandlers: Step[] = [
},
// Hide 2s, show 1s
(next) => {
- const g2s = anim.selector('#grub .grub-2s');
- const g1s = anim.selector('#grub .grub-1s');
+ const g2s = anim.selector('.anmroot #grub .grub-2s');
+ const g1s = anim.selector('.anmroot #grub .grub-1s');
g2s.style('width:max-content;opacity:1;');
g1s.style('width:0;opacity:0;');
anim._internal_timeline.now += 1;
@@ -150,14 +150,14 @@ const grubStepHandlers: Step[] = [
anim.in(100, next);
},
(next) => {
- const s = anim.selector('#grub-term .load-kernel');
+ const s = anim.selector('.anmroot #grub-term .load-kernel');
s.style(hiddenStyles);
anim._internal_timeline.now += 1;
s.style(visibleStyles);
anim.in(200, next);
},
(next) => {
- const s = anim.selector('#grub-term .load-ramdisk');
+ const s = anim.selector('.anmroot #grub-term .load-ramdisk');
s.style(hiddenStyles);
anim._internal_timeline.now += 1;
s.style(visibleStyles);
@@ -282,7 +282,7 @@ const openrcStepHandlers = (multi: number): Step[] => [
]
.map((v) => v / multi)
.map((time, idx, arr) => (next: () => void) => {
- const s = anim.selector('#openrc .openrc-boot-step-' + idx);
+ const s = anim.selector('.anmroot #openrc .openrc-boot-step-' + idx);
s.style(`${hiddenStyles}
max-height: 0;`);
if (idx === arr.length - 1) {
@@ -299,16 +299,16 @@ max-height: 0;`);
s.style(`${visibleStyles}
max-height: max-content;`);
if (idx === arr.length - 1) {
- idleTypingBar(anim.selector('#openrc .openrc-username-anim'), time);
+ idleTypingBar(anim.selector('.anmroot #openrc .openrc-username-anim'), time);
}
anim.in(time, next);
}),
// Typing Username
...(() => {
- const typingBar = anim.selector('#openrc .openrc-username-anim');
+ const typingBar = anim.selector('.anmroot #openrc .openrc-username-anim');
return login.username.split('').map((_, i) => {
const character = anim.selector(
- `#openrc .openrc-username .openrc-username-char.openrc-username-char-${i}`,
+ `.anmroot #openrc .openrc-username .openrc-username-char.openrc-username-char-${i}`,
);
return (next: () => void) =>
typeCharacter(typingBar, character, next, getDelay(login));
@@ -317,7 +317,7 @@ max-height: max-content;`);
// Hide Username Cursor
(next) => {
const s = anim.selector(
- '#openrc .openrc-hide-at-login-prompt-username-done',
+ '.anmroot #openrc .openrc-hide-at-login-prompt-username-done',
);
s.style(`transform:none;width:max-content;opacity:1;`);
anim._internal_timeline.now += 1;
@@ -326,7 +326,7 @@ max-height: max-content;`);
},
// Show Password
(next) => {
- const s = anim.selector('#openrc .openrc-pw-line');
+ const s = anim.selector('.anmroot #openrc .openrc-pw-line');
s.style(`transform:scaleX(0);width:0;opacity:0;`);
anim._internal_timeline.now += 1;
s.style(`transform:none;width:max-content;opacity:1;`);
@@ -335,13 +335,13 @@ max-height: max-content;`);
// Password Typing
...new Array(login.passwordLength)
.fill((_idx: number) => (next: () => void) => {
- const s = anim.selector('#openrc .openrc-password-anim');
+ const s = anim.selector('.anmroot #openrc .openrc-password-anim');
const characterTime = getDelay(login);
typeCharacter(s, null, next, characterTime);
})
.map((v, i) => v(i)),
(next) => {
- const s = anim.selector('#openrc .openrc-password-anim');
+ const s = anim.selector('.anmroot #openrc .openrc-password-anim');
s.style('opacity:0;transform:scaleX(0);');
anim.in(1, next);
},
@@ -349,7 +349,7 @@ max-height: max-content;`);
const ttyStepHandlers: Step[] = [
(next) => anim.in(100, next),
(next) => {
- const s = anim.selector(`#openrc .ttylines-openrc`);
+ const s = anim.selector(`.anmroot #openrc .ttylines-openrc`);
s.style(altHiddenStyles);
anim.in(1, () => {
s.style(altVisibleStyles);
@@ -363,7 +363,7 @@ const ttyStepHandlers: Step[] = [
switch (step.kind) {
case 'text': {
const s = anim.selector(
- `${isBeforeFirstClear ? '#openrc' : '#tty-' + (ttyIdx - 1)} ${step.classes
+ `.anmroot ${isBeforeFirstClear ? '#openrc' : '#tty-' + (ttyIdx - 1)} ${step.classes
.map((v) => `.${v}`)
.join('')}`,
);
@@ -376,7 +376,7 @@ const ttyStepHandlers: Step[] = [
}
case 'removeNode': {
const s = anim.selector(
- `${isBeforeFirstClear ? '#openrc' : '#tty-' + (ttyIdx - 1)} ${step.removedItemClassList
+ `.anmroot ${isBeforeFirstClear ? '#openrc' : '#tty-' + (ttyIdx - 1)} ${step.removedItemClassList
.map((v) => `.${v}`)
.join('')}`,
);
@@ -418,7 +418,7 @@ const handleSteps: Step[] = [
...openrcStepHandlers(1),
...ttyStepHandlers,
(n) => {
- const s = anim.selector('#app .hidden-after-anim');
+ const s = anim.selector('.anmroot #app .hidden-after-anim');
s.style(visibleStyles);
anim._internal_timeline.now += 1;
s.style(hiddenStyles);
diff --git a/src/routes/shared.ts b/src/routes/shared.ts
index caefe05..2ffdb0e 100644
--- a/src/routes/shared.ts
+++ b/src/routes/shared.ts
@@ -210,7 +210,7 @@ export const ttyLines: TTYText[] = (() => {
renderrestriction: 'noscript',
},
[
- 'This browser does not support JS. Your experience may be degraded.',
+ 'No JS. Some links may not work as intended.',
{
bg: '#ff0000',
colour: '#dedede',
generated by cgit v1.2.3 (git 2.25.1) at 2026-01-14 09:20:37 +0000