Design refinement

Workshop/Module1-AdaptiveUI/Source/Begin/Microsoft.Labs.SightsToSee/Microsoft.Labs.SightsToSee.Library/Models/Restaurant.cs

@@ -254,5 +254,12 @@ protected virtual void OnPropertyChanged([CallerMemberName] string propertyName
         {
             PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
         }
+
+
+    }
+    public class EatsGroup
+    {
+        public string GroupName { get; set; }
+        public List<Restaurant> ListOfEats { get; set; }
     }
 }

Workshop/Module1-AdaptiveUI/Source/Begin/Microsoft.Labs.SightsToSee/Microsoft.Labs.SightsToSee/Controls/BlurredBackgroundControl.xaml

@@ -11,8 +11,12 @@
     d:DesignWidth="400">
 
     <Grid>
+        <xaml:CanvasControl x:Name="BlurredBackImage"
+                            ClearColor="Black"/>
+
         <xaml:CanvasControl x:Name="BlurredImage"
                             ClearColor="White"/>
+
         <Rectangle Fill="White"
                    x:Name="OpacityLayer"
                    Opacity="0.6"

Workshop/Module1-AdaptiveUI/Source/Begin/Microsoft.Labs.SightsToSee/Microsoft.Labs.SightsToSee/Controls/BlurredBackgroundControl.xaml.cs

@@ -18,31 +18,34 @@ namespace Microsoft.Labs.SightsToSee.Controls
     public sealed partial class BlurredBackgroundControl : UserControl
     {
         public static readonly DependencyProperty BlurFactorProperty = DependencyProperty.Register(
-            "BlurFactor", typeof (float), typeof (BlurredBackgroundControl), new PropertyMetadata(20.0f));
+            "BlurFactor", typeof(float), typeof(BlurredBackgroundControl), new PropertyMetadata(20.0f));
 
         public static readonly DependencyProperty BackgroundImageSourceProperty = DependencyProperty.Register(
-            "BackgroundImageSource", typeof (ImageSource), typeof (BlurredBackgroundControl),
+            "BackgroundImageSource", typeof(ImageSource), typeof(BlurredBackgroundControl),
             new PropertyMetadata(default(ImageSource), PropertyChangedCallback));
 
         private CanvasBitmap _backgroundBitmap;
+        private CanvasBitmap _altBackBitmap;
         private GaussianBlurEffect _blurEffect;
+        private GaussianBlurEffect _altBlurEffect;
 
         public BlurredBackgroundControl()
         {
             InitializeComponent();
             BlurredImage.CreateResources += BlurredImage_CreateResources;
             BlurredImage.Draw += BlurredImage_Draw;
+            BlurredBackImage.Draw += AltBlurredImage_Draw;
         }
 
         public float BlurFactor
         {
-            get { return (float) GetValue(BlurFactorProperty); }
+            get { return (float)GetValue(BlurFactorProperty); }
             set { SetValue(BlurFactorProperty, value); }
         }
 
         public ImageSource BackgroundImageSource
         {
-            get { return (ImageSource) GetValue(BackgroundImageSourceProperty); }
+            get { return (ImageSource)GetValue(BackgroundImageSourceProperty); }
             set { SetValue(BackgroundImageSourceProperty, value); }
         }
 
@@ -67,29 +70,35 @@ private static async void PropertyChangedCallback(DependencyObject dependencyObj
                     return;
                 }
 
