958918: Added new ugs

ej2-asp-core-mvc/code-snippet/diagram/container/basiccontainer/Container.cs

@@ -0,0 +1,102 @@
+using System;
+using System.Collections.Generic;
+using System.Web.Mvc;
+using Syncfusion.EJ2.Diagrams;
+
+namespace EJ2MVCSampleBrowser.Controllers.Diagram
+{
+    public partial class DiagramController : Controller
+    {
+        // GET: Nodes
+        public ActionResult Nodes()
+        {
+            List<DiagramNode> nodes = new List<DiagramNode>();
+            List<DiagramNodeAnnotation> Node1Annots = new List<DiagramNodeAnnotation>();
+            Node1Annots.Add(new DiagramNodeAnnotation()
+            {
+                Content = "Node 1",
+            });
+            nodes.Add(new Node()
+            {
+                Id = "node1",
+                Width = 100,
+                Height = 100,
+                text = "node1",
+                Margin = new DiagramMargin()
+                {
+                    Left = 50,
+                    Top = 30
+                },
+                Shape = new DiagramShapeStyle()
+                {
+                    Type = "Basic",
+                    Shape = "Rectangle",
+                    CornerRadius = 4
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "white",
+                    StrokeColor = "#2546BB",
+                    StrokeWidth = 1
+                },
+                Annotations = Node1Annots
+            });
+            List<DiagramNodeAnnotation> Node2Annots = new List<DiagramNodeAnnotation>();
+            Node2Annots.Add(new DiagramNodeAnnotation()
+            {
+                Content = "Node 2",
+            });
+            nodes.Add(new Node()
+            {
+                Id = "node2",
+                Width = 100,
+                Height = 100,
+                text = "node2",
+                Margin = new DiagramMargin()
+                {
+                    Left = 200,
+                    Top = 130
+                },
+                Shape = new DiagramShapeStyle()
+                {
+                    Type = "Basic",
+                    Shape = "Rectangle",
+                    CornerRadius = 4
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "white",
+                    StrokeColor = "#2546BB",
+                    StrokeWidth = 1
+                },
+                Annotations = Node2Annots
+            });
+            // Container Node
+            nodes.Add(new Node()
+            {
+                Id = "container",
+                Width = 350,
+                Height = 280,
+                OffsetX = 250,
+                OffsetY = 250,
+                Shape = new DiagramShapeStyle()
+                {
+                    Type = "Container",
+                    Children = ["node1", "node2"]
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "#E9EEFF",
+                    StrokeColor = "#2546BB",
+                    StrokeWidth = 1
+                },
+            });
+            ViewData.nodes = nodes;
+            return View();
+        }
+    }
+    public class Node : DiagramNode
+    {
+        public string text;
+    }
+}

ej2-asp-core-mvc/code-snippet/diagram/container/basiccontainer/razor

@@ -0,0 +1,6 @@
+@Syncfusion.EJ2.Diagrams;
+
+@(Html.EJS().Diagram("container").Width("100%").Height("500px")
+    .Nodes((List<DiagramNode>)ViewData["nodes"])
+    .Render()
+)

ej2-asp-core-mvc/code-snippet/diagram/container/basiccontainer/tagHelper

@@ -0,0 +1,2 @@
+<ejs-diagram id="container" width="100%" height="500px" nodes="@ViewData.nodes">
+</ejs-diagram>

ej2-asp-core-mvc/code-snippet/diagram/container/containerheader/Container.cs

