diff options
-rw-r--r-- | pkg/view/media.go | 25 | ||||
-rw-r--r-- | templates/base.qtpl | 47 | ||||
-rw-r--r-- | templates/media.qtpl | 37 |
3 files changed, 94 insertions, 15 deletions
diff --git a/pkg/view/media.go b/pkg/view/media.go index 6d380e2..4bf8d68 100644 --- a/pkg/view/media.go +++ b/pkg/view/media.go @@ -5,9 +5,9 @@ import ( "github.com/valyala/fasthttp" - "git.sr.ht/~gabrielgio/img" "git.sr.ht/~gabrielgio/img/pkg/database/repository" "git.sr.ht/~gabrielgio/img/pkg/ext" + "git.sr.ht/~gabrielgio/img/templates" ) type ( @@ -15,11 +15,6 @@ type ( mediaRepository repository.MediaRepository userRepository repository.UserRepository } - - Page struct { - Medias []*repository.Media - Next *repository.Pagination - } ) func getPagination(ctx *fasthttp.RequestCtx) *repository.Pagination { @@ -77,16 +72,16 @@ func (self *MediaView) Index(ctx *fasthttp.RequestCtx) error { return err } - err = img.Render(ctx, "media.html", &img.HTMLView[*Page]{ - Title: "Media", - Data: &Page{ - Medias: medias, - Next: &repository.Pagination{ - Size: p.Size, - Page: p.Page + 1, - }, + page := &templates.MediaPage{ + Medias: medias, + Next: &repository.Pagination{ + Size: p.Size, + Page: p.Page + 1, }, - }) + } + + templates.WritePageTemplate(ctx, page) + if err != nil { return err } diff --git a/templates/base.qtpl b/templates/base.qtpl new file mode 100644 index 0000000..cbde355 --- /dev/null +++ b/templates/base.qtpl @@ -0,0 +1,47 @@ +This is a base page template. All the other template pages implement this interface. + +{% interface +Page { + Title() + Content() + Script() +} +%} + + +Page prints a page implementing Page interface. +{% func PageTemplate(p Page) %} +<html lang="en"> + <head> + <meta charset="utf-8"> + <title>img | {%= p.Title() %}</title> + <link rel="stylesheet" href="/static/main.css"> + <link rel="icon" href="/static/square.svg" sizes="any" type="image/svg+xml"> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + </head> + <body> + <nav class="navbar"> + <div class="navbar-start"> + <a href="/fs" class="navbar-item"> + files + </a> + <a href="/media" class="navbar-item"> + media + </a> + <a href="/settings" class="navbar-item"> + settings + </a> + </div> + </nav> + <div class="container"> + {%= p.Content() %} + </div> + </body> + {%= p.Script() %} +</html> +{% endfunc %} + +{% code type BasePage struct {} %} +{% func (p *BasePage) Title() %}Empty{% endfunc %} +{% func (p *BasePage) Body() %}HelloWorld{% endfunc %} +{% func (p *BasePage) Script() %}{% endfunc %} diff --git a/templates/media.qtpl b/templates/media.qtpl new file mode 100644 index 0000000..88ce582 --- /dev/null +++ b/templates/media.qtpl @@ -0,0 +1,37 @@ +{% import "git.sr.ht/~gabrielgio/img/pkg/database/repository" %} + +{% code +type MediaPage struct { + Medias []*repository.Media + Next *repository.Pagination +} +%} + +{% func (p *MediaPage) Title() %} +Media +{% endfunc %} + + +{% func (p *MediaPage) Content() %} +<div class="columns is-multiline"> +{% for _, media := range p.Medias %} + <div class="card-image"> + {% if media.IsVideo() %} + <video controls muted="true" poster="/media/thumbnail?path_hash={%s media.PathHash %}" preload="none"> + <source src="/media/image?path_hash={%s media.PathHash %}" type="{%s media.MIMEType %}"> + </video> + {% else %} + <figure class="image is-fit"> + <img src="/media/thumbnail?path_hash={%s media.PathHash %}"> + </figure> + {% endif %} + </div> +{% endfor %} +</div> +<div class="row"> + <a href="/media?page={%d p.Next.Page %}" class="button is-pulled-right">next</a> +</div> +{% endfunc %} + +{% func (p *MediaPage) Script() %} +{% endfunc %} |