This commit is contained in:
Rizky 2023-11-20 00:08:47 +07:00
parent eef625cd66
commit 651dd39f06
7 changed files with 87 additions and 22 deletions

View File

@ -8,10 +8,14 @@ import { DBCode } from "./prep-code";
import { activity } from "../../entity/activity"; import { activity } from "../../entity/activity";
import { sendWS } from "../../sync-handler"; import { sendWS } from "../../sync-handler";
import { SyncType } from "../../type"; import { SyncType } from "../../type";
import { gzipAsync } from "../../entity/zlib";
const encoder = new TextEncoder();
export const codeBuild = async (code: DBCode) => { export const codeBuild = async (code: DBCode) => {
try { try {
const id_code = code.id; const id_code = code.id;
const outfile = dir.path(`${g.datadir}/site/build/${id_code}/index.js`);
if (!Code.build.ctx[id_code]) { if (!Code.build.ctx[id_code]) {
Code.build.ctx[id_code] = await context({ Code.build.ctx[id_code] = await context({
absWorkingDir: dir.path( absWorkingDir: dir.path(
@ -20,7 +24,7 @@ export const codeBuild = async (code: DBCode) => {
entryPoints: ["index.tsx"], entryPoints: ["index.tsx"],
bundle: true, bundle: true,
format: "cjs", format: "cjs",
outfile: dir.path(`${g.datadir}/site/build/${id_code}/index.js`), outfile,
minify: true, minify: true,
treeShaking: true, treeShaking: true,
sourcemap: true, sourcemap: true,
@ -55,6 +59,14 @@ export const codeBuild = async (code: DBCode) => {
}); });
}); });
const result = await Code.build.ctx[id_code].rebuild(); const result = await Code.build.ctx[id_code].rebuild();
const out = Bun.file(outfile);
const src = (await out.text()).replace(
"//# sourceMappingURL=index.js.map",
`//# sourceMappingURL=/nova-load/code/${id_code}/index.js.map`
);
Bun.write(out, src);
const srcgz = await gzipAsync(encoder.encode(src));
activity.site activity.site
.room(code.id_site) .room(code.id_site)
.findAll({ site_js: code.name }) .findAll({ site_js: code.name })
@ -66,6 +78,7 @@ export const codeBuild = async (code: DBCode) => {
name: code.name, name: code.name,
id: code.id, id: code.id,
event: "code-done", event: "code-done",
src: srcgz,
content: content:
result.errors.length > 0 result.errors.length > 0
? `${result.errors.join("\n")}` ? `${result.errors.join("\n")}`

View File

@ -6,6 +6,7 @@ import { w } from "../../../utils/types/general";
import { Loading } from "../../../utils/ui/loading"; import { Loading } from "../../../utils/ui/loading";
import { EmptySite, PG } from "./ed-global"; import { EmptySite, PG } from "./ed-global";
import { treeRebuild } from "./tree/build"; import { treeRebuild } from "./tree/build";
import { evalCJS } from "../../view/logic/load-code";
const decoder = new TextDecoder(); const decoder = new TextDecoder();
@ -78,6 +79,17 @@ export const edInitSync = (p: PG) => {
p.ui.popup.code.log += arg.content; p.ui.popup.code.log += arg.content;
} }
p.ui.popup.code.loading = false; p.ui.popup.code.loading = false;
if (arg.src) {
const w = window as any;
console.clear();
const module = evalCJS(decoder.decode(decompress(arg.src)));
if (typeof module === "object") {
for (const [k, v] of Object.entries(module)) {
w[k] = v;
}
}
}
p.render(); p.render();
} else { } else {
if (typeof arg.content === "string") if (typeof arg.content === "string")

View File

@ -12,6 +12,7 @@ export const EdMain = () => {
{!p.page.building && ( {!p.page.building && (
<View <View
mode={p.mode} mode={p.mode}
isEditor={true}
api_url={p.site.config.api_url} api_url={p.site.config.api_url}
component={{ component={{
map: p.comp.map, map: p.comp.map,

View File

@ -1,11 +1,27 @@
import { VG } from "./global"; import { VG } from "./global";
import { VLoad } from "./types"; import { VLoad } from "./types";
export const w = window as unknown as {
isMobile: boolean;
isDesktop: boolean;
isEditor: boolean;
};
export const vInit = ( export const vInit = (
v: VG, v: VG,
arg: { load: VLoad; site_id: string; page_id: string } arg: {
load: VLoad;
site_id: string;
page_id: string;
mode: "mobile" | "desktop";
isEditor: boolean;
}
) => { ) => {
const { load, site_id, page_id } = arg; const { load, site_id, page_id, mode, isEditor } = arg;
w.isDesktop = mode !== "mobile";
w.isMobile = mode === "mobile";
w.isEditor = isEditor;
v.status = "load-code"; v.status = "load-code";
v.current.site_id = site_id; v.current.site_id = site_id;

View File

@ -107,23 +107,24 @@ export const loadCompCode = async (comp_id: string) => {
}; };
const importCJS = async (url: string) => { const importCJS = async (url: string) => {
const module = { exports: { __esModule: true as true | undefined } };
const res = await fetch(url); const res = await fetch(url);
const src = await res.text(); const src = await res.text();
return evalCJS(src);
};
export const evalCJS = (src: string) => {
if (src) { if (src) {
try { const module = { exports: { __esModule: true as true | undefined } };
const fn = new Function("module", src); eval(`try {
await fn(module); ${src}
} catch(e) {
const result = { ...module.exports }; console.error(e);
if (result.__esModule) { }`);
delete result.__esModule; const result = { ...module.exports };
} if (result.__esModule) {
delete result.__esModule;
return result; }
} catch (e) {} return result;
} }
return {}; return {};
}; };

View File

@ -1,4 +1,4 @@
import { FC } from "react"; import { FC, Suspense } from "react";
import { useGlobal } from "web-utils"; import { useGlobal } from "web-utils";
import { IContent } from "../../utils/types/general"; import { IContent } from "../../utils/types/general";
import { Loading } from "../../utils/ui/loading"; import { Loading } from "../../utils/ui/loading";
@ -7,19 +7,33 @@ import { vInit } from "./logic/init";
import { vLoadCode } from "./logic/load-code"; import { vLoadCode } from "./logic/load-code";
import { VLoad, VLoadComponent } from "./logic/types"; import { VLoad, VLoadComponent } from "./logic/types";
import { VEntry } from "./render/entry"; import { VEntry } from "./render/entry";
import { ErrorBox } from "./render/meta/script/error-box";
export const View: FC<{ type ViewProp = {
load: VLoad; load: VLoad;
component: VLoadComponent; component: VLoadComponent;
site_id: string; site_id: string;
page_id: string; page_id: string;
api_url: string; api_url: string;
mode: "desktop" | "mobile"; mode: "desktop" | "mobile";
isEditor?: boolean;
bind?: (arg: { render: () => void }) => void; bind?: (arg: { render: () => void }) => void;
hidden?: (item: IContent) => boolean; hidden?: (item: IContent) => boolean;
hover?: { get: (item: IContent) => boolean; set: (id: string) => void }; hover?: { get: (item: IContent) => boolean; set: (id: string) => void };
active?: { get: (item: IContent) => boolean; set: (id: string) => void }; active?: { get: (item: IContent) => boolean; set: (id: string) => void };
}> = ({ };
export const View: FC<ViewProp> = (props) => {
return (
<ErrorBox>
<Suspense>
<BoxedView {...props} />
</Suspense>
</ErrorBox>
);
};
const BoxedView: FC<ViewProp> = ({
load, load,
site_id, site_id,
page_id, page_id,
@ -29,6 +43,8 @@ export const View: FC<{
hidden, hidden,
component, component,
api_url, api_url,
mode,
isEditor,
}) => { }) => {
const v = useGlobal(ViewGlobal, "VIEW"); const v = useGlobal(ViewGlobal, "VIEW");
@ -52,7 +68,7 @@ export const View: FC<{
} }
if (v.status === "init") { if (v.status === "init") {
vInit(v, { load, page_id, site_id }); vInit(v, { load, page_id, site_id, mode, isEditor: !!isEditor });
if (v.status === "init") { if (v.status === "init") {
return <Loading backdrop={false} note="init" />; return <Loading backdrop={false} note="init" />;
} }
@ -61,7 +77,11 @@ export const View: FC<{
if (v.status === "load-code" || v.status === "loading-code") { if (v.status === "load-code" || v.status === "loading-code") {
vLoadCode(v); vLoadCode(v);
if (v.status === "load-code" || v.status === "loading-code") { if (v.status === "load-code" || v.status === "loading-code") {
return <Loading backdrop={false} note="rendering-view" />; return (
<>
<Loading backdrop={false} note="rendering-view" />
</>
);
} }
} }
@ -76,3 +96,4 @@ export const View: FC<{
return <div className="flex flex-1 flex-col relative">{v.bodyCache}</div>; return <div className="flex flex-1 flex-col relative">{v.bodyCache}</div>;
}; };

View File

@ -80,6 +80,7 @@ export const clientStartSync = async (arg: {
id: string; id: string;
event: "code-loading" | "code-done"; event: "code-loading" | "code-done";
content?: string; content?: string;
src?: Uint8Array;
}) => void; }) => void;
activity: (arg: { activity: (arg: {
activity: string; activity: string;