From 11e64f69d00d84974bb09bef6f921c7eeab7c47e Mon Sep 17 00:00:00 2001
From: Roy Ben-Shabat <Roy@Twine-s.com>
Date: Wed, 24 Jan 2018 18:30:53 +0200
Subject: Added Graphs Drag & Drop to Developer Module.

---
 .../Views/MainView.xaml                            | 179 ++++++++++++++++++++-
 1 file changed, 172 insertions(+), 7 deletions(-)

(limited to 'Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/Views/MainView.xaml')

diff --git a/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/Views/MainView.xaml b/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/Views/MainView.xaml
index 7d98fe2d7..40babfc74 100644
--- a/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/Views/MainView.xaml
+++ b/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/Views/MainView.xaml
@@ -5,6 +5,7 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
              xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
              xmlns:global="clr-namespace:Tango.MachineStudio.Developer"
+             xmlns:dragAndDrop="clr-namespace:Tango.DragAndDrop;assembly=Tango.DragAndDrop"
              xmlns:mahapps="http://metro.mahapps.com/winfx/xaml/controls"
              xmlns:db="clr-namespace:Tango.MachineStudio.DB.Views.DBViews;assembly=Tango.MachineStudio.DB"
              xmlns:commonControls="clr-namespace:Tango.MachineStudio.Common.Controls;assembly=Tango.MachineStudio.Common"
@@ -31,6 +32,51 @@
         <SolidColorBrush x:Key="SideBarBackground" Color="#F9F9F9">
 
         </SolidColorBrush>
+
+        <Style x:Key="droppableGrid" TargetType="Grid">
+            <Setter Property="RenderTransform">
+                <Setter.Value>
+                    <ScaleTransform ScaleX="1" ScaleY="1"></ScaleTransform>
+                </Setter.Value>
+            </Setter>
+            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"></Setter>
+            <Setter Property="Background" Value="Transparent"></Setter>
+            <Setter Property="dragAndDrop:DragAndDropService.Droppable" Value="True"></Setter>
+            <Setter Property="dragAndDrop:DragAndDropService.DraggingSurface" Value="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DraggingSurface}"></Setter>
+            <Style.Triggers>
+                <Trigger Property="dragAndDrop:DragAndDropService.IsDraggableOver" Value="True">
+                    <Setter Property="Opacity" Value="0.5"></Setter>
+                    <Trigger.EnterActions>
+                        <BeginStoryboard>
+                            <Storyboard>
+                                <DoubleAnimation To="0.95" Duration="00:00:0.2" Storyboard.TargetProperty="RenderTransform.ScaleX"></DoubleAnimation>
+                                <DoubleAnimation To="0.95" Duration="00:00:0.2" Storyboard.TargetProperty="RenderTransform.ScaleY"></DoubleAnimation>
+                            </Storyboard>
+                        </BeginStoryboard>
+                    </Trigger.EnterActions>
+                    <Trigger.ExitActions>
+                        <BeginStoryboard>
+                            <Storyboard>
+                                <DoubleAnimation To="1" Duration="00:00:0.2" Storyboard.TargetProperty="RenderTransform.ScaleX"></DoubleAnimation>
+                                <DoubleAnimation To="1" Duration="00:00:0.2" Storyboard.TargetProperty="RenderTransform.ScaleY"></DoubleAnimation>
+                            </Storyboard>
+                        </BeginStoryboard>
+                    </Trigger.ExitActions>
+                </Trigger>
+            </Style.Triggers>
+        </Style>
+
+        <Style x:Key="draggableGrid" TargetType="Grid">
+            <Setter Property="RenderTransform">
+                <Setter.Value>
+                    <ScaleTransform ScaleX="1" ScaleY="1"></ScaleTransform>
+                </Setter.Value>
+            </Setter>
+            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"></Setter>
+            <Setter Property="Background" Value="Transparent"></Setter>
+            <Setter Property="dragAndDrop:DragAndDropService.Draggable" Value="True"></Setter>
+            <Setter Property="dragAndDrop:DragAndDropService.DraggingSurface" Value="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DraggingSurface}"></Setter>
+        </Style>
     </UserControl.Resources>
 
     <Grid>
