Visual indication of function state (#12758)

filipeotero · web-flow · commit f0fc14e0ef93 · 2022-04-04T11:51:38.000-04:00
* Visual indication of function state

* Removing empty spaces

* removing empty space

* Hide output rectangle when not in function state;
Set the colors in xaml file;
Minor fixes;

* retrigger checks
diff --git a/src/DynamoCore/Graph/Nodes/NodeModel.cs b/src/DynamoCore/Graph/Nodes/NodeModel.cs
@@ -887,6 +887,15 @@ public bool DisplayLabels
             get { return !inPorts.All(p => p.IsConnected); }
         }
 
+        /// <summary>
+        ///     Are all the outputs of this node connected?
+        /// </summary>
+        [JsonIgnore]
+        public bool AreAllOutputsConnected
+        {
+            get { return outPorts.All(p => p.IsConnected); }
+        }
+
         /// <summary>
         ///     Returns the description from type information
         /// </summary>
diff --git a/src/DynamoCoreWpf/UI/Themes/Modern/DynamoColorsAndBrushes.xaml b/src/DynamoCoreWpf/UI/Themes/Modern/DynamoColorsAndBrushes.xaml
@@ -159,6 +159,9 @@
     <!--  Port color  -->
     <SolidColorBrush x:Key="PortKeepListStructureBackground" Color="#537E91" />
     <SolidColorBrush x:Key="PortUseLevelsCheckBoxColor" Color="#808080" />
+    <SolidColorBrush x:Key="PortValueMarkerBlue" Color="#6AC0E7" />
+    <SolidColorBrush x:Key="PortValueMarkerGrey" Color="#999999" />
+    <SolidColorBrush x:Key="PortValueMarkerRed" Color="#EB5555" />
 
     <!--  Connector  -->
     <SolidColorBrush x:Key="ConnectorHoverStateColor" Color="#808080" />
diff --git a/src/DynamoCoreWpf/UI/Themes/Modern/InPorts.xaml b/src/DynamoCoreWpf/UI/Themes/Modern/InPorts.xaml
@@ -88,7 +88,7 @@
                     Height="27px"
                     Margin="0,0,1,0"
                     HorizontalAlignment="Right"
-                    Background="{StaticResource Blue300Brush}"
+                    Background="{Binding PortValueMarkerColor, UpdateSourceTrigger=PropertyChanged}"
                     Visibility="{Binding PortDefaultValueMarkerVisible, Converter={StaticResource BooleanToVisibilityCollapsedConverter}}" />
 
             <!--  The name of this port  -->
diff --git a/src/DynamoCoreWpf/UI/Themes/Modern/OutPorts.xaml b/src/DynamoCoreWpf/UI/Themes/Modern/OutPorts.xaml
@@ -20,6 +20,7 @@
               IsHitTestVisible="True">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition Name="PortNameColumn" Width="*" />
+                <ColumnDefinition Name="ValueMarkerColumn" Width="5px" />
                 <ColumnDefinition Name="PortSnappingColumn" Width="25px" />
             </Grid.ColumnDefinitions>
 
@@ -51,8 +52,9 @@
 
             <!--  Transparent rectangle used for port snapping, overhangs the edge of the port  -->
             <Rectangle Grid.Column="0"
-                       Grid.ColumnSpan="2"
+                       x:Name="PortSnapping"
                        Margin="-25,0,0,0"
+                       Grid.ColumnSpan="7"
                        Canvas.ZIndex="1"
                        Fill="Transparent"
                        IsHitTestVisible="{Binding IsHitTestVisible}"
@@ -70,6 +72,7 @@
             <!--  Sets the port background color  -->
             <Border x:Name="PortBackgroundBorder"
                     Grid.Column="0"
+                    Grid.ColumnSpan="2"
                     SnapsToDevicePixels="True">
                 <Border.Style>
                     <Style TargetType="Border">
@@ -93,6 +96,16 @@
                 </Border.Style>
             </Border>
 
+            <!--  A small marker on the left of the port, indicating whether it's been honored  -->
+            <Rectangle x:Name="PortValueMarker"
+                       Grid.Column="1"
+                       Height="27px"
+                       VerticalAlignment="Center"
+                       Fill="{Binding PortValueMarkerColor, UpdateSourceTrigger=PropertyChanged}"
+                       IsHitTestVisible="False"
+                       Visibility="{Binding PortDefaultValueMarkerVisible, Converter={StaticResource BooleanToVisibilityCollapsedConverter}}"
+                       SnapsToDevicePixels="True" />
+       
             <!--  Grid containing the Port Name TextBox  -->
             <Grid Name="PortNameGrid"
                   Grid.Column="0"
