diff --git a/README.md b/README.md index 952eaf2..ae8910a 100644 --- a/README.md +++ b/README.md @@ -26,6 +26,22 @@ Render result: ``` +Multiple images are supported: + +```md +![Picture of Oscar.](/path/to/cat1.jpg) +![Picture of Luna.](/path/to/cat2.jpg) +Awesome captions about the **kitties**. +``` + +```html +
+Picture of Oscar. +Picture of Luna. +

Awesome captions about the kitties.

+
+``` + # Why? Using dedicated `
` and `
` elements makes styling images @@ -97,6 +113,11 @@ See [`figure_test.go`](/figure_test.go) for more examples. # Changelog +## v1.2.0 (2024-06-19) + +* Support multiple images (see + [#5](https://github.com/MangoUmbrella/goldmark-figure/issues/5)). + ## v1.1.0 (2024-06-18) * New option to add a link to the image when rendering the figure (see diff --git a/figure_test.go b/figure_test.go index 803fdd2..cd85e98 100644 --- a/figure_test.go +++ b/figure_test.go @@ -106,6 +106,42 @@ Last paragraph. This is the continued line with bold.

Last paragraph.

+`, + }, t) + + count++ + testutil.DoTestCase(markdown, testutil.MarkdownTestCase{ + No: count, + Description: "Two images", + Markdown: ` +![Picture of Oscar.](/path/to/cat1.jpg) +![Picture of Luna.](/path/to/cat2.jpg) +Awesome captions about the **kitties**. +`, + Expected: `
+Picture of Oscar. +Picture of Luna. +

Awesome captions about the kitties.

+
+`, + }, t) + + count++ + testutil.DoTestCase(markdown, testutil.MarkdownTestCase{ + No: count, + Description: "Three images", + Markdown: ` +![Picture of Oscar.](/path/to/cat1.jpg) +![Picture of Luna.](/path/to/cat2.jpg) +![Picture of Oreo.](/path/to/cat3.jpg) +Awesome captions about the **kitties**. +`, + Expected: `
+Picture of Oscar. +Picture of Luna. +Picture of Oreo. +

Awesome captions about the kitties.

+
`, }, t) @@ -133,6 +169,27 @@ This is caption.

This is caption.

+`, + }, t) + + count++ + testutil.DoTestCase(markdown, testutil.MarkdownTestCase{ + No: count, + Description: "Multi images", + Markdown: ` +![Picture of Oscar.](/path/to/cat1.jpg) +![Picture of Luna.](/path/to/cat2.jpg) +Awesome captions about the **kitties**. +`, + Expected: `
+ +Picture of Oscar. + + +Picture of Luna. + +

Awesome captions about the kitties.

+
`, }, t) } diff --git a/parser/parser.go b/parser/parser.go index 7fb668e..441815f 100644 --- a/parser/parser.go +++ b/parser/parser.go @@ -32,8 +32,9 @@ func (b *figureParagraphTransformer) Transform(node *gast.Paragraph, reader text if lines.Len() < 1 { return } + var source = reader.Source() var firstSeg = lines.At(0) - var firstLineStr = firstSeg.Value(reader.Source()) + var firstLineStr = firstSeg.Value(source) // Here we simply match by regex. // But this simple regex ignores image descriptions that contain other links. // E.g. ![foo ![bar](/url)](/url2). @@ -48,9 +49,24 @@ func (b *figureParagraphTransformer) Transform(node *gast.Paragraph, reader text figureImage.Lines().Append(lines.At(0)) figure.AppendChild(figure, figureImage) - if lines.Len() >= 2 { + var currentLine = 1 + for currentLine < lines.Len() { + var currentSeg = lines.At(currentLine) + var currentLineStr = currentSeg.Value(source) + if imageRegexp.Match(currentLineStr) { + // Continued images. + figureImage := fast.NewFigureImage() + figureImage.Lines().Append(lines.At(currentLine)) + figure.AppendChild(figure, figureImage) + currentLine += 1 + } else { + break + } + } + + if currentLine < lines.Len() { figureCaption := fast.NewFigureCaption() - for i := 1; i < lines.Len(); i++ { + for i := currentLine; i < lines.Len(); i++ { seg := lines.At(i) if i == lines.Len()-1 { // trim last newline(\n)