From 57b8791dc01d00d065fce2f79825d19d2d93dbf2 Mon Sep 17 00:00:00 2001
From: bliestlech-tc <christoph.bliestle@techcrafters.de>
Date: Tue, 10 Mar 2026 22:05:18 +0100
Subject: [PATCH] Suggest Mediacabinet View

---
 .../UniperHMI/Common/MediaContainer.xaml      |  37 +++--
 .../UniperHMI/Common/MediaContainerVm.cs      |  35 +++--
 .../BinaryValveControl.xaml                   |  10 +-
 .../InterlockControl/IntlkControl.xaml        |   8 +-
 .../Pages/Views/MediaCabinetPage.xaml         | 131 ++++++++++++++----
 5 files changed, 155 insertions(+), 66 deletions(-)

diff --git a/uniper_hmi/UniperHMI/Common/MediaContainer.xaml b/uniper_hmi/UniperHMI/Common/MediaContainer.xaml
index a4c410e..336561c 100644
--- a/uniper_hmi/UniperHMI/Common/MediaContainer.xaml
+++ b/uniper_hmi/UniperHMI/Common/MediaContainer.xaml
@@ -16,21 +16,22 @@
     <d:DesignerProperties.DesignStyle>
         <Style TargetType="UserControl">
             <!--  Property="Background" Value="White" /> -->
-            <Setter Property="Height" Value="300" />
+            <Setter Property="Height" Value="Auto" />
+            <Setter Property="Width" Value="Auto"></Setter>
         </Style>
     </d:DesignerProperties.DesignStyle>
     
 	<Grid>
         <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="25*"/>
-            <ColumnDefinition Width="25*"/>
-            <ColumnDefinition Width="50*"/>
+            <ColumnDefinition Width="Auto"/>
+            <ColumnDefinition Width="Auto"/>
+            <ColumnDefinition Width="Auto"/>
         </Grid.ColumnDefinitions>
 		<Grid.RowDefinitions>
-			<RowDefinition Height="70"/>
-			<RowDefinition Height="100"/>
-			<RowDefinition Height="100"/>
-			<RowDefinition Height="180"/>
+			<RowDefinition Height="Auto"/>
+			<RowDefinition Height="Auto"/>
+			<RowDefinition Height="*"/>
+			<RowDefinition Height="*"/>
 		</Grid.RowDefinitions>
 	<Border Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" BorderBrush="White" BorderThickness="2"/>
         <!-- <Label Grid.Column="0" Content="{Binding SName}" VerticalAlignment="Center" HorizontalAlignment="Left"/> -->
@@ -43,7 +44,7 @@
             </Grid.RowDefinitions>
             <Border Grid.Row="0" BorderBrush="White" BorderThickness="1" />
 			<Border Grid.Row="1" BorderBrush="White" BorderThickness="1" />
-			<Label Grid.Row="0" VerticalAlignment="Center" Content="Übervoll" HorizontalContentAlignment="Center" HorizontalAlignment="Center" Width="200"  FontSize="30"/>
+			<Label Grid.Row="0" VerticalAlignment="Center" Content="Übervoll" HorizontalContentAlignment="Center" HorizontalAlignment="Center" FontSize="30"/>
 			<RadioButton Margin="5" Grid.Row="1" IsChecked="{Binding Overload}" HorizontalAlignment="Center" VerticalAlignment="Center" IsEnabled="False"/>
         </Grid>
 
@@ -71,13 +72,11 @@
 
 		<Border Grid.Column="1" Grid.Row="1" BorderBrush="White" BorderThickness="1"/>
 
-    <Grid Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3">
-        <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="*" />
-            <ColumnDefinition Width="*" />
-        </Grid.ColumnDefinitions>
+		<HMIToolkit:BinaryValveControl Grid.Row="2" Grid.Column="0" DataContext="{Binding FillValveControlVm}"/>
+		<HMIToolkit:BinaryValveControl Grid.Row="2" Grid.Column="1" DataContext="{Binding DrainValveControlVm}"/>
+		<HMIToolkit:BinaryValveControl Grid.Row="2"  Grid.Column="2" DataContext="{Binding PumpValveControlVm}"/>
 
