import { isPc } from "@queenjs/utils"; import { nanoid } from "nanoid"; import { EditorModule } from ".."; import { CompObject } from "../../controllers/SelectCtrl/compObj"; import { Matrix } from "../../controllers/SelectCtrl/matrix"; import { Design_Page_Size, Design_Pixel_Ratio } from "../../dicts/CompOptions"; import { DesignComp } from "../../objects/DesignTemp/DesignComp"; import { createCompStyle } from "../../objects/DesignTemp/creates/createCompStyle"; import { Layout } from "../../typings"; export const helpers = EditorModule.helper({ pxToDesignSize(value: number) { return value * Design_Pixel_Ratio; }, designSizeToPx(value: number) { return value / Design_Pixel_Ratio; }, designToNaturalSize( value: number, options?: { adaptiveH?: boolean } ): string { if (options?.adaptiveH && !isPc()) { value = value * ((window.innerHeight * Design_Pixel_Ratio) / Design_Page_Size[1]); } return this.helper.designSizeToPx(value) + "px"; }, findComp(compId: string) { const { compMap } = this.store.designData; const comp = compMap[compId]; if (comp) return comp; }, isStreamCard(compId: string) { return this.store.streamCardIds.indexOf(compId) > -1; }, isGroupComp(compId: string) { return this.store.groupIds.indexOf(compId) > -1; }, isGroupCompChild(compId: string) { const comps = this.helper.getCompTrees(compId); comps.pop(); while (comps.length) { const comp = comps.pop() as DesignComp; if (comp.compKey === "Group") { return true; } } return false; }, isStreamCardChild(compId: string) { if (compId == "root" || this.helper.isStreamCard(compId)) { return false; } const cards = this.store.streamCardIds; let n = cards.length; const compMap = this.store.designData.compMap; while (n--) { const childs = compMap[cards[n]].children.default || []; if (childs.indexOf(compId) > -1) return true; } return false; }, findParentComp(compId: string): DesignComp | undefined { const comp = this.helper.findComp(compId); if (comp) return this.helper.findComp(this.store.compPids[compId]); }, findRootComp(): DesignComp | undefined { return this.store.designData.compMap["root"]; }, findCardAllChildren(index:number) { const cardId = this.store.streamCardIds[index]; return this.store.designData.compMap[cardId].children.default || [] as string[]; }, getCompCard(compId: string) { const paths: DesignComp[] = this.helper.getCompTrees(compId); return paths[1]; }, getCompWorlParentPos(compId: string, vx: number, vy: number) { const paths: DesignComp[] = this.helper.getCompTrees(compId); const m = new Matrix(); let n = paths.length; let box = paths[1].$el.getBoundingClientRect(); const s = this.controls.editorCtrl.state.scale; m.translate((box.left - vx) / s, (box.top - vy)/s); for (let i = 2; i < n - 1; i++) { //card开始遍历 const m1 = new Matrix(); m1.setMatrixStr(paths[i].layout.transformMatrix || "matrix(1,0,0,1,0,0)"); m.append(m1); } return m; }, getCompTrees(compId: string) { const comps: DesignComp[] = []; const getParentComp = (compId: string) => { const comp = this.helper.findComp(compId); if (comp) { comps.unshift(comp); getParentComp(this.store.compPids[comp.id]); } }; getParentComp(compId); return comps; }, createStyle(layout: Partial & { size: any[] }, comp: DesignComp) { return createCompStyle(this, layout, comp); }, isCurrComp(compId: string) { return this.store.currCompId === compId; }, isCustomChildComp(comp: DesignComp): boolean { const parentComp = this.helper.findParentComp(comp.id); if (!parentComp) return false; const i = parentComp.children.default?.findIndex((d) => d === comp.id) ?? -1; return i >= 0; }, isCompCanDelete(compId: string): boolean { return ( this.helper.isStreamCardChild(compId) || (this.helper.isStreamCard(compId) && this.store.streamCardIds.length > 1) ); }, isShowSaveComp(comp: DesignComp): boolean { if (!this.helper.isStreamCardChild(comp.id)) return false; return true; }, clearUnusedComps(compMap: Record, rootId = "root") { const used = new Set(); const getUsedIds = (ids: string[]) => { ids.forEach((id) => { const comp = compMap[id]; if (!comp) return; used.add(id); getUsedIds(comp.getChildIds()); }); return used; }; getUsedIds([rootId]); Object.keys(compMap).forEach((compId) => { if (!used.has(compId)) { delete compMap[compId]; } }); }, getPointOffsetWith(e: MouseEvent, dom: HTMLElement) { const domRect = dom.getBoundingClientRect(); return { x: e.clientX - domRect.left, y: e.clientY - domRect.top, }; }, getCardCompBound(compId: string) { const compMap = this.store.designData.compMap; const c = compMap[compId]; const obj = new CompObject(c); const bound = obj.getBox(); return bound; }, extendStreamCard(streamCardId: string) { if (!streamCardId) return; const compMap = this.store.designData.compMap; const card = compMap[streamCardId]; if (this.store.isShortPage) { card.setH(this.controls.screenCtrl.getCurrScreenHeight()); return; } const childs = card.children.default || []; let maxH = 0, n = childs.length; while (n--) { const c = childs[n]; const aabb = this.helper.getCardCompBound(c); maxH = Math.max(maxH, aabb.y + aabb.h); } maxH = this.helper.pxToDesignSize(maxH); if (childs.length < 1) { maxH = 200; } card.setH(maxH); }, getClientId() { let clientId = undefined; try { const userInfo = JSON.parse(localStorage.getItem("userInfo") || "{}"); clientId = userInfo._id || localStorage.getItem("clientId"); } catch (error) { console.error(error); } if (!clientId) { clientId = nanoid(); localStorage.setItem("clientId", clientId); } return clientId; }, });