summaryrefslogtreecommitdiff
path: root/internal/glightbox
diff refs
from: back
to: back
| flip
diff options
context:
space:
mode:
Diffstat (limited to 'internal/glightbox')
-rw-r--r--internal/glightbox/block.go6
-rw-r--r--internal/glightbox/html_renderer.go110
-rw-r--r--internal/glightbox/parser.go25
3 files changed, 35 insertions, 106 deletions
diff --git a/internal/glightbox/block.go b/internal/glightbox/block.go
index 30cda1c..696f328 100644
--- a/internal/glightbox/block.go
+++ b/internal/glightbox/block.go
@@ -9,14 +9,12 @@ import (
// GLightboxBlock represents a light gallery block in the AST
type GLightboxBlock struct {
ast.BaseBlock
- Images []GLightboxImage
- Location *time.Location
- Namespace string
+ Images []GLightboxImage
+ Location *time.Location
}
type GLightboxImage struct {
URL string
- Tags []string
Caption []byte
}
diff --git a/internal/glightbox/html_renderer.go b/internal/glightbox/html_renderer.go
index ac34880..43d4790 100644
--- a/internal/glightbox/html_renderer.go
+++ b/internal/glightbox/html_renderer.go
@@ -4,14 +4,11 @@ import (
"bytes"
"fmt"
"math/rand"
- "regexp"
"strings"
"time"
- "github.com/SayaAndy/saya-today-web/internal/tailwind"
"github.com/yuin/goldmark"
"github.com/yuin/goldmark/ast"
- "github.com/yuin/goldmark/parser"
"github.com/yuin/goldmark/renderer"
"github.com/yuin/goldmark/renderer/html"
"github.com/yuin/goldmark/util"
@@ -19,36 +16,22 @@ import (
type GLightboxHTMLRenderer struct {
html.Config
- md goldmark.Markdown
- anchorMatchRe *regexp.Regexp
+ md goldmark.Markdown
}
func NewGLightboxHTMLRenderer(opts ...html.Option) renderer.NodeRenderer {
r := &GLightboxHTMLRenderer{
Config: html.NewConfig(),
md: goldmark.New(
- goldmark.WithParserOptions(
- parser.WithAutoHeadingID(),
- parser.WithAttribute(),
- ),
- goldmark.WithRenderer(
- renderer.NewRenderer(
- renderer.WithNodeRenderers(
- util.Prioritized(tailwind.NewCustomLinkRenderer(
- html.WithUnsafe(), html.WithHardWraps(), html.WithXHTML(),
- ), 50),
- util.Prioritized(html.NewRenderer(
- html.WithUnsafe(), html.WithHardWraps(), html.WithXHTML(),
- ), 100),
- ),
- ),
+ goldmark.WithRendererOptions(
+ html.WithHardWraps(),
+ html.WithXHTML(),
),
),
}
for _, opt := range opts {
opt.SetHTMLOption(&r.Config)
}
- r.anchorMatchRe = regexp.MustCompile(`(?s)<\s*a(\s+[^<]*)(href\s*=\s*["'].*?["'])\s*([^<]*)>(.*?)<\s*\/\s*a\s*>`)
return r
}
@@ -68,8 +51,7 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte,
var elements []string
for i, img := range gallery.Images {
- fullImageUrl := gallery.Namespace + img.URL
- imageUrlSegments := strings.Split(fullImageUrl, ".")
+ imageUrlSegments := strings.Split(img.URL, ".")
imageUrlWithoutExt := strings.Join(imageUrlSegments[:len(imageUrlSegments)-1], ".")
imageUrlParts := strings.Split(imageUrlWithoutExt, "/")
imageNameParts := strings.Split(imageUrlParts[len(imageUrlParts)-1], "-")
@@ -96,34 +78,11 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte,
dataDescriptionAttribute = fmt.Sprintf("data-description=\".%s\"", glightboxDescId)
}
- tagClassList := make([]string, 0, len(img.Tags))
- for _, tag := range img.Tags {
- switch tag {
- case "2x":
- tagClassList = append(tagClassList, "grid-item-2x")
- }
- }
-
- if len(img.Caption) > 0 {
- tagClassList = append(tagClassList, "grid-tooltip")
- }
-
- anchorlessCaptionHTML := r.anchorMatchRe.ReplaceAll(captionHTML, []byte("<span class=\"linklike\" $1 $3>$4</span>"))
-
elements = append(elements, fmt.Sprintf(`
- <a href="https://f003.backblazeb2.com/file/sayana-photos/full/%s" class="glightbox grid-item %s grid-item-%s p-1"
- data-gallery="gallery" data-title="%s" %s>
- <picture>
- <source media="(width < 800px)" srcset="https://f003.backblazeb2.com/file/sayana-photos/webp-320p/%s.webp" />
- <source media="(width < 2400px)" srcset="https://f003.backblazeb2.com/file/sayana-photos/webp-560p/%s.webp" />
- <source media="(width < 3200px)" srcset="https://f003.backblazeb2.com/file/sayana-photos/webp-800p/%s.webp" />
- <source media="(width < 4000px)" srcset="https://f003.backblazeb2.com/file/sayana-photos/webp-1200p/%s.webp" />
- <source media="(width >= 4000px)" srcset="https://f003.backblazeb2.com/file/sayana-photos/webp-1600p/%s.webp" />
- <img src="https://f003.backblazeb2.com/file/sayana-photos/webp-560p/%s.webp" />
- </picture>
- <span class="grid-tooltip-text"><p>%s</p></span>
- <span class="grid-item-index">%d</span>
- </a>`, fullImageUrl, strings.Join(tagClassList, " "), galleryID, dayDate.Format("2006-01-02 15:04:05 -07:00"), dataDescriptionAttribute, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, anchorlessCaptionHTML, i+1))
+ <a href="https://f003.backblazeb2.com/file/sayana-photos/full/%s" class="glightbox-%s grid-item grid-item-%s"
+ data-gallery="gallery-%s" data-title="%s" %s>
+ <img src="https://f003.backblazeb2.com/file/sayana-photos/webp-320p/%s.webp" class="rounded-md p-1" alt="webp thumbnail" />
+ </a>`, img.URL, galleryID, galleryID, galleryID, dayDate.Format("2006-01-02 15:04:05 -07:00"), dataDescriptionAttribute, imageUrlWithoutExt))
if glightboxDescId != "" {
elements = append(elements, fmt.Sprintf(`
@@ -133,43 +92,32 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte,
}
}
- w.WriteString(strings.ReplaceAll(`
-<div class="items-center flex flex-col">
- <hr class="border-t-3 border-dotted border-main-hard mt-1 mb-2 w-[80%%] ml-auto mr-auto">
- <div class="grid masonry-grid-{id}">
- <div class="grid-sizer grid-sizer-{id}"></div>
- `+strings.Join(elements, "\n")+`
+ w.WriteString(fmt.Sprintf(`
+<div class="justify-content-center display-block m-1">
+ <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
+ <div class="grid masonry-grid-%s">
+ <div class="grid-sizer grid-sizer-%s"></div>
+ %s
</div>
- <hr class="border-t-3 border-dotted border-main-hard mt-1 mb-2 w-[80%%] ml-auto mr-auto">
-</div>
+ <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
+</div>`, galleryID, galleryID, strings.Join(elements, "\n")))
+ w.WriteString(fmt.Sprintf(`
<script>
- var pckry_{id} = new Packery('.masonry-grid-{id}', {
- itemSelector: '.grid-item-{id}',
- columnWidth: '.grid-sizer-{id}',
- percentPosition: false
+ var lightbox_%s = GLightbox({
+ selector: '.glightbox-%s'
});
- var imgLoad_{id}_timer;
- var imgLoad_{id} = imagesLoaded('.masonry-grid-{id}');
-
- function initMasonryLayout_{id}(tm) {
- clearTimeout(imgLoad_{id}_timer);
- imgLoad_{id}_timer = setTimeout(() => pckry_{id}.layout(), 100);
- }
-
- imgLoad_{id}.on('progress', initMasonryLayout_{id});
-
- window.addEventListener('resize', initMasonryLayout_{id});
+ var msnry_%s = new Masonry('.masonry-grid-%s', {
+ itemSelector: '.grid-item-%s',
+ columnWidth: '.grid-sizer-%s',
+ percentPosition: true
+ });
- document.addEventListener('popout', (e) => {
- window.removeEventListener('resize', initMasonryLayout_{id});
- imgLoad_{id}.off('progress', initMasonryLayout_{id});
- initMasonryLayout_{id} = null;
- imgLoad_{id} = null;
- }, {once: true});
-</script>
-`, "{id}", galleryID))
+ imagesLoaded('.masonry-grid-%s', function() {
+ msnry_%s.layout();
+ });
+</script>`, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID))
}
return ast.WalkContinue, nil
diff --git a/internal/glightbox/parser.go b/internal/glightbox/parser.go
index b376034..ba3f22e 100644
--- a/internal/glightbox/parser.go
+++ b/internal/glightbox/parser.go
@@ -4,7 +4,6 @@ import (
"bytes"
"log/slog"
"regexp"
- "strings"
"time"
"github.com/yuin/goldmark/ast"
@@ -29,7 +28,7 @@ func (p *GLightboxParser) Open(parent ast.Node, reader text.Reader, pc parser.Co
return nil, parser.NoChildren
}
- r := regexp.MustCompile(`^\{Gallery:([A-Za-z0-9\+\-/]+)(:([A-Za-z0-9\+\-/]+))?\}$`)
+ r := regexp.MustCompile(`^\{Gallery:([A-Za-z0-9\+\-/]+)\}$`)
trimmed := bytes.TrimSpace(line)
parts := r.FindSubmatch(trimmed)
@@ -44,12 +43,7 @@ func (p *GLightboxParser) Open(parent ast.Node, reader text.Reader, pc parser.Co
return nil, parser.NoChildren
}
- ns := ""
- if len(parts) >= 4 {
- ns = string(parts[3])
- }
-
- return &GLightboxBlock{Location: loc, Namespace: ns}, parser.NoChildren
+ return &GLightboxBlock{Location: loc}, parser.NoChildren
}
func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.Context) parser.State {
@@ -66,27 +60,16 @@ func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.
gallery := node.(*GLightboxBlock)
- parts := bytes.SplitN(trimmed, []byte{'|'}, 3)
+ parts := bytes.SplitN(trimmed, []byte{'|'}, 2)
url := bytes.TrimSpace(parts[0])
caption := make([]byte, 0)
- tagsRaw := ""
- if len(parts) == 2 {
+ if len(parts) > 1 {
caption = bytes.TrimSpace(parts[1])
}
- if len(parts) >= 3 {
- tagsRaw = string(parts[1])
- caption = bytes.TrimSpace(parts[2])
- }
-
- tags := strings.Split(tagsRaw, ",")
- for i := range tags {
- tags[i] = strings.TrimSpace(tags[i])
- }
gallery.Images = append(gallery.Images, GLightboxImage{
URL: string(url),
- Tags: tags,
Caption: caption,
})