<UserControl x:Class="CtrEditor.ObjetosSim.HydraulicComponents.ucHydPipe"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:vm="clr-namespace:CtrEditor.ObjetosSim.HydraulicComponents"
             mc:Ignorable="d">

    <UserControl.DataContext>
        <vm:osHydPipe Ancho="2.0" Alto="0.2"/>
    </UserControl.DataContext>

    <Canvas RenderTransformOrigin="0,0">
        <Canvas.RenderTransform>
            <TransformGroup>
                <ScaleTransform />
                <SkewTransform />
                <RotateTransform Angle="{Binding Angulo}" />
                <TranslateTransform />
            </TransformGroup>
        </Canvas.RenderTransform>

        <!-- Cuerpo de la tubería -->
        <Rectangle x:Name="rectPipe" 
                   Width="{Binding Ancho, Converter={StaticResource MeterToPixelConverter}}"
                   Height="{Binding Alto, Converter={StaticResource MeterToPixelConverter}}"
                   Fill="{Binding ColorButton_oculto}" 
                   Stroke="Black" 
                   StrokeThickness="2"
                   RadiusX="5" 
                   RadiusY="5"/>
        
        <!-- Etiqueta con Viewbox para escalado -->
        <Viewbox Width="{Binding Ancho, Converter={StaticResource MeterToPixelConverter}}"
                 Height="{Binding Alto, Converter={StaticResource MeterToPixelConverter}}" 
                 Stretch="Uniform">
            <Label Content="{Binding Nombre}" 
                   VerticalAlignment="Center" 
                   HorizontalAlignment="Center" 
                   FontWeight="Bold"
                   FontSize="18" 
                   Opacity="0.9" 
                   Foreground="White"/>
        </Viewbox>

        <!-- Indicador de conexión entrada -->
        <Ellipse x:Name="ConnectionIn" 
                 Fill="Green" 
                 Width="8" 
                 Height="8" 
                 Canvas.Left="-4" 
                 Canvas.Top="{Binding Alto, Converter={StaticResource MeterToPixelConverter}, ConverterParameter=0.5}"/>
        
        <!-- Indicador de conexión salida -->
        <Ellipse x:Name="ConnectionOut" 
                 Fill="Red" 
                 Width="8" 
                 Height="8" 
                 Canvas.Right="-4" 
                 Canvas.Top="{Binding Alto, Converter={StaticResource MeterToPixelConverter}, ConverterParameter=0.5}"/>
        
        <!-- Indicador de flujo -->
        <Border x:Name="FlowIndicator" 
                Background="Yellow" 
                CornerRadius="2" 
                Visibility="Collapsed"
                Canvas.Top="-20"
                Canvas.Left="{Binding Ancho, Converter={StaticResource MeterToPixelConverter}, ConverterParameter=0.5}">
            <TextBlock x:Name="FlowText" 
                       Text="0.00" 
                       FontSize="6" 
                       Foreground="Black" 
                       Margin="2"/>
        </Border>
        
    </Canvas>
</UserControl>
