wip fix idx-map

This commit is contained in:
Riz 2023-12-07 04:33:17 +07:00
parent 390a832d76
commit 9ac3990511
12 changed files with 254 additions and 166 deletions

View File

@ -184,6 +184,7 @@ const scanMeta = async (doc: DPage, sync: SyncConnection) => {
await Promise.all(
childs.map((m) => serverWalkLoad(m, scope_comps, sync, loaded))
);
childs.map((m, i) => {
serverWalkMap(
{ sync, scope, scope_comps, note: "page-load" },

View File

@ -29,7 +29,8 @@ export const loadComponent = async (id: string, sync: SyncConnection) => {
const sv_local = await gzipAsync(update);
user.active.findAll({ comp_id: id }).map((e) => {
const all = user.active.findAll({ comp_id: id });
all.map((e) => {
if (origin !== um) {
if (e.client_id === origin) return;
}

View File

@ -15,7 +15,11 @@ import { SyncConnection } from "../type";
import { loadComponent } from "./load-component";
import { extractMItemProps } from "./load-page-comp";
import { ArgParentMComp, parseJs } from "./parser/parse-js";
import { user } from "../entity/user";
const defaultActive = {
select: "" as "" | "comp" | "item" | "section" | "text",
};
export const serverWalkLoad = async (
mitem: MItem,
scope_comps: IScopeComp,
@ -35,6 +39,18 @@ export const serverWalkLoad = async (
loaded.add(id);
if (!docs.comp[id]) {
await loadComponent(id, sync);
} else {
const conf = sync.conf;
if (conf) {
user.active.add({
...defaultActive,
client_id: sync.client_id,
user_id: sync.user_id,
site_id: conf.site_id,
page_id: conf.page_id,
comp_id: comp.id,
});
}
}
const pcomp = docs.comp[id];

View File

@ -5,7 +5,6 @@ import { EdAddText } from "./panel/header/mid/add-text";
import { EdCompPicker } from "./panel/header/mid/comp-picker";
import { EdPagePicker } from "./panel/header/mid/page-picker";
import { TopBtn } from "./panel/header/top-btn";
import { EdMain } from "./panel/main/main";
export const EdMid: FC<{}> = () => {
return (
@ -15,12 +14,12 @@ export const EdMid: FC<{}> = () => {
"h-[35px] border-b flex p-1 items-stretch text-[12px] justify-between"
)}
>
<div className="flex items-stretch flex-1 ">
<div className="flex items-stretch flex-1">
<EdPagePicker />
</div>
<div className="flex items-stretch flex-1 justify-center ">
<div className="flex items-stretch ">
<div className="flex items-stretch flex-1 justify-center">
<div className="flex items-stretch">
<div className="border-r border-r-slate-100 text-slate-400 text-[9px] flex items-center px-1 mr-1">
ADD
</div>

View File

@ -43,23 +43,37 @@ export const EdMain = () => {
p.page.render = render;
}}
hidden={(meta) => {
if (meta.item.hidden) return true
if (meta.item.hidden) return true;
return false;
}}
hover={{
get(meta) {
const item = meta.item;
if (item.originalId === active.hover_id || item.id === active.hover_id)
if (active.comp_id) {
if (meta.parent_mcomp) {
if (
meta.parent_mcomp?.mcomp.get("component")?.get("id") !==
active.comp_id
)
return false;
}
}
if (
item.originalId === active.hover_id ||
item.id === active.hover_id
)
return true;
return false
return false;
},
set(meta) {
if (meta.parent_mcomp) {
const id = meta.parent_mcomp.mitem.get('id');
const id = meta.parent_mcomp.mitem.get("id");
if (active.instance.item_id !== id) {
const original_id = meta.parent_mcomp.mitem.get('originalId');
const original_id =
meta.parent_mcomp.mitem.get("originalId");
if (active.comp_id && original_id) {
active.hover_id = original_id;
@ -79,14 +93,14 @@ export const EdMain = () => {
const parent = meta.parent_mcomp;
if (parent) {
const mcomp = parent.mcomp;
if (mcomp.get('component')?.get('id') === active.comp_id) {
if (mcomp.get("component")?.get("id") === active.comp_id) {
active.hover_id = meta.item.originalId || meta.item.id;
}
} else {
active.hover_id = meta.item.id;
}
} else {
active.hover_id = meta.item.id
active.hover_id = meta.item.id;
}
p.render();
@ -97,18 +111,32 @@ export const EdMain = () => {
get(meta) {
const item = meta.item;
if (item.originalId === active.item_id || item.id === active.item_id)
if (active.comp_id) {
if (meta.parent_mcomp) {
if (
meta.parent_mcomp?.mcomp.get("component")?.get("id") !==
active.comp_id
)
return false;
}
}
if (
item.originalId === active.item_id ||
item.id === active.item_id
)
return true;
return false
return false;
},
set(meta) {
if (meta.parent_mcomp) {
const id = meta.parent_mcomp.mitem.get('id');
const id = meta.parent_mcomp.mitem.get("id");
if (active.instance.item_id !== id) {
const original_id = meta.parent_mcomp.mitem.get('originalId');
const original_id =
meta.parent_mcomp.mitem.get("originalId");
let active_id = ""
let active_id = "";
if (active.comp_id && original_id) {
active_id = original_id;
} else if (id) {
@ -119,7 +147,9 @@ export const EdMain = () => {
if (active.item_id !== active_id) {
active.item_id = active_id;
} else {
const comp_id = meta.parent_mcomp.mcomp.get('component')?.get('id');
const comp_id = meta.parent_mcomp.mcomp
.get("component")
?.get("id");
if (comp_id) {
active.instance.item_id = active_id;
active.instance.comp_id = active.comp_id;
@ -147,7 +177,7 @@ export const EdMain = () => {
const parent = meta.parent_mcomp;
if (parent) {
const mcomp = parent.mcomp;
if (mcomp.get('component')?.get('id') === active.comp_id) {
if (mcomp.get("component")?.get("id") === active.comp_id) {
active.item_id = meta.item.originalId || meta.item.id;
}
} else {
@ -157,13 +187,12 @@ export const EdMain = () => {
active.instance.comp_id = "";
}
} else {
active.item_id = meta.item.id
active.item_id = meta.item.id;
}
p.render();
p.page.render();
focus();
},
text(meta) {
const { item } = meta;
@ -172,15 +201,20 @@ export const EdMain = () => {
active.text.content = item.html || "";
}
return <div
className={cx(`v-text-${item.id} v-text-${item.originalId} outline-none`)}
return (
<div
className={cx(
`v-text-${item.id} v-text-${item.originalId} outline-none`
)}
ref={(ref) => {
if (ref !== document.activeElement && ref) {
const renaming = document.querySelector('.rename-item');
const modals = document.querySelectorAll('[data-floating-ui-portal]');
const renaming = document.querySelector(".rename-item");
const modals = document.querySelectorAll(
"[data-floating-ui-portal]"
);
if (modals.length === 0 && !renaming) {
ref.focus();
setEndOfContenteditable(ref)
setEndOfContenteditable(ref);
}
}
}}
@ -194,11 +228,13 @@ export const EdMain = () => {
onBlur={() => {
const meta = getMetaById(p, item.id);
if (meta && meta.mitem && active.text.id === item.id) {
meta.mitem.set('html', active.text.content)
meta.mitem.set("html", active.text.content);
}
}}
dangerouslySetInnerHTML={{ __html: item.html || "" }}></div>
}
dangerouslySetInnerHTML={{ __html: item.html || "" }}
></div>
);
},
}}
/>
)}
@ -209,8 +245,8 @@ export const EdMain = () => {
function setEndOfContenteditable(div: any) {
let range: any, sel: any;
if (document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
{
if (document.createRange) {
//Firefox, Chrome, Opera, Safari, IE 9+
range = document.createRange();
range.selectNodeContents(div);
sel = window.getSelection();

View File

@ -7,7 +7,7 @@ import { useGlobal, useLocal } from "web-utils";
import { jscript } from "../../../../../utils/script/jscript";
import { jsMount } from "../../../../../utils/script/mount";
import { monacoTypings } from "../../../../../utils/script/typings";
import { EDGlobal, active } from "../../../logic/ed-global";
import { EDGlobal, EdMeta, active } from "../../../logic/ed-global";
import { getMetaById } from "../../../logic/tree/build";
import { declareScope } from "./scope";
@ -30,9 +30,11 @@ export const ScriptMonaco = () => {
const Editor = jscript.editor;
if (!Editor) return null;
let meta = p.page.meta[active.item_id];
if (active.comp_id && p.comp.list[active.comp_id]) {
let meta: EdMeta | null = p.page.meta[active.item_id];
if (active.comp_id) {
if (p.comp.list[active.comp_id]) {
meta = p.comp.list[active.comp_id].meta[active.item_id];
} else meta = null;
}
let val = "";
@ -164,6 +166,8 @@ async () => {
}
}
if (!meta) return null;
return (
<Editor
value={val}

View File

@ -5,7 +5,7 @@ import {
PlaceholderRender,
TreeMethods,
} from "@minoru/react-dnd-treeview";
import { FC, useEffect } from "react";
import { FC } from "react";
import { useGlobal, useLocal } from "web-utils";
import { EDGlobal, EdMeta, active } from "../../logic/ed-global";
import { DEPTH_WIDTH } from "./node/item/indent";
@ -13,7 +13,6 @@ import { expandTreeHook } from "./node/item/indent-hook";
import { canDrop, nodeOnDrop } from "./node/on-drop";
import { nodeRender } from "./node/render";
import { doTreeSearch } from "./search";
import { getMetaById } from "../../logic/tree/build";
export const EdTreeBody = () => {
const p = useGlobal(EDGlobal, "EDITOR");

View File

@ -1,7 +1,7 @@
import { NodeModel } from "@minoru/react-dnd-treeview";
import { useEffect } from "react";
import { useGlobal, useLocal } from "web-utils";
import { EDGlobal, EdMeta, PG } from "../../logic/ed-global";
import { EDGlobal, EdMeta, PG, active } from "../../logic/ed-global";
import { fuzzy } from "../../../../utils/ui/fuzzy";
export const EdTreeSearch = () => {
@ -115,7 +115,13 @@ export const doTreeSearch = (p: PG) => {
const search = p.ui.tree.search.toLowerCase();
let i = 0;
for (const row of p.page.tree) {
let ptree = p.page.tree;
if (active.comp_id && p.comp.list[active.comp_id].tree) {
ptree = p.comp.list[active.comp_id].tree;
}
for (const row of ptree) {
const item = row.data?.item;
if (item) {
const js = item.adv?.js;

View File

@ -136,7 +136,6 @@ export const ViewMetaScript: FC<{
}
const output = { jsx: null as any };
args = {
...w.exports,
...finalScope,

View File

@ -22,7 +22,6 @@ export const compPropVal = (
props = icomp.props;
cprops = Object.entries({ ...icomp.props });
if (v.script.api_url) {
if (!v.script.db) v.script.db = createDB(v.script.api_url);
if (!v.script.api) v.script.api = createAPI(v.script.api_url);
@ -84,8 +83,7 @@ export const compPropVal = (
if (v.scope) {
while (parent) {
if (v.scope[parent.item.id]) {
v.scope[prop.content.id] =
v.scope[parent.item.id];
v.scope[prop.content.id] = v.scope[parent.item.id];
}
parent = v.meta[parent.parent_item.id];
}
@ -108,7 +106,6 @@ export const compPropVal = (
}
result[name] = value;
}
meta.propval = result;
}
}

View File

@ -21,7 +21,7 @@ export const createAPI = (url: string) => {
w.prasiApi = {};
}
if (!url) {
throw new Error("No URL provided");
return null;
}
return w.apiClient(w.prasiApi[url]?.apiEntry, url);

View File

@ -1,38 +1,68 @@
import hash_sum from "hash-sum";
const match = (item: any, where: any) => {
for (const [k, v] of Object.entries(where)) {
if (item[k] !== v) return false;
}
return true;
};
export const IndexedMap = {
create: <OBJ extends Record<string, any>, KEY extends string>(id: KEY) => {
const all = {} as Record<string, OBJ & Record<KEY, string>>;
const all = {} as Record<KEY, Record<string, OBJ>>;
return {
add(item: OBJ & Record<KEY, string>) {
const _id = item[id];
all[_id] = item as any;
return _id;
},
find(id: string) {
return all[id];
},
del(id: string) {
delete all[id];
},
findAll(where: Partial<OBJ & Record<KEY, string>>) {
return Object.entries(all)
.filter(([k, item]) => {
for (const f in where) {
if (f === id) {
if (k !== where[f]) {
return false;
add(item: OBJ & Record<KEY, any>) {
const pk = item[id] as KEY;
if (!all[pk]) {
all[pk] = {};
}
} else if (item[f] !== where[f]) {
return false;
const _id = hash_sum(item) as any;
const items = all[pk] as Record<string, OBJ>;
items[_id] = item;
return pk;
},
findAll(where: Partial<OBJ & Record<KEY, string>>, withId?: boolean) {
const founds = [];
if (where[id]) {
const _id = where[id] as KEY;
if (all[_id]) {
for (const [k, item] of Object.entries(all[_id])) {
if (match(item, where)) {
if (withId) {
founds.push({ ...item, _id: k });
} else {
founds.push(item);
}
}
return true;
})
.map(([_, item]) => item);
}
}
} else {
for (const _items of Object.values(all)) {
const items = _items as Record<string, OBJ>;
for (const [k, item] of Object.entries(items)) {
if (match(item, where)) {
if (withId) {
founds.push({ ...item, _id: k });
} else {
founds.push(item);
}
}
}
}
}
return founds;
},
delAll(where: Partial<OBJ & Record<KEY, string>>) {
for (const item of this.findAll(where)) {
delete all[item[id]];
for (const item of this.findAll(where, true)) {
delete all[item[id]][item._id];
}
},
};