diff --git a/src/DynamoCoreWpf/ViewModels/Core/InPortViewModel.cs b/src/DynamoCoreWpf/ViewModels/Core/InPortViewModel.cs
@@ -1,8 +1,10 @@
 ﻿using System;
+using System.Linq;
 using System.Windows;
 using System.Windows.Media;
 using Dynamo.Graph.Nodes;
 using Dynamo.Models;
+using Dynamo.UI;
 using Dynamo.UI.Commands;
 
 namespace Dynamo.ViewModels
@@ -17,10 +19,13 @@ public partial class InPortViewModel : PortViewModel
 
         private bool showUseLevelMenu;
 
-        private SolidColorBrush portValueMarkerColor = new SolidColorBrush(Color.FromArgb(255, 204, 204, 204));
+        private SolidColorBrush portValueMarkerColor;
+
         private bool portDefaultValueMarkerVisible;
-        private static SolidColorBrush PortValueMarkerBlue = new SolidColorBrush(Color.FromRgb(106, 192, 231));
-        private static SolidColorBrush PortValueMarkerRed = new SolidColorBrush(Color.FromRgb(235, 85, 85));
+
+        private SolidColorBrush PortValueMarkerBlue;
+        private SolidColorBrush PortValueMarkerRed;
+        private SolidColorBrush PortValueMarkerGrey;
 
         private static readonly SolidColorBrush PortBackgroundColorKeepListStructure = new SolidColorBrush(Color.FromRgb(83, 126, 145));
         private static readonly SolidColorBrush PortBorderBrushColorKeepListStructure = new SolidColorBrush(Color.FromRgb(168, 181, 187));
@@ -146,6 +151,13 @@ public bool PortDefaultValueMarkerVisible
         public InPortViewModel(NodeViewModel node, PortModel port) : base(node, port)
         {
             port.PropertyChanged += PortPropertyChanged;
+
+            var resourceDictionary = SharedDictionaryManager.DynamoColorsAndBrushesDictionary;
+
+            PortValueMarkerBlue = (SolidColorBrush)resourceDictionary["PortValueMarkerBlue"];
+            PortValueMarkerGrey = (SolidColorBrush)resourceDictionary["PortValueMarkerGrey"];
+            PortValueMarkerRed = (SolidColorBrush)resourceDictionary["PortValueMarkerRed"];
+
             RefreshPortDefaultValueMarkerVisible();
         }
 
@@ -156,7 +168,7 @@ public override void Dispose()
         }
 
         internal override PortViewModel CreateProxyPortViewModel(PortModel portModel)
-        {
+        {            
             portModel.IsProxyPort = true;
             return new InPortViewModel(node, portModel);
         }
@@ -269,6 +281,43 @@ private void RefreshPortDefaultValueMarkerVisible()
         /// Handles the logic for updating the PortBackgroundColor and PortBackgroundBrushColor
         /// </summary>
         protected override void RefreshPortColors()
+        {
+            //Is in function state
+            if (node.NodeModel.IsPartiallyApplied)
+            {
+                if (node.NodeModel.AreAllOutputsConnected)
+                {
+                    PortValueMarkerColor = PortValueMarkerGrey;
+                    PortBackgroundColor = PortBackgroundColorDefault;
+                    PortBorderBrushColor = PortBorderBrushColorDefault;
+                }
+                else
+                {
+                    SetupDefaultPortColorValues();
+                }
+            }
+            else
+            {
+                SetupDefaultPortColorValues();
+            }
+        }
+
+        internal void RefreshInputPortsByOutputConnectionChanged(bool isOutputConnected)
+        {
+            if (node.NodeModel.IsPartiallyApplied)
+            {
+                if (isOutputConnected)
+                {
+                    PortValueMarkerColor = PortValueMarkerGrey;
+                }
+                else 
+                {
+                    SetupDefaultPortColorValues();
+                }
+            }
+        }
+
+        private void SetupDefaultPortColorValues()
         {
             // Special case for keeping list structure visual appearance
             if (port.UseLevels && port.KeepListStructure && port.IsConnected)
diff --git a/src/DynamoCoreWpf/ViewModels/Core/OutPortViewModel.cs b/src/DynamoCoreWpf/ViewModels/Core/OutPortViewModel.cs
@@ -1,7 +1,10 @@
-﻿using System.Linq;
+﻿using System.ComponentModel;
+using System.Linq;
 using System.Windows;
+using System.Windows.Media;
 using Dynamo.Graph.Nodes;
 using Dynamo.Logging;
+using Dynamo.UI;
 using Dynamo.UI.Commands;
 
 namespace Dynamo.ViewModels
@@ -14,10 +17,16 @@ public partial class OutPortViewModel : PortViewModel
         private DelegateCommand hideConnectionsCommand;
         private DelegateCommand portMouseLeftButtonOnContextCommand;
 
+        private SolidColorBrush portValueMarkerColor;
+
+        private SolidColorBrush PortValueMarkerBlue;
+        private SolidColorBrush PortValueMarkerGrey;
+
         private bool showContextMenu;
         private bool areConnectorsHidden;
         private string showHideWiresButtonContent = "";
         private bool hideWiresButtonEnabled;
+        private bool portDefaultValueMarkerVisible;
 
         /// <summary>
         /// Sets the condensed styling on Code Block output ports.
@@ -97,6 +106,31 @@ public bool HideWiresButtonEnabled
             }
         }
 
