Diffstat (limited to 'internal/glightbox')
| -rw-r--r-- | internal/glightbox/block.go | 6 | ||||
| -rw-r--r-- | internal/glightbox/extension.go | 11 | ||||
| -rw-r--r-- | internal/glightbox/html_renderer.go | 128 | ||||
| -rw-r--r-- | internal/glightbox/parser.go | 25 |
4 files changed, 40 insertions, 130 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/extension.go b/internal/glightbox/extension.go index e9a9f3e..7fd17b1 100644 --- a/internal/glightbox/extension.go +++ b/internal/glightbox/extension.go @@ -1,7 +1,6 @@ package glightbox import ( - "github.com/SayaAndy/saya-today-web/config" "github.com/yuin/goldmark" "github.com/yuin/goldmark/parser" "github.com/yuin/goldmark/renderer" @@ -9,12 +8,10 @@ import ( ) // Extension that combines parser and renderer -type GLightboxExtension struct { - photoStorage config.PhotoStorageConfig -} +type GLightboxExtension struct{} -func NewGLightboxExtension(photoStorage config.PhotoStorageConfig) goldmark.Extender { - return &GLightboxExtension{photoStorage} +func NewGLightboxExtension() goldmark.Extender { + return &GLightboxExtension{} } func (e *GLightboxExtension) Extend(m goldmark.Markdown) { @@ -25,7 +22,7 @@ func (e *GLightboxExtension) Extend(m goldmark.Markdown) { ) m.Renderer().AddOptions( renderer.WithNodeRenderers( - util.Prioritized(NewGLightboxHTMLRenderer(e.photoStorage), 500), + util.Prioritized(NewGLightboxHTMLRenderer(), 500), ), ) } diff --git a/internal/glightbox/html_renderer.go b/internal/glightbox/html_renderer.go index 1bb606b..43d4790 100644 --- a/internal/glightbox/html_renderer.go +++ b/internal/glightbox/html_renderer.go @@ -4,15 +4,11 @@ import ( "bytes" "fmt" "math/rand" - "regexp" "strings" "time" - "github.com/SayaAndy/saya-today-web/config" - "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" @@ -20,34 +16,18 @@ import ( type GLightboxHTMLRenderer struct { html.Config - md goldmark.Markdown - anchorMatchRe *regexp.Regexp - photoStorage config.PhotoStorageConfig + md goldmark.Markdown } -func NewGLightboxHTMLRenderer(photoStorage config.PhotoStorageConfig, opts ...html.Option) renderer.NodeRenderer { +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(), ), ), - anchorMatchRe: regexp.MustCompile(`(?s)<\s*a(\s+[^<]*)(href\s*=\s*["'].*?["'])\s*([^<]*)>(.*?)<\s*\/\s*a\s*>`), - photoStorage: photoStorage, } for _, opt := range opts { opt.SetHTMLOption(&r.Config) @@ -71,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], "-") @@ -99,47 +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="%[7]s" class="glightbox grid-item %[1]s grid-item-%[2]s p-1" - data-gallery="gallery" data-title="%[3]s" %[4]s> - <picture> - <source media="(width < 800px)" srcset="%[8]s" /> - <source media="(width < 2400px)" srcset="%[9]s" /> - <source media="(width < 3200px)" srcset="%[10]s" /> - <source media="(width < 4000px)" srcset="%[11]s" /> - <source media="(width >= 4000px)" srcset="%[12]s" /> - <img src="%[9]s" /> - </picture> - <span class="grid-tooltip-text"><p>%[5]s</p></span> - <span class="grid-item-index">%[6]d</span> - </a>`, - strings.Join(tagClassList, " "), - galleryID, - dayDate.Format("2006-01-02 15:04:05 -07:00"), - dataDescriptionAttribute, - anchorlessCaptionHTML, - i+1, - fmt.Sprintf(r.photoStorage.Full.BaseUrl, fullImageUrl), - fmt.Sprintf(r.photoStorage.Thumbnail1600p.BaseUrl, imageUrlWithoutExt), - fmt.Sprintf(r.photoStorage.Thumbnail1200p.BaseUrl, imageUrlWithoutExt), - fmt.Sprintf(r.photoStorage.Thumbnail800p.BaseUrl, imageUrlWithoutExt), - fmt.Sprintf(r.photoStorage.Thumbnail560p.BaseUrl, imageUrlWithoutExt), - fmt.Sprintf(r.photoStorage.Thumbnail320p.BaseUrl, imageUrlWithoutExt), - )) + <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(` @@ -149,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-[0.375rem] border-dotted border-main-hard my-2 w-24 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-[0.375rem] border-dotted border-main-hard my-2 w-24 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, }) |