-                var uriPath = ((BitmapImage) imageSource).UriSource;
+                var uriPath = ((BitmapImage)imageSource).UriSource;
                 var path = uriPath.AbsoluteUri;
                 if (path.StartsWith("ms-appx"))
                 {
                     //Add the Preprocessor directive EFCOREHACK to enable generating migrations
                     //Pending issue https://github.com/aspnet/EntityFramework/issues/4683
 #if !EFCOREHACK
                     control._backgroundBitmap =
-                        await CanvasBitmap.LoadAsync(control.BlurredImage, ((BitmapImage) imageSource).UriSource);
+                        await CanvasBitmap.LoadAsync(control.BlurredImage, ((BitmapImage)imageSource).UriSource);
+                    control._altBackBitmap =
+                        await CanvasBitmap.LoadAsync(control.BlurredBackImage, ((BitmapImage)imageSource).UriSource);
 #endif
                 }
                 else if (path.StartsWith("ms-appdata"))
                 {
 #if !EFCOREHACK
-                    control._backgroundBitmap = 
-                        await CanvasBitmap.LoadAsync(control.BlurredImage,((BitmapImage)imageSource).UriSource);
+                    control._backgroundBitmap =
+                        await CanvasBitmap.LoadAsync(control.BlurredImage, ((BitmapImage)imageSource).UriSource);
+                    control._altBackBitmap =
+                        await CanvasBitmap.LoadAsync(control.BlurredBackImage, ((BitmapImage)imageSource).UriSource);
 #endif
                 }
                 else
                 {
 #if !EFCOREHACK
-                    control._backgroundBitmap = 
+                    control._backgroundBitmap =
                         await CanvasBitmap.LoadAsync(control.BlurredImage, uriPath.AbsolutePath);
+                    control._altBackBitmap =
+                        await CanvasBitmap.LoadAsync(control.BlurredBackImage, ((BitmapImage)imageSource).UriSource);
 #endif
                 }
 
@@ -99,28 +108,45 @@ private static async void PropertyChangedCallback(DependencyObject dependencyObj
                     BlurAmount = control.BlurFactor
                 };
 
+                control._altBlurEffect = new GaussianBlurEffect
+                {
+                    Source = control._altBackBitmap,
+                    BlurAmount = control.BlurFactor
+                };
+
                 var fadeOut = new Storyboard();
                 var daOut = new DoubleAnimation
                 {
-                    From = 0.6,
-                    To = 1.0,
+                    //From = 0.6,
+                    //To = 1.0,
+                    From = 1.0,
+                    To = 0.0,
                     Duration = new Duration(TimeSpan.FromMilliseconds(300)),
                     AutoReverse = false
                 };
-                Storyboard.SetTarget(daOut, control.OpacityLayer);
+
+                //Storyboard.SetTarget(daOut, control.OpacityLayer);
+                Storyboard.SetTarget(daOut, control.BlurredImage);
                 Storyboard.SetTargetProperty(daOut, "Opacity");
                 fadeOut.Children.Add(daOut);
                 var fadeIn = new Storyboard();
                 var daIn = new DoubleAnimation
                 {
-                    From = 1.0,
-                    To = 0.6,
+                    //From = 0.6,
+                    //To = 1.0,
+                    From = 0.0,
+                    To = 1.0,
                     Duration = new Duration(TimeSpan.FromMilliseconds(300)),
                     AutoReverse = false
                 };
-                Storyboard.SetTarget(daIn, control.OpacityLayer);
+                //Storyboard.SetTarget(daIn, control.OpacityLayer);
+                Storyboard.SetTarget(daIn, control.BlurredImage);
                 Storyboard.SetTargetProperty(daIn, "Opacity");
                 fadeIn.Children.Add(daIn);
