Add tooltip to File

src/modules/peek/Peek.Common/Helpers/ReadableStringHelper.cs

@@ -0,0 +1,57 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+namespace Peek.Common.Helpers
+{
+    using System;
+    using System.Collections.Generic;
+    using Windows.ApplicationModel.Resources;
+
+    public static class ReadableStringHelper
+    {
+        private const int DecimalPercision = 10;
+
+        public static string BytesToReadableString(ulong bytes)
+        {
+            var resourceLoader = ResourceLoader.GetForViewIndependentUse();
+            List<string> format = new List<string>
+            {
+                resourceLoader.GetString("ReadableString_ByteAbbreviationFormat"),     // "B"
+                resourceLoader.GetString("ReadableString_KiloByteAbbreviationFormat"), // "KB"
+                resourceLoader.GetString("ReadableString_MegaByteAbbreviationFormat"), // "MB"
+                resourceLoader.GetString("ReadableString_GigaByteAbbreviationFormat"), // "GB"
+                resourceLoader.GetString("ReadableString_TeraByteAbbreviationFormat"), // "TB"
+                resourceLoader.GetString("ReadableString_PetaByteAbbreviationFormat"), // "PB"
+                resourceLoader.GetString("ReadableString_ExaByteAbbreviationFormat"),  // "EB"
+            };
+
+            int index = 0;
+            double number = 0.0;
+
+            if (bytes > 0)
+            {
+                index = (int)Math.Floor(Math.Log(bytes) / Math.Log(1024));
+                number = Math.Round((bytes / Math.Pow(1024, index)) * DecimalPercision) / DecimalPercision;
+            }
+
+            return string.Format(format[index], number);
+        }
+
+        public static string FormatResourceString(string resourceId, object? args)
+        {
+            var formatString = ResourceLoader.GetForViewIndependentUse().GetString(resourceId);
+            var formattedString = string.Format(formatString, args);
+
+            return formattedString;
+        }
+
+        public static string FormatResourceString(string resourceId, object? args0, object? args1)
+        {
+            var formatString = ResourceLoader.GetForViewIndependentUse().GetString(resourceId);
+            var formattedString = string.Format(formatString, args0, args1);
+
+            return formattedString;
+        }
+    }
+}

src/modules/peek/Peek.FilePreviewer/FilePreview.xaml

@@ -5,11 +5,11 @@
     x:Class="Peek.FilePreviewer.FilePreview"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:controls="using:Peek.FilePreviewer.Controls"
     xmlns:conv="using:Peek.Common.Converters"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:local="using:Peek.FilePreviewer"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:controls="using:Peek.FilePreviewer.Controls"
     mc:Ignorable="d">
 
     <Grid>
@@ -21,14 +21,16 @@
         <Image
             x:Name="PreviewImage"
             Source="{x:Bind BitmapPreviewer.Preview, Mode=OneWay}"
+            ToolTipService.ToolTip="{x:Bind ImageInfoTooltip, Mode=OneWay}"
             Visibility="{x:Bind IsImageVisible, Mode=OneWay}" />
 
-        <controls:BrowserControl x:Name="PreviewBrowser"
-                                 x:Load="True"
-                                 Source="{x:Bind BrowserPreviewer.Preview, Mode=OneWay}"
-                                 IsNavigationCompleted="{x:Bind BrowserPreviewer.IsPreviewLoaded, Mode=TwoWay}"
-                                 Visibility="{x:Bind IsBrowserVisible, Mode=OneWay, FallbackValue=Collapsed}"
-                                 NavigationCompleted="PreviewBrowser_NavigationCompleted"/>
+        <controls:BrowserControl
+            x:Name="PreviewBrowser"
+            x:Load="True"
+            IsNavigationCompleted="{x:Bind BrowserPreviewer.IsPreviewLoaded, Mode=TwoWay}"
+            NavigationCompleted="PreviewBrowser_NavigationCompleted"
+            Source="{x:Bind BrowserPreviewer.Preview, Mode=OneWay}"
+            Visibility="{x:Bind IsBrowserVisible, Mode=OneWay, FallbackValue=Collapsed}" />
 
         <local:UnsupportedFilePreview
             DateModified="{x:Bind UnsupportedFilePreviewer.DateModified, Mode=OneWay}"

