mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-22 02:28:11 +08:00
Clean up code with better naming
This commit is contained in:
Keavon Chambers
@@ -12,8 +12,8 @@
|
||||
let dataPanelLayout: Layout = [];
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDataPanelLayout, (updateDataPanelLayout) => {
|
||||
patchLayout(dataPanelLayout, updateDataPanelLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDataPanelLayout, (data) => {
|
||||
patchLayout(dataPanelLayout, data);
|
||||
dataPanelLayout = dataPanelLayout;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -332,7 +332,7 @@
|
||||
editor.handle.onChangeText(textCleaned, false);
|
||||
}
|
||||
|
||||
export async function displayEditableTextbox(displayEditableTextbox: DisplayEditableTextbox) {
|
||||
export async function displayEditableTextbox(data: DisplayEditableTextbox) {
|
||||
showTextInput = true;
|
||||
|
||||
await tick();
|
||||
@@ -340,33 +340,33 @@
|
||||
if (!textInput) return;
|
||||
|
||||
// eslint-disable-next-line svelte/no-dom-manipulating
|
||||
if (displayEditableTextbox.text === "") textInput.textContent = "";
|
||||
if (data.text === "") textInput.textContent = "";
|
||||
// eslint-disable-next-line svelte/no-dom-manipulating
|
||||
else textInput.textContent = `${displayEditableTextbox.text}\n`;
|
||||
else textInput.textContent = `${data.text}\n`;
|
||||
|
||||
// Make it so `maxHeight` is a multiple of `lineHeight`
|
||||
const lineHeight = displayEditableTextbox.lineHeightRatio * displayEditableTextbox.fontSize;
|
||||
let height = displayEditableTextbox.maxHeight === undefined ? "auto" : `${Math.floor(displayEditableTextbox.maxHeight / lineHeight) * lineHeight}px`;
|
||||
const lineHeight = data.lineHeightRatio * data.fontSize;
|
||||
let height = data.maxHeight === undefined ? "auto" : `${Math.floor(data.maxHeight / lineHeight) * lineHeight}px`;
|
||||
|
||||
textInput.contentEditable = "true";
|
||||
textInput.style.transformOrigin = "0 0";
|
||||
textInput.style.width = displayEditableTextbox.maxWidth ? `${displayEditableTextbox.maxWidth}px` : "max-content";
|
||||
textInput.style.width = data.maxWidth ? `${data.maxWidth}px` : "max-content";
|
||||
textInput.style.height = height;
|
||||
textInput.style.lineHeight = `${displayEditableTextbox.lineHeightRatio}`;
|
||||
textInput.style.fontSize = `${displayEditableTextbox.fontSize}px`;
|
||||
textInput.style.color = displayEditableTextbox.color.toHexOptionalAlpha() || "transparent";
|
||||
textInput.style.textAlign = displayEditableTextbox.align;
|
||||
textInput.style.lineHeight = `${data.lineHeightRatio}`;
|
||||
textInput.style.fontSize = `${data.fontSize}px`;
|
||||
textInput.style.color = data.color.toHexOptionalAlpha() || "transparent";
|
||||
textInput.style.textAlign = data.align;
|
||||
|
||||
textInput.oninput = () => {
|
||||
if (!textInput) return;
|
||||
editor.handle.updateBounds(textInputCleanup(textInput.innerText));
|
||||
};
|
||||
|
||||
textInputMatrix = displayEditableTextbox.transform;
|
||||
textInputMatrix = data.transform;
|
||||
|
||||
const data = new Uint8Array(displayEditableTextbox.fontData);
|
||||
if (data.length > 0) {
|
||||
window.document.fonts.add(new FontFace("text-font", data));
|
||||
const bytes = new Uint8Array(data.fontData);
|
||||
if (bytes.length > 0) {
|
||||
window.document.fonts.add(new FontFace("text-font", bytes));
|
||||
textInput.style.fontFamily = "text-font";
|
||||
}
|
||||
|
||||
|
||||
@@ -75,28 +75,28 @@
|
||||
let layersPanelBottomBarLayout: Layout = [];
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelControlBarLeftLayout, (updateLayersPanelControlBarLeftLayout) => {
|
||||
patchLayout(layersPanelControlBarLeftLayout, updateLayersPanelControlBarLeftLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelControlBarLeftLayout, (data) => {
|
||||
patchLayout(layersPanelControlBarLeftLayout, data);
|
||||
layersPanelControlBarLeftLayout = layersPanelControlBarLeftLayout;
|
||||
});
|
||||
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelControlBarRightLayout, (updateLayersPanelControlBarRightLayout) => {
|
||||
patchLayout(layersPanelControlBarRightLayout, updateLayersPanelControlBarRightLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelControlBarRightLayout, (data) => {
|
||||
patchLayout(layersPanelControlBarRightLayout, data);
|
||||
layersPanelControlBarRightLayout = layersPanelControlBarRightLayout;
|
||||
});
|
||||
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelBottomBarLayout, (updateLayersPanelBottomBarLayout) => {
|
||||
patchLayout(layersPanelBottomBarLayout, updateLayersPanelBottomBarLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelBottomBarLayout, (data) => {
|
||||
patchLayout(layersPanelBottomBarLayout, data);
|
||||
layersPanelBottomBarLayout = layersPanelBottomBarLayout;
|
||||
});
|
||||
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentLayerStructureJs, (updateDocumentLayerStructure) => {
|
||||
const structure = newUpdateDocumentLayerStructure(updateDocumentLayerStructure.dataBuffer);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentLayerStructureJs, (data) => {
|
||||
const structure = newUpdateDocumentLayerStructure(data.dataBuffer);
|
||||
rebuildLayerHierarchy(structure);
|
||||
});
|
||||
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentLayerDetails, (updateDocumentLayerDetails) => {
|
||||
const targetLayer = updateDocumentLayerDetails.data;
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentLayerDetails, (data) => {
|
||||
const targetLayer = data.data;
|
||||
const targetId = targetLayer.id;
|
||||
|
||||
updateLayerInTree(targetId, targetLayer);
|
||||
|
||||
@@ -12,8 +12,8 @@
|
||||
let propertiesPanelLayout: Layout = [];
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePropertiesPanelLayout, (updatePropertiesPanelLayout) => {
|
||||
patchLayout(propertiesPanelLayout, updatePropertiesPanelLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePropertiesPanelLayout, (data) => {
|
||||
patchLayout(propertiesPanelLayout, data);
|
||||
propertiesPanelLayout = propertiesPanelLayout;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -17,8 +17,8 @@
|
||||
let welcomePanelButtonsLayout: Layout = [];
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWelcomeScreenButtonsLayout, (updateWelcomeScreenButtonsLayout) => {
|
||||
patchLayout(welcomePanelButtonsLayout, updateWelcomeScreenButtonsLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWelcomeScreenButtonsLayout, (data) => {
|
||||
patchLayout(welcomePanelButtonsLayout, data);
|
||||
welcomePanelButtonsLayout = welcomePanelButtonsLayout;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -13,8 +13,8 @@
|
||||
let statusBarHintsLayout: Layout = [];
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateStatusBarHintsLayout, (updateStatusBarHintsLayout) => {
|
||||
patchLayout(statusBarHintsLayout, updateStatusBarHintsLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateStatusBarHintsLayout, (data) => {
|
||||
patchLayout(statusBarHintsLayout, data);
|
||||
statusBarHintsLayout = statusBarHintsLayout;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -21,8 +21,8 @@
|
||||
$: height = $appWindow.platform === "Mac" ? 28 * (1 / $appWindow.uiScale) : 28;
|
||||
|
||||
onMount(() => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateMenuBarLayout, (updateMenuBarLayout) => {
|
||||
patchLayout(menuBarLayout, updateMenuBarLayout);
|
||||
editor.subscriptions.subscribeJsMessage(UpdateMenuBarLayout, (data) => {
|
||||
patchLayout(menuBarLayout, data);
|
||||
menuBarLayout = menuBarLayout;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -3,9 +3,9 @@ import { TriggerClipboardWrite, TriggerSelectionRead, TriggerSelectionWrite } fr
|
||||
|
||||
export function createClipboardManager(editor: Editor) {
|
||||
// Subscribe to process backend event
|
||||
editor.subscriptions.subscribeJsMessage(TriggerClipboardWrite, (triggerTextCopy) => {
|
||||
editor.subscriptions.subscribeJsMessage(TriggerClipboardWrite, (data) => {
|
||||
// If the Clipboard API is supported in the browser, copy text to the clipboard
|
||||
navigator.clipboard?.writeText?.(triggerTextCopy.content);
|
||||
navigator.clipboard?.writeText?.(data.content);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSelectionRead, async (data) => {
|
||||
editor.handle.readSelection(readAtCaret(data.cut), data.cut);
|
||||
|
||||
@@ -26,16 +26,16 @@ export function createFontsManager(editor: Editor) {
|
||||
editor.handle.onFontCatalogLoad(catalog);
|
||||
});
|
||||
|
||||
editor.subscriptions.subscribeJsMessage(TriggerFontDataLoad, async (triggerFontDataLoad) => {
|
||||
const { fontFamily, fontStyle } = triggerFontDataLoad.font;
|
||||
editor.subscriptions.subscribeJsMessage(TriggerFontDataLoad, async (data) => {
|
||||
const { fontFamily, fontStyle } = data.font;
|
||||
|
||||
try {
|
||||
if (!triggerFontDataLoad.url) throw new Error("No URL provided for font data load");
|
||||
const response = await fetch(triggerFontDataLoad.url);
|
||||
if (!data.url) throw new Error("No URL provided for font data load");
|
||||
const response = await fetch(data.url);
|
||||
const buffer = await response.arrayBuffer();
|
||||
const data = new Uint8Array(buffer);
|
||||
const bytes = new Uint8Array(buffer);
|
||||
|
||||
editor.handle.onFontLoad(fontFamily, fontStyle, data);
|
||||
editor.handle.onFontLoad(fontFamily, fontStyle, bytes);
|
||||
} catch (error) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.error("Failed to load font:", error);
|
||||
|
||||
@@ -3,7 +3,7 @@ import { TriggerVisitLink } from "@graphite/messages";
|
||||
|
||||
export function createHyperlinkManager(editor: Editor) {
|
||||
// Subscribe to process backend event
|
||||
editor.subscriptions.subscribeJsMessage(TriggerVisitLink, async (triggerOpenLink) => {
|
||||
window.open(triggerOpenLink.url, "_blank");
|
||||
editor.subscriptions.subscribeJsMessage(TriggerVisitLink, async (data) => {
|
||||
window.open(data.url, "_blank");
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3,8 +3,8 @@ import { TriggerAboutGraphiteLocalizedCommitDate } from "@graphite/messages";
|
||||
|
||||
export function createLocalizationManager(editor: Editor) {
|
||||
// Subscribe to process backend event
|
||||
editor.subscriptions.subscribeJsMessage(TriggerAboutGraphiteLocalizedCommitDate, (triggerAboutGraphiteLocalizedCommitDate) => {
|
||||
const localized = localizeTimestamp(triggerAboutGraphiteLocalizedCommitDate.commitDate);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerAboutGraphiteLocalizedCommitDate, (data) => {
|
||||
const localized = localizeTimestamp(data.commitDate);
|
||||
editor.handle.requestAboutGraphiteDialogWithLocalizedCommitDate(localized.timestamp, localized.year);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -6,12 +6,12 @@ import { stripIndents } from "@graphite/utility-functions/strip-indents";
|
||||
|
||||
export function createPanicManager(editor: Editor, dialogState: DialogState) {
|
||||
// Code panic dialog and console error
|
||||
editor.subscriptions.subscribeJsMessage(DisplayDialogPanic, (displayDialogPanic) => {
|
||||
editor.subscriptions.subscribeJsMessage(DisplayDialogPanic, (data) => {
|
||||
// `Error.stackTraceLimit` is only available in V8/Chromium
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
(Error as any).stackTraceLimit = Infinity;
|
||||
const stackTrace = new Error().stack || "";
|
||||
const panicDetails = `${displayDialogPanic.panicInfo}${stackTrace ? `\n\n${stackTrace}` : ""}`;
|
||||
const panicDetails = `${data.panicInfo}${stackTrace ? `\n\n${stackTrace}` : ""}`;
|
||||
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(panicDetails);
|
||||
|
||||
@@ -154,17 +154,17 @@ export function createPersistenceManager(editor: Editor, portfolio: PortfolioSta
|
||||
// FRONTEND MESSAGE SUBSCRIPTIONS
|
||||
|
||||
// Subscribe to process backend events
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSavePreferences, async (preferences) => {
|
||||
await savePreferences(preferences.preferences);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSavePreferences, async (data) => {
|
||||
await savePreferences(data.preferences);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerLoadPreferences, async () => {
|
||||
await loadPreferences();
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerPersistenceWriteDocument, async (autoSaveDocument) => {
|
||||
await storeDocument(autoSaveDocument);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerPersistenceWriteDocument, async (data) => {
|
||||
await storeDocument(data);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerPersistenceRemoveDocument, async (removeAutoSaveDocument) => {
|
||||
await removeDocument(removeAutoSaveDocument.documentId);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerPersistenceRemoveDocument, async (data) => {
|
||||
await removeDocument(data.documentId);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerLoadFirstAutoSaveDocument, async () => {
|
||||
await loadFirstDocument();
|
||||
@@ -175,8 +175,8 @@ export function createPersistenceManager(editor: Editor, portfolio: PortfolioSta
|
||||
editor.subscriptions.subscribeJsMessage(TriggerOpenLaunchDocuments, async () => {
|
||||
// TODO: Could be used to load documents from URL params or similar on launch
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveActiveDocument, async (triggerSaveActiveDocument) => {
|
||||
const documentId = String(triggerSaveActiveDocument.documentId);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveActiveDocument, async (data) => {
|
||||
const documentId = String(data.documentId);
|
||||
const previouslySavedDocuments = await get<Record<string, TriggerPersistenceWriteDocument>>("documents", graphiteStore);
|
||||
if (!previouslySavedDocuments) return;
|
||||
if (documentId in previouslySavedDocuments) {
|
||||
|
||||
@@ -13,33 +13,33 @@ export function createAppWindowState(editor: Editor) {
|
||||
});
|
||||
|
||||
// Set up message subscriptions on creation
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePlatform, (updatePlatform) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePlatform, (data) => {
|
||||
update((state) => {
|
||||
state.platform = updatePlatform.platform;
|
||||
state.platform = data.platform;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateMaximized, (updateMaximized) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateMaximized, (data) => {
|
||||
update((state) => {
|
||||
state.maximized = updateMaximized.maximized;
|
||||
state.maximized = data.maximized;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateFullscreen, (updateFullscreen) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateFullscreen, (data) => {
|
||||
update((state) => {
|
||||
state.fullscreen = updateFullscreen.fullscreen;
|
||||
state.fullscreen = data.fullscreen;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateViewportHolePunch, (viewportHolePunch) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateViewportHolePunch, (data) => {
|
||||
update((state) => {
|
||||
state.viewportHolePunch = viewportHolePunch.active;
|
||||
state.viewportHolePunch = data.active;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateUIScale, (uiScale) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateUIScale, (data) => {
|
||||
update((state) => {
|
||||
state.uiScale = uiScale.scale;
|
||||
state.uiScale = data.scale;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -45,33 +45,33 @@ export function createDialogState(editor: Editor) {
|
||||
}
|
||||
|
||||
// Subscribe to process backend events
|
||||
editor.subscriptions.subscribeJsMessage(DisplayDialog, (displayDialog) => {
|
||||
editor.subscriptions.subscribeJsMessage(DisplayDialog, (data) => {
|
||||
update((state) => {
|
||||
state.visible = true;
|
||||
|
||||
state.title = displayDialog.title;
|
||||
state.icon = displayDialog.icon;
|
||||
state.title = data.title;
|
||||
state.icon = data.icon;
|
||||
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogButtons, (updateDialogButtons) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogButtons, (data) => {
|
||||
update((state) => {
|
||||
patchLayout(state.buttons, updateDialogButtons);
|
||||
patchLayout(state.buttons, data);
|
||||
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogColumn1, (updateDialogColumn1) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogColumn1, (data) => {
|
||||
update((state) => {
|
||||
patchLayout(state.column1, updateDialogColumn1);
|
||||
patchLayout(state.column1, data);
|
||||
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogColumn2, (updateDialogColumn2) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDialogColumn2, (data) => {
|
||||
update((state) => {
|
||||
patchLayout(state.column2, updateDialogColumn2);
|
||||
patchLayout(state.column2, data);
|
||||
|
||||
return state;
|
||||
});
|
||||
|
||||
@@ -30,55 +30,55 @@ export function createDocumentState(editor: Editor) {
|
||||
const { subscribe, update } = state;
|
||||
|
||||
// Update layouts
|
||||
editor.subscriptions.subscribeJsMessage(UpdateGraphFadeArtwork, (updateGraphFadeArtwork) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateGraphFadeArtwork, (data) => {
|
||||
update((state) => {
|
||||
state.fadeArtwork = updateGraphFadeArtwork.percentage;
|
||||
state.fadeArtwork = data.percentage;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateToolOptionsLayout, async (updateToolOptionsLayout) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateToolOptionsLayout, async (data) => {
|
||||
await tick();
|
||||
|
||||
update((state) => {
|
||||
patchLayout(state.toolOptionsLayout, updateToolOptionsLayout);
|
||||
patchLayout(state.toolOptionsLayout, data);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentBarLayout, async (updateDocumentBarLayout) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDocumentBarLayout, async (data) => {
|
||||
await tick();
|
||||
|
||||
update((state) => {
|
||||
patchLayout(state.documentBarLayout, updateDocumentBarLayout);
|
||||
patchLayout(state.documentBarLayout, data);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateToolShelfLayout, async (updateToolShelfLayout) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateToolShelfLayout, async (data) => {
|
||||
await tick();
|
||||
|
||||
update((state) => {
|
||||
patchLayout(state.toolShelfLayout, updateToolShelfLayout);
|
||||
patchLayout(state.toolShelfLayout, data);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWorkingColorsLayout, async (updateWorkingColorsLayout) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWorkingColorsLayout, async (data) => {
|
||||
await tick();
|
||||
|
||||
update((state) => {
|
||||
patchLayout(state.workingColorsLayout, updateWorkingColorsLayout);
|
||||
patchLayout(state.workingColorsLayout, data);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphControlBarLayout, (updateNodeGraphControlBarLayout) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphControlBarLayout, (data) => {
|
||||
update((state) => {
|
||||
patchLayout(state.nodeGraphControlBarLayout, updateNodeGraphControlBarLayout);
|
||||
patchLayout(state.nodeGraphControlBarLayout, data);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
|
||||
// Show or hide the graph view overlay
|
||||
editor.subscriptions.subscribeJsMessage(UpdateGraphViewOverlay, (updateGraphViewOverlay) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateGraphViewOverlay, (data) => {
|
||||
update((state) => {
|
||||
state.graphViewOverlayOpen = updateGraphViewOverlay.open;
|
||||
state.graphViewOverlayOpen = data.open;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -62,87 +62,87 @@ export function createNodeGraphState(editor: Editor) {
|
||||
}
|
||||
|
||||
// Set up message subscriptions on creation
|
||||
editor.subscriptions.subscribeJsMessage(SendUIMetadata, (uiMetadata) => {
|
||||
editor.subscriptions.subscribeJsMessage(SendUIMetadata, (data) => {
|
||||
update((state) => {
|
||||
state.nodeDescriptions = uiMetadata.nodeDescriptions;
|
||||
state.nodeTypes = uiMetadata.nodeTypes;
|
||||
state.nodeDescriptions = data.nodeDescriptions;
|
||||
state.nodeTypes = data.nodeTypes;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateBox, (updateBox) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateBox, (data) => {
|
||||
update((state) => {
|
||||
state.box = updateBox.box;
|
||||
state.box = data.box;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateClickTargets, (UpdateClickTargets) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateClickTargets, (data) => {
|
||||
update((state) => {
|
||||
state.clickTargets = UpdateClickTargets.clickTargets;
|
||||
state.clickTargets = data.clickTargets;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateContextMenuInformation, (updateContextMenuInformation) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateContextMenuInformation, (data) => {
|
||||
update((state) => {
|
||||
state.contextMenuInformation = updateContextMenuInformation.contextMenuInformation;
|
||||
state.contextMenuInformation = data.contextMenuInformation;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateImportReorderIndex, (updateImportReorderIndex) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateImportReorderIndex, (data) => {
|
||||
update((state) => {
|
||||
state.reorderImportIndex = updateImportReorderIndex.importIndex;
|
||||
state.reorderImportIndex = data.importIndex;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateExportReorderIndex, (updateExportReorderIndex) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateExportReorderIndex, (data) => {
|
||||
update((state) => {
|
||||
state.reorderExportIndex = updateExportReorderIndex.exportIndex;
|
||||
state.reorderExportIndex = data.exportIndex;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateImportsExports, (updateImportsExports) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateImportsExports, (data) => {
|
||||
update((state) => {
|
||||
state.updateImportsExports = updateImportsExports;
|
||||
state.updateImportsExports = data;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateInSelectedNetwork, (updateInSelectedNetwork) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateInSelectedNetwork, (data) => {
|
||||
update((state) => {
|
||||
state.inSelectedNetwork = updateInSelectedNetwork.inSelectedNetwork;
|
||||
state.inSelectedNetwork = data.inSelectedNetwork;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayerWidths, (updateLayerWidths) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayerWidths, (data) => {
|
||||
update((state) => {
|
||||
state.layerWidths = updateLayerWidths.layerWidths;
|
||||
state.chainWidths = updateLayerWidths.chainWidths;
|
||||
state.hasLeftInputWire = updateLayerWidths.hasLeftInputWire;
|
||||
state.layerWidths = data.layerWidths;
|
||||
state.chainWidths = data.chainWidths;
|
||||
state.hasLeftInputWire = data.hasLeftInputWire;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphNodes, (updateNodeGraphNodes) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphNodes, (data) => {
|
||||
update((state) => {
|
||||
state.nodes.clear();
|
||||
updateNodeGraphNodes.nodes.forEach((node) => {
|
||||
data.nodes.forEach((node) => {
|
||||
state.nodes.set(node.id, node);
|
||||
});
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphErrorDiagnostic, (updateNodeGraphErrorDiagnostic) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphErrorDiagnostic, (data) => {
|
||||
update((state) => {
|
||||
state.error = updateNodeGraphErrorDiagnostic.error;
|
||||
state.error = data.error;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateVisibleNodes, (updateVisibleNodes) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateVisibleNodes, (data) => {
|
||||
update((state) => {
|
||||
state.visibleNodes = new Set<bigint>(updateVisibleNodes.nodes);
|
||||
state.visibleNodes = new Set<bigint>(data.nodes);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphWires, (updateNodeWires) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphWires, (data) => {
|
||||
update((state) => {
|
||||
updateNodeWires.wires.forEach((wireUpdate) => {
|
||||
data.wires.forEach((wireUpdate) => {
|
||||
let inputMap = state.wires.get(wireUpdate.id);
|
||||
// If it doesn't exist, create it and set it in the outer map
|
||||
if (!inputMap) {
|
||||
@@ -158,33 +158,33 @@ export function createNodeGraphState(editor: Editor) {
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(ClearAllNodeGraphWires, (_) => {
|
||||
editor.subscriptions.subscribeJsMessage(ClearAllNodeGraphWires, () => {
|
||||
update((state) => {
|
||||
state.wires.clear();
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphSelection, (updateNodeGraphSelection) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphSelection, (data) => {
|
||||
update((state) => {
|
||||
state.selected = updateNodeGraphSelection.selected;
|
||||
state.selected = data.selected;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphTransform, (updateNodeGraphTransform) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeGraphTransform, (data) => {
|
||||
update((state) => {
|
||||
state.transform = updateNodeGraphTransform.transform;
|
||||
state.transform = data.transform;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeThumbnail, (updateNodeThumbnail) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateNodeThumbnail, (data) => {
|
||||
update((state) => {
|
||||
state.thumbnails.set(updateNodeThumbnail.id, updateNodeThumbnail.value);
|
||||
state.thumbnails.set(data.id, data.value);
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWirePathInProgress, (updateWirePathInProgress) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateWirePathInProgress, (data) => {
|
||||
update((state) => {
|
||||
state.wirePathInProgress = updateWirePathInProgress.wirePath;
|
||||
state.wirePathInProgress = data.wirePath;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -29,26 +29,26 @@ export function createPortfolioState(editor: Editor) {
|
||||
});
|
||||
|
||||
// Set up message subscriptions on creation
|
||||
editor.subscriptions.subscribeJsMessage(UpdateOpenDocumentsList, (updateOpenDocumentList) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateOpenDocumentsList, (data) => {
|
||||
update((state) => {
|
||||
state.documents = updateOpenDocumentList.openDocuments;
|
||||
state.documents = data.openDocuments;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateActiveDocument, (updateActiveDocument) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateActiveDocument, (data) => {
|
||||
update((state) => {
|
||||
// Assume we receive a correct document id
|
||||
const activeId = state.documents.findIndex((doc) => doc.id === updateActiveDocument.documentId);
|
||||
const activeId = state.documents.findIndex((doc) => doc.id === data.documentId);
|
||||
state.activeDocumentIndex = activeId;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerFetchAndOpenDocument, async (triggerFetchAndOpenDocument) => {
|
||||
editor.subscriptions.subscribeJsMessage(TriggerFetchAndOpenDocument, async (data) => {
|
||||
try {
|
||||
const { name, filename } = triggerFetchAndOpenDocument;
|
||||
const { name, filename } = data;
|
||||
const url = new URL(`demo-artwork/${filename}`, document.location.href);
|
||||
const data = await fetch(url);
|
||||
const content = await data.text();
|
||||
const response = await fetch(url);
|
||||
const content = await response.text();
|
||||
|
||||
editor.handle.openDocumentFile(name, content);
|
||||
} catch {
|
||||
@@ -90,14 +90,14 @@ export function createPortfolioState(editor: Editor) {
|
||||
const imageData = await extractPixelData(new Blob([new Uint8Array(data.content.data)], { type: data.type }));
|
||||
editor.handle.pasteImage(data.filename, new Uint8Array(imageData.data), imageData.width, imageData.height);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveDocument, (triggerSaveDocument) => {
|
||||
downloadFile(triggerSaveDocument.name, triggerSaveDocument.content);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveDocument, (data) => {
|
||||
downloadFile(data.name, data.content);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveFile, (triggerFileDownload) => {
|
||||
downloadFile(triggerFileDownload.name, triggerFileDownload.content);
|
||||
editor.subscriptions.subscribeJsMessage(TriggerSaveFile, (data) => {
|
||||
downloadFile(data.name, data.content);
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(TriggerExportImage, async (TriggerExportImage) => {
|
||||
const { svg, name, mime, size } = TriggerExportImage;
|
||||
editor.subscriptions.subscribeJsMessage(TriggerExportImage, async (data) => {
|
||||
const { svg, name, mime, size } = data;
|
||||
|
||||
// Fill the canvas with white if it'll be a JPEG (which does not support transparency and defaults to black)
|
||||
const backgroundColor = mime.endsWith("jpeg") ? "white" : undefined;
|
||||
@@ -112,21 +112,21 @@ export function createPortfolioState(editor: Editor) {
|
||||
// Fail silently if there's an error rasterizing the SVG, such as a zero-sized image
|
||||
}
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDataPanelState, async (updateDataPanelState) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateDataPanelState, async (data) => {
|
||||
update((state) => {
|
||||
state.dataPanelOpen = updateDataPanelState.open;
|
||||
state.dataPanelOpen = data.open;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePropertiesPanelState, async (updatePropertiesPanelState) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdatePropertiesPanelState, async (data) => {
|
||||
update((state) => {
|
||||
state.propertiesPanelOpen = updatePropertiesPanelState.open;
|
||||
state.propertiesPanelOpen = data.open;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelState, async (updateLayersPanelState) => {
|
||||
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelState, async (data) => {
|
||||
update((state) => {
|
||||
state.layersPanelOpen = updateLayersPanelState.open;
|
||||
state.layersPanelOpen = data.open;
|
||||
return state;
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user