feat: add nodegraph init

CHANGELOG.md

@@ -7,6 +7,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.1.3] - 2024-12-10
+This update adds a **NODEGRAPH** functionality to the instance view (Simit-alike). This is a very first beta version for the early adopters. Linking outputs to inputs and datablock values is possible.
+![](docs/img/nodegraph.png)
+
+### Features
+- One big feature: nodegraph!
+
+### Fix
+- Version in code now automatically updates when building the app
+
 ## [0.1.2] - 2024-10-10
 Minor update, mainly annoying bugfix and some small performance improvements
 

PLCsimAdvanced_Manager/Components/Nodegraph.razor

@@ -0,0 +1,83 @@
+@using Blazor.Diagrams
+@using Blazor.Diagrams.Core
+@using Blazor.Diagrams.Core.PathGenerators
+@using Blazor.Diagrams.Core.Routers
+@using Blazor.Diagrams.Options
+@using Blazor.Diagrams.Components
+@using Blazor.Diagrams.Components.Widgets
+@using Blazor.Diagrams.Core.Geometry
+@using Blazor.Diagrams.Core.Models
+@using PLCsimAdvanced_Manager.Services.Nodegraph
+@using PLCsimAdvanced_Manager.Services.Nodegraph.InputNode
+@using PLCsimAdvanced_Manager.Services.Nodegraph.OutputNode
+@inject NodegraphServiceFactory NodegraphServiceFactory
+
+<div class="diagram-container @(simulationRunning ? "border-yellow" : "")">
+    <CascadingValue Value="Diagram" IsFixed="true">
+        <DiagramCanvas>
+            <Widgets>
+                <SelectionBoxWidget/>
+            </Widgets>
+
+        </DiagramCanvas>
+    </CascadingValue>
+
+    <MudButton @onclick="_nodegraphService.ExecuteSimulation" Disabled="simulationRunning">Start simulation</MudButton>
+    <MudButton @onclick="_nodegraphService.StopSimulation" Disabled="!simulationRunning">Stop simulation</MudButton>
+
+    @if (simulationRunning)
+    {
+        <MudText>Stop simulation to change nodegraph</MudText>
+    }
+    else
+    {
+    <MudTabs Elevation="2" Rounded="true" ApplyEffectsToContainer="true" PanelClass="pa-6">
+
+        <MudTabPanel Text="Datablocks">
+            <VariablesTable Area="EArea.DataBlock" InstanceName="@InstanceName" Diagram="Diagram"></VariablesTable>
+        </MudTabPanel>
+        <MudTabPanel Text="Inputs">
+            <VariablesTable Area="EArea.Input" InstanceName="@InstanceName" Diagram="Diagram"></VariablesTable>
+
+        </MudTabPanel>
+        <MudTabPanel Text="Outputs">
+            <VariablesTable Area="EArea.Output" InstanceName="@InstanceName" Diagram="Diagram"></VariablesTable>
+        </MudTabPanel>
+    </MudTabs>
+    }
+</div>
+
+
+@code {
+
+    [Parameter] public string InstanceName { get; set; }
+
+    private NodegraphService _nodegraphService;
+    private BlazorDiagram Diagram;
+
+    private bool simulationRunning;
+
+
+    protected override void OnInitialized()
+    {
+        _nodegraphService = NodegraphServiceFactory.GetOrCreateService(InstanceName);
+        Diagram = _nodegraphService.Diagram;
+        _nodegraphService.OnSimulationStarted += OnSimulationStarted;
+        _nodegraphService.OnSimulationStopped += OnSimulationStopped;
+        simulationRunning = _nodegraphService.IsSimulationRunning;
+    }
+
+    private void OnSimulationStarted(object sender, EventArgs e)
+    {
+        simulationRunning = true;
+        StateHasChanged();
+    }
+
+    private void OnSimulationStopped(object sender, EventArgs e)
+    {
+        simulationRunning = false;
+        StateHasChanged();
+    }
+
+
+}

PLCsimAdvanced_Manager/Components/Nodegraph.razor.css

@@ -0,0 +1,9 @@
+.diagram-container{
+    width: 100%;
+    height: 400px;
+    border: 1px solid lightgray;
+}
+
+.diagram-container.border-yellow {
+     border: 4px solid #ff8400;
+ }