src/modules/peek/Peek.FilePreviewer/FilePreview.xaml.cs

@@ -10,6 +10,7 @@ namespace Peek.FilePreviewer
     using Microsoft.UI.Xaml;
     using Microsoft.UI.Xaml.Controls;
     using Microsoft.UI.Xaml.Media.Imaging;
+    using Peek.Common.Helpers;
     using Peek.Common.Models;
     using Peek.FilePreviewer.Models;
     using Peek.FilePreviewer.Previewers;
@@ -36,7 +37,9 @@ namespace Peek.FilePreviewer
         [NotifyPropertyChangedFor(nameof(IsUnsupportedPreviewVisible))]
         [NotifyPropertyChangedFor(nameof(BrowserPreviewer))]
         [NotifyPropertyChangedFor(nameof(IsBrowserVisible))]
+        [NotifyPropertyChangedFor(nameof(ImageInfoTooltip))]
         private IPreviewer? previewer;
+        private string imageTooltip = "No file yet";
 
         public FilePreview()
         {
@@ -49,6 +52,8 @@ namespace Peek.FilePreviewer
 
         public bool IsImageVisible => BitmapPreviewer != null;
 
+        public string ImageInfoTooltip => imageTooltip;
+
         public IUnsupportedFilePreviewer? UnsupportedFilePreviewer => Previewer as IUnsupportedFilePreviewer;
 
         public bool IsUnsupportedPreviewVisible => UnsupportedFilePreviewer != null;
@@ -90,6 +95,8 @@ namespace Peek.FilePreviewer
                 PreviewSizeChanged?.Invoke(this, new PreviewSizeChangedArgs(size));
                 await Previewer.LoadPreviewAsync();
             }
+
+            await UpdateImageTooltipAsync();
         }
 
         private void PreviewBrowser_NavigationCompleted(WebView2 sender, Microsoft.Web.WebView2.Core.CoreWebView2NavigationCompletedEventArgs args)
@@ -97,5 +104,33 @@ namespace Peek.FilePreviewer
             // Once browser has completed navigation it is ready to be visible
             OnPropertyChanged(nameof(IsBrowserVisible));
         }
+
+        private async Task UpdateImageTooltipAsync()
+        {
+            if (File == null)
+            {
+                return;
+            }
+
+            imageTooltip = string.Empty;
+
+            // Fetch and format available file properties
+            imageTooltip += ReadableStringHelper.FormatResourceString("PreviewTooltip_FileName", File.FileName);
+
+            string fileType = await PropertyHelper.GetFileType(File.Path);
+            imageTooltip += string.IsNullOrEmpty(fileType) ? string.Empty : "\n" + ReadableStringHelper.FormatResourceString("PreviewTooltip_FileType", fileType);
+
+            string dateModified = File.DateModified.ToString();
+            imageTooltip += string.IsNullOrEmpty(dateModified) ? string.Empty : "\n" + ReadableStringHelper.FormatResourceString("PreviewTooltip_DateModified", dateModified);
+
+            Size dimensions = await PropertyHelper.GetImageSize(File.Path);
+            imageTooltip += dimensions.IsEmpty ? string.Empty : "\n" + ReadableStringHelper.FormatResourceString("PreviewTooltip_Dimensions", dimensions.Width, dimensions.Height);
+
+            ulong bytes = await PropertyHelper.GetFileSizeInBytes(File.Path);
+            string fileSize = ReadableStringHelper.BytesToReadableString(bytes);
+            imageTooltip += string.IsNullOrEmpty(fileSize) ? string.Empty : "\n" + ReadableStringHelper.FormatResourceString("PreviewTooltip_FileSize", fileSize);
+
+            OnPropertyChanged(nameof(ImageInfoTooltip));
+        }
     }
 }