@@ -291,7 +337,7 @@
                     <Grid>
                         <Grid.RowDefinitions>
                             <RowDefinition Height="234*"/>
-                            <RowDefinition Height="131*"/>
+                            <RowDefinition Height="161*"/>
                         </Grid.RowDefinitions>
                         <Grid.ColumnDefinitions>
                             <ColumnDefinition Width="173*"/>
@@ -331,9 +377,9 @@
                             </DockPanel>
                         </Grid>
 
-                        <Grid Grid.Column="1" Margin="10">
+                        <Grid Grid.Column="1" Margin="10 10 10 0">
                             <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="1*"/>
+                                <ColumnDefinition/>
                                 <ColumnDefinition Width="Auto"/>
                             </Grid.ColumnDefinitions>
                             <Grid>
@@ -402,7 +448,7 @@
                                 </StackPanel>
                             </Grid>
 
-                            <Grid Grid.Column="1" Background="{StaticResource SideBarBackground}" Margin="10 0 0 0" Width="400">
+                            <Grid Grid.Column="1" Margin="10 0 0 0" Width="340">
                                 <Grid.Style>
                                     <Style TargetType="Grid">
                                         <Setter Property="LayoutTransform">
@@ -431,14 +477,133 @@
                                     </Style>
                                 </Grid.Style>
 
-                                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center">CAMERAS</TextBlock>
+                                <Grid Margin="5 0 0 0">
+                                    <DockPanel>
+                                        <StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
+                                            <Image Source="../Images/camera.png" Width="42"></Image>
+                                            <TextBlock VerticalAlignment="Center" Margin="10 0 0 0" Foreground="DimGray" FontSize="16" FontWeight="SemiBold">USB CAMERAS</TextBlock>
+                                        </StackPanel>
+                                        <UniformGrid Rows="3">
+                                            <Border BorderBrush="Gray" BorderThickness="1" Margin="0 0 0 5" CornerRadius="5">
+                                                <Border.Background>
+                                                    <ImageBrush ImageSource="../Images/no-signal.jpg" Stretch="Fill"></ImageBrush>
+                                                </Border.Background>
+
+                                                <Grid>
+                                                    <Label Style="{StaticResource graphLabel}">
+                                                        <TextBlock VerticalAlignment="Center" FontSize="10" Margin="0 0 30 0">CAMERA 1</TextBlock>
+                                                    </Label>
+                                                </Grid>
+                                            </Border>
+                                            <Border BorderBrush="Gray" BorderThickness="1" Margin="0 0 0 5" CornerRadius="5">
+                                                <Border.Background>
+                                                    <ImageBrush ImageSource="../Images/no-signal.jpg" Stretch="Fill"></ImageBrush>
+                                                </Border.Background>
+
+                                                <Grid>
+                                                    <Label Style="{StaticResource graphLabel}">
+                                                        <TextBlock VerticalAlignment="Center" FontSize="10" Margin="0 0 30 0">CAMERA 2</TextBlock>
+                                                    </Label>
+                                                </Grid>
+                                            </Border>
+                                            <Border BorderBrush="Gray" BorderThickness="1" Margin="0 0 0 5" CornerRadius="5">
+                                                <Border.Background>
+                                                    <ImageBrush ImageSource="../Images/no-signal.jpg" Stretch="Fill"></ImageBrush>
+                                                </Border.Background>
+
+                                                <Grid>
+                                                    <Label Style="{StaticResource graphLabel}">
+                                                        <TextBlock VerticalAlignment="Center" FontSize="10" Margin="0 0 30 0">CAMERA 3</TextBlock>
+                                                    </Label>
+                                                </Grid>
+                                            </Border>
+                                        </UniformGrid>
+                                    </DockPanel>
+                                </Grid>
+
                             </Grid>
                         </Grid>
 
