midsuit
/
prasi-bun
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add script nav

This commit is contained in:
Rizky 2024-01-19 18:51:17 +08:00
parent 6c6eaac5e9
commit 553b59460c
3 changed files with 101 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/web/src/nova/ed/logic/ed-global.ts
View File

@ -70,6 +70,14 @@ const target = {
export const active = {
should_render_main: true,
hover: { id: "" },
script_nav: {
list: [] as {
item_id: string;
comp_id?: string;
instance?: { item_id: string; comp_id?: string };
}[],
idx: -1,
},
text: { id: "", content: "", timeout: null as any, el: null as any },
get item_id() {
if (target.active_id === false) {

85
app/web/src/nova/ed/panel/popup/script/workbench.tsx
View File

@ -22,10 +22,61 @@ export const EdScriptWorkbench = () => {
}
}, [active.item_id]);
const scriptNav = {
canNext: active.script_nav.idx < active.script_nav.list.length - 1,
canBack: active.script_nav.list.length > 0,
};
return (
<div className="flex flex-1 items-stretch">
<div className="flex flex-1 flex-col ">
<div className="flex border-b">
<div className="flex border-b items-stretch">
{active.script_nav.list.length > 0 && (
<div className="border-r px-2 flex items-center">
<div
className={cx(scriptNav.canBack ? "" : "text-slate-200")}
onClick={() => {
if (scriptNav.canBack) {
active.script_nav.idx = active.script_nav.idx - 1;
const item = active.script_nav.list.pop();
if (item) {
active.item_id = item.item_id;
active.comp_id = item.comp_id || "";
active.instance = {
item_id: item.instance?.item_id || "",
comp_id: item.instance?.comp_id || "",
};
p.render();
}
}
}}
>
<ChevronLeft />
</div>
<div
className={cx(scriptNav.canNext ? "" : "text-slate-200")}
onClick={() => {
if (scriptNav.canNext) {
active.script_nav.idx = active.script_nav.idx + 1;
const item = active.script_nav.list[active.script_nav.idx];
if (item) {
active.item_id = item.item_id;
active.comp_id = item.comp_id || "";
active.instance = {
item_id: item.instance?.item_id || "",
comp_id: item.instance?.comp_id || "",
};
p.render();
}
}
}}
>
<ChevronRight />
</div>
</div>
)}
{p.ui.popup.script.type === "prop-master" && <CompTitleMaster />}
{p.ui.popup.script.type === "prop-instance" && <CompTitleInstance />}
{p.ui.popup.script.type === "item" && (
@ -153,3 +204,35 @@ const ArrowRight = () => (
></path>
</svg>
);
export const ChevronRight = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
viewBox="0 0 15 15"
>
<path
fill="currentColor"
fillRule="evenodd"
d="M6.158 3.135a.5.5 0 01.707.023l3.75 4a.5.5 0 010 .684l-3.75 4a.5.5 0 11-.73-.684L9.566 7.5l-3.43-3.658a.5.5 0 01.023-.707z"
clipRule="evenodd"
></path>
</svg>
);
export const ChevronLeft = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="15"
height="15"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
fillRule="evenodd"
d="M14 18l-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6L14 18z"
></path>
</svg>
);

10
app/web/src/utils/script/mount.tsx
View File

@ -59,8 +59,15 @@ export const jsMount = async (editor: MonacoEditor, monaco: Monaco, p?: PG) => {
const args = r.path.split("_");
if (args.length === 3) {
const loc = extractLoc(args, p);
console.log(loc.meta);
if (loc.meta) {
active.script_nav.list.length = active.script_nav.idx;
active.script_nav.list.push({
item_id: active.item_id,
comp_id: active.comp_id,
instance: active.instance,
});
active.script_nav.idx = active.script_nav.idx + 1;
if (loc.meta.item.component?.id && loc.meta.instances) {
active.comp_id = loc.meta.item.component?.id;
active.instance = {
@ -87,6 +94,7 @@ export const jsMount = async (editor: MonacoEditor, monaco: Monaco, p?: PG) => {
} else {
active.item_id = loc.meta.item.id;
}
p.render();
}
}