-        <Button x:Name="btnOpen"
+			<!--<Button x:Name="btnOpen"
                 Grid.Column="0"
                 DataContext="{Binding EmptyButton}"
                 Command="{Binding ButtonClickedCommand}"
@@ -85,9 +84,9 @@
                 Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}"
                 Content="Leeren"
                 Height="100"
-                FontSize="30"/>
+                FontSize="30"/>-->
 
-        <Button x:Name="btnFill"
+        <!--<Button x:Name="btnFill"
                 Grid.Column="1"
                 DataContext="{Binding FillButton}"
                 Command="{Binding ButtonClickedCommand}"
@@ -95,7 +94,7 @@
                 Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}"
                 Content="Füllen"
                 Height="100"
-                FontSize="30"/>
-    </Grid>
+                FontSize="30"/>-->
+    
     </Grid>
 </UserControl>
diff --git a/uniper_hmi/UniperHMI/Common/MediaContainerVm.cs b/uniper_hmi/UniperHMI/Common/MediaContainerVm.cs
index 88b11f6..ac427a2 100644
--- a/uniper_hmi/UniperHMI/Common/MediaContainerVm.cs
+++ b/uniper_hmi/UniperHMI/Common/MediaContainerVm.cs
@@ -19,18 +19,23 @@ public sealed partial class MediaContainerVm : ObservableValidator, IDisposable
 	[ObservableProperty] private bool full = false;
 
 	[ObservableProperty] private bool overload = false;
+	
+	[ObservableProperty] private BinaryValveControlVM? fillValveControlVm;
 
-	[ObservableProperty] private HMIControlButtonVM? emptyButton;
-
-	[ObservableProperty] private HMIControlButtonVM? fillButton;
+	[ObservableProperty] private BinaryValveControlVM? drainValveControlVm;
 
+	[ObservableProperty] private BinaryValveControlVM? pumpValveControlVm;
+	
 
 
 	public MediaContainerVm()
 	{
 		sName = "No Name";
-		EmptyButton = new HMIControlButtonVM();
-		FillButton = new HMIControlButtonVM();
+		FillValveControlVm = new();
+		DrainValveControlVm = new();
+		PumpValveControlVm = new();
+
+
 
 	}
 
@@ -41,8 +46,10 @@ public sealed partial class MediaContainerVm : ObservableValidator, IDisposable
 
 		sName = "No Name";
 
-		EmptyButton = new HMIControlButtonVM(_adsManager, _variableName + ".stEmptyButton");
-		FillButton = new HMIControlButtonVM(_adsManager, _variableName + ".stFillButton");
+		FillValveControlVm =  new BinaryValveControlVM(_adsManager, _variableName + ".stFillingValve");
+		DrainValveControlVm = new BinaryValveControlVM(_adsManager, _variableName + ".stDrainValve");
+		PumpValveControlVm = new BinaryValveControlVM(_adsManager, _variableName + ".stPumpValve"); 
+
 		_adsManager.Register(_variableName + ".xEmpty", EmptyChanged);
 		_adsManager.Register(_variableName + ".xFull", FullChanged);
 		_adsManager.Register(_variableName + ".xOverload", OverloadChanged);
@@ -62,12 +69,16 @@ public sealed partial class MediaContainerVm : ObservableValidator, IDisposable
 	}
 	public void Dispose()
     {
-		EmptyButton?.Dispose();
-		EmptyButton = null;
-		FillButton?.Dispose();
-		FillButton = null;
+		FillValveControlVm?.Dispose();
+		DrainValveControlVm?.Dispose();
+		PumpValveControlVm?.Dispose();
 
-	    _adsManager?.Deregister(_variableName + ".xEmpty", EmptyChanged);
+		FillValveControlVm = null;
+		DrainValveControlVm = null;
+		PumpValveControlVm = null;
+
+		
+		_adsManager?.Deregister(_variableName + ".xEmpty", EmptyChanged);
 	    _adsManager?.Deregister(_variableName + ".xFull", FullChanged);
 	    _adsManager?.Deregister(_variableName + ".xOverload", OverloadChanged);
 	}
