nv-html-term-paint 1.0.1

package/TEST/tst-cli.js

@@ -0,0 +1,8 @@
+const x=require("../index");
+let html = require("fs").readFileSync(process.argv[2]).toString();
+console.log(html.length)
+let s = x(
+   html,
+   {max_depth:Number(process.argv[3]??4)}
+);
+console.log(s)

package/colors.js

@@ -0,0 +1,97 @@
+//终端染色
+
+// ANSI Escape Codes
+const RESET = "\x1b[0m";
+const UNDERLINE = "\x1b[4m";
+const DIM = "\x1b[2m";
+const BRIGHT = "\x1b[1m";
+
+// 建议在 colors.js 中这样定义
+const C = {
+    STRUCT: "\x1b[38;5;208m", // 橙色：骨架标签 (html, body, div, section)
+    INLINE: "\x1b[38;5;148m", // 黄绿色：行内文本 (span, a, b, i)
+    FORM:   "\x1b[38;5;39m",  // 蓝色：交互控件 (input, button, select)
+    HEAD:   "\x1b[38;5;244m", // 灰色：头部元数据 (meta, link, title)
+    MEDIA:  "\x1b[38;5;170m", // 紫色：多媒体 (img, video, canvas, svg)
+    GOLD: "\x1b[38;5;214m",
+    CYAN: "\x1b[36m",
+    L_BLUE: "\x1b[94m",
+    GRAY: "\x1b[90m",
+    D_GRAY: "\x1b[38;5;237m",
+    WHITE: "\x1b[37m",
+    GREEN: "\x1b[32m"
+};
+
+const DFLT_BUILTIN_TAGS = {
+    // 1. 骨架与块级容器 (Structural)
+    "html": C.STRUCT, "body": C.STRUCT, "head": C.HEAD,
+    "div": C.STRUCT, "section": C.STRUCT, "article": C.STRUCT, 
+    "nav": C.STRUCT, "header": C.STRUCT, "footer": C.STRUCT,
+    "main": C.STRUCT, "aside": C.STRUCT, "details": C.STRUCT, "summary": C.STRUCT,
+
+    // 2. 文本内容 (Content)
+    "h1": C.STRUCT, "h2": C.STRUCT, "h3": C.STRUCT, "h4": C.STRUCT, "h5": C.STRUCT, "h6": C.STRUCT,
+    "p": C.INLINE, "li": C.INLINE, "ul": C.STRUCT, "ol": C.STRUCT, "dl": C.STRUCT, "dt": C.STRUCT, "dd": C.STRUCT,
+    "blockquote": C.INLINE, "pre": C.INLINE, "code": C.INLINE, "span": C.INLINE, "a": C.INLINE,
+
+    // 3. 表单与交互 (Forms & Interactive)
+    "form": C.FORM, "input": C.FORM, "button": C.FORM, "select": C.FORM, 
+    "textarea": C.FORM, "label": C.FORM, "option": C.FORM, "optgroup": C.FORM,
+    "datalist": C.FORM, "progress": C.FORM, "meter": C.FORM,
+
+    // 4. 多媒体与图形 (Media)
+    "img": C.MEDIA, "video": C.MEDIA, "audio": C.MEDIA, "canvas": C.MEDIA, 
+    "svg": C.MEDIA, "picture": C.MEDIA, "source": C.MEDIA, "track": C.MEDIA,
+
+    // 5. 表格 (Table)
+    "table": C.STRUCT, "thead": C.STRUCT, "tbody": C.STRUCT, "tfoot": C.STRUCT,
+    "tr": C.STRUCT, "th": C.INLINE, "td": C.INLINE, "caption": C.INLINE,
+
+    // 6. 元数据与脚本 (Meta & Script) - 通常建议用暗色，因为它们不是视觉重点
+    "meta": C.HEAD, "link": C.HEAD, "title": C.HEAD, "style": C.HEAD, "script": C.HEAD,
+    "noscript": C.HEAD, "template": C.HEAD, "base": C.HEAD,
+
+    // 7. 其他/功能性
+    "br": C.HEAD, "hr": C.HEAD, "wbr": C.HEAD, "iframe": C.MEDIA, "embed": C.MEDIA, "object": C.MEDIA
+};
+
+const theme = {
+    underline_tags: [],
+    tag: {
+        ...DFLT_BUILTIN_TAGS,
+        ___other___: C.L_BLUE // 自定义标签用亮蓝色区分
+    },
+    attrk: {
+        id: C.CYAN,
+        class: C.GREEN,
+	href: C.HEAD,
+	src : C.HEAD,
+        ___other___: C.D_GRAY
+    },
+    attrv: {
+        id: BRIGHT + C.CYAN,   // 更亮的青色
+        class: BRIGHT + C.GREEN, // 更亮的绿色
+	src:BRIGHT + C.L_BLUE,
+	href:BRIGHT + C.L_BLUE,
+        ___other___: C.D_GRAY
+    },
+    underline_attrvs: ["id", "class", "href","src"],
+    txt: C.GRAY,
+    punc: C.D_GRAY,
+    reset:RESET,
+};
+
+// 辅助包装函数：处理 underline 和颜色合成
+const paint = (type, key, val) => {
+    let color = theme[type][key] || theme[type].___other___;
+    let style = color;
+    if (type === 'tag' && theme.underline_tags.includes(key)) style += UNDERLINE;
+    if (type === 'attrv' && theme.underline_attrvs.includes(key)) style += UNDERLINE;
+    return `${style}${val}${RESET}`;
+};
+
+module.exports = {
+    theme,
+    paint,
+    RESET,
+}

