diff --git a/bun.lock b/bun.lock index e3cfe7b..7864799 100644 --- a/bun.lock +++ b/bun.lock @@ -7,7 +7,7 @@ "@astrojs/react": "^4.2.0", "@types/react": "^19.0.8", "@types/react-dom": "^19.0.3", - "astro": "^5.2.3", + "astro": "^5.2.5", "react": "^19.0.0", "react-dom": "^19.0.0", "sass": "^1.83.4", diff --git a/src/components/react/shell/events.tsx b/src/components/react/shell/events.tsx index d548913..28251f6 100644 --- a/src/components/react/shell/events.tsx +++ b/src/components/react/shell/events.tsx @@ -11,25 +11,34 @@ const enum Key { Tab = "Tab" } -function DisplayPrompt() { +function display_prompt() { return <> } -function Prompt([existingPrompts, setPrompt]: [JSX.Element[], SetStateAction]) { - const shell_prompts = document.getElementsByClassName("shell-ps1") - Array.from(shell_prompts).forEach((shellps1) => { - (shellps1 as HTMLInputElement).disabled = true - }) - setPrompt([...existingPrompts, DisplayPrompt()]) +function get_current_prompt(): HTMLInputElement | undefined { + const shell_input = document.getElementsByClassName("shell-ps1") + return shell_input[shell_input.length-1] as HTMLInputElement } -function keyboard_stream(terminal_window: HTMLElement, existingPrompts: JSX.Element[], setPrompt: SetStateAction) { - terminal_window.addEventListener("keydown", keyboard_event => { +function new_prompt([existingPrompts, setPrompt]: [JSX.Element[], SetStateAction]) { + const shell_prompts = document.getElementsByClassName("shell-ps1") + Array.from(shell_prompts).forEach(shellps1 => { + (shellps1 as HTMLInputElement).disabled = true + }) + setPrompt([...existingPrompts, display_prompt()]) +} + +function keyboard_event(terminal: HTMLElement, existingPrompts: JSX.Element[], setPrompt: SetStateAction) { + const terminal_event = (keyboard_event: KeyboardEvent) => { if (keyboard_event.key === Key.Enter) { - Prompt([existingPrompts, setPrompt]) + const current_prompt = get_current_prompt() + if (current_prompt) { + new_prompt([existingPrompts, setPrompt]) + terminal.removeEventListener("keydown", terminal_event) + } } else if (keyboard_event.key === Key.ArrowUp) { } else if (keyboard_event.key === Key.ArrowDown) { @@ -37,18 +46,11 @@ function keyboard_stream(terminal_window: HTMLElement, existingPrompts: JSX.Elem } else if (keyboard_event.key === Key.Tab) { } - }) -} - -function Events() { - const terminal_window = document.querySelector("main") - if (terminal_window) { - const [existingPrompts, setPrompt] = useState([DisplayPrompt()]) - - keyboard_stream(terminal_window, existingPrompts, setPrompt) - return existingPrompts } - return + terminal.addEventListener("keydown", terminal_event) } -export default Events \ No newline at end of file +export { + keyboard_event, + display_prompt +} \ No newline at end of file diff --git a/src/components/react/shell/prompt.tsx b/src/components/react/shell/prompt.tsx index 58b5780..4e43e82 100644 --- a/src/components/react/shell/prompt.tsx +++ b/src/components/react/shell/prompt.tsx @@ -3,7 +3,11 @@ import { cyan, green } from "./color" const userAgent = navigator.userAgent const browser_name_fallible = userAgent.match(/Firefox.\d+[\d.\d]+|Chrome.\d+[\d.\d]+/gm)?.map(f => f.split("/")[0]) -const browser_name = browser_name_fallible ? browser_name_fallible[0].toLowerCase() : "unknown" + +let browser_name = "unknown" +if (browser_name_fallible) { + browser_name = browser_name_fallible[0] === "Firefox" ? "gecko" : "chromium" +} function GetWorkingDir() { return working_dir === "user" ? "~" : working_dir diff --git a/src/components/react/terminal/events.ts b/src/components/react/terminal/events.ts deleted file mode 100644 index 324c6cd..0000000 --- a/src/components/react/terminal/events.ts +++ /dev/null @@ -1,10 +0,0 @@ -const terminal_window = document.querySelector("main"); - -export function TermEvents() { - if (terminal_window) { - // terminal_window.addEventListener("click", (_event) => { - // const shell_input = document.getElementById("shell-input") - // if (shell_input) { shell_input.focus() } - // }) - } -} \ No newline at end of file diff --git a/src/components/react/terminal/exec.tsx b/src/components/react/terminal/exec.tsx index 504d04c..c344e1c 100644 --- a/src/components/react/terminal/exec.tsx +++ b/src/components/react/terminal/exec.tsx @@ -1,9 +1,11 @@ -import { TermEvents } from "./events" +import { useState } from "react" import { red } from "../shell/color" -import Events from "../shell/events" +import { display_prompt, keyboard_event } from "../shell/events" -function Panic(message: string) { +const terminal_window = document.querySelector("main") + +function panic(message: string) { return <>

{red("=================================================")}

{red("An unexpected JavaScript error occured:")}

@@ -13,9 +15,13 @@ function Panic(message: string) { } export default function Shell() { - const existingPrompts = Events() - if (existingPrompts) { + if (terminal_window) { + const [existingPrompts, setPrompt] = useState([display_prompt()]) + keyboard_event(terminal_window, existingPrompts, setPrompt) + return existingPrompts.map((ps1, k) =>
{ps1}
) } - return Panic("The
element is missing") -} \ No newline at end of file + return panic("The
element is missing") +} + +export { panic } \ No newline at end of file diff --git a/src/layouts/Webpage.astro b/src/layouts/Webpage.astro index f5f1629..b9ba5f3 100644 --- a/src/layouts/Webpage.astro +++ b/src/layouts/Webpage.astro @@ -2,11 +2,6 @@ import Metas from "../components/metas.astro" import Header from "../components/header.astro" import Footer from "../components/footer.astro" - -interface Props { - title: string, -} -const {title} = Astro.props --- @@ -14,10 +9,10 @@ const {title} = Astro.props - {`rhpidfyre.io | ${title}`} + rhpidfyre.io -
+