Skip to content

Commit 3e76acd

Browse files
adamgerhantadamgerhant
committed
Improve context menu data
1 parent cc0b5cd commit 3e76acd

File tree

5 files changed

+26
-49
lines changed

5 files changed

+26
-49
lines changed

‎editor/src/messages/frontend/frontend_message.rs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ use super::utility_types::{DocumentDetails, MouseCursorIcon, OpenDocument};
22
use crate::messages::app_window::app_window_message_handler::AppWindowPlatform;
33
use crate::messages::layout::utility_types::widget_prelude::*;
44
use crate::messages::portfolio::document::node_graph::utility_types::{
5-
BoxSelection, ContextMenuInformation, FrontendClickTargets, FrontendGraphInput, FrontendGraphOutput, FrontendNode, FrontendNodeType, NodeGraphError, Transform
5+
BoxSelection, ContextMenuInformation, FrontendClickTargets, FrontendGraphInput, FrontendGraphOutput, FrontendNode, FrontendNodeType, NodeGraphError, Transform,
66
};
77
use crate::messages::portfolio::document::utility_types::nodes::{JsRawBuffer, LayerPanelEntry, RawBuffer};
88
use crate::messages::portfolio::document::utility_types::wires::{WirePath, WirePathUpdate};

‎editor/src/messages/portfolio/document/node_graph/node_graph_message_handler.rs‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -776,8 +776,13 @@ impl<'a> MessageHandler<NodeGraphMessage, NodeGraphMessageContext<'a>> for NodeG
776776
}
777777

778778
let context_menu_data = if let Some(node_id) = clicked_id {
779-
let currently_is_node = !network_interface.is_layer(&node_id, selection_network_path);
780-
ContextMenuData::ToggleLayer { node_id, currently_is_node }
779+
let currently_is_node = !network_interface.is_layer(&node_id, breadcrumb_network_path);
780+
let can_be_layer = network_interface.is_eligible_to_be_layer(&node_id, breadcrumb_network_path);
781+
ContextMenuData::ModifyNode {
782+
can_be_layer,
783+
currently_is_node,
784+
node_id,
785+
}
781786
} else {
782787
ContextMenuData::CreateNode { compatible_type: None }
783788
};
@@ -2592,18 +2597,18 @@ impl NodeGraphMessageHandler {
25922597
}
25932598

