From c2a57baf01f278fb2a7b0b4a60ed89ebed93fec6 Mon Sep 17 00:00:00 2001 From: Diego Colombo Date: Thu, 15 Jul 2021 02:19:55 +0100 Subject: [PATCH 1/5] first pass --- README.md | 13 ++++++- src/ImageSharp.Interactive/KernelExtension.cs | 25 ++++++++----- .../FormatterTests.cs | 37 +++++++++++++++++++ .../ImageSharp.Interactive.Tests.csproj | 5 +++ .../ImageSharp.Interactive.Tests/UnitTest1.cs | 15 -------- 5 files changed, 69 insertions(+), 26 deletions(-) create mode 100644 tests/ImageSharp.Interactive.Tests/FormatterTests.cs delete mode 100644 tests/ImageSharp.Interactive.Tests/UnitTest1.cs diff --git a/README.md b/README.md index db26296..91ef931 100644 --- a/README.md +++ b/README.md @@ -14,5 +14,16 @@ SixLabors.ImageSharp.Interactive -### A [.NET Interactive](https://github.com/dotnet/interactive/) implementation using ImageSharp +### A [.NET Interactive](https://github.com/dotnet/interactive/) extension for ImageSharp + +Laod 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(100, 100); +image.Mutate(c => c.BackgroundColor(Color.AliceBlue)); +image.Display(); +``` diff --git a/src/ImageSharp.Interactive/KernelExtension.cs b/src/ImageSharp.Interactive/KernelExtension.cs index 070b171..c0f4766 100644 --- a/src/ImageSharp.Interactive/KernelExtension.cs +++ b/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 { /// /// A implementation adding support for ImageSharp images. @@ -21,13 +20,7 @@ namespace ImageSharp.Interactive /// public Task OnLoadAsync(Kernel kernel) { - Formatter.Register( - (image, writer) => - { - string id = Guid.NewGuid().ToString("N"); - PocketView imgTag = CreateImgTag(image, id, image.Height, image.Width); - writer.Write(imgTag); - }, HtmlFormatter.MimeType); + RegisterFormatters(); return kernel.SendAsync( new DisplayValue(new FormattedValue( @@ -35,12 +28,24 @@ namespace ImageSharp.Interactive $"Added support for SixLabors.ImageSharp to kernel {kernel.Name}."))); } + /// + /// Registers the formatters. + /// + public static void RegisterFormatters() => Formatter.Register( + (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](); } diff --git a/tests/ImageSharp.Interactive.Tests/FormatterTests.cs b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs new file mode 100644 index 0000000..24675e6 --- /dev/null +++ b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs @@ -0,0 +1,37 @@ +// Copyright (c) Six Labors. +// Licensed under the Apache License, Version 2.0. + +using System; +using System.Threading.Tasks; +using AngleSharp.Html.Parser; +using FluentAssertions; +using FluentAssertions.Execution; +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 Formats_image_as_png() + { + var image = new Image(100, 100); + string html = image.ToDisplayString(HtmlFormatter.MimeType); + var parser = new HtmlParser(); + AngleSharp.Html.Dom.IHtmlDocument document = await parser.ParseDocumentAsync(html); + AngleSharp.Dom.IElement img = document.QuerySelector("img"); + using var _ = new AssertionScope(); + + img.Should().NotBeNull(); + img.Attributes["src"].Value.Should().Contain("data:image/png;base64,"); + } + + public void Dispose() => Formatter.ResetToDefault(); + } +} diff --git a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj index bc78d2c..063a333 100644 --- a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj +++ b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj @@ -5,4 +5,9 @@ netcoreapp3.1 + + + + + diff --git a/tests/ImageSharp.Interactive.Tests/UnitTest1.cs b/tests/ImageSharp.Interactive.Tests/UnitTest1.cs deleted file mode 100644 index aad49d8..0000000 --- a/tests/ImageSharp.Interactive.Tests/UnitTest1.cs +++ /dev/null @@ -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() - { - } - } -} From 4f50efd6c128105ba59e6c6481ec8ddc83458677 Mon Sep 17 00:00:00 2001 From: Diego Colombo Date: Thu, 15 Jul 2021 03:50:43 +0100 Subject: [PATCH 2/5] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 91ef931..2a07e7f 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ SixLabors.ImageSharp.Interactive ### A [.NET Interactive](https://github.com/dotnet/interactive/) extension for ImageSharp -Laod the nuget pacakge and then you can display images +Load the nuget pacakge and then you can display images ```csharp --project using SixLabors.ImageSharp; using SixLabors.ImageSharp.Interactive; From 7024c186c30ed5d63247a4088772378c8102ac79 Mon Sep 17 00:00:00 2001 From: colombod Date: Thu, 15 Jul 2021 04:00:50 +0100 Subject: [PATCH 3/5] add gif formatting test --- .../FormatterTests.cs | 24 +++++++++++++++++++ .../ImageSharp.Interactive.Tests.csproj | 1 + 2 files changed, 25 insertions(+) diff --git a/tests/ImageSharp.Interactive.Tests/FormatterTests.cs b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs index 24675e6..d52b1be 100644 --- a/tests/ImageSharp.Interactive.Tests/FormatterTests.cs +++ b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs @@ -8,8 +8,10 @@ using FluentAssertions; using FluentAssertions.Execution; using Microsoft.DotNet.Interactive.Formatting; using SixLabors.ImageSharp; +using SixLabors.ImageSharp.Drawing.Processing; using SixLabors.ImageSharp.Interactive; using SixLabors.ImageSharp.PixelFormats; +using SixLabors.ImageSharp.Processing; using Xunit; namespace ImageSharp.Interactive.Tests @@ -32,6 +34,28 @@ namespace ImageSharp.Interactive.Tests img.Attributes["src"].Value.Should().Contain("data:image/png;base64,"); } + [Fact] + public async Task Formats_images_with_multiple_frames_as_gif() + { + var image = new Image(400, 400); + image.Mutate(context => context.Fill(Color.Coral)); + for (int i = 0; i < 10; ++i) + { + var frame = new Image(400, 400); + frame.Mutate(x => x.Fill(Color.Black)); + image.Frames.AddFrame(frame.Frames[0]); + } + + string html = image.ToDisplayString(HtmlFormatter.MimeType); + var parser = new HtmlParser(); + AngleSharp.Html.Dom.IHtmlDocument document = await parser.ParseDocumentAsync(html); + AngleSharp.Dom.IElement img = document.QuerySelector("img"); + using var _ = new AssertionScope(); + + img.Should().NotBeNull(); + img.Attributes["src"].Value.Should().Contain("data:image/gif;base64,"); + } + public void Dispose() => Formatter.ResetToDefault(); } } diff --git a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj index 063a333..0e60333 100644 --- a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj +++ b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj @@ -8,6 +8,7 @@ + From 346d8954d6cb5e6a881848d13fe8dbeb9ff8d5a5 Mon Sep 17 00:00:00 2001 From: colombod Date: Thu, 15 Jul 2021 10:23:52 +0100 Subject: [PATCH 4/5] Addressing PR feedback --- ImageSharp.Interactive.v3.ncrunchsolution | 6 +++ .../FormatterTests.cs | 38 ++++++++----------- .../ImageSharp.Interactive.Tests.csproj | 1 - 3 files changed, 21 insertions(+), 24 deletions(-) create mode 100644 ImageSharp.Interactive.v3.ncrunchsolution diff --git a/ImageSharp.Interactive.v3.ncrunchsolution b/ImageSharp.Interactive.v3.ncrunchsolution new file mode 100644 index 0000000..10420ac --- /dev/null +++ b/ImageSharp.Interactive.v3.ncrunchsolution @@ -0,0 +1,6 @@ + + + True + True + + \ No newline at end of file diff --git a/tests/ImageSharp.Interactive.Tests/FormatterTests.cs b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs index d52b1be..01e2da9 100644 --- a/tests/ImageSharp.Interactive.Tests/FormatterTests.cs +++ b/tests/ImageSharp.Interactive.Tests/FormatterTests.cs @@ -3,15 +3,13 @@ using System; using System.Threading.Tasks; +using AngleSharp.Dom; +using AngleSharp.Html.Dom; using AngleSharp.Html.Parser; -using FluentAssertions; -using FluentAssertions.Execution; using Microsoft.DotNet.Interactive.Formatting; using SixLabors.ImageSharp; -using SixLabors.ImageSharp.Drawing.Processing; using SixLabors.ImageSharp.Interactive; using SixLabors.ImageSharp.PixelFormats; -using SixLabors.ImageSharp.Processing; using Xunit; namespace ImageSharp.Interactive.Tests @@ -21,39 +19,33 @@ namespace ImageSharp.Interactive.Tests public FormatterTests() => KernelExtension.RegisterFormatters(); [Fact] - public async Task Formats_image_as_png() + public async Task ImageIsFormattedAsPng() { - var image = new Image(100, 100); + using var image = new Image(Configuration.Default, 400, 400, Color.Black); string html = image.ToDisplayString(HtmlFormatter.MimeType); var parser = new HtmlParser(); - AngleSharp.Html.Dom.IHtmlDocument document = await parser.ParseDocumentAsync(html); - AngleSharp.Dom.IElement img = document.QuerySelector("img"); - using var _ = new AssertionScope(); - - img.Should().NotBeNull(); - img.Attributes["src"].Value.Should().Contain("data:image/png;base64,"); + 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 Formats_images_with_multiple_frames_as_gif() + public async Task AnImageWithMultipleFramesIsFormattedAsGif() { - var image = new Image(400, 400); - image.Mutate(context => context.Fill(Color.Coral)); + using var image = new Image(Configuration.Default, 400, 400, Color.Coral); for (int i = 0; i < 10; ++i) { - var frame = new Image(400, 400); - frame.Mutate(x => x.Fill(Color.Black)); + var frame = new Image(Configuration.Default, 400, 400, Color.Black); image.Frames.AddFrame(frame.Frames[0]); } string html = image.ToDisplayString(HtmlFormatter.MimeType); var parser = new HtmlParser(); - AngleSharp.Html.Dom.IHtmlDocument document = await parser.ParseDocumentAsync(html); - AngleSharp.Dom.IElement img = document.QuerySelector("img"); - using var _ = new AssertionScope(); - - img.Should().NotBeNull(); - img.Attributes["src"].Value.Should().Contain("data:image/gif;base64,"); + 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(); diff --git a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj index 0e60333..5be943a 100644 --- a/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj +++ b/tests/ImageSharp.Interactive.Tests/ImageSharp.Interactive.Tests.csproj @@ -7,7 +7,6 @@ - From cc615b1f144c0469ee3266f7af850e5367a29d85 Mon Sep 17 00:00:00 2001 From: colombod Date: Thu, 15 Jul 2021 14:23:36 +0100 Subject: [PATCH 5/5] put package in right location for extension --- src/ImageSharp.Interactive/ImageSharp.Interactive.csproj | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/ImageSharp.Interactive/ImageSharp.Interactive.csproj b/src/ImageSharp.Interactive/ImageSharp.Interactive.csproj index d066726..0365f02 100644 --- a/src/ImageSharp.Interactive/ImageSharp.Interactive.csproj +++ b/src/ImageSharp.Interactive/ImageSharp.Interactive.csproj @@ -18,4 +18,9 @@ + + + + +