@acepad/browser 1.0.0

package/acepad-browser.js

@@ -0,0 +1,114 @@
+import {appendNode} from "./dom.js";
+import {createModuleURL} from "petit-node";
+import {createURL} from "./url.js";
+export async function open(f,_opt={}){
+    let p=new DOMParser();
+    let html=f.text();
+    const colon=":";
+    let d=p.parseFromString(html,"text/html");
+    let opt={
+        doc:_opt.document||document,
+        resolve(p){
+            return f.sibling(p);
+        },
+        async toURL(p,n){
+            let t=n.getAttribute("type");
+            if(t=="module"){
+                return await createModuleURL(opt.resolve(p));
+            }
+            return await createURL(opt.resolve(p));
+        },
+        protocol(href,n){
+            
+        },
+        open
+    };
+    //const s=programmableReadyState();
+    //s.value="loading";
+    //let h=hack();
+    for(let t of ["head","body"]){
+        let hd=opt.doc.querySelector(t);
+        hd.innerHTML="";
+        let hs=d.querySelector(t);
+        await appendNode(hs, hd, opt);
+    }
+    /*h.setReadyState("interactive");
+    h.setReadyState("complete");
+    
+    s.value="complete";
+    document.dispatchEvent(new Event("readystatechange"));
+    const le=new Event("load");
+    window.dispatchEvent(le);*/
+}
+function hack(){
+    let h=document.addEventListener.hacked;
+    h.readyState=document.readyState;
+    if(!h){
+        document.addEventListener.hacked=h={};
+        Object.defineProperty(document,"readyState",{
+            get(){
+                return h.readyState;
+            }
+        });
+        h.readystatechange=hackEventListener(
+            document,"readystatechange");
+        h.load=hackEventListener(
+            window,"load");
+        h.domcontentloaded=hackEventListener(
+            document,"domcontentloaded");
+        h.setReadyState=(s)=>{
+            h.readyState=s;
+            if(h.readyState==="interactive"){
+                const e=new Event("DOMContentLoaded");
+                for(let f of h.domcontentloaded){
+                    f.call(document,e);
+                }
+            }
+            if(h.readyState==="complete"){
+                const e=new Event("load");
+                for(let f of h.load){
+                    f.call(window,e);
+                }
+            }
+            const e=new Event("readystatechange");
+            for(let f of h.readystatechange){
+                f.call(document,e);
+            }
+        };
+    }
+    h.readystatechange.length=0;
+    h.readystatechange.push((e)=>{
+        if(typeof 
+        document.onreadystatechange==="function"){
+            document.onreadystatechange(e);
+        }
+    });
+    delete document.onreadystatechange;
+    h.domcontentloaded.length=0;
+    h.load.length=0;
+    h.load.push((e)=>{
+        if(typeof 
+        window.onload==="function"){
+            window.onload(e);
+        }
+    });
+    delete window.onload;
+    h.readyState="loading";
+    return h;
+}
+function hackEventListener(o,type){
+    const old=o.addEventListener;
+    const listeners=[];
+    o.addEventListener=function (t,...a){
+        if(type.toLowerCase()!==t.toLowerCase()){
+            return old.apply(this,[t,...a]);
+        }        
+        alert(t+a);
+        listeners.push(a[0]);
+    };
+    return listeners;
+}
+
+
+
+//

package/dom.js

@@ -0,0 +1,64 @@
+function loadPromise(n){
+    return new Promise((s,e)=>{ 
+		n.onload=s;
+		n.onerror=e;
+    });
+}
+export async function appendNode(src,dst,opt) {
+    opt.doc=opt.doc||document;
+    let {doc,open,resolve,toURL}=opt;
+    const colon=":";
+	const c=src.childNodes;
+	const loadings=[];
+	//console.log("apn",src.innerHTML,dst);
+	for(let n of c){
+	    switch (n.nodeType) {
+		case Node.ELEMENT_NODE:
+			let nn=doc.createElement(n.tagName);
+			let at=Array.from(n.attributes);
+			// should charset must be set first than src
+			const names=at.map(a=>a.name);
+			var idx=names.indexOf("charset");
+			if (idx>=0) {
+				names.splice(idx,1);
+				names.unshift("charset");
+			}
+			let w;
+			for(let name of names) {
+				let value=n.getAttribute(name);
+				let isrel=FS.PathUtil.isRelativePath(value);
+				let tag=n.tagName.toLowerCase();
+				if (name=="href" && isrel) {
+				    if(tag=="a"){
+				        let f=resolve(value);
+
+				        nn.addEventListener(
+				            "click",
+				        ()=>{
+				            open(f);
+				        });
+				        value="javascript"+colon+";";
+				    }else{
+						value=await toURL(value,n);
+						
+				    }
+				}
+				if (name=="src") {
+					if(isrel)value=await toURL(value,n);
+					if (tag=="script") {
+					    //alert(value);
+					    w=loadPromise(nn);
+					}
+				}
+				nn.setAttribute(name, value);
+			}
+			dst.appendChild(nn);
+			await w;
+			await appendNode(n ,nn,opt);
+			break;
+		case Node.TEXT_NODE:
+			dst.appendChild(doc.createTextNode(n.textContent));
+			break;
+		}
+	}
+}

package/package.json

@@ -0,0 +1,10 @@
+{
+    "main": "acepad-browser.js",
+    "name": "@acepad/browser",
+    "type": "module",
+    "version": "1.0.0",
+    "description": "Show browser in acepad",
+    "dependencies": {
+        "petit-node": "^1.3.6"
+    }
+}

package/url.js

@@ -0,0 +1,33 @@
+
+class Entry{
+    constructor(f,url){
+        this.f=f;
+        this.url=url;
+        this.time=f.lastUpdate();
+    }
+    upToDate(){
+        return this.f.exists()&&
+        this.f.lastUpdate()==this.time;
+    }
+    dispose(){
+        URL.revokeObjectURL(this.url);
+    }
+}
+const cache=new Map();
+export function createURL(f){
+    const k=f.path();
+    let e=cache.get(k);
+    if(e) {
+        if(e.upToDate()) return e.url;
+        e.dispose();
+        cache.delete(k);
+    }
+    if(!f.exists()){
+        throw new Error(`Cannot createURL ${f}: not exists`);
+    }
+    const blob=f.getBlob();
+    const blobUrl = URL.createObjectURL(blob);
+    e=new Entry(f,blobUrl);
+    cache.set(k,e);
+    return blobUrl;
+}