- ${canWrite ? `
-
+
+
- ` : ""}
-
-
+
+
@@ -184,6 +180,13 @@ export function openModelPreview(
`,
actions: {
+ 更新缩略图() {
+ if (canWrite) {
+ screenshotModel(model.id, onThumbnailSaved).catch((error) => {
+
+ })
+ }
+ },
关闭() {
disposePreview();
w2popup.close();
@@ -192,7 +195,8 @@ export function openModelPreview(
});
popup.self
- .on("open:after", () => {
+ .on("open:after", () => {popup
+ console.log(popup)
bindProcessPlaceholder(operations);
bindImportScene(model, operations, options.onImportScene);
if (canWrite) bindThumbnailCapture(model.id, onThumbnailSaved);
@@ -481,42 +485,48 @@ function disposeMaterial(material: unknown) {
}
function bindThumbnailCapture(modelId: number, onThumbnailSaved?: () => Promise
| void) {
- document.querySelector("#previewCaptureThumbBtn")?.addEventListener("click", async () => {
- try {
- if (!runtime) {
- throw new Error("模型还未加载完成");
- }
- const { renderer, scene, camera, controls } = runtime.context;
- if (!renderer || !scene || !camera || !controls) {
- throw new Error("模型还未加载完成");
- }
- const transparent = document.querySelector("#previewTransparentThumb")?.checked ?? false;
- controls.update();
- const oldBackground = scene.background;
- const oldClearAlpha = renderer.getClearAlpha();
- if (transparent) {
- scene.background = null;
- renderer.setClearColor(0x000000, 0);
- }
- renderer.render(scene, camera);
- const thumbnail = renderer.domElement.toDataURL("image/png");
- if (transparent) {
- scene.background = oldBackground;
- renderer.setClearAlpha(oldClearAlpha);
- renderer.render(scene, camera);
- }
- await api(`/api/models/${modelId}/thumbnail`, {
- method: "PUT",
- body: JSON.stringify({ thumbnail })
- });
- await onThumbnailSaved?.();
- notify("缩略图已保存");
- } catch (error) {
- notifyError(error);
- }
+ document.querySelector("#previewCaptureThumbBtn")?.addEventListener("click", () => {
+ screenshotModel(modelId, onThumbnailSaved).catch((error) => {
+
+ })
});
}
+async function screenshotModel(modelId: number, onThumbnailSaved?: () => Promise | void) {
+ try {
+ if (!runtime) {
+ throw new Error("模型还未加载完成");
+ }
+ const { renderer, scene, camera, controls } = runtime.context;
+ if (!renderer || !scene || !camera || !controls) {
+ throw new Error("模型还未加载完成");
+ }
+ const transparent = true; // document.querySelector("#previewTransparentThumb")?.checked ?? false;
+ controls.update();
+ const oldBackground = scene.background;
+ const oldClearAlpha = renderer.getClearAlpha();
+ if (transparent) {
+ scene.background = null;
+ renderer.setClearColor(0x000000, 0);
+ }
+ renderer.render(scene, camera);
+ const thumbnail = renderer.domElement.toDataURL("image/png");
+ if (transparent) {
+ scene.background = oldBackground;
+ renderer.setClearAlpha(oldClearAlpha);
+ renderer.render(scene, camera);
+ }
+ await api(`/api/models/${modelId}/thumbnail`, {
+ method: "PUT",
+ body: JSON.stringify({ thumbnail })
+ });
+ await onThumbnailSaved?.();
+ notify("缩略图已保存");
+ } catch (error) {
+ notifyError(error);
+ }
+}
+
function getSelectedOperation(operations: PreviewOperation[]) {
const selectedButton = document.querySelector(".preview-process-tree li.is-active button");
const index = Number(selectedButton?.dataset.processIndex ?? 0);