diff --git a/src/App.tsx b/src/App.tsx index 4773c15..99bfce6 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -50,8 +50,9 @@ function getHref(f: File) return f.type == "directory" ? urlJoin(fullPath, f.name) : urlJoin(host, filePath, f.name) } +const alpNum = new Set("0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ") + export default function App() { - let bcMax: number const [api] = createResource(fetchApi) const paths = [window.location.host, ...filePath.split("/").filter(it => it)] @@ -60,9 +61,23 @@ export default function App() { const scrollNext = () => setScrollIndex(Math.min(scrollIndex() + 20, api().length)) // Search - const [search, setSearch] = createSignal() + let searchInp: HTMLInputElement + const [search, setSearch] = createSignal("") + const [searchOn, setSearchOn] = createSignal(false) + const searchChange = e => { + const val = (e.target as HTMLInputElement).value + setSearch(val) + if (val == "") setSearchOn(false) + } + + // Type anywhere to activate search + window.addEventListener("keydown", e => { + if (!searchOn()) setSearchOn(true) + searchInp.focus() + }) // Handle wheel for breadcrumb + let bcMax: number const [bcLeft, setBcLeft] = createSignal(0) function wheel(e: WheelEvent) { @@ -92,12 +107,13 @@ export default function App() { {/* Search bar */} - - setSearch((e.target as HTMLInputElement).value)} /> + + {/* Breadcrumbs */} - +
wheel(e)} style={{'margin-left': -bcLeft() + 'px'}} ref={w => initWheel(w)}>