Diffstat (limited to 'internal/glightbox')
| -rw-r--r-- | internal/glightbox/block.go | 5 | ||||
| -rw-r--r-- | internal/glightbox/extension.go | 11 | ||||
| -rw-r--r-- | internal/glightbox/html_renderer.go | 96 | ||||
| -rw-r--r-- | internal/glightbox/parser.go | 9 |
4 files changed, 73 insertions, 48 deletions
diff --git a/internal/glightbox/block.go b/internal/glightbox/block.go index e53e67b..30cda1c 100644 --- a/internal/glightbox/block.go +++ b/internal/glightbox/block.go @@ -9,8 +9,9 @@ import ( // GLightboxBlock represents a light gallery block in the AST type GLightboxBlock struct { ast.BaseBlock - Images []GLightboxImage - Location *time.Location + Images []GLightboxImage + Location *time.Location + Namespace string } type GLightboxImage struct { diff --git a/internal/glightbox/extension.go b/internal/glightbox/extension.go index 7fd17b1..e9a9f3e 100644 --- a/internal/glightbox/extension.go +++ b/internal/glightbox/extension.go @@ -1,6 +1,7 @@ package glightbox import ( + "github.com/SayaAndy/saya-today-web/config" "github.com/yuin/goldmark" "github.com/yuin/goldmark/parser" "github.com/yuin/goldmark/renderer" @@ -8,10 +9,12 @@ import ( ) // Extension that combines parser and renderer -type GLightboxExtension struct{} +type GLightboxExtension struct { + photoStorage config.PhotoStorageConfig +} -func NewGLightboxExtension() goldmark.Extender { - return &GLightboxExtension{} +func NewGLightboxExtension(photoStorage config.PhotoStorageConfig) goldmark.Extender { + return &GLightboxExtension{photoStorage} } func (e *GLightboxExtension) Extend(m goldmark.Markdown) { @@ -22,7 +25,7 @@ func (e *GLightboxExtension) Extend(m goldmark.Markdown) { ) m.Renderer().AddOptions( renderer.WithNodeRenderers( - util.Prioritized(NewGLightboxHTMLRenderer(), 500), + util.Prioritized(NewGLightboxHTMLRenderer(e.photoStorage), 500), ), ) } diff --git a/internal/glightbox/html_renderer.go b/internal/glightbox/html_renderer.go index 7022793..1bb606b 100644 --- a/internal/glightbox/html_renderer.go +++ b/internal/glightbox/html_renderer.go @@ -8,6 +8,7 @@ import ( "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" @@ -21,9 +22,10 @@ type GLightboxHTMLRenderer struct { html.Config md goldmark.Markdown anchorMatchRe *regexp.Regexp + photoStorage config.PhotoStorageConfig } -func NewGLightboxHTMLRenderer(opts ...html.Option) renderer.NodeRenderer { +func NewGLightboxHTMLRenderer(photoStorage config.PhotoStorageConfig, opts ...html.Option) renderer.NodeRenderer { r := &GLightboxHTMLRenderer{ Config: html.NewConfig(), md: goldmark.New( @@ -44,11 +46,12 @@ func NewGLightboxHTMLRenderer(opts ...html.Option) renderer.NodeRenderer { ), ), ), + 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) } - r.anchorMatchRe = regexp.MustCompile(`(?s)<\s*a(\s+[^<]*)(href\s*=\s*["'].*?["'])\s*([^<]*)>(.*?)<\s*\/\s*a\s*>`) return r } @@ -68,7 +71,8 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte, var elements []string for i, img := range gallery.Images { - imageUrlSegments := strings.Split(img.URL, ".") + fullImageUrl := gallery.Namespace + img.URL + imageUrlSegments := strings.Split(fullImageUrl, ".") imageUrlWithoutExt := strings.Join(imageUrlSegments[:len(imageUrlSegments)-1], ".") imageUrlParts := strings.Split(imageUrlWithoutExt, "/") imageNameParts := strings.Split(imageUrlParts[len(imageUrlParts)-1], "-") @@ -110,19 +114,32 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte, 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> + <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="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" /> + <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>%s</p></span> - <span class="grid-item-index">%d</span> - </a>`, img.URL, strings.Join(tagClassList, " "), galleryID, dayDate.Format("2006-01-02 15:04:05 -07:00"), dataDescriptionAttribute, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, anchorlessCaptionHTML, i+1)) + <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), + )) if glightboxDescId != "" { elements = append(elements, fmt.Sprintf(` @@ -132,44 +149,43 @@ func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte, } } - w.WriteString(fmt.Sprintf(` -<div class="justify-content-center display-block"> - <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-%s mx-auto"> - <div class="grid-sizer grid-sizer-%s"></div> - %s + 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")+` </div> - <hr class="border-t-3 border-dotted border-main-hard mt-1 mb-2 w-[80%%] ml-auto mr-auto"> -</div>`, galleryID, galleryID, strings.Join(elements, "\n"))) + <hr class="border-t-[0.375rem] border-dotted border-main-hard my-2 w-24 ml-auto mr-auto"> +</div> - w.WriteString(fmt.Sprintf(` <script> - var msnry_%s = new Masonry('.masonry-grid-%s', { - itemSelector: '.grid-item-%s', - columnWidth: '.grid-sizer-%s', - percentPosition: false, - fitWidth: true + var pckry_{id} = new Packery('.masonry-grid-{id}', { + itemSelector: '.grid-item-{id}', + columnWidth: '.grid-sizer-{id}', + percentPosition: false }); - var imgLoad_%s_timer; - var imgLoad_%s = imagesLoaded('.masonry-grid-%s'); + var imgLoad_{id}_timer; + var imgLoad_{id} = imagesLoaded('.masonry-grid-{id}'); - function initMasonryLayout_%s(tm) { - clearTimeout(imgLoad_%s_timer); - imgLoad_%s_timer = setTimeout(() => msnry_%s.layout(), 100); + function initMasonryLayout_{id}(tm) { + clearTimeout(imgLoad_{id}_timer); + imgLoad_{id}_timer = setTimeout(() => pckry_{id}.layout(), 100); } - imgLoad_%s.on('progress', initMasonryLayout_%s); + imgLoad_{id}.on('progress', initMasonryLayout_{id}); - window.addEventListener('resize', initMasonryLayout_%s); + window.addEventListener('resize', initMasonryLayout_{id}); document.addEventListener('popout', (e) => { - window.removeEventListener('resize', initMasonryLayout_%s); - imgLoad_%s.off('progress', initMasonryLayout_%s); - initMasonryLayout_%s = null; - imgLoad_%s = null; + window.removeEventListener('resize', initMasonryLayout_{id}); + imgLoad_{id}.off('progress', initMasonryLayout_{id}); + initMasonryLayout_{id} = null; + imgLoad_{id} = null; }, {once: true}); -</script>`, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID)) +</script> +`, "{id}", galleryID)) } return ast.WalkContinue, nil diff --git a/internal/glightbox/parser.go b/internal/glightbox/parser.go index 6780090..b376034 100644 --- a/internal/glightbox/parser.go +++ b/internal/glightbox/parser.go @@ -29,7 +29,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\+\-/]+)\}$`) + r := regexp.MustCompile(`^\{Gallery:([A-Za-z0-9\+\-/]+)(:([A-Za-z0-9\+\-/]+))?\}$`) trimmed := bytes.TrimSpace(line) parts := r.FindSubmatch(trimmed) @@ -44,7 +44,12 @@ func (p *GLightboxParser) Open(parent ast.Node, reader text.Reader, pc parser.Co return nil, parser.NoChildren } - return &GLightboxBlock{Location: loc}, parser.NoChildren + ns := "" + if len(parts) >= 4 { + ns = string(parts[3]) + } + + return &GLightboxBlock{Location: loc, Namespace: ns}, parser.NoChildren } func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.Context) parser.State { |