Merge branch 'main' of https://github.com/SixLabors/ImageSharp.Interactive into main

ImageSharp.Interactive.v3.ncrunchsolution

@@ -0,0 +1,6 @@
+<SolutionConfiguration>
+  <Settings>
+    <AllowParallelTestExecution>True</AllowParallelTestExecution>
+    <SolutionConfigured>True</SolutionConfigured>
+  </Settings>
+</SolutionConfiguration>

README.md

@@ -14,5 +14,16 @@ SixLabors.ImageSharp.Interactive
 
 </div>
 
-### A [.NET Interactive](https://github.com/dotnet/interactive/) implementation using ImageSharp
+### A [.NET Interactive](https://github.com/dotnet/interactive/) extension for ImageSharp
+
+Load the nuget pacakge and then you can display images
+```csharp --project
+using SixLabors.ImageSharp;
+using SixLabors.ImageSharp.Interactive;
+using SixLabors.ImageSharp.PixelFormats;
+
+var image = new Image<Rgb24>(100, 100);
+image.Mutate(c => c.BackgroundColor(Color.AliceBlue));
+image.Display(); 
+```
 

src/ImageSharp.Interactive/ImageSharp.Interactive.csproj

@@ -26,4 +26,9 @@
     <PackageReference Include="SixLabors.ImageSharp" Version="1.0.3" />
   </ItemGroup>
 
+  <ItemGroup>
+    <None Include="$(OutputPath)/SixLabors.ImageSharp.Interactive.dll" Pack="true" PackagePath="interactive-extensions/dotnet" />
+  </ItemGroup>
+
+
 </Project>

src/ImageSharp.Interactive/KernelExtension.cs

@@ -6,12 +6,11 @@ using System.Threading.Tasks;
 using Microsoft.DotNet.Interactive;
 using Microsoft.DotNet.Interactive.Commands;
 using Microsoft.DotNet.Interactive.Formatting;
-using SixLabors.ImageSharp;
 using SixLabors.ImageSharp.Formats;
 using SixLabors.ImageSharp.Formats.Gif;
 using SixLabors.ImageSharp.Formats.Png;
 
-namespace ImageSharp.Interactive
+namespace SixLabors.ImageSharp.Interactive
 {
     /// <summary>
     /// A <see cref="IKernelExtension"/> implementation adding support for ImageSharp images.
@@ -21,13 +20,7 @@ namespace ImageSharp.Interactive
         /// <inheritdoc/>
         public Task OnLoadAsync(Kernel kernel)
         {
-            Formatter.Register<Image>(
+            RegisterFormatters();
-                (image, writer) =>
-            {
-                string id = Guid.NewGuid().ToString("N");
-                PocketView imgTag = CreateImgTag(image, id, image.Height, image.Width);
-                writer.Write(imgTag);
-            }, HtmlFormatter.MimeType);
 
             return kernel.SendAsync(
                 new DisplayValue(new FormattedValue(
@@ -35,12 +28,24 @@ namespace ImageSharp.Interactive
                     $"Added support for SixLabors.ImageSharp to kernel {kernel.Name}.")));
         }
 
+        /// <summary>
+        /// Registers the formatters.
+        /// </summary>
+        public static void RegisterFormatters() => Formatter.Register<Image>(
+                (image, writer) =>
+                {
+                    var id = Guid.NewGuid().ToString("N");
+                    PocketView imgTag = CreateImgTag(image, id, image.Height, image.Width);
+                    writer.Write(imgTag);
+                }, HtmlFormatter.MimeType);
+
         private static PocketView CreateImgTag(Image image, string id, int height, int width)
         {
             IImageFormat format = image.Frames.Count > 1
                 ? (IImageFormat)GifFormat.Instance
                 : PngFormat.Instance;
-            string imageSource = image.ToBase64String(format);
+
+            var imageSource = image.ToBase64String(format);
 
             return (PocketView)PocketViewTags.img[id: id, src: imageSource, height: height, width: width]();
         }

tests/ImageSharp.Interactive.Tests/FormatterTests.cs

@@ -0,0 +1,53 @@
+// Copyright (c) Six Labors.
+// Licensed under the Apache License, Version 2.0.
+
+using System;
+using System.Threading.Tasks;
+using AngleSharp.Dom;
+using AngleSharp.Html.Dom;
+using AngleSharp.Html.Parser;
+using Microsoft.DotNet.Interactive.Formatting;
+using SixLabors.ImageSharp;
+using SixLabors.ImageSharp.Interactive;
+using SixLabors.ImageSharp.PixelFormats;
+using Xunit;
+
+namespace ImageSharp.Interactive.Tests
+{
+    public class FormatterTests : IDisposable
+    {
+        public FormatterTests() => KernelExtension.RegisterFormatters();
+
+        [Fact]
+        public async Task ImageIsFormattedAsPng()
+        {
+            using var image = new Image<Rgb24>(Configuration.Default, 400, 400, Color.Black);
+            string html = image.ToDisplayString(HtmlFormatter.MimeType);
+            var parser = new HtmlParser();
+            IHtmlDocument document = await parser.ParseDocumentAsync(html);
+            IElement img = document.QuerySelector("img");
+            Assert.NotNull(img);
+            Assert.Contains("data:image/png;base64,", img.Attributes["src"].Value);
+        }
+
+        [Fact]
+        public async Task AnImageWithMultipleFramesIsFormattedAsGif()
+        {
+            using var image = new Image<Rgba32>(Configuration.Default, 400, 400, Color.Coral);
+            for (int i = 0; i < 10; ++i)
+            {
+                var frame = new Image<Rgba32>(Configuration.Default, 400, 400, Color.Black);
+                image.Frames.AddFrame(frame.Frames[0]);
+            }
+
+            string html = image.ToDisplayString(HtmlFormatter.MimeType);
+            var parser = new HtmlParser();
+            IHtmlDocument document = await parser.ParseDocumentAsync(html);
+            IElement img = document.QuerySelector("img");
+            Assert.NotNull(img);
+            Assert.Contains("data:image/gif;base64,", img.Attributes["src"].Value);
+        }
+
+        public void Dispose() => Formatter.ResetToDefault();
+    }
+}

tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj

@@ -5,4 +5,9 @@
     <TargetFramework>netcoreapp3.1</TargetFramework>
   </PropertyGroup>
 
+  <ItemGroup>
+    <PackageReference Include="AngleSharp" Version="0.16.0" />
+    <PackageReference Include="SixLabors.ImageSharp.Drawing" Version="1.0.0-beta13" />
+  </ItemGroup>
+
 </Project>

tests/ImageSharp.Interactive.Tests/UnitTest1.cs

@@ -1,15 +0,0 @@
-// Copyright (c) Six Labors.
-// Licensed under the Apache License, Version 2.0.
-
-using Xunit;
-
-namespace ImageSharp.Interactive.Tests
-{
-    public class UnitTest1
-    {
-        [Fact]
-        public void Test1()
-        {
-        }
-    }
-}