diff --git a/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/BinaryValveControl/BinaryValveControl.xaml b/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/BinaryValveControl/BinaryValveControl.xaml
index c4c5a02..73166fe 100644
--- a/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/BinaryValveControl/BinaryValveControl.xaml
+++ b/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/BinaryValveControl/BinaryValveControl.xaml
@@ -27,7 +27,7 @@
             <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
-            <RowDefinition Height="*" />
+            <RowDefinition Height="Auto" />
 
         </Grid.RowDefinitions>
         <!-- Row 0 -->
@@ -52,8 +52,8 @@
                 <ColumnDefinition Width="*" />
             </Grid.ColumnDefinitions>
             <Label Grid.Row="0" Grid.Column="0"  Grid.ColumnSpan="2" FontSize="30" Content="Control:"/>
-            <Button x:Name="btnOpen" DataContext="{Binding OpenButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}" Grid.Row="1"  Grid.Column="0" Content="Open" FontSize="40" Height="100" Width="180" Margin="0,0,5,5" />
-            <Button x:Name="btnClose" DataContext="{Binding CloseButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}" Grid.Row="1"  Grid.Column="1" Content="Close" FontSize="40" Height="100" Width="180" Margin="0,-5,0,0"/>
+            <Button x:Name="btnOpen" DataContext="{Binding OpenButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}" Grid.Row="1"  Grid.Column="0" Content="Open" FontSize="40" Height="70" Width="150" Margin="0,0,5,5" />
+            <Button x:Name="btnClose" DataContext="{Binding CloseButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Background="{Binding IFeedback, Converter={StaticResource feedbackConverter}}" Grid.Row="1"  Grid.Column="1" Content="Close" FontSize="40" Height="70" Width="150" Margin="0,-5,0,0"/>
         </Grid>
         
         <!-- Row 4 -->
@@ -68,8 +68,8 @@
             </Grid.ColumnDefinitions>
 
             <Label Grid.Row="0" Grid.Column="0"  Grid.ColumnSpan="2" FontSize="30" Content="Mode:"  />
-            <Button x:Name="btnAuto" DataContext="{Binding AutomaticButton}" Command="{Binding ButtonClickedCommand}"  IsEnabled="{Binding XRelease}" Grid.Row="1"  Grid.Column="0" Content="Auto" FontSize="35" Height="100" Width="180" Margin="0,0,5,0"/>
-            <Button x:Name="btnManual" DataContext="{Binding ManualButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Grid.Row="1"  Grid.Column="1" Content="Man" FontSize="35" Height="100" Width="180" Margin="0,-5,0,-5"/>
+            <Button x:Name="btnAuto" DataContext="{Binding AutomaticButton}" Command="{Binding ButtonClickedCommand}"  IsEnabled="{Binding XRelease}" Grid.Row="1"  Grid.Column="0" Content="Auto" FontSize="30" Height="70" Width="150" Margin="0,0,5,0"/>
+            <Button x:Name="btnManual" DataContext="{Binding ManualButton}" Command="{Binding ButtonClickedCommand}" IsEnabled="{Binding XRelease}" Grid.Row="1"  Grid.Column="1" Content="Man" FontSize="30" Height="70" Width="150" Margin="0,-5,0,-5"/>
         </Grid>
 
 		</Grid>
diff --git a/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/InterlockControl/IntlkControl.xaml b/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/InterlockControl/IntlkControl.xaml
index 2ac5107..7f6dd58 100644
--- a/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/InterlockControl/IntlkControl.xaml
+++ b/uniper_hmi/UniperHMI/HMIToolkit/HMIObjects/InterlockControl/IntlkControl.xaml
@@ -16,15 +16,15 @@
             <ColumnDefinition Width="*" />
         </Grid.ColumnDefinitions>
 
