Compare commits

..
Author SHA1 Message Date
suyx 468bb5579d fix(POSTV1-07): 自动关闭编辑器操作提示
Dada P0-A isolated Windows CI / validate-and-package (push) Waiting to run
2026-08-05 18:01:03 +08:00
suyx 9d2aa879e9 fix(POSTV1-07): 固定画布布局与文字贴纸选择
Dada P0-A isolated Windows CI / validate-and-package (push) Waiting to run
2026-08-05 17:59:53 +08:00
8 changed files with 166 additions and 74 deletions
+7 -3
View File
@@ -1,9 +1,12 @@
.editor-page-shell {
min-height: 100vh;
height: 100vh;
height: 100dvh;
min-height: 0;
display: grid;
grid-template-rows: 56px minmax(0, 1fr) 32px;
background: #e8e8e5;
color: #111111;
overflow: hidden;
}
.editor-page-shell :focus-visible {
@@ -124,6 +127,7 @@
display: grid;
grid-template-columns: 280px minmax(0, 1fr) 320px;
min-height: 0;
overflow: hidden;
}
.editor-assets-panel,
@@ -542,13 +546,13 @@
}
@media (max-width: 760px) {
.editor-page-shell { grid-template-rows: auto minmax(0, 1fr) auto; }
.editor-page-shell { height: auto; min-height: 100dvh; grid-template-rows: auto minmax(0, 1fr) auto; overflow: visible; }
.editor-toolbar { display: flex; min-height: 56px; flex-wrap: wrap; gap: 8px; padding: 8px 10px; }
.editor-title { min-width: 0; flex: 1 1 calc(100% - 56px); }
.editor-history-actions { order: 3; }
.editor-save-status { order: 4; flex: 1 1 128px; }
.editor-toolbar-controls > button { display: block; order: 5; }
.editor-layout { grid-template-columns: 1fr; }
.editor-layout { grid-template-columns: 1fr; overflow: visible; }
.editor-assets-panel, .editor-inspector { border: 0; }
.editor-assets-panel { order: 2; }
.editor-inspector { order: 3; }
+43 -29
View File
@@ -160,6 +160,20 @@ export function EditorPage({ projectId }: { projectId: string }) {
const conflictExportGuardRef = useRef(new ConflictExportGuard());
const candidateMenuRef = useRef<HTMLDivElement | null>(null);
const candidateTriggerRef = useRef<HTMLButtonElement | null>(null);
const noticeTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
function showNotice(message: string) {
if (noticeTimerRef.current) clearTimeout(noticeTimerRef.current);
setNotice(message);
noticeTimerRef.current = setTimeout(() => {
setNotice("");
noticeTimerRef.current = undefined;
}, 3_000);
}
useEffect(() => () => {
if (noticeTimerRef.current) clearTimeout(noticeTimerRef.current);
}, []);
useEffect(() => {
let active = true;
@@ -175,7 +189,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
setDraftAdjustments(initial.background.adjustments);
historyRef.current = new CanvasEditHistory(initial);
elementControllerRef.current = new CanvasElementController(initial);
}).catch(() => { if (active) setNotice("编辑器暂时无法读取项目"); });
}).catch(() => { if (active) showNotice("编辑器暂时无法读取项目"); });
return () => { active = false; };
}, [projectId]);
@@ -291,7 +305,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
function applyPreview() {
if (!canvasState) return;
commitCanvas(updateBackgroundAdjustments(canvasState, draftAdjustments));
setNotice("底图调整已提交");
showNotice("底图调整已提交");
}
function undo() {
@@ -334,9 +348,9 @@ export function EditorPage({ projectId }: { projectId: string }) {
const palette = await paletteForAsset(pendingBackground);
commitCanvas(switchBackground(canvasState, pendingBackground, palette));
setPendingBackground(undefined);
setNotice("已更换底图,覆盖元素保留,底图处理已重置");
showNotice("已更换底图,覆盖元素保留,底图处理已重置");
} catch {
setNotice("新底图无法读取,未更换底图或刷新色卡");
showNotice("新底图无法读取,未更换底图或刷新色卡");
}
}
@@ -353,7 +367,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
commitCanvas(next);
setGuides([]);
setCandidateMenu(undefined);
setNotice(message);
showNotice(message);
}
function addSticker(sticker: StaticStickerCatalogItem) {
@@ -369,8 +383,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
}));
commitElementOperation(controller, "贴纸已加入画布");
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
else setNotice("贴纸未能加入画布");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
else showNotice("贴纸未能加入画布");
}
}
@@ -383,8 +397,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
controller.add(createColorCardElement(definition, palette, newElementIdentity(), canvasState.elements.length));
commitElementOperation(controller, "色卡已按原始底图加入画布");
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
else setNotice("无法从原始底图稳定提取五色,色卡未加入画布");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
else showNotice("无法从原始底图稳定提取五色,色卡未加入画布");
}
}
@@ -394,7 +408,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
if (templateId === "DYN012") {
const font = fontOption("FONT081");
if (!font || await ensureFont(font.fontId, font.url) !== "ready") {
setNotice("DYN012 的 FONT081 替代字体不可用,未使用系统字体替代。");
showNotice("DYN012 的 FONT081 替代字体不可用,未使用系统字体替代。");
return;
}
}
@@ -407,8 +421,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
commitElementOperation(controller, "动态值已确认并加入画布");
setLocationDialog(undefined);
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
else setNotice("动态贴纸未能加入画布");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
else showNotice("动态贴纸未能加入画布");
}
}
@@ -456,7 +470,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
controller.replaceElement(overrideDynamicStickerValue(element, value));
commitElementOperation(controller, "动态贴纸显示文字已更新");
} catch {
setNotice("动态贴纸显示文字不能为空");
showNotice("动态贴纸显示文字不能为空");
}
}
@@ -480,7 +494,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
if (!template.fontUrl || !canvasState) return;
const status = await ensureFont(template.defaultFontId, template.fontUrl);
if (status !== "ready") {
setNotice("素材暂不可用,未使用系统字体替代。");
showNotice("素材暂不可用,未使用系统字体替代。");
return;
}
const controller = controllerForCurrent();
@@ -490,8 +504,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
commitElementOperation(controller, "文字模板已加入画布");
void recordRecentTextTemplate(template.templateId, template.resourceVersion);
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
else setNotice("文字模板未能加入画布");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
else showNotice("文字模板未能加入画布");
}
}
@@ -503,7 +517,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
action(edit);
return { ...current, draft: edit.value };
} catch {
setNotice("文字参数不在允许范围内");
showNotice("文字参数不在允许范围内");
return current;
}
});
@@ -514,7 +528,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
if (!template?.fontUrl) return;
const status = await ensureFont(template.defaultFontId, template.fontUrl);
if (status !== "ready") {
setNotice("素材暂不可用,未使用系统字体替代。");
showNotice("素材暂不可用,未使用系统字体替代。");
return;
}
updateTextDraft((edit) => edit.switchTemplate(templateId));
@@ -527,7 +541,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
}
const option = fontOption(fontId);
if (!option || await ensureFont(option.fontId, option.url) !== "ready") {
setNotice("字体素材暂不可用,未使用系统字体替代。");
showNotice("字体素材暂不可用,未使用系统字体替代。");
return;
}
updateTextDraft((edit) => edit.setStyle({ fontOverride: fontId }));
@@ -546,8 +560,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
void recordRecentTextTemplate(complete.template_or_asset_id, complete.resource_version);
}
} catch (error) {
if (error instanceof Error && error.message === "text_content_required") setNotice("请输入文字内容或删除该元素。");
else setNotice("文字编辑未能完成");
if (error instanceof Error && error.message === "text_content_required") showNotice("请输入文字内容或删除该元素。");
else showNotice("文字编辑未能完成");
}
}
@@ -556,7 +570,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
const current = canvasState.elements.find((element) => element.element_id === textEdit.elementId);
if (current) setTextEdit({ draft: structuredClone(current), elementId: current.element_id, originalTemplateId: current.template_or_asset_id });
}
setNotice("已取消未提交的文字修改");
showNotice("已取消未提交的文字修改");
}
function pendingTextDraft() {
@@ -624,7 +638,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
return;
}
const ran = await conflictExportGuardRef.current.run(() => executeExport(options));
if (!ran) setNotice("版本冲突时仅允许导出本页版本一次");
if (!ran) showNotice("版本冲突时仅允许导出本页版本一次");
}
async function retryExportDownload() {
@@ -639,8 +653,8 @@ export function EditorPage({ projectId }: { projectId: string }) {
action(controller);
commitElementOperation(controller, message);
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
else setNotice("对象操作未完成");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
else showNotice("对象操作未完成");
}
}
@@ -668,7 +682,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
opacityGestureRef.current = undefined;
if (gesture.last === gesture.base) return;
commitCanvas(gesture.last);
setNotice("贴纸透明度已提交");
showNotice("贴纸透明度已提交");
}
function duplicateSelection() {
@@ -688,7 +702,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
const controller = controllerForCurrent();
if (!controller || selectedIds.length === 0) return;
clipboardRef.current = controller.copySelected();
setNotice("已复制到画布剪贴板");
showNotice("已复制到画布剪贴板");
}
function pasteSelection() {
@@ -698,7 +712,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
controller.pasteElements(clipboardRef.current, () => newElementIdentity());
commitElementOperation(controller, "已粘贴画布对象");
} catch (error) {
if (error instanceof Error && error.message === "canvas_element_limit_reached") setNotice("画布最多 50 个元素,请先删除现有元素。");
if (error instanceof Error && error.message === "canvas_element_limit_reached") showNotice("画布最多 50 个元素,请先删除现有元素。");
}
}
@@ -728,7 +742,7 @@ export function EditorPage({ projectId }: { projectId: string }) {
const drag = dragRef.current;
if (!drag) return;
commitCanvas(drag.last);
setNotice("对象位置已提交");
showNotice("对象位置已提交");
setGuides([]);
dragRef.current = undefined;
}
+29 -12
View File
@@ -12,12 +12,17 @@ import { drawColorCard } from "./palette-provider.js";
interface Gesture {
append: boolean;
bounds: DOMRect;
hit: boolean;
longPressOpened: boolean;
moved: boolean;
pointerId: number;
start: CanvasPoint;
startClient: CanvasPoint;
}
const DRAG_THRESHOLD_PX = 4;
interface EditorStageProps {
assetId: string | null;
canvasState: CanvasState;
@@ -38,11 +43,10 @@ interface EditorStageProps {
selectedIds: readonly string[];
}
function pointFromEvent(event: PointerEvent<HTMLCanvasElement>): CanvasPoint {
const bounds = event.currentTarget.getBoundingClientRect();
function pointFromClient(clientX: number, clientY: number, bounds: DOMRect): CanvasPoint {
return {
x: Math.max(0, Math.min(1, (event.clientX - bounds.left) / bounds.width)),
y: Math.max(0, Math.min(1, (event.clientY - bounds.top) / bounds.height)),
x: Math.max(0, Math.min(1, (clientX - bounds.left) / bounds.width)),
y: Math.max(0, Math.min(1, (clientY - bounds.top) / bounds.height)),
};
}
@@ -356,10 +360,14 @@ export function EditorStage(props: EditorStageProps) {
function handlePointerDown(event: PointerEvent<HTMLCanvasElement>) {
if (event.button !== 0) return;
const start = pointFromEvent(event);
const bounds = event.currentTarget.getBoundingClientRect();
const start = pointFromClient(event.clientX, event.clientY, bounds);
const append = event.shiftKey;
const hit = props.onSelect(start, append);
gestureRef.current = { append, hit, longPressOpened: false, pointerId: event.pointerId, start };
gestureRef.current = {
append, bounds, hit, longPressOpened: false, moved: false, pointerId: event.pointerId, start,
startClient: { x: event.clientX, y: event.clientY },
};
event.currentTarget.setPointerCapture(event.pointerId);
longPressRef.current = setTimeout(() => {
const gesture = gestureRef.current;
@@ -375,9 +383,11 @@ export function EditorStage(props: EditorStageProps) {
props.onPointerMoved();
return;
}
const point = pointFromEvent(event);
const clientDistance = Math.hypot(event.clientX - gesture.startClient.x, event.clientY - gesture.startClient.y);
if (!gesture.moved && clientDistance < DRAG_THRESHOLD_PX) return;
gesture.moved = true;
const point = pointFromClient(event.clientX, event.clientY, gesture.bounds);
const delta = { x: point.x - gesture.start.x, y: point.y - gesture.start.y };
if (Math.abs(delta.x) + Math.abs(delta.y) < 0.003) return;
if (longPressRef.current) clearTimeout(longPressRef.current);
props.onPointerMoved();
if (gesture.hit && !gesture.longPressOpened) props.onMovePreview(delta);
@@ -388,11 +398,18 @@ export function EditorStage(props: EditorStageProps) {
const gesture = gestureRef.current;
if (!gesture || gesture.pointerId !== event.pointerId) return;
if (longPressRef.current) clearTimeout(longPressRef.current);
const point = pointFromEvent(event);
const delta = { x: point.x - gesture.start.x, y: point.y - gesture.start.y };
const moved = Math.abs(delta.x) + Math.abs(delta.y) >= 0.003;
const clientDistance = Math.hypot(event.clientX - gesture.startClient.x, event.clientY - gesture.startClient.y);
const moved = gesture.moved || clientDistance >= DRAG_THRESHOLD_PX;
if (moved && !gesture.moved && !gesture.longPressOpened) {
const point = pointFromClient(event.clientX, event.clientY, gesture.bounds);
const delta = { x: point.x - gesture.start.x, y: point.y - gesture.start.y };
if (gesture.hit) props.onMovePreview(delta);
}
if (gesture.hit && moved && !gesture.longPressOpened) props.onMoveCommit();
else if (!gesture.hit && moved) props.onMarquee({ height: delta.y, width: delta.x, x: gesture.start.x, y: gesture.start.y }, gesture.append);
else if (!gesture.hit && moved) {
const point = pointFromClient(event.clientX, event.clientY, gesture.bounds);
props.onMarquee({ height: point.y - gesture.start.y, width: point.x - gesture.start.x, x: gesture.start.x, y: gesture.start.y }, gesture.append);
}
setMarquee(undefined);
gestureRef.current = undefined;
event.currentTarget.releasePointerCapture(event.pointerId);
-2
View File
@@ -107,7 +107,5 @@ if (!workerPort && process.argv.includes("--dada-ai-probe")) {
} catch {
storageStatus = "unavailable";
control.reportStatus("storage_unavailable");
clearInterval(keepAlive);
setTimeout(() => process.exit(1), 50);
}
}
+1 -4
View File
@@ -30,10 +30,7 @@ internal static class Program
};
var state = await runtime.StartAsync();
if (!form.IsDisposed) form.SetState(state);
if (state == SupervisorState.Ready && !SupervisorForm.OpenProductInSupportedBrowser())
{
form.SetBrowserLaunchFailure();
}
if (state == SupervisorState.Ready) SupervisorForm.OpenProductInSupportedBrowser();
}
form.Shown += async (_, _) => await StartRuntimeAsync();
form.RestartRequested += async () => await StartRuntimeAsync();
+4 -9
View File
@@ -26,7 +26,6 @@ internal sealed class SupervisorForm : Form
Font = new Font("Segoe UI", 9F);
FormBorderStyle = FormBorderStyle.FixedDialog;
MaximizeBox = false;
ShowInTaskbar = true;
StartPosition = FormStartPosition.CenterScreen;
Text = "Dada";
@@ -91,6 +90,10 @@ internal sealed class SupervisorForm : Form
trayIcon.DoubleClick += (_, _) => RestoreWindow();
FormClosing += (_, _) => trayIcon.Visible = false;
Resize += (_, _) =>
{
if (WindowState == FormWindowState.Minimized) Hide();
};
SetState(initialState);
}
@@ -136,14 +139,6 @@ internal sealed class SupervisorForm : Form
Activate();
}
internal void SetBrowserLaunchFailure()
{
if (state == SupervisorState.Ready)
{
statusDetail.Text = "本机服务运行正常,但未能自动打开浏览器;请点击“打开 Dada”或选择浏览器。";
}
}
protected override void Dispose(bool disposing)
{
if (disposing) trayIcon.Dispose();
@@ -1,4 +1,3 @@
using System.ComponentModel;
using System.Diagnostics;
using Microsoft.Win32;
@@ -14,20 +13,10 @@ internal static class SupportedBrowserLauncher
{
var executable = FindExecutable(executableName);
if (executable is null) return false;
try
{
var startInfo = new ProcessStartInfo(executable) { UseShellExecute = false };
startInfo.ArgumentList.Add(uri.AbsoluteUri);
return Process.Start(startInfo) is not null;
}
catch (Win32Exception)
{
return false;
}
catch (InvalidOperationException)
{
return false;
}
var startInfo = new ProcessStartInfo(executable) { UseShellExecute = false };
startInfo.ArgumentList.Add(uri.AbsoluteUri);
Process.Start(startInfo);
return true;
}
private static string? FindExecutable(string executableName)
+78
View File
@@ -212,3 +212,81 @@ test("TDD-WP4-TXT-002 waits for the archived font and commits exact style ranges
writeEvidence("TDD-WP4-TXT-002-font-metrics-ranges", "pixel-diff.json", { background_alpha_separate: true, clipped_visible_text: false, effective_font_size: 96 });
if (process.env.DADA_EVIDENCE_DIR_TEXT_EDITOR) await page.screenshot({ fullPage: true, path: resolve(process.env.DADA_EVIDENCE_DIR_TEXT_EDITOR, "TDD-WP4-TXT-002-font-metrics-ranges", "font-styles.png") });
});
test("POSTV1-07 keeps the canvas anchored when the text template panel opens", async ({ page }) => {
const projectId = uuid(760);
const backend: Backend = { canvas: emptyCanvas(), recent: [], saves: 0, version: 5 };
await routeEditor(page, projectId, backend);
await page.goto(`${webUrl}/app/projects/${projectId}/editor`);
const stage = page.getByLabel("编辑画布");
const before = await stage.boundingBox();
if (!before) throw new Error("Canvas geometry is unavailable before opening text templates.");
await page.getByRole("button", { name: "文字模板", exact: true }).click();
await expect(page.locator(".editor-template-grid button")).toHaveCount(32);
const after = await stage.boundingBox();
if (!after) throw new Error("Canvas geometry is unavailable after opening text templates.");
const assetsPanelScroll = await page.getByLabel("素材与底图来源").evaluate((panel) => ({
clientHeight: panel.clientHeight,
overflowY: getComputedStyle(panel).overflowY,
scrollHeight: panel.scrollHeight,
}));
expect(Math.abs(after.x - before.x)).toBeLessThanOrEqual(1);
expect(Math.abs(after.y - before.y)).toBeLessThanOrEqual(1);
expect(Math.abs(after.width - before.width)).toBeLessThanOrEqual(1);
expect(Math.abs(after.height - before.height)).toBeLessThanOrEqual(1);
expect(assetsPanelScroll.overflowY).toBe("auto");
expect(assetsPanelScroll.scrollHeight).toBeGreaterThan(assetsPanelScroll.clientHeight);
});
test("POSTV1-07 keeps text selection stable and dismisses move feedback", async ({ page }) => {
const projectId = uuid(770);
const backend: Backend = { canvas: emptyCanvas(), recent: [], saves: 0, version: 6 };
await routeEditor(page, projectId, backend);
await page.goto(`${webUrl}/app/projects/${projectId}/editor`);
await page.getByRole("button", { name: "文字模板", exact: true }).click();
await page.getByRole("button", { name: /H003 生活分享家/ }).click();
await expect.poll(() => backend.canvas.elements.length).toBe(1);
await expect.poll(() => backend.saves, { timeout: 5_000 }).toBeGreaterThan(0);
await page.reload();
const stage = page.getByLabel("编辑画布");
const bounds = await stage.boundingBox();
const element = backend.canvas.elements[0];
if (!bounds || !element) throw new Error("Text selection geometry is unavailable.");
const positionBefore = structuredClone(element.position);
const savesBefore = backend.saves;
const clientX = bounds.x + bounds.width * element.position.x;
const clientY = bounds.y + bounds.height * element.position.y;
await page.mouse.move(clientX, clientY);
await page.mouse.down();
await expect(page.getByLabel("字体覆盖")).toBeVisible();
const selectedBounds = await stage.boundingBox();
const inspectorScroll = await page.getByLabel("对象参数").evaluate((panel) => ({
clientHeight: panel.clientHeight,
overflowY: getComputedStyle(panel).overflowY,
scrollHeight: panel.scrollHeight,
}));
if (!selectedBounds) throw new Error("Canvas geometry is unavailable after selecting text.");
expect(Math.abs(selectedBounds.y - bounds.y)).toBeLessThanOrEqual(1);
expect(inspectorScroll.overflowY).toBe("auto");
expect(inspectorScroll.scrollHeight).toBeGreaterThan(inspectorScroll.clientHeight);
await page.mouse.move(clientX + 1, clientY);
await page.mouse.up();
await expect(page.getByLabel("字体覆盖")).toBeVisible();
await page.waitForTimeout(800);
expect(backend.canvas.elements[0]?.position).toEqual(positionBefore);
expect(backend.saves).toBe(savesBefore);
await page.mouse.move(clientX, clientY);
await page.mouse.down();
await page.mouse.move(clientX + 12, clientY);
await page.mouse.up();
await expect(page.getByText("对象位置已提交", { exact: true })).toBeVisible();
await expect.poll(() => backend.saves, { timeout: 5_000 }).toBeGreaterThan(savesBefore);
await expect(page.getByText("对象位置已提交", { exact: true })).toBeHidden({ timeout: 5_000 });
});