+                fadeIn.Completed += (sender, o) =>
+                {
+                    control.BlurredBackImage.Invalidate();
+                };
                 fadeOut.Begin();
                 fadeOut.Completed += (sender, o) =>
                 {
@@ -141,30 +167,61 @@ private void BlurredImage_Draw(CanvasControl sender, CanvasDrawEventArgs args)
                 var imageHeight = _backgroundBitmap.Bounds.Height;
                 var imageWidth = _backgroundBitmap.Bounds.Width;
 
-                var scale = Math.Min(BlurredImage.ActualWidth/imageWidth, BlurredImage.ActualHeight/imageHeight);
+                var scale = Math.Min(BlurredImage.ActualWidth / imageWidth, BlurredImage.ActualHeight / imageHeight);
 
                 double xOffset = 0, yOffset = 0;
-                if (Math.Abs(imageWidth*scale - BlurredImage.ActualWidth) < 1)
+                if (Math.Abs(imageWidth * scale - BlurredImage.ActualWidth) < 1)
                 {
                     // Basically the same width, we need to scale up for the height to fit
-                    var newScale = BlurredImage.ActualHeight/(imageHeight*scale);
+                    var newScale = BlurredImage.ActualHeight / (imageHeight * scale);
                     scale *= newScale;
                 }
                 else
                 {
-                    var newScale = BlurredImage.ActualWidth/(imageWidth*scale);
+                    var newScale = BlurredImage.ActualWidth / (imageWidth * scale);
                     scale *= newScale;
                 }
 
-                yOffset = (BlurredImage.ActualHeight - imageHeight*scale)/2.0;
-                xOffset = (BlurredImage.ActualWidth - imageWidth*scale)/2.0;
+                yOffset = (BlurredImage.ActualHeight - imageHeight * scale) / 2.0;
+                xOffset = (BlurredImage.ActualWidth - imageWidth * scale) / 2.0;
 
                 args.DrawingSession.DrawImage(_blurEffect,
-                    new Rect(xOffset, yOffset, imageWidth*scale, imageHeight*scale),
+                    new Rect(xOffset, yOffset, imageWidth * scale, imageHeight * scale),
                     _backgroundBitmap.Bounds);
             }
         }
 
+        private void AltBlurredImage_Draw(CanvasControl sender, CanvasDrawEventArgs args)
+        {
+            if (_altBackBitmap != null)
+            {
+                var imageHeight = _altBackBitmap.Bounds.Height;
+                var imageWidth = _altBackBitmap.Bounds.Width;
+
+                var scale = Math.Min(BlurredImage.ActualWidth / imageWidth, BlurredImage.ActualHeight / imageHeight);
+
+                double xOffset = 0, yOffset = 0;
+                if (Math.Abs(imageWidth * scale - BlurredImage.ActualWidth) < 1)
+                {
+                    // Basically the same width, we need to scale up for the height to fit
+                    var newScale = BlurredImage.ActualHeight / (imageHeight * scale);
+                    scale *= newScale;
+                }
+                else
+                {
+                    var newScale = BlurredImage.ActualWidth / (imageWidth * scale);
+                    scale *= newScale;
+                }
+
+                yOffset = (BlurredImage.ActualHeight - imageHeight * scale) / 2.0;
+                xOffset = (BlurredImage.ActualWidth - imageWidth * scale) / 2.0;
+
+                args.DrawingSession.DrawImage(_blurEffect,
+                    new Rect(xOffset, yOffset, imageWidth * scale, imageHeight * scale),
+                    _altBackBitmap.Bounds);
+            }
+        }
+
         private void BlurredImage_CreateResources(CanvasControl sender, CanvasCreateResourcesEventArgs args)
         {
             args.TrackAsyncAction(CreateResourcesAsync(sender).AsAsyncAction());
@@ -177,12 +234,21 @@ private async Task CreateResourcesAsync(CanvasControl sender)
             {
 #if !EFCOREHACK
                 _backgroundBitmap =
-                    await CanvasBitmap.LoadAsync(sender, ((BitmapImage) BackgroundImageSource).UriSource);
+                    await CanvasBitmap.LoadAsync(sender, ((BitmapImage)BackgroundImageSource).UriSource);
                 _blurEffect = new GaussianBlurEffect
                 {
                     Source = _backgroundBitmap,
                     BlurAmount = BlurFactor
                 };
+
+                _altBackBitmap =
+                    await CanvasBitmap.LoadAsync(sender, ((BitmapImage)BackgroundImageSource).UriSource);
+
+                _altBlurEffect = new GaussianBlurEffect
+                {
+                    Source = _altBackBitmap,
+                    BlurAmount = BlurFactor
+                };
 #endif
             }
         }