nv-basic-bw 1.0.11 → 1.0.14

package/calc.js

@@ -0,0 +1,144 @@
+const {wait_for_layout_ready} = require("./wait");
+
+const creat_rect_desc = () => ({
+    "x": 0,
+    "y": 0,
+    "width": 0,
+    "height": 0,
+    "top": 0,
+    "right": 0,
+    "bottom": 0,
+    "left": 0
+});
+
+const get_rect_desc_bfr_transfrom = async(el) => {
+    let rect_bfr_transfrom = creat_rect_desc();
+    // 方法：临时移除 transform 获取真实位置
+    // 保存原始 transform
+    const originalTransform = el.style.transform;
+    // 临时移除 transform（会触发一次 reflow）
+    el.style.transform = 'none';
+    await wait_for_layout_ready();
+    // 获取无 transform 的位置
+    const rect = el.getBoundingClientRect();
+    // 立即恢复 transform
+    el.style.transform = originalTransform;
+    // 复制所有值
+    rect_bfr_transfrom.x = rect.x;
+    rect_bfr_transfrom.y = rect.y;
+    rect_bfr_transfrom.width = rect.width;
+    rect_bfr_transfrom.height = rect.height;
+    rect_bfr_transfrom.top = rect.top;
+    rect_bfr_transfrom.left = rect.left;
+    rect_bfr_transfrom.right = rect.right;
+    rect_bfr_transfrom.bottom = rect.bottom;
+    return rect_bfr_transfrom;
+}
+
+const get_all_positions_bfr_transform = async (
+    el,
+    filter = (el) => true
+) => {
+    //使用editonly_sdfs_for_each 获取
+    //类似 .getBoundingClientRect()
+    let results = [];
+    await editonly_sdfs_for_each(el, async (curr_el) => {
+        if (filter(curr_el)) {
+            let rect_bfr_transfrom = await get_rect_desc_bfr_transfrom(curr_el);
+            results.push({
+                el: curr_el,
+                rect: rect_bfr_transfrom
+            });
+        }
+    });
+
+    return results;
+}
+const get_all_positions_aft_transform = async (
+    el,
+    filter = (el) => true
+) => {
+    // 获取 transform 之后的最终位置
+    let results = [];
+    await editonly_sdfs_for_each(el, async (curr_el) => {
+        if (filter(curr_el)) {
+            await wait_for_layout_ready();
+            let rect_aft_transfrom = curr_el.getBoundingClientRect();
+            results.push({
+                el: curr_el,
+                rect: rect_aft_transfrom
+            });
+        }
+    });
+
+    return results;
+}
+
+const get_all_positions_transform_diff = async(
+    el,
+    filter = (el) => true
+) => {
+    // 计算 transform 前后的差异
+    let results = [];
+    await editonly_sdfs_for_each(el, async (curr_el) => {
+        if (filter(curr_el)) {
+            let rect_bfr_transfrom =  await get_rect_desc_bfr_transfrom(curr_el);
+            await wait_for_layout_ready();//因为 get_rect_desc_bfr_transfrom 会改回去 transform，需要等待布局稳定
+            let rect_aft_transfrom = curr_el.getBoundingClientRect();
+            let rect_diff = {
+                x: rect_aft_transfrom.x - rect_bfr_transfrom.x,
+                y: rect_aft_transfrom.y - rect_bfr_transfrom.y,
+                width: rect_aft_transfrom.width - rect_bfr_transfrom.width,
+                height: rect_aft_transfrom.height - rect_bfr_transfrom.height,
+                top: rect_aft_transfrom.top - rect_bfr_transfrom.top,
+                right: rect_aft_transfrom.right - rect_bfr_transfrom.right,
+                bottom: rect_aft_transfrom.bottom - rect_bfr_transfrom.bottom,
+                left: rect_aft_transfrom.left - rect_bfr_transfrom.left
+            };
+            if (rect_diff.x === 0 && rect_diff.y === 0 &&
+                rect_diff.width === 0 && rect_diff.height === 0 &&
+                rect_diff.top === 0 && rect_diff.right === 0 &&
+                rect_diff.bottom === 0 && rect_diff.left === 0) {
+            } else {
+                results.push({
+                    el: curr_el,
+                    rect: rect_diff
+                });
+            }
+        }
+    });
+
+    return results;
+}
+
+const is_rect_overlapping = (rect1, rect2) => {
+    return !(rect1.right < rect2.left ||
+        rect1.left > rect2.right ||
+        rect1.bottom < rect2.top ||
+        rect1.top > rect2.bottom);
+}
+
+const is_ele_overlapping_with_eles = (checkEle, eleList) => {
+    let isOverlapping = false;
+    for (const element of eleList) {
+        const elementRect = element.getBoundingClientRect();
+        // 检查元素是否与标题重叠
+        if (is_rect_overlapping(elementRect, checkEle.getBoundingClientRect())) {
+            isOverlapping = true;
+            break;
+        }
+    }
+    return isOverlapping;
+}
+
+
+module.exports = {
+    creat_rect_desc,
+    get_rect_desc_bfr_transfrom,
+    get_all_positions_bfr_transform,
+    get_all_positions_aft_transform,
+    get_all_positions_transform_diff,
+    is_rect_overlapping,
+    is_ele_overlapping_with_eles,
+    
+}