@@ -0,0 +1,108 @@
+using System;
+using System.Collections.Generic;
+using System.Web.Mvc;
+using Syncfusion.EJ2.Diagrams;
+
+namespace EJ2MVCSampleBrowser.Controllers.Diagram
+{
+    public partial class DiagramController : Controller
+    {
+        // GET: Nodes
+        public ActionResult Nodes()
+        {
+            List<DiagramNode> nodes = new List<DiagramNode>();
+            List<DiagramNodeAnnotation> Node1Annots = new List<DiagramNodeAnnotation>();
+            Node1Annots.Add(new DiagramNodeAnnotation()
+            {
+                Content = "Node 1",
+                Style = new DiagramTextStyle() { Color = "white", FontFamily = "Arial" }
+            });
+            nodes.Add(new Node()
+            {
+                Id = "node1",
+                Width = 100,
+                Height = 100,
+                text = "node1",
+                Margin = new DiagramMargin()
+                {
+                    Left = 50,
+                    Top = 30
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "#357BD2",
+                    StrokeColor = "white"
+                },
+                Annotations = Node1Annots
+            });
+            List<DiagramNodeAnnotation> Node2Annots = new List<DiagramNodeAnnotation>();
+            Node2Annots.Add(new DiagramNodeAnnotation()
+            {
+                Content = "Node 2",
+                Style = new DiagramTextStyle() { Color = "white", FontFamily = "Arial" }
+            });
+            nodes.Add(new Node()
+            {
+                Id = "node2",
+                Width = 100,
+                Height = 100,
+                text = "node1",
+                Margin = new DiagramMargin()
+                {
+                    Left = 200,
+                    Top = 130
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "357BD2",
+                    StrokeColor = "white"
+                },
+                Annotations = Node2Annots
+            });
+            // Container Node
+            nodes.Add(new Node()
+            {
+                Id = "container",
+                Width = 350,
+                Height = 300,
+                OffsetX = 250,
+                OffsetY = 250,
+                Shape = new DiagramShapeStyle()
+                {
+                    Type = "Container",
+                    Header = new DiagramHeader()
+                    {
+                        Annotation = new DiagramNodeAnnotation()
+                        {
+                            Content = "Container Title",
+                            Style = new DiagramTextStyle()
+                            {
+                                FontSize = 18,
+                                Bold = true,
+                                Color = "white",
+                            }
+                        },
+                        Style = new DiagramTextStyle()
+                        {
+                            Fill = "#3c63ac",
+                            StrokeColor = "30518f"
+                        }
+                    },
+                    Children = ["node1", "node2"],
+                },
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "white",
+                    StrokeColor = "#30518f",
+                    StrokeDashArray = "4 4"
+                },
+            });
+            ViewData.nodes = nodes;
+            return View();
+        }
+    }
+    public class Node : DiagramNode
+    {
+        public string text;
+    }
+}

ej2-asp-core-mvc/code-snippet/diagram/container/containerheader/razor

@@ -0,0 +1,6 @@
+@Syncfusion.EJ2.Diagrams;
+
+@(Html.EJS().Diagram("container").Width("100%").Height("500px")
+    .Nodes((List<DiagramNode>)ViewData["nodes"])
+    .Render()
+)

ej2-asp-core-mvc/code-snippet/diagram/container/containerheader/tagHelper

@@ -0,0 +1,2 @@
+<ejs-diagram id="container" width="100%" height="500px" nodes="@ViewData.nodes">
+</ejs-diagram>

ej2-asp-core-mvc/code-snippet/diagram/ports/automaticPort/AutoPort.cs

@@ -0,0 +1,49 @@
+using System;
+using System.Collections.Generic;
+using System.Web.Mvc;
+using Syncfusion.EJ2.Diagrams;
+
+namespace EJ2MVCSampleBrowser.Controllers.Diagram
+{
+    public partial class DiagramController : Controller
+    {
+        public ActionResult AutoPort()
+        {
+            List<DiagramNode> nodes = new List<DiagramNode>();
+            nodes.Add(new Node()
+            {
+                Id = "node1",
+                Width = 100,
+                Height = 100,
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "cornflowerblue",
+                },
+                text = "node1",
+                OffsetX = 150,
+                OffsetY = 200,
+                Constraints = NodeConstraints.Default & ~(NodeConstraints.InConnect | NodeConstraints.OutConnect)
+            });
+            nodes.Add(new Node()
+            {
+                Id = "node2",
+                Width = 100,
+                Height = 100,
+                Style = new NodeStyleNodes()
+                {
+                    Fill = "cornflowerblue",
+                },
+                text = "node2",
+                OffsetX = 400,
+                OffsetY = 200,
+                Constraints = NodeConstraints.Default & ~(NodeConstraints.InConnect | NodeConstraints.OutConnect)
+            });
+            ViewData.nodes = nodes;
+            return View();
+        }
+    }
+    public class Node : DiagramNode
+    {
+        public string text;
+    }
+}