25942599
fn node_graph_error(&self, network_interface: &mut NodeNetworkInterface, breadcrumb_network_path: &[NodeId]) -> Option<NodeGraphError> {
2595-
let error = network_interface
2600+
let graph_error = network_interface
25962601
.resolved_types
25972602
.node_graph_errors
25982603
.iter()
25992604
.filter(|error| error.node_path.starts_with(breadcrumb_network_path) && error.node_path.len() > breadcrumb_network_path.len())
26002605
.next()?;
2601-
let error_node = error.node_path[breadcrumb_network_path.len()];
2602-
let error = if error.node_path.len() == breadcrumb_network_path.len() + 1 {
2603-
format!("{:?}", error.error)
2606+
let error = if graph_error.node_path.len() == breadcrumb_network_path.len() + 1 {
2607+
format!("{:?}", graph_error.error)
26042608
} else {
26052609
"Node graph type error within this node".to_string()
26062610
};
2611+
let error_node = graph_error.node_path[breadcrumb_network_path.len()];
26072612
let mut position = network_interface.position(&error_node, breadcrumb_network_path)?;
26082613
// Convert to graph space
26092614
position *= 24;

‎editor/src/messages/portfolio/document/node_graph/utility_types.rs‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -153,16 +153,18 @@ pub struct BoxSelection {
153153
}
154154

155155
#[derive(Clone, Debug, PartialEq, serde::Serialize, serde::Deserialize, specta::Type)]
156+
#[serde(tag = "type", content = "data")]
156157
pub enum ContextMenuData {
157-
ToggleLayer {
158-
#[serde(rename = "nodeId")]
159-
node_id: NodeId,
158+
ModifyNode {
159+
#[serde(rename = "canBeLayer")]
160+
can_be_layer: bool,
160161
#[serde(rename = "currentlyIsNode")]
161162
currently_is_node: bool,
163+
#[serde(rename = "nodeId")]
164+
node_id: NodeId,
162165
},
163166
CreateNode {
164167
#[serde(rename = "compatibleType")]
165-
#[serde(default)]
166168
compatible_type: Option<String>,
167169
},
168170
}

‎frontend/src/components/views/Graph.svelte‎

Lines changed: 7 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,6 @@
2727
2828
let graph: HTMLDivElement | undefined;
2929
30-
// Key value is node id + input/output index
31-
// Imports/Export are stored at a key value of 0
32-
3330
$: gridSpacing = calculateGridSpacing($nodeGraph.transform.scale);
3431
$: gridDotRadius = 1 + Math.floor($nodeGraph.transform.scale - 0.5 + 0.001) / 2;
3532
@@ -115,15 +112,6 @@
115112
return iconMap[icon] || "NodeNodes";
116113
}
117114
118-
function toggleLayerDisplay(displayAsLayer: boolean, toggleId: bigint) {
119-
let node = $nodeGraph.nodes.get(toggleId);
120-
if (node) editor.handle.setToNodeOrLayer(node.id, displayAsLayer);
121-
}
122-
123-
function canBeToggledBetweenNodeAndLayer(toggleDisplayAsLayerNodeId: bigint) {
124-
return $nodeGraph.nodes.get(toggleDisplayAsLayerNodeId)?.canBeLayer || false;
125-
}
126-
127115
function createNode(nodeType: string) {
128116
if ($nodeGraph.contextMenuInformation === undefined) return;
129117
@@ -224,29 +212,26 @@
224212
top: `${$nodeGraph.contextMenuInformation.contextMenuCoordinates.y * $nodeGraph.transform.scale + $nodeGraph.transform.y}px`,
225213
}}
226214
>
227-
{#if typeof $nodeGraph.contextMenuInformation.contextMenuData === "string" && $nodeGraph.contextMenuInformation.contextMenuData === "CreateNode"}
228-
<NodeCatalog on:selectNodeType={(e) => createNode(e.detail)} />
229-
{:else if $nodeGraph.contextMenuInformation.contextMenuData && "compatibleType" in $nodeGraph.contextMenuInformation.contextMenuData}
230-
<NodeCatalog initialSearchTerm={$nodeGraph.contextMenuInformation.contextMenuData.compatibleType || ""} on:selectNodeType={(e) => createNode(e.detail)} />
231-
{:else}
232-
{@const contextMenuData = $nodeGraph.contextMenuInformation.contextMenuData}
215+
{#if $nodeGraph.contextMenuInformation.contextMenuData.type == "CreateNode"}
216+
<NodeCatalog initialSearchTerm={$nodeGraph.contextMenuInformation.contextMenuData.data.compatibleType || ""} on:selectNodeType={(e) => createNode(e.detail)} />
217+
{:else if $nodeGraph.contextMenuInformation.contextMenuData.type == "ModifyNode"}
233218
<LayoutRow class="toggle-layer-or-node">
234219
<TextLabel>Display as</TextLabel>
235220
<RadioInput
236-
selectedIndex={contextMenuData.currentlyIsNode ? 0 : 1}
221+
selectedIndex={$nodeGraph.contextMenuInformation.contextMenuData.data.currentlyIsNode ? 0 : 1}
237222
entries={[
238223
{
239224
value: "node",
240225
label: "Node",
241-
action: () => toggleLayerDisplay(false, contextMenuData.nodeId),
226+
action: () => editor.handle.setToNodeOrLayer($nodeGraph.contextMenuInformation.contextMenuData.data.nodeId, false),
242227
},
243228
{
244229
value: "layer",
245230
label: "Layer",
246-
action: () => toggleLayerDisplay(true, contextMenuData.nodeId),
231+
action: () => editor.handle.setToNodeOrLayer($nodeGraph.contextMenuInformation.contextMenuData.data.nodeId, true),
247232
},
248233
]}
249-
disabled={!canBeToggledBetweenNodeAndLayer(contextMenuData.nodeId)}
234+
disabled={!$nodeGraph.contextMenuInformation.contextMenuData.data.canBeLayer}
250235
/>
251236
</LayoutRow>
252237
<Separator type="Section" direction="Vertical" />
@@ -264,15 +249,13 @@
264249
style={`left: ${$nodeGraph.error.position.x}px;
265250
top: ${$nodeGraph.error.position.y}px;`}
266251
transition:fade={FADE_TRANSITION}
267-
title=""
268252
data-node-error>{$nodeGraph.error.error}</span
269253
>
270254
<span
271255
class="node-error hover"
272256
style={`left: ${$nodeGraph.error.position.x}px;
273257
top: ${$nodeGraph.error.position.y}px;`}
274258
transition:fade={FADE_TRANSITION}
275-
title=""
276259
data-node-error>{$nodeGraph.error.error}</span
277260
>
278261
</div>

‎frontend/src/messages.ts‎

Lines changed: 1 addition & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -33,20 +33,7 @@ export class UpdateClickTargets extends JsMessage {
3333
readonly clickTargets!: FrontendClickTargets | undefined;
3434
}
3535

36-
const ContextTupleToVec2 = Transform((data) => {
37-
if (data.obj.contextMenuInformation === undefined) return undefined;
38-
const contextMenuCoordinates = data.obj.contextMenuInformation.contextMenuCoordinates;
39-
let contextMenuData = data.obj.contextMenuInformation.contextMenuData;
40-
if (contextMenuData.ToggleLayer !== undefined) {
41-
contextMenuData = { nodeId: contextMenuData.ToggleLayer.nodeId, currentlyIsNode: contextMenuData.ToggleLayer.currentlyIsNode };
42-
} else if (contextMenuData.CreateNode !== undefined) {
43-
contextMenuData = { type: "CreateNode", compatibleType: contextMenuData.CreateNode.compatibleType };
44-
}
45-
return { contextMenuCoordinates, contextMenuData };
46-
});
47-
4836
export class UpdateContextMenuInformation extends JsMessage {
49-
@ContextTupleToVec2
5037
readonly contextMenuInformation!: ContextMenuInformation | undefined;
5138
}
5239

@@ -182,7 +169,7 @@ export type FrontendClickTargets = {
182169

183170
export type ContextMenuInformation = {
184171
contextMenuCoordinates: XY;
185-
contextMenuData: "CreateNode" | { type: "CreateNode"; compatibleType: string } | { nodeId: bigint; currentlyIsNode: boolean };
172+
contextMenuData: { type: "CreateNode"; data: { compatibleType: string | undefined } } | { type: "ModifyNode"; data: { canBeLayer: boolean; currentlyIsNode: boolean; nodeId: bigint } };
186173
};
187174

188175
export type FrontendGraphDataType = "General" | "Number" | "Artboard" | "Graphic" | "Raster" | "Vector" | "Color" | "Invalid";

0 commit comments

Comments
 (0)