diff options
Diffstat (limited to 'vfs')
| -rw-r--r-- | vfs/example.ts | 28 | ||||
| -rw-r--r-- | vfs/vfs.d.ts | 40 | ||||
| -rw-r--r-- | vfs/vfs.ts | 77 |
3 files changed, 71 insertions, 74 deletions
diff --git a/vfs/example.ts b/vfs/example.ts index f2bc91d..6c963d0 100644 --- a/vfs/example.ts +++ b/vfs/example.ts @@ -1,14 +1,14 @@ // SPDX-FileCopyrightText: 2021 M. Shulhan <ms@kilabit.info> // SPDX-License-Identifier: GPL-3.0-or-later -import { WuiVfs, WuiVfsNodeInterface } from "./vfs.js"; +import { WuiVfs, WuiVfsNodeInterface, WuiVfsOptions } from "./vfs.js"; import { WuiResponseInterface } from "../response.js"; interface PathNodeInterface { [key: string]: WuiVfsNodeInterface; } -let dummyfs: PathNodeInterface = { +const dummyfs: PathNodeInterface = { "/": { name: "/", path: "/", @@ -100,27 +100,27 @@ let dummyfs: PathNodeInterface = { }; async function main() { - let opts = { + const opts: WuiVfsOptions = { id: "vfs", - Open: Open, - OpenNode: OpenNode, + open: open, + openNode: openNode, }; - let wui_vfs = new WuiVfs(opts); - wui_vfs.OpenDir("/"); + const wuiVFS = new WuiVfs(opts); + wuiVFS.openDir("/"); } -async function Open( +async function open( path: string, - is_dir: boolean, + isDir: boolean, ): Promise<WuiResponseInterface> { - console.log("Open:", path, is_dir); - let res: WuiResponseInterface = { + console.log("Open:", path, isDir); + const res: WuiResponseInterface = { code: 200, message: "", }; - if (is_dir) { + if (isDir) { res.data = dummyfs[path]; return res; } @@ -158,10 +158,10 @@ async function Open( return res; } -async function OpenNode( +async function openNode( node: WuiVfsNodeInterface, ): Promise<WuiResponseInterface> { - return await Open(node.path, node.is_dir); + return await open(node.path, node.is_dir); } main(); diff --git a/vfs/vfs.d.ts b/vfs/vfs.d.ts index 5e89b33..a7d365d 100644 --- a/vfs/vfs.d.ts +++ b/vfs/vfs.d.ts @@ -1,27 +1,27 @@ import { WuiResponseInterface } from "../response"; export interface WuiVfsNodeInterface { - name: string; - path: string; - is_dir: boolean; - content_type?: string; - mod_time?: number; - size?: number; - mode?: string; - childs?: WuiVfsNodeInterface[]; - content: string; + name: string; + path: string; + is_dir: boolean; + content_type?: string; + mod_time?: number; + size?: number; + mode?: string; + childs?: WuiVfsNodeInterface[]; + content: string; } export interface WuiVfsOptions { - id: string; - Open(path: string, is_dir: boolean): Promise<WuiResponseInterface>; - OpenNode(node: WuiVfsNodeInterface): Promise<WuiResponseInterface>; + id: string; + Open(path: string, is_dir: boolean): Promise<WuiResponseInterface>; + OpenNode(node: WuiVfsNodeInterface): Promise<WuiResponseInterface>; } export declare class WuiVfs { - opts: WuiVfsOptions; - private el; - private com_path; - private com_list; - constructor(opts: WuiVfsOptions); - OpenNode(node: WuiVfsNodeInterface): void; - OpenDir(path: string): Promise<void>; - Set(node: WuiVfsNodeInterface): void; + opts: WuiVfsOptions; + private el; + private com_path; + private com_list; + constructor(opts: WuiVfsOptions); + OpenNode(node: WuiVfsNodeInterface): void; + OpenDir(path: string): Promise<void>; + Set(node: WuiVfsNodeInterface): void; } @@ -24,13 +24,13 @@ type NodeClickHandler = (node: WuiVfsNodeInterface) => void; export interface WuiVfsOptions { id: string; - // Open define an handler that will be called when a directory is clicked + // open define an handler that will be called when a directory is clicked // from the WuiVfsPath. - Open(path: string, is_dir: boolean): Promise<WuiResponseInterface>; + open(path: string, is_dir: boolean): Promise<WuiResponseInterface>; - // OpenNode define an handler that will be called when a file is clicked + // openNode define an handler that will be called when a file is clicked // from the WuiVfsList. - OpenNode(node: WuiVfsNodeInterface): Promise<WuiResponseInterface>; + openNode(node: WuiVfsNodeInterface): Promise<WuiResponseInterface>; } export class WuiVfs { @@ -41,7 +41,7 @@ export class WuiVfs { constructor(public opts: WuiVfsOptions) { this.opts = opts; - let el = document.getElementById(opts.id); + const el = document.getElementById(opts.id); if (!el) { console.error("WuiVfs: element id", opts.id, "not found"); return; @@ -49,40 +49,40 @@ export class WuiVfs { this.el = el; this.com_path = new WuiVfsPath((path: string) => { - this.OpenDir(path); + this.openDir(path); }); this.el.appendChild(this.com_path.el); this.com_list = new WuiVfsList((node: WuiVfsNodeInterface) => { - this.OpenNode(node); + this.openNode(node); }); this.el.appendChild(this.com_list.el); } - // OpenNode is a handler that will be called when a node is clicked + // openNode is a handler that will be called when a node is clicked // inside the WuiVfsList. - OpenNode(node: WuiVfsNodeInterface): void { + openNode(node: WuiVfsNodeInterface): void { if (node.is_dir) { - this.OpenDir(node.path); + this.openDir(node.path); } else { - this.opts.OpenNode(node); + this.opts.openNode(node); } } - // OpenDir is a handler that will be called when a path is clicked + // openDir is a handler that will be called when a path is clicked // inside the WuiVfsPath. - async OpenDir(path: string): Promise<void> { - let res = await this.opts.Open(path, true); + async openDir(path: string): Promise<void> { + const res = await this.opts.open(path, true); if (res.code != 200) { return; } - this.Set(res.data as WuiVfsNodeInterface); + this.set(res.data as WuiVfsNodeInterface); } - Set(node: WuiVfsNodeInterface) { + set(node: WuiVfsNodeInterface) { if (node.is_dir) { - this.com_path.Open(node); - this.com_list.Open(node); + this.com_path.open(node); + this.com_list.open(node); } } } @@ -99,14 +99,14 @@ class WuiVfsList { this.el.style.borderColor = "silver"; } - Open(node: WuiVfsNodeInterface) { + open(node: WuiVfsNodeInterface) { this.node = node; this.el.innerHTML = ""; if (!this.node.childs) { return; } - for (let c of this.node.childs) { - let el = document.createElement("div"); + for (const c of this.node.childs) { + const el = document.createElement("div"); el.style.padding = "1em"; el.style.cursor = "pointer"; el.innerHTML = c.name; @@ -115,17 +115,17 @@ class WuiVfsList { el.style.backgroundColor = "cornsilk"; } - el.onclick = (ev: MouseEvent) => { + el.onclick = () => { this.onClick(c); }; - el.onmouseout = (event) => { + el.onmouseout = () => { if (c.is_dir) { el.style.backgroundColor = "cornsilk"; } else { el.style.backgroundColor = "white"; } }; - el.onmouseover = (event) => { + el.onmouseover = () => { el.style.backgroundColor = "aliceblue"; }; @@ -136,7 +136,6 @@ class WuiVfsList { class WuiVfsPath { el: HTMLElement; - private crumbs: string[]; private onClick: PathClickHandler; constructor(onClick: PathClickHandler) { @@ -146,14 +145,12 @@ class WuiVfsPath { this.el.style.borderWidth = "1px"; this.el.style.borderStyle = "solid"; this.el.style.borderColor = "silver"; - this.crumbs = []; this.onClick = onClick; } - Open(node: WuiVfsNodeInterface) { + open(node: WuiVfsNodeInterface) { this.el.innerHTML = ""; - this.crumbs = []; - let paths = []; + let paths: string[] = []; if (node.path == "/") { paths.push(node.path); @@ -161,35 +158,35 @@ class WuiVfsPath { paths = node.path.split("/"); } - for (let x = 0; x < paths.length; x++) { - let full_path = ""; + paths.forEach((path, x) => { + let fullPath = ""; let p = ""; if (x == 0) { p = "/"; - full_path = "/"; + fullPath = "/"; } else { - p = paths[x]; - full_path = paths.slice(0, x + 1).join("/"); + p = path; + fullPath = paths.slice(0, x + 1).join("/"); } - let crumb = document.createElement("span"); + const crumb = document.createElement("span"); crumb.style.display = "inline-block"; crumb.style.padding = "1em"; crumb.style.cursor = "pointer"; crumb.innerHTML = p; - crumb.onclick = (event) => { - this.onClick(full_path); + crumb.onclick = () => { + this.onClick(fullPath); }; - crumb.onmouseout = (event) => { + crumb.onmouseout = () => { crumb.style.backgroundColor = "white"; }; - crumb.onmouseover = (event) => { + crumb.onmouseover = () => { crumb.style.backgroundColor = "aliceblue"; }; this.el.appendChild(crumb); - } + }); } } |