package/cls-accessor.js

@@ -1,4 +1,4 @@
-const _nvison = require("nvison");
+const _nvison = require("nvison-bw");
 const { dash_to_snake,css_str_to_num} = require("./attr");
 
 const add_attr_accessors_to_cls = (Cls,ATTRS) => {

package/code.js

@@ -0,0 +1,181 @@
+const {fullfill_url} = require("./util");
+
+const get_all_scripts = async()=>{
+  const scripts = document.querySelectorAll('script');
+  const codePromises = [];
+
+  for (const script of scripts) {
+    if (script.src) {
+      codePromises.push(
+        fetch(script.src)
+          .then(r => r.ok ? r.text() : '')
+          .catch(() => '')
+      );
+    } else {
+      const inlineCode = script.textContent;
+      if (inlineCode.trim()) {
+        codePromises.push(Promise.resolve(inlineCode));
+      }
+    }
+  }
+
+  const codes = await Promise.all(codePromises);
+  const allJsCode = codes.filter(code => code).join('\n\n');
+
+  return `<script>\n${allJsCode}\n</script>`;
+}
+
+const get_all_csses = async()=>{
+  let css = '';
+  for (const link of document.querySelectorAll('link[rel="stylesheet"]')) {
+    if (link.href) {
+      try {
+        css += await (await fetch(link.href)).text() + '\n';
+      } catch {}
+    }
+  }
+  for (const style of document.querySelectorAll('style')) {
+    css += style.outerHtml + '\n';
+  }
+  return css;
+}
+
+const collect_img_like_urls = (root = document) => {
+    const urls = new Set();
+
+    // <img src>
+    root.querySelectorAll("img[src]").forEach(el => {
+        urls.add(fullfill_url(el.getAttribute("src")));
+    });
+
+    // <img srcset>
+    root.querySelectorAll("img[srcset]").forEach(el => {
+        const srcset = el.getAttribute("srcset");
+        if (!srcset) return;
+        for (const part of srcset.split(",")) {
+            const [u] = part.trim().split(/\s+/);
+            if (u) urls.add(fullfill_url(u));
+        }
+    });
+
+    // <svg image href / xlink:href>
+    root.querySelectorAll("svg").forEach(el => {
+        const text = new XMLSerializer().serializeToString(el);
+	const blob = new Blob([text], { type: "image/svg+xml" });
+	let url = URL.createObjectURL(blob);
+	urls.add([url,".svg"]);
+    });
+
+    // CSS background-image (非常保守版)
+    root.querySelectorAll("*").forEach(el => {
+        const bg = getComputedStyle(el).backgroundImage;
+        if (!bg || bg === "none") return;
+        const m = bg.match(/url\(["']?(.*?)["']?\)/);
+        if (m && m[1]) urls.add(m[1]);
+    });
+
+    return Array.from(urls).filter(Boolean);
+};
+
+
+const extract_css_varnms_from_rule = (rule, target)=> {
+  // 处理普通样式规则
+  if (rule instanceof CSSStyleRule) {
+    const style = rule.style;
+    for (let i = 0; i < style.length; i++) {
+      const property = style[i];
+      if (property.startsWith('--')) {
+        const value = style.getPropertyValue(property).trim();
+        if (value) {
+          target[property] = value;
+        }
+      }
+    }
+  }
+  // 处理嵌套规则（如@media, @supports等）
+  else if (rule instanceof CSSMediaRule ||
+           rule instanceof CSSSupportsRule ||
+           rule instanceof CSSKeyframesRule) {
+    const nestedRules = rule.cssRules || rule.rules;
+    if (nestedRules) {
+      for (let i = 0; i < nestedRules.length; i++) {
+        extract_css_varnms_from_rule(nestedRules[i], target);
+      }
+    }
+  }
+  // 处理@font-face规则
+  else if (rule instanceof CSSFontFaceRule) {
+    const style = rule.style;
+    for (let i = 0; i < style.length; i++) {
+      const property = style[i];
+      if (property.startsWith('--')) {
+        const value = style.getPropertyValue(property).trim();
+        if (value) {
+          target[property] = value;
+        }
+      }
+    }
+  }
+}
+
+/**
+ * 获取页面中所有CSS自定义属性（变量）
+ * 返回格式: { [样式表来源] : { [变量名] : 变量值 } }
+ * 
+ * @returns {Object} 包含所有CSS变量的对象
+ */
+const get_all_css_vars =()=>{
+  const result = {};
+  
+  // 处理所有样式表
+  const styleSheets = document.styleSheets;
+  
+  for (let i = 0; i < styleSheets.length; i++) {
+    const sheet = styleSheets[i];
+    let source = '';
+    
+    // 确定样式表来源
+    if (sheet.href) {
+      source = sheet.href;
+    } else if (sheet.ownerNode) {
+      if (sheet.ownerNode.tagName === 'STYLE') {
+        source = 'inline-style';
+      } else if (sheet.ownerNode.tagName === 'LINK') {
+        source = sheet.ownerNode.href || 'external-stylesheet';
+      } else {
+        source = 'unknown';
+      }
+    } else {
+      source = 'unknown';
+    }
+    
+    // 初始化该来源的对象
+    if (!result[source]) {
+      result[source] = {};
+    }
+    
+    try {
+      // 遍历样式表中的所有规则
+      const rules = sheet.cssRules || sheet.rules;
+      if (!rules) continue;
+      
+      for (let j = 0; j < rules.length; j++) {
+        const rule = rules[j];
+        extract_css_varnms_from_rule(rule, result[source]);
+      }
+    } catch (error) {
+      // 处理跨域样式表等无法访问的情况
+      console.warn(`无法访问样式表 ${source} 的规则:`, error);
+    }
+  }
+  
+  return result;
+}
+
+
+module.exports = {
+   get_all_scripts,
+   get_all_csses,
+   collect_img_like_urls,
+   get_all_css_vars
+}

package/com.sh

@@ -1 +1,2 @@
+#nv_cli_build    -g nvbasicbw -i index.js -o ./DIST/nv-basci-bw.full.js
 nv_cli_build -m -g nvbasicbw -i index.js -o ./DIST/nv-basci-bw.js

package/const.js

@@ -0,0 +1,48 @@
+const TAGS = new Set([
+  "html","head","body","title","meta","link","base","style",
+
+  "header","footer","nav","main","section","article","aside",
+  "h1","h2","h3","h4","h5","h6","address",
+
+  "p","hr","pre","blockquote",
+  "ol","ul","li","dl","dt","dd",
+  "figure","figcaption","div",
+
+  "a","em","strong","small","s","cite","q","dfn","abbr",
+  "ruby","rt","rp","data","time",
+  "code","var","samp","kbd",
+  "sub","sup","i","b","u","mark",
+  "bdi","bdo","span","br","wbr",
+
+  "ins","del",
+
+  "img","iframe","embed","object","param",
+  "video","audio","source","track","picture",
+  "map","area","canvas","svg",
+
+  "table","caption","colgroup","col",
+  "thead","tbody","tfoot","tr","th","td",
+
+  "form","label","input","button","select","datalist",
+  "optgroup","option","textarea","output",
+  "progress","meter","fieldset","legend",
+
+  "details","summary","dialog",
+
+  "script","noscript","template","slot"
+]);
+
+
+const NEED_TO_SP_ATTR_NMS = new Set([
+  "class",
+  "rel",
+  "sandbox",
+  "allow",
+  "headers",
+  "aria-describedby",
+  "aria-labelledby"
+]);
+
+module.exports = {
+   TAGS,NEED_TO_SP_ATTR_NMS
+}

package/dnld.js

@@ -0,0 +1,90 @@
+const {creat_dt_prefix} = require("./util");
+const {simple_alert} = require("./ui");
+const {collect_img_like_urls} = require("./code");
+
+const save_blob = async (blob, name,dir) => {
+    if(dir) {} else {
+       try{
+           dir = await window.showDirectoryPicker();
+       } catch(e) {
+           return [false,String(e.stack)]
+       }
+    }
+    try {
+        const fh = await dir.getFileHandle(name, { create: true });
+        const w = await fh.createWritable();
+        await w.write(blob);
+        await w.close();
+	return [true,null]
+    } catch(e) {
+	return [false,String(e.stack)]
+    }
+};
+
+const fetch_save = async (url,dirHandle,name,recv) => {
+    if(name) {
+	if(Array.isArray(url)) { url = url[0];} 
+    } else   {
+	if(Array.isArray(url)) {
+	    name = creat_dt_prefix()+"_" +"inline"+url[1];
+	    url = url[0];
+	} else {
+	    let U = new URL(url);
+	    let arr = U.pathname.split("/");
+            name = creat_dt_prefix()+"_" + arr[arr.length-1];
+	}
+    }
+    if(dirHandle) {} else {
+       try{
+           dir = await window.showDirectoryPicker();
+       } catch(e) {
+	   if(recv) {
+	      recv.fails.push([url,String(e.stack)])
+	   }
+       }
+    }    
+    try {
+        const r = await fetch(url);
+        const b = await r.blob();
+        let [cond,reason] = await save_blob(b, name,dirHandle);
+	if(recv) {
+	    if(cond) {
+	        recv.succs.push(url)
+	    } else   {
+		recv.fails.push([url,String(reason)])
+	    }
+	} else {}
+    } catch(e) {
+        if(recv) {
+           recv.fails.push([url,String(e.stack)])
+        }         
+    }
+};
+
+const dnld_img_like = async (fltr = (_url) => true) => {
+    const succs = [];
+    const fails = [];
+    // 1️⃣ 让用户选择目录
+    const dirHandle = await window.showDirectoryPicker();
+    // 2️⃣ 扫描 DOM，得到 url 列表
+    const urls = collect_img_like_urls(document);
+    // 3️⃣ 过滤 + 规范化
+
+    // 4️⃣ 去重
+    const uniq = Array.from(new Set(urls));
+    // 5️⃣ 顺序下载（避免并发 IO 爆炸）
+    for (const url of uniq) {
+        await fetch_save(url, dirHandle, undefined, { succs, fails });
+    }
+    simple_alert(
+        "dnld_img_like",
+        JSON.stringify({ succs, fails }, null, 2),
+        "success"
+    );
+    return { succs, fails };
+};
+
+module.exports = {
+    save_blob ,fetch_save,
+    dnld_img_like
+}