-        <Button Grid.Column="0" FontSize="35" Height="80" Width="180" Padding="0" Command="{Binding ShowProcessIntlksCommand}">
+        <Button Grid.Column="0" FontSize="35" Height="60" Width="150" Padding="0" Command="{Binding ShowProcessIntlksCommand}">
             <StackPanel Orientation="Horizontal">
-                <Label>Process</Label>
+				<Label FontSize="30">Process</Label>
                 <Rectangle Width="10" Height="10" Fill="{Binding Path=XProcessIntlkOk, Converter={StaticResource myBoolConverter}}" RadiusX="2" RadiusY="2" Margin="0,2,0,0"/>
             </StackPanel>
         </Button>
-        <Button Grid.Column="1" Padding="0" FontSize="35" Height="80" Width="180" Margin="5,0,0,0" Command="{Binding ShowSafetyIntlksCommand}">
+        <Button Grid.Column="1" Padding="0" FontSize="35" Height="60" Width="150" Margin="5,0,0,0" Command="{Binding ShowSafetyIntlksCommand}">
             <StackPanel Orientation="Horizontal">
-                <Label>Safety</Label>
+				<Label FontSize="30">Safety</Label>
                 <Rectangle Width="10" Height="10" Fill="{Binding Path=XSafetyIntlkOk, Converter={StaticResource myBoolConverter}}"  RadiusX="2" RadiusY="2" Margin="0,2,0,0"/>
             </StackPanel>
         </Button>
diff --git a/uniper_hmi/UniperHMI/Pages/Views/MediaCabinetPage.xaml b/uniper_hmi/UniperHMI/Pages/Views/MediaCabinetPage.xaml
index 7565a13..b725e30 100644
--- a/uniper_hmi/UniperHMI/Pages/Views/MediaCabinetPage.xaml
+++ b/uniper_hmi/UniperHMI/Pages/Views/MediaCabinetPage.xaml
@@ -10,37 +10,116 @@
       d:DesignHeight="1600" d:DesignWidth="3800"
       Title="Media Cabinet">
 
-	<Grid>
-		<Grid.ColumnDefinitions>
-			<ColumnDefinition />
-			<ColumnDefinition />
-			<ColumnDefinition />
-			<ColumnDefinition />
-			<ColumnDefinition />
-			<ColumnDefinition />
-		</Grid.ColumnDefinitions>
-		<Grid.RowDefinitions>
-			<RowDefinition Height="4*"/>
-			<RowDefinition Height="30*" />
-			<RowDefinition Height="30*" />
-			<RowDefinition Height="33*" />
-		</Grid.RowDefinitions>
-		<!--<Label Grid.Row="0" Grid.Column="0" Content="Mediacabinet Page" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="35" />-->
+	<Page.Resources>
 
