Move node visibility flag from NodeNetwork to DocumentNode (#1708)

* protonode -> proto node

* Move node visibility flag from NodeNetwork to DocumentNode

* Add serde default for new field

* Logic improvements
This commit is contained in:
Keavon Chambers 2024-03-27 05:17:08 -07:00 committed by GitHub
parent d3e3e19822
commit 27f9e3f00e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
27 changed files with 161 additions and 140 deletions

View file

@ -50,7 +50,7 @@ module.exports = {
camelcase: ["error", { properties: "always" }],
"linebreak-style": ["error", "unix"],
"eol-last": ["error", "always"],
"max-len": ["error", { code: 200, tabWidth: 4 }],
"max-len": ["error", { code: 200, tabWidth: 4, ignorePattern: `d="([\\s\\S]*?)"` }],
"prefer-destructuring": "off",
"no-console": "warn",
"no-debugger": "warn",
@ -81,6 +81,8 @@ module.exports = {
// Import plugin config (for intelligently validating module import statements)
"import/no-unresolved": "error",
// `no-duplicates` disabled due to <https://github.com/import-js/eslint-plugin-import/issues/1479#issuecomment-1789527447>. Reenable if that issue gets fixed.
"import/no-duplicates": "off",
"import/prefer-default-export": "off",
"import/no-relative-packages": "error",
"import/order": [

View file

@ -417,8 +417,8 @@
class={"visibility"}
action={(e) => (toggleLayerVisibility(listing.entry.id), e?.stopPropagation())}
size={24}
icon={listing.entry.disabled ? "EyeHidden" : "EyeVisible"}
tooltip={listing.entry.disabled ? "Disabled" : "Enabled"}
icon={listing.entry.visible ? "EyeVisible" : "EyeHidden"}
tooltip={listing.entry.visible ? "Visible" : "Hidden"}
/>
</LayoutRow>
{/each}

View file

@ -795,7 +795,7 @@
class="layer"
class:selected={showSelected($nodeGraph.selected, boxSelection, node.id, nodeIndex)}
class:previewed={node.previewed}
class:disabled={node.disabled}
class:disabled={!node.visible}
style:--offset-left={(node.position?.x || 0) + ($nodeGraph.selected.includes(node.id) ? draggingNodes?.roundX || 0 : 0)}
style:--offset-top={(node.position?.y || 0) + ($nodeGraph.selected.includes(node.id) ? draggingNodes?.roundY || 0 : 0)}
style:--clip-path-id={`url(#${clipPathId})`}
@ -891,8 +891,8 @@
class={"visibility"}
action={(e) => (toggleLayerVisibility(node.id), e?.stopPropagation())}
size={24}
icon={node.disabled ? "EyeHidden" : "EyeVisible"}
tooltip={node.disabled ? "Disabled" : "Enabled"}
icon={node.visible ? "EyeVisible" : "EyeHidden"}
tooltip={node.visible ? "Visible" : "Hidden"}
/>
<svg class="border-mask" width="0" height="0">
@ -913,7 +913,7 @@
class="node"
class:selected={showSelected($nodeGraph.selected, boxSelection, node.id, nodeIndex)}
class:previewed={node.previewed}
class:disabled={node.disabled}
class:disabled={!node.visible}
style:--offset-left={(node.position?.x || 0) + ($nodeGraph.selected.includes(node.id) ? draggingNodes?.roundX || 0 : 0)}
style:--offset-top={(node.position?.y || 0) + ($nodeGraph.selected.includes(node.id) ? draggingNodes?.roundY || 0 : 0)}
style:--clip-path-id={`url(#${clipPathId})`}

View file

@ -124,7 +124,7 @@ export class FrontendNode {
readonly previewed!: boolean;
readonly disabled!: boolean;
readonly visible!: boolean;
readonly errors!: string | undefined;
}
@ -613,7 +613,7 @@ export class LayerPanelEntry {
expanded!: boolean;
disabled!: boolean;
visible!: boolean;
parentId!: bigint | undefined;

View file

@ -757,8 +757,8 @@ impl JsEditorHandle {
/// Toggle visibility of a layer from the layer list
#[wasm_bindgen(js_name = toggleLayerVisibility)]
pub fn toggle_layer_visibility(&self, id: u64) {
let id = NodeId(id);
let message = NodeGraphMessage::ToggleHidden { node_id: id };
let node_id = NodeId(id);
let message = NodeGraphMessage::ToggleVisibility { node_id };
self.dispatch(message);
}