package/index.js

@@ -0,0 +1,92 @@
+
+
+const {crsync}   = require("nv-hson-der-from-str-cmmn");
+
+const {theme,paint,RESET} = require("./colors");
+
+const DFLT_CFG= ()=>({
+   just_show  : true,
+   ignore_text: true,
+   max_depth  : 5,
+});
+
+module.exports = (html_str, cfg = DFLT_CFG(), COLORS = theme) => {
+    const { just_show, ignore_text, max_depth } = { ...DFLT_CFG(), ...cfg };
+    let painted_str = "";
+
+    const write = (s) => {
+        if (just_show) {
+            process.stdout.write(s);
+        } else {
+            painted_str += s;
+        }
+    };
+
+    const cbs = {
+        open: (tag, attr, id, depth) => {
+            if (depth > max_depth) return;
+
+            const indent = "  ".repeat(depth);
+            const p_tag = paint('tag', tag, tag);
+            const p_lt = COLORS.punc + "<" + RESET;
+            const p_gt = COLORS.punc + ">" + RESET;
+
+            let attr_str = "";
+            for (let k in attr) {
+                const pk = paint('attrk', k, k);
+                const pv = paint('attrv', k, `"${attr[k]}"`);
+                attr_str += ` ${pk}${COLORS.punc}=${RESET}${pv}`;
+            }
+
+            write(`${indent}${p_lt}${p_tag}${attr_str}${p_gt}\n`);
+        },
+        leaf: (tag, attr, id, depth) => {
+            if (depth > max_depth) return;
+
+            const indent = "  ".repeat(depth);
+            const p_tag = paint('tag', tag, tag);
+            const p_lt = COLORS.punc + "<" + RESET;
+            const p_gt = COLORS.punc + " />" + RESET;
+
+            let attr_str = "";
+            for (let k in attr) {
+                const pk = paint('attrk', k, k);
+                const pv = paint('attrv', k, `"${attr[k]}"`);
+                attr_str += ` ${pk}${COLORS.punc}=${RESET}${pv}`;
+            }
+
+            write(`${indent}${p_lt}${p_tag}${attr_str}${p_gt}\n`);
+        },
+        clos: (tag, id, depth, open_id) => {
+            if (depth > max_depth) return;
+
+            const indent = "  ".repeat(depth);
+            const p_tag = paint('tag', tag, tag);
+            const p_punc_start = COLORS.punc + "</" + RESET;
+            const p_punc_end = COLORS.punc + ">" + RESET;
+
+            write(`${indent}${p_punc_start}${p_tag}${p_punc_end}\n`);
+        },
+        text: (txt, id, depth) => {
+            if (ignore_text || depth > max_depth) return;
+
+            const content = txt.trim();
+            if (content.length === 0) return;
+
+            const indent = "  ".repeat(depth);
+            const p_txt = COLORS.txt + content + RESET;
+            write(`${indent}${p_txt}\n`);
+        }
+    };
+
+    const ma = crsync(cbs);
+    ma.exe(html_str);
+    ma.fin();
+
+    if (!just_show) {
+        return painted_str;
+    }
+};
+
+module.exports.THEME =theme;
+module.exports.DFLT_CFG = DFLT_CFG();

package/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "nv-html-term-paint",
+  "version": "1.0.1",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "description": "",
+  "dependencies": {
+    "nv-hson-der-from-str-cmmn": "^1.0.3"
+  }
+}