bin/mode.ts

@@ -1,19 +0,0 @@
-/// <reference lib="dom" />
-// Swap UI between cinema mode (fix 16:9) and 100% height.
-
-import { content } from "@/js/dom"
-import { focusInput } from "@/js/focus"
-import { resize } from "@/js/resize"
-import { send } from "@/js/websocket"
-
-export default function (mode?: string) {
-    if (!mode) {
-        mode = document.body.dataset.mode === "tall" ? "cinema" : "tall"
-        send({ type: "session:update", data: { "ui:mode": mode } })
-    }
-
-    content.style.display = ""
-    document.body.dataset.mode = mode
-    resize()
-    focusInput()
-}

src/commands.ts

@@ -7,7 +7,6 @@ import { join, basename } from "path"
 import { isFile } from "./utils"
 import { sendAll } from "./websocket"
 import { expectDir } from "./utils"
-import { importUrl } from "./shared/utils"
 import type { Command, Commands } from "./shared/types"
 import { projectBin, projectName } from "./project"
 import { DEFAULT_PROJECT, NOSE_DIR, NOSE_ROOT_BIN, NOSE_BIN } from "./config"
@@ -82,7 +81,7 @@ export async function commandSource(name: string): Promise<string> {
 export async function loadCommandModule(cmd: string) {
   const path = commandPath(cmd)
   if (!path) return
-  return await importUrl(path + "?t+" + Date.now())
+  return await import(path + "?t+" + Date.now())
 }
 
 let noseDirWatcher

src/js/commands.ts

@@ -1,18 +1,32 @@
 ////
-// Keep track of all NOSE commands.
+// temporary hack for browser commands
 
-import type { Commands } from "../shared/types"
+import type { CommandOutput, Commands } from "../shared/types"
-import { runCommand } from "./shell"
+import { content } from "./dom"
+import { focusInput } from "./focus"
+import { resize } from "./resize"
+import { send } from "./websocket"
 
 export const commands: Commands = {}
 
+// TODO: convert to bin/shell "browser" commands
+export const browserCommands: Record<string, (...args: string[]) => void | Promise<void> | CommandOutput> = {
+  mode: (mode?: string) => {
+    if (!mode) {
+      mode = document.body.dataset.mode === "tall" ? "cinema" : "tall"
+      send({ type: "session:update", data: { "ui:mode": mode } })
+    }
+
+    content.style.display = ""
+    document.body.dataset.mode = mode
+    resize()
+    focusInput()
+  },
+}
+
 export function cacheCommands(cmds: Commands) {
   for (const key in commands)
     delete commands[key]
 
   Object.assign(commands, cmds)
 }
-
-export async function mode(mode?: string) {
-  await runCommand(mode ? `mode ${mode}` : "mode", false)
-}

src/js/game.ts

@@ -2,10 +2,10 @@ import type { GameStartMessage } from "../shared/types"
 import { GameContext, type InputState } from "../shared/game"
 import { focusInput } from "./focus"
 import { $$ } from "./dom"
-import { randomId, importUrl } from "../shared/utils"
+import { randomId } from "../shared/utils"
 import { setStatus, addOutput, insert } from "./scrollback"
+import { browserCommands } from "./commands"
 import { sessionId } from "./session"
-import { mode } from "./commands"
 
 const FPS = 30
 const HEIGHT = 540
@@ -35,7 +35,7 @@ export async function handleGameStart(msg: GameStartMessage) {
 
   let game
   try {
-    game = await importUrl(`/source/${name}?session=${sessionId}&t=${Date.now()}`)
+    game = await import(`/source/${name}?session=${sessionId}`)
   } catch (err: any) {
     setStatus(msgId, "error")
     addOutput(msgId, `Error: ${err.message ? err.message : err}`)
@@ -43,7 +43,7 @@ export async function handleGameStart(msg: GameStartMessage) {
   }
 
   if (document.body.dataset.mode === "tall") {
-    mode()
+    browserCommands.mode?.()
     oldMode = "tall"
   }
 
@@ -143,7 +143,7 @@ function endGame() {
   window.removeEventListener("keyup", handleKeyup)
   window.removeEventListener("resize", resizeCanvas)
 
-  if (oldMode === "tall") mode()
+  if (oldMode === "tall") browserCommands.mode?.()
 
   const main = document.querySelector("main")
   main?.classList.remove("game")

src/js/session.ts

@@ -3,10 +3,10 @@
 // in the same browser.
 
 import type { SessionStartMessage, SessionUpdateMessage } from "@/shared/types"
+import { browserCommands } from "./commands"
 import { randomId } from "../shared/utils"
 import { apps } from "./webapp"
 import { $ } from "./dom"
-import { mode } from "./commands"
 
 export const sessionId = randomId()
 export const projectName = $("project-name") as HTMLAnchorElement
@@ -25,7 +25,7 @@ export function handleSessionStart(msg: SessionStartMessage) {
     sessionStore.set("hostname", msg.data.hostname)
     updateProjectName(msg.data.project)
     updateCwd(msg.data.cwd)
-    mode(msg.data.mode)
+    browserCommands.mode?.(msg.data.mode)
 }
 
 export function handleSessionUpdate(msg: SessionUpdateMessage) {

src/js/shell.ts

@@ -4,11 +4,11 @@
 import type { InputMessage } from "../shared/types"
 import { addInput, setStatus, addOutput } from "./scrollback"
 import { send } from "./websocket"
-import { randomId, importUrl } from "../shared/utils"
+import { randomId } from "../shared/utils"
 import { addToHistory } from "./history"
-import { commands } from "./commands"
+import { browserCommands, commands } from "./commands"
 
-export async function runCommand(input: string, showInput = true) {
+export async function runCommand(input: string) {
     if (!input.trim()) return
 
     if (input.includes(";")) {
@@ -19,21 +19,19 @@ export async function runCommand(input: string, showInput = true) {
     const id = randomId()
 
     addToHistory(input)
-    if (showInput)
     addInput(id, input)
 
     const [cmd = "", ...args] = input.split(" ")
 
     if (commands[cmd]?.type === "browser") {
-        const mod = await importUrl(`/source/${cmd}?t=${Date.now()}`)
+        const mod = await import(`/source/${cmd}?t=${Date.now()}`)
-        if (!mod.default) {
-            addOutput(id, `no default export in ${cmd}`)
-            setStatus(id, "error")
-            return
-        }
         const result = mod.default(...args)
         if (result) addOutput(id, result)
         setStatus(id, "ok")
+    } else if (browserCommands[cmd]) {
+        const result = await browserCommands[cmd](...args)
+        if (result) addOutput(id, result)
+        setStatus(id, "ok")
     } else {
         send({ id, type: "input", data: input } as InputMessage)
     }

src/shared/utils.ts

@@ -39,8 +39,3 @@ export function randomIndex<T>(list: T[]): number | undefined {
 export function unique<T>(array: T[]): T[] {
     return [...new Set(array)]
 }
-
-export async function importUrl(url: string) {
-    console.log("-> import", url)
-    return import(url)
-}

src/webapp.ts

@@ -10,7 +10,6 @@ import { sendAll } from "./websocket"
 import { expectDir } from "./utils"
 import { NOSE_DIR } from "./config"
 import { isFile, isDir } from "./utils"
-import { importUrl } from "./shared/utils"
 
 export type Handler = (r: Context) => string | Child | Response | Promise<Response>
 export type App = Hono | Handler
@@ -74,7 +73,7 @@ async function findApp(name: string): Promise<App | undefined> {
 async function loadApp(path: string): Promise<App | undefined> {
     if (!await Bun.file(path).exists()) return
 
-    const mod = await importUrl(path + `?t=${Date.now()}`)
+    const mod = await import(path + `?t=${Date.now()}`)
     if (mod?.default)
         return mod.default as App
 }