src/modules/peek/Peek.FilePreviewer/Previewers/Helpers/IconHelper.cs

@@ -2,7 +2,7 @@
 // The Microsoft Corporation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
-namespace Peek.FilePreviewer.Previewers
+namespace Peek.FilePreviewer.Previewers.Helpers
 {
     using System;
     using System.Drawing;

src/modules/peek/Peek.FilePreviewer/Previewers/Helpers/ReadableStringHelper.cs

@@ -1,40 +0,0 @@
-// Copyright (c) Microsoft Corporation
-// The Microsoft Corporation licenses this file to you under the MIT license.
-// See the LICENSE file in the project root for more information.
-
-namespace Peek.FilePreviewer.Previewers
-{
-    using System;
-    using System.Collections.Generic;
-
-    public static class ReadableStringHelper
-    {
-        private const int DecimalPercision = 10;
-
-        public static string BytesToReadableString(ulong bytes)
-        {
-            // TODO: get string from resources
-            List<string> format = new List<string>
-            {
-                "B",
-                "KB",
-                "MB",
-                "GB",
-                "TB",
-                "PB",
-                "EB",
-            };
-
-            int index = 0;
-            double number = 0.0;
-
-            if (bytes > 0)
-            {
-                index = (int)Math.Floor(Math.Log(bytes) / Math.Log(1024));
-                number = Math.Round((bytes / Math.Pow(1024, index)) * DecimalPercision) / DecimalPercision;
-            }
-
-            return string.Concat(number, format[index]);
-        }
-    }
-}

src/modules/peek/Peek.FilePreviewer/Previewers/UnsupportedFilePreviewer/UnsupportedFilePreviewer.cs

@@ -13,6 +13,8 @@ namespace Peek.FilePreviewer.Previewers
     using Microsoft.UI.Dispatching;
     using Microsoft.UI.Xaml.Media.Imaging;
     using Peek.Common;
+    using Peek.Common.Helpers;
+    using Peek.FilePreviewer.Previewers.Helpers;
     using Windows.Foundation;
     using File = Peek.Common.Models.File;
 

src/modules/peek/Peek.FilePreviewer/UnsupportedFilePreview.xaml

@@ -35,22 +35,9 @@
                 FontSize="26"
                 FontWeight="SemiBold"
                 Text="{x:Bind FileName, Mode=OneWay}" />
-
-            <!--  TODO: move strings to resw  -->
-            <StackPanel Orientation="Horizontal">
-                <TextBlock Text="File Type: " />
-                <TextBlock Text="{x:Bind FileType, Mode=OneWay}" />
-            </StackPanel>
-
-            <StackPanel Orientation="Horizontal">
-                <TextBlock Text="Size: " />
-                <TextBlock Text="{x:Bind FileSize, Mode=OneWay}" />
-            </StackPanel>
-
-            <StackPanel Orientation="Horizontal">
-                <TextBlock Text="Date Modified: " />
-                <TextBlock Text="{x:Bind DateModified, Mode=OneWay}" />
-            </StackPanel>
+            <TextBlock Text="{x:Bind FormattedFileType, Mode=OneWay}" />
+            <TextBlock Text="{x:Bind FormattedFileSize, Mode=OneWay}" />
+            <TextBlock Text="{x:Bind FormattedDateModified, Mode=OneWay}" />
         </StackPanel>
     </Grid>
 </UserControl>

src/modules/peek/Peek.FilePreviewer/UnsupportedFilePreview.xaml.cs

@@ -7,6 +7,7 @@ namespace Peek.FilePreviewer
     using CommunityToolkit.Mvvm.ComponentModel;
     using Microsoft.UI.Xaml.Controls;
     using Microsoft.UI.Xaml.Media.Imaging;
+    using Peek.Common.Helpers;
 
     [INotifyPropertyChanged]
     public sealed partial class UnsupportedFilePreview : UserControl
@@ -18,14 +19,23 @@ namespace Peek.FilePreviewer
         private string? fileName;
 
         [ObservableProperty]
+        [NotifyPropertyChangedFor(nameof(FormattedFileType))]
         private string? fileType;
 
         [ObservableProperty]
+        [NotifyPropertyChangedFor(nameof(FormattedFileSize))]
         private string? fileSize;
 
         [ObservableProperty]
+        [NotifyPropertyChangedFor(nameof(FormattedDateModified))]
         private string? dateModified;
 
+        public string FormattedFileType => ReadableStringHelper.FormatResourceString("UnsupportedFile_FileType", FileType);
+
+        public string FormattedFileSize => ReadableStringHelper.FormatResourceString("UnsupportedFile_FileSize", FileSize);
+
+        public string FormattedDateModified => ReadableStringHelper.FormatResourceString("UnsupportedFile_DateModified", DateModified);
+
         public UnsupportedFilePreview()
         {
             this.InitializeComponent();

src/modules/peek/Peek.UI/Strings/en-us/Resources.resw

@@ -141,4 +141,64 @@
     <value>Open with {0} (Enter)</value>
     <comment>Tooltip for button to launch default application. 0: name of the default application.</comment>
   </data>
+  <data name="UnsupportedFile_FileType" xml:space="preserve">
+    <value>File Type: {0}</value>
+    <comment>File Type label for the unsupported files view. {0} is the type,</comment>
+  </data>
+  <data name="UnsupportedFile_FileSize" xml:space="preserve">
+    <value>Size: {0}</value>
+    <comment>File Size label for the unsupported files view. {0} is the size,</comment>
+  </data>
+  <data name="UnsupportedFile_DateModified" xml:space="preserve">
+    <value>Date Modified: {0}</value>
+    <comment>Date Modified label for the unsupported files view. {0} is the date</comment>
+  </data>
+  <data name="ReadableString_ByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} B</value>
+    <comment>Abbrivation for the size unit byte.</comment>
+  </data>
+  <data name="ReadableString_KiloByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} KB</value>
+    <comment>Abbrivation for the size unit kilobyte.</comment>
+  </data>
+  <data name="ReadableString_MegaByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} MB</value>
+    <comment>Abbrivation for the size unit megabyte.</comment>
+  </data>
+  <data name="ReadableString_GigaByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} GB</value>
+    <comment>Abbrivation for the size unit gigabyte.</comment>
+  </data>
+  <data name="ReadableString_TeraByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} TB</value>
+    <comment>Abbrivation for the size unit terabyte.</comment>
+  </data>
+  <data name="ReadableString_PetaByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} PB</value>
+    <comment>Abbrivation for the size unit petabyte.</comment>
+  </data>
+  <data name="ReadableString_ExaByteAbbreviationFormat" xml:space="preserve">
+    <value>{0} EB</value>
+    <comment>Abbrivation for the size unit exabyte.</comment>
+  </data>
+  <data name="PreviewTooltip_FileName" xml:space="preserve">
+    <value>Filename: {0}</value>
+    <comment>Filename for the tooltip of preview. {0} is the name.</comment>
+  </data>
+  <data name="PreviewTooltip_FileType" xml:space="preserve">
+    <value>Item Type: {0}</value>
+    <comment>Item Type for the tooltip of preview. {0} is the type.</comment>
+  </data>
+	<data name="PreviewTooltip_DateModified" xml:space="preserve">
+    <value>Date Modified: {0}</value>
+    <comment>Date Modified label for the tooltip of preview. {0} is the date.</comment>
+  </data>
+  <data name="PreviewTooltip_Dimensions" xml:space="preserve">
+    <value>Dimensions: {0} x {1}</value>
+    <comment>Dimensions label for the tooltip of preview. {0} is the width, {1} is the height.</comment>
+  </data>
+  <data name="PreviewTooltip_FileSize" xml:space="preserve">
+    <value>Size: {0}</value>
+    <comment>File Size label for the tooltip of preview. {0} is the size.</comment>
+  </data>
 </root>