Add a basic API and rudimentary frontend for node graph layers (#846)

* Node graph API stub * Rename and fix SetInputValue * Get list of links from network * Test populating node graph UI * Node properties * Fix viewport bounds * Slightly change promise usage * A tiny bit of cleanup I did while reading code * Cleanup and work towards hooking up node links in Vue template * Add the brighten colour node * Run cargo fmt * Add to and from hsla * GrayscaleImage node with small perf improvement * Fix gutter panel resizing * Display node links from backend * Add support for connecting node links * Use existing message * Fix formatting error * Add a (currently crashing) brighten node * Replace brighten node with proto node implementation * Add support for connecting node links * Update watch dirs * Add hue shift node * Add create_node function to editor api * Basic insert node UI * Fix broken names * Add log * Fix positioning * Set connector index to 0 * Add properties for Heu shift / brighten * Allow deselecting nodes * Redesign Properties panel collapsible sections Co-authored-by: Keavon Chambers <keavon@keavon.com> Co-authored-by: Dennis Kobert <dennis@kobert.dev>
GraphiteEditor · Nov 12, 2022 · d9177f5 · d9177f5
1 parent d75f0aa
commit d9177f5
Show file tree

Hide file tree

Showing 37 changed files with 1,212 additions and 293 deletions.
diff --git a/Cargo.lock b/Cargo.lock
diff --git a/editor/src/consts.rs b/editor/src/consts.rs
@@ -1,7 +1,7 @@
 use graphene::color::Color;
 
 // Viewport
-pub const VIEWPORT_ZOOM_WHEEL_RATE: f64 = 1. / 600.;
+pub const VIEWPORT_ZOOM_WHEEL_RATE: f64 = (1. / 600.) * 3.;
 pub const VIEWPORT_ZOOM_MOUSE_RATE: f64 = 1. / 400.;
 pub const VIEWPORT_ZOOM_SCALE_MIN: f64 = 0.000_000_1;
 pub const VIEWPORT_ZOOM_SCALE_MAX: f64 = 10_000.;

diff --git a/editor/src/messages/frontend/frontend_message.rs b/editor/src/messages/frontend/frontend_message.rs
@@ -2,6 +2,7 @@ use super::utility_types::{FrontendDocumentDetails, FrontendImageData, MouseCurs
 use crate::messages::layout::utility_types::layout_widget::SubLayout;
 use crate::messages::layout::utility_types::misc::LayoutTarget;
 use crate::messages::layout::utility_types::widgets::menu_widgets::MenuBarEntry;
+use crate::messages::portfolio::document::node_graph::{FrontendNode, FrontendNodeLink, FrontendNodeType};
 use crate::messages::portfolio::document::utility_types::layer_panel::{LayerPanelEntry, RawBuffer};
 use crate::messages::prelude::*;
 use crate::messages::tool::utility_types::HintData;
@@ -198,9 +199,17 @@ pub enum FrontendMessage {
 	UpdateMouseCursor {
 		cursor: MouseCursorIcon,
 	},
+	UpdateNodeGraph {
+		nodes: Vec<FrontendNode>,
+		links: Vec<FrontendNodeLink>,
+	},
 	UpdateNodeGraphVisibility {
 		visible: bool,
 	},
+	UpdateNodeTypes {
+		#[serde(rename = "nodeTypes")]
+		node_types: Vec<FrontendNodeType>,
+	},
 	UpdateOpenDocumentsList {
 		#[serde(rename = "openDocuments")]
 		open_documents: Vec<FrontendDocumentDetails>,

diff --git a/editor/src/messages/portfolio/document/document_message.rs b/editor/src/messages/portfolio/document/document_message.rs
@@ -32,6 +32,9 @@ pub enum DocumentMessage {
 	#[remain::unsorted]
 	#[child]
 	PropertiesPanel(PropertiesPanelMessage),
+	#[remain::unsorted]
+	#[child]
+	NodeGraph(NodeGraphMessage),
 
 	// Messages
 	AbortTransaction,

diff --git a/editor/src/messages/portfolio/document/document_message_handler.rs b/editor/src/messages/portfolio/document/document_message_handler.rs
@@ -64,6 +64,8 @@ pub struct DocumentMessageHandler {
 	#[serde(skip)]
 	transform_layer_handler: TransformLayerMessageHandler,
 	properties_panel_message_handler: PropertiesPanelMessageHandler,
+	#[serde(skip)]
+	node_graph_handler: NodeGraphMessageHandler,
 }
 
 impl Default for DocumentMessageHandler {
@@ -91,6 +93,7 @@ impl Default for DocumentMessageHandler {
 			artboard_message_handler: ArtboardMessageHandler::default(),
 			transform_layer_handler: TransformLayerMessageHandler::default(),
 			properties_panel_message_handler: PropertiesPanelMessageHandler::default(),
+			node_graph_handler: Default::default(),
 		}
 	}
 }
@@ -165,10 +168,15 @@ impl MessageHandler<DocumentMessage, (u64, &InputPreprocessorMessageHandler, &Pe
 					artwork_document: &self.graphene_document,
 					artboard_document: &self.artboard_message_handler.artboards_graphene_document,
 					selected_layers: &mut self.layer_metadata.iter().filter_map(|(path, data)| data.selected.then_some(path.as_slice())),
+					node_graph_message_handler: &self.node_graph_handler,
 				};
 				self.properties_panel_message_handler
 					.process_message(message, (persistent_data, properties_panel_message_handler_data), responses);
 			}
+			#[remain::unsorted]
+			NodeGraph(message) => {
+				self.node_graph_handler.process_message(message, (&mut self.graphene_document, ipp), responses);
+			}
 
 			// Messages
 			AbortTransaction => {

diff --git a/editor/src/messages/portfolio/document/mod.rs b/editor/src/messages/portfolio/document/mod.rs
@@ -3,6 +3,7 @@ mod document_message_handler;
 
 pub mod artboard;
 pub mod navigation;
+pub mod node_graph;
 pub mod overlays;
 pub mod properties_panel;
 pub mod transform_layer;

diff --git a/editor/src/messages/portfolio/document/node_graph/mod.rs b/editor/src/messages/portfolio/document/node_graph/mod.rs
@@ -0,0 +1,7 @@
+mod node_graph_message;
+mod node_graph_message_handler;
+
+#[doc(inline)]
+pub use node_graph_message::{NodeGraphMessage, NodeGraphMessageDiscriminant};
+#[doc(inline)]
+pub use node_graph_message_handler::*;
diff --git a/editor/src/messages/portfolio/document/node_graph/node_graph_message.rs b/editor/src/messages/portfolio/document/node_graph/node_graph_message.rs
@@ -0,0 +1,44 @@
+use crate::messages::prelude::*;
+use graph_craft::document::{value::TaggedValue, NodeId};
+use graph_craft::proto::NodeIdentifier;
+
+#[remain::sorted]
+#[impl_message(Message, DocumentMessage, NodeGraph)]
+#[derive(PartialEq, Clone, Debug, serde::Serialize, serde::Deserialize)]
+pub enum NodeGraphMessage {
+	// Messages
+	AddLink {
+		from: NodeId,
+		to: NodeId,
+		to_index: usize,
+	},
+	CloseNodeGraph,
+	ConnectNodesByLink {
+		output_node: u64,
+		input_node: u64,
+		input_node_connector_index: u32,
+	},
+	CreateNode {
+		// Having the caller generate the id means that we don't have to return it. This can be a random u64.
+		node_id: NodeId,
+		// I don't really know what this is for (perhaps a user identifiable name).
+		name: String,
+		// The node identifier must mach that found in `node-graph/graph-craft/src/node_registry.rs` e.g. "graphene_core::raster::GrayscaleNode
+		identifier: NodeIdentifier,
+		num_inputs: u32,
+	},
+	DeleteNode {
+		node_id: NodeId,
+	},
+	OpenNodeGraph {
+		layer_path: Vec<graphene::LayerId>,
+	},
+	SelectNodes {
+		nodes: Vec<NodeId>,
+	},
+	SetInputValue {
+		node: NodeId,
+		input_index: usize,
+		value: TaggedValue,
+	},
+}