-                  
+                        <Grid Grid.Row="1" Grid.ColumnSpan="2" Background="{StaticResource SideBarBackground}">
+                            <Grid Margin="10 70 10 10">
+                                <Grid.ColumnDefinitions>
+                                    <ColumnDefinition Width="1*"/>
+                                    <ColumnDefinition Width="350"/>
+                                </Grid.ColumnDefinitions>
+
+                                <Grid Grid.Column="1">
+                                    <DockPanel>
+                                        <StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
+                                            <Image Source="../Images/graphs.png" Width="42"></Image>
+                                            <TextBlock VerticalAlignment="Center" Margin="10 0 0 0" Foreground="DimGray" FontSize="16" FontWeight="SemiBold">AVAILABLE GRAPHS</TextBlock>
+                                        </StackPanel>
+                                        <ScrollViewer Margin="0 5 0 0" VerticalScrollBarVisibility="Auto">
+                                            <ItemsControl Margin="0 0 5 0" ItemsSource="{Binding AvailableSensors}">
+                                                <ItemsControl.ItemsPanel>
+                                                    <ItemsPanelTemplate>
+                                                        <UniformGrid Columns="2" IsItemsHost="True"></UniformGrid>
+                                                    </ItemsPanelTemplate>
+                                                </ItemsControl.ItemsPanel>
+                                                <ItemsControl.ItemTemplate>
+                                                    <DataTemplate DataType="{x:Type observables:Sensor}">
+                                                        <Border dragAndDrop:DragAndDropService.Draggable="True" dragAndDrop:DragAndDropService.DraggingSurface="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DraggingSurface}" Margin="5" CornerRadius="3" Height="120" BorderThickness="1" BorderBrush="Silver" ClipToBounds="True">
+                                                            <Border.Background>
+                                                                <ImageBrush ImageSource="../Images/line_graph.png" Stretch="Fill"></ImageBrush>
+                                                            </Border.Background>
+                                                            <Grid>
+                                                                <Label HorizontalAlignment="Left" VerticalAlignment="Top" Style="{StaticResource graphLabel}">
+                                                                    <TextBlock Foreground="DimGray" VerticalAlignment="Center" Text="{Binding Description}"></TextBlock>
+                                                                </Label>
+                                                            </Grid>
+                                                        </Border>
+                                                    </DataTemplate>
+                                                </ItemsControl.ItemTemplate>
+                                            </ItemsControl>
+                                        </ScrollViewer>
+                                    </DockPanel>
+                                </Grid>
 
-                        <Grid Grid.Row="1" Grid.ColumnSpan="2">
+                                <Grid>
+                                    <Grid Margin="0 0 10 0" Style="{StaticResource droppableGrid}" dragAndDrop:DragAndDropService.Drop="OnDropAvailableSensor">
+                                        <Border>
+                                            <ItemsControl ItemsSource="{Binding Graphs}">
+                                                <ItemsControl.ItemsPanel>
+                                                    <ItemsPanelTemplate>
+                                                        <UniformGrid Columns="4" Rows="2" IsItemsHost="True"></UniformGrid>
+                                                    </ItemsPanelTemplate>
+                                                </ItemsControl.ItemsPanel>
+                                            </ItemsControl>
+                                        </Border>
+                                        <Grid>
+                                            <Grid.Style>
+                                                <Style TargetType="Grid">
+                                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
+                                                    <Style.Triggers>
+                                                        <DataTrigger Binding="{Binding Graphs.Count}" Value="0">
+                                                            <Setter Property="Visibility" Value="Visible"></Setter>
+                                                        </DataTrigger>
+                                                    </Style.Triggers>
+                                                </Style>
+                                            </Grid.Style>
+                                            <TextBlock Foreground="Silver" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="30">DRAG &amp; DROP GRAPHS</TextBlock>
+                                        </Grid>
+                                    </Grid>
+                                </Grid>
+                            </Grid>
 
+                            <Border VerticalAlignment="Top" Height="50" CornerRadius="0 0 50 50">
+                                <Border.Effect>
+                                    <DropShadowEffect BlurRadius="30" ShadowDepth="20" Opacity="0.2" />
+                                </Border.Effect>
+                                <Border.Background>
+                                    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
+                                        <GradientStop Color="White" Offset="0" />
+                                        <GradientStop Color="#FFE6E6E6" Offset="1"/>
+
+                                    </LinearGradientBrush>
+                                </Border.Background>
+                            </Border>
+                            <dragAndDrop:DraggingSurface x:Name="draggingSurface" />
                         </Grid>
                     </Grid>
                 </Grid>
-- 
cgit v1.3.1