diff --git a/public/fear/fonts/vcr.ttf b/public/fear/fonts/vcr.ttf
new file mode 100644
index 0000000..dcca687
Binary files /dev/null and b/public/fear/fonts/vcr.ttf differ
diff --git a/src/app/fear/page.tsx b/src/app/fear/page.tsx
index 064de8c..ce57259 100644
--- a/src/app/fear/page.tsx
+++ b/src/app/fear/page.tsx
@@ -15,6 +15,7 @@ import Player from './scene-components/player';
import Hallway from './scene-components/hallway';
import { AudioListener } from 'three';
+import FinaleText from './scene-components/finale-text';
function PostProcessing() {
const [wasCaught, setWasCaught] = useState(fearState.wasCaught);
@@ -94,7 +95,7 @@ export default function Fear() {
-
+
: null}
+
+
>)
}
\ No newline at end of file
diff --git a/src/app/fear/scene-components/finale-text.css b/src/app/fear/scene-components/finale-text.css
new file mode 100644
index 0000000..0d80da6
--- /dev/null
+++ b/src/app/fear/scene-components/finale-text.css
@@ -0,0 +1,52 @@
+@font-face {
+ font-family: 'VCR';
+ src: url('/fear/fonts/vcr.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+ font-display: swap;
+}
+
+.finale-container {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0vh;
+
+ display: grid;
+ align-items: center;
+ align-content: center;
+ justify-content: center;
+ overflow: hidden;
+
+ grid-auto-rows: 2.5vh;
+ /* grid-template-columns: 0; */
+ grid-template-rows: repeat(auto-fit, max-content);
+
+ user-select: none;
+}
+
+.finale-text {
+ font-family: 'VCR', sans-serif;
+ height: 0px;
+ width: 100%;
+ color: rgb(255, 255, 255);
+ font-size: 5vh;
+
+ text-align: center;
+ white-space: nowrap;
+}
+
+.scanlines {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 900;
+ background: repeating-linear-gradient(rgba(0, 0, 0, 0) 0px,
+ rgba(0, 0, 0, 0) 2px,
+ rgba(0, 0, 0, 0.3) 2px,
+ rgba(0, 0, 0, 0.3) 4px);
+
+}
\ No newline at end of file
diff --git a/src/app/fear/scene-components/finale-text.tsx b/src/app/fear/scene-components/finale-text.tsx
new file mode 100644
index 0000000..9fc0220
--- /dev/null
+++ b/src/app/fear/scene-components/finale-text.tsx
@@ -0,0 +1,36 @@
+import { JSX, useEffect, useState } from "react"
+import { FEAR_SETTINGS, fearState } from "../state"
+
+import './finale-text.css';
+
+export default function FinaleText() {
+ const [progression, setProgression] = useState(fearState.finaleProgression);
+ const [wasCaught, setWasCaught] = useState(fearState.isRustActive);
+
+ useEffect(() => {
+ const unsubscribe = fearState.subscribe(() => {
+ setProgression(fearState.finaleProgression);
+ setWasCaught(fearState.wasCaught)
+ });
+ return () => unsubscribe();
+ });
+
+
+ let elementCount = (FEAR_SETTINGS.EVENT_FINALE_TEXT_COUNT / FEAR_SETTINGS.EVENT_FINALE_DURATION) * progression;
+
+ let testElements: Array = [];
+
+ for (let x = 0; x < elementCount; x++)
+ testElements.push(the deal has been sealed)
+
+
+ if (wasCaught)
+ return (<>
+
+ {testElements}
+
+
+ >)
+
+ return <>>
+}
\ No newline at end of file
diff --git a/src/app/fear/state.ts b/src/app/fear/state.ts
index 0ce2159..7baeb93 100644
--- a/src/app/fear/state.ts
+++ b/src/app/fear/state.ts
@@ -12,7 +12,10 @@ export const FEAR_SETTINGS = {
EVENT_NARROW_LOOP_COUNT: 2,
EVENT_RUST_LOOP_COUNT: 4,
- EVENT_FINALE_LOOP_COUNT: 5
+ EVENT_FINALE_LOOP_COUNT: 5,
+
+ EVENT_FINALE_DURATION: 3,
+ EVENT_FINALE_TEXT_COUNT: 128
};
const listeners = new Set<() => void>();
@@ -23,6 +26,7 @@ export const fearState = {
isRustActive: false,
finaleTriggered: false,
wasCaught: false,
+ finaleProgression: 0,
subscribe(listener: () => void) {
listeners.add(listener);
@@ -39,8 +43,12 @@ export const fearState = {
if (Math.abs(this.currentWidth - newWidth) > 0.001) {
this.currentWidth = newWidth;
- this.emit();
}
+
+ if (this.wasCaught && this.finaleProgression < FEAR_SETTINGS.EVENT_FINALE_DURATION)
+ this.finaleProgression = Math.min(this.finaleProgression + delta, FEAR_SETTINGS.EVENT_FINALE_DURATION);
+
+ this.emit();
},
registerLoop(direction: 'forward' | 'backward') {