+        /// <summary>
+        /// Sets the color of the small rectangular marker on each input port.
+        /// </summary>
+        public SolidColorBrush PortValueMarkerColor
+        {
+            get => portValueMarkerColor;
+            set
+            {
+                portValueMarkerColor = value;
+                RaisePropertyChanged(nameof(PortValueMarkerColor));
+            }
+        }
+
+
+        public bool PortDefaultValueMarkerVisible 
+        {
+            get => portDefaultValueMarkerVisible;
+            set
+            {
+                portDefaultValueMarkerVisible = value;
+                RaisePropertyChanged(nameof(PortDefaultValueMarkerVisible));
+            }
+        }
+
+
         /// <summary>
         /// Takes care of the multiple UI concerns when dealing with the Unhide/Hide Wires button
         /// on the output port's context menu.
@@ -117,9 +151,44 @@ internal void RefreshHideWiresState()
 
         public OutPortViewModel(NodeViewModel node, PortModel port) :base(node, port)
         {
+            port.PropertyChanged += PortPropertyChanged;
+
+            var resourceDictionary = SharedDictionaryManager.DynamoColorsAndBrushesDictionary;
+            
+            PortValueMarkerBlue = (SolidColorBrush)resourceDictionary["PortValueMarkerBlue"];
+            PortValueMarkerGrey = (SolidColorBrush)resourceDictionary["PortValueMarkerGrey"];
+
             RefreshHideWiresState();
         }
 
+        public override void Dispose()
+        {
+            port.PropertyChanged -= PortPropertyChanged;
+            base.Dispose();
+        }
+
+        private void PortPropertyChanged(object sender, PropertyChangedEventArgs e)
+        {
+            switch (e.PropertyName)
+            {
+                case nameof(UsingDefaultValue):
+                    RefreshPortColors();
+                    break;
+                case nameof(IsConnected):
+                    RefreshInputPorts();
+                    break;
+            }
+        }
+
+        private void RefreshInputPorts()
+        {
+            foreach (var portViewModel in node.InPorts)
+            {
+                var inPort = (InPortViewModel)portViewModel;
+                inPort.RefreshInputPortsByOutputConnectionChanged(port.IsConnected);
+            }
+        }
+
         internal override PortViewModel CreateProxyPortViewModel(PortModel portModel)
         {
             portModel.IsProxyPort = true;
@@ -224,9 +293,23 @@ public DelegateCommand MouseLeftButtonDownOnContextCommand
             }
         }
 
+
         private void OnMouseLeftButtonDownOnContext(object parameter)
         {
             ShowContextMenu = true;
         }
+
+        protected override void RefreshPortColors()
+        {            
+            if (node.NodeModel.IsPartiallyApplied)
+            {
+                PortDefaultValueMarkerVisible = true;
+                portValueMarkerColor = PortValueMarkerGrey;
+            }
+            else
+            {
+                PortDefaultValueMarkerVisible = false;
+            }
+        }
     }
 }
diff --git a/src/DynamoCoreWpf/ViewModels/Core/PortViewModel.cs b/src/DynamoCoreWpf/ViewModels/Core/PortViewModel.cs
@@ -379,6 +379,7 @@ private void WorkspacePropertyChanged(object sender, System.ComponentModel.Prope
             {
                 case "ActiveConnector":
                     RaisePropertyChanged(nameof(IsHitTestVisible));
+                    RefreshPortColors();
                     break;
                 default:
                     break;
@@ -394,6 +395,7 @@ private void NodePropertyChanged(object sender, System.ComponentModel.PropertyCh
                     break;
                 case nameof(State):
                     RaisePropertyChanged(nameof(State));
+                    RefreshPortColors();
                     break;
                 case nameof(ToolTipContent):
                     RaisePropertyChanged(nameof(ToolTipContent));