ej2-asp-core-mvc/code-snippet/diagram/ports/automaticPort/razor

@@ -0,0 +1,7 @@
+@Syncfusion.EJ2.Diagrams;
+
+@(Html.EJS().Diagram("container").Width("100%").Height("500px")
+    .SnapSettings(s => s.Constraints(SnapConstraints.None))
+    .Nodes((List<DiagramNode>)ViewData["nodes"])
+    .Constraints(DiagramConstraints.Default | DiagramConstraints.AutomaticPortCreation).Render()
+)

ej2-asp-core-mvc/code-snippet/diagram/ports/automaticPort/tagHelper

@@ -0,0 +1,4 @@
+<ejs-diagram id="container" width="100%" height="500px" nodes="@ViewData.nodes"
+    constraints="AutomaticPortCreation,Default">
+    <e-diagram-snapsettings constraints="None"></e-diagram-snapsettings>
+</ejs-diagram>

ej2-asp-core-mvc/code-snippet/diagram/umlsequencediagram/activations/razor

@@ -0,0 +1,7 @@
+@Syncfusion.EJ2.Diagrams;
+
+@(Html.EJS().Diagram("container").Width("100%").Height("600px")
+    .SnapSettings(s => s.Constraints(SnapConstraints.None))
+    .Model((DiagramModel)ViewData["model"])
+    .Render()
+)

ej2-asp-core-mvc/code-snippet/diagram/umlsequencediagram/activations/tagHelper

@@ -0,0 +1,3 @@
+<ejs-diagram id="container" width="100%" height="600px" model="@ViewData.model">
+    <e-diagram-snapsettings constraints="None"></e-diagram-snapsettings>
+</ejs-diagram>

ej2-asp-core-mvc/code-snippet/diagram/umlsequencediagram/activations/umlseq.cs

@@ -0,0 +1,72 @@
+using System;
+using System.Collections.Generic;
+using System.Web.Mvc;
+using Syncfusion.EJ2.Diagrams;
+
+namespace EJ2MVCSampleBrowser.Controllers.Diagram
+{
+    public partial class DiagramController : Controller
+    {
+        // This method sets up and returns a view for the UML Sequence Diagram
+        public ActionResult Model()
+        {
+            // Create a new UML Sequence Diagram model
+            var model = new DiagramUmlSequenceDiagram
+            {
+                // Define the participants involved in the sequence diagram
+                Participants = new List<DiagramUmlSequenceParticipant>
+                {
+                    // Define the "User" as a participant, marked as an actor
+                    new DiagramUmlSequenceParticipant
+                    {
+                        Id = "User",
+                        Content = "User",
+                        IsActor = true
+                    },
+                    // Define the "System" as a non-actor participant with a destruction marker
+                    new DiagramUmlSequenceParticipant
+                    {
+                        Id = "System",
+                        Content = "System",
+                        IsActor = false,
+                        ShowDestructionMarker = true,
+                        // Define activation boxes for the system
+                        ActivationBoxes = new List<DiagramUmlSequenceActivationBox>
+                        {
+                            new DiagramUmlSequenceActivationBox
+                            {
+                                Id = "ActSystem", // Identifier for the activation box
+                                StartMessageID = "MSG1", // Message that starts the activation
+                                EndMessageID = "MSG2" // Message that ends the activation
+                            }
+                        }
+                    }
+                },
+                // Define the messages exchanged between these participants
+                Messages = new List<DiagramUmlSequenceMessage>
+                {
+                    new DiagramUmlSequenceMessage
+                    {
+                        Id = "MSG1",
+                        Content = "Login Request",
+                        FromParticipantID = "User", // Sender of the message
+                        ToParticipantID = "System", // Receiver of the message
+                        Type = UmlSequenceMessageType.Synchronous // Type of the message
+                    },
+                    new DiagramUmlSequenceMessage
+                    {
+                        Id = "MSG2",
+                        Content = "Login Response",
+                        FromParticipantID = "System",
+                        ToParticipantID = "User",
+                        Type = UmlSequenceMessageType.Reply // Reply type indicating a response
+                    }
+                }
+            };
+
+            // Pass the UML sequence diagram model to the view for rendering
+            ViewData.model = model;
+            return View();
+        }
+    }
+}