-		<common:MediaContainer Grid.Row="1" Grid.Column="0" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container1Vm}"/>
-		<common:MediaContainer Grid.Row="2" Grid.Column="0" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container7Vm}"/>
-		<common:MediaContainer Grid.Row="3" Grid.Column="0" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container5Vm}"/>
+		<!-- TabItem Style -->
+		<Style x:Key="TabItemHeaderStyle" TargetType="TabItem" >
+			<Setter Property="Foreground" Value="White"/>
+			<Setter Property="FontWeight" Value="SemiBold"/>
+			<Setter Property="Padding" Value="120,30"/>
+			<Setter Property="Margin" Value="4,0"/>
+			<Setter Property="Background" Value="#333"/>
+			<Setter Property="FontSize" Value="40"/>
+			<Setter Property="Template">
+				<Setter.Value>
+					<ControlTemplate TargetType="TabItem">
+						<Border x:Name="Border"
+                            Background="{TemplateBinding Background}"
+                            CornerRadius="8,8,0,0"
+							BorderThickness="1,1,0,0"
+							BorderBrush="White"
+                            Padding="{TemplateBinding Padding}">
+
+							<ContentPresenter
+                            ContentSource="Header"
+                            HorizontalAlignment="Center"
+                            VerticalAlignment="Center"/>
+						</Border>
+
+						<ControlTemplate.Triggers>
+
+							<!-- Hover -->
+							<Trigger Property="IsMouseOver" Value="True">
+								<Setter TargetName="Border"
+                                    Property="Background"
+                                    Value="Gray"/>
+							</Trigger>
+
+							<!-- Selected -->
+							<Trigger Property="IsSelected" Value="True">
+								<Setter TargetName="Border"
+                                    Property="Background"
+                                    Value="Gray"/>
+								<Setter Property="Foreground"
+                                    Value="White"/>
+							</Trigger>
+
+							<!-- Disabled -->
+							<Trigger Property="IsEnabled" Value="False">
+								<Setter Property="Foreground"
+                                    Value="#999"/>
+							</Trigger>
+
+						</ControlTemplate.Triggers>
+					</ControlTemplate>
+				</Setter.Value>
+			</Setter>
+		</Style>
+
+	</Page.Resources>
+	<TabControl Margin="100 0 0 0">
+		<TabItem Header="Tank 1-6" Style="{StaticResource TabItemHeaderStyle}">
+			<Grid>
+				<Grid.ColumnDefinitions>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="*"/>
+				</Grid.ColumnDefinitions>
+				<Grid.RowDefinitions>
+					<RowDefinition Height="Auto" />
+					<RowDefinition Height="Auto" />
+					<RowDefinition Height="*" />
+				</Grid.RowDefinitions>
+				<!--<Label Grid.Row="0" Grid.Column="0" Content="Mediacabinet Page" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="35" />-->
+				<common:MediaContainer Grid.Row="0" Grid.Column="0" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container1Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="1" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container5Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="2" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container3Vm}"/>
+
+				<common:MediaContainer Grid.Row="1" Grid.Column="0" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container7Vm}"/>
+				<common:MediaContainer Grid.Row="1" Grid.Column="1" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container4Vm}"/>
+				<common:MediaContainer Grid.Row="1" Grid.Column="2" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container6Vm}"/>
 
 
 
-        <common:MediaContainer Grid.Row="1" Grid.Column="1" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container4Vm}"/>
-		<common:MediaContainer Grid.Row="2" Grid.Column="1" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container3Vm}"/>
-		<common:MediaContainer Grid.Row="3" Grid.Column="1" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container6Vm}"/>
 
+				<!--<common:MediaContainer Grid.Row="0" Grid.Column="0" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container1Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="1" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container2Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="2" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container3Vm}"/>
+				<common:MediaContainer Grid.Row="1" Grid.Column="0" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container4Vm}"/>
+				<common:MediaContainer Grid.Row="1" Grid.Column="1" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container5Vm}"/>
+				<common:MediaContainer Grid.Row="1" Grid.Column="2" Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container6Vm}"/>-->
+			</Grid>
+			</TabItem>
+		<TabItem Header="Tank 7-9" Style="{StaticResource TabItemHeaderStyle}">
+			<Grid>
+				<Grid.ColumnDefinitions>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="Auto"/>
+					<ColumnDefinition Width="*"/>
+				</Grid.ColumnDefinitions>
+				<Grid.RowDefinitions>
+					<RowDefinition Height="Auto" />
+					<RowDefinition Height="Auto" />
+				</Grid.RowDefinitions>
+				<!--<Label Grid.Row="0" Grid.Column="0" Content="Mediacabinet Page" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="35" />-->
 
-		<common:MediaContainer Grid.Row="1" Grid.Column="2" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container9Vm}"/>
-		<common:MediaContainer Grid.Row="2" Grid.Column="2" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container8Vm}"/>
-		<common:MediaContainer Grid.Row="3" Grid.Column="2" Height="400"  Width="300" Margin="10" HorizontalAlignment="Center" DataContext="{Binding Container2Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="0"  Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container9Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="1"  Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container8Vm}"/>
+				<common:MediaContainer Grid.Row="0" Grid.Column="2"  Margin="0 30 40 10" HorizontalAlignment="Center" DataContext="{Binding Container2Vm}"/>
 
-    </Grid>
+			</Grid>
+		</TabItem>
+	